■

自分が検閲削除する基準が解らない。
でもまぁ検閲にあたらないから良いや。


OBは楽しかったと言い、現役は疲れたと言う。要するにいつも通りということ。


前に日記でちょっと触れたかもしれない、通年カレンダー、結局自分で作った。所要時間は１時間くらい。
http://yamanoue.sakura.ne.jp/casm/YearCalendar.pdf
ついでに類聚に自分用のディレクトリを置かせてもらったけど、今のところindex.htmlも無い。
.sの写真集でも作ろうか。
…ところで最近.sをやってないのは、前に作った真珠の耳飾りの少女を壊すのが忍びないから。あと、単純にめんどくさいってのもある。
もう１パック買おうか…。


閑話休題。
上のカレンダーは実はHTMLで作られてる。Safariから印刷でPDFに書き出した。
もちろんあんなHTMLを手打ちしてるわけもなく、表の生成にはJavaScriptを使ってる。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Year Calendar</title>
<script src="yearCalender.js" type="text/javascript"></script>
<style type="text/css">
body {
  margin-top: 5pt;
}
table {
  border-collapse : collapse;
  border: double 3px black;
  width: 100%;
}
thead {
  border-bottom: solid 2px black;
  background-color: #DFD;
}
th,td {
  border-left: solid 1px gray;
  border-top: solid 1px gray;
  width: 8.33%;
}

/* 曜日処理 */
tr.sunday, .holiday {
  background-color: #FDD;
}
tr.saturday {
  background-color: #DDF;
}

th {
  font-size: small;
  padding: 0;
  font-family: cursive;
}
td {
  font-size: x-small;
}
</style>
</head>

<body onload="init();">
<table>
  <caption>2007/4 〜 2008/3</caption>
  <thead>
    <tr id="monthes"></tr>
  </thead>
  <tbody id="dates"></tbody>
</table>
</body>
</html>

//yearCalender.js
function init(){
  function TD(text){
    var td = document.createElement("td");
    td.appendChild(document.createTextNode(text));
    td.addEventListener(
      "click",
      function(){td.className = "holiday";},
      true
    )
    return td;
  }
  function TH(text){
    var td = document.createElement("th");
    td.appendChild(document.createTextNode(text));
    return td;
  }
  
  //月見出し
  for(var i=0; i<12; i++){
    document.getElementById("monthes").appendChild(TH(
      (i+3)%12+1
      +"月"));
  }
  var daysOfMonth = [30,31,30,31,31,30,31,30,31,31,29,31,]; //2007.4〜2008.3。2008年は閏年。
  var startDay = [0,2,5,0,3,6,1,4,6,2,5,6]; //曜日
  var calendar = new Array();
  
  //カレンダーの生成
  for(var i=0; i<daysOfMonth.length; i++){
    calendar[i] = new Array();
    for(var j=0; j<daysOfMonth[i]; j++){
      calendar[i][j+startDay[i]] = j+1;
    }
  }
  
  //カレンダーの出力
  for(var i=0; i<37; i++){
    var tr = document.createElement("tr");
    switch(i%7){
      case 0: tr.className="sunday"; break;
      case 6: tr.className="saturday"; break;
    }
    for(var j=0; j<daysOfMonth.length; j++){
      tr.appendChild(TD(calendar[j][i] ? calendar[j][i] : ""));
    }
    document.getElementById("dates").appendChild(tr);
  }
}

カレンダー配列の生成処理は、今回は今年度の分さえ作れれば充分だと思って、すんげー抽象度の低い穢いコードになってる。普段ならプロトタイプレベルのコードでそのまま突っ走った感じ。
もうちょっとブラッシュアップしても楽しいかもしれない。例えば今回は2007/4〜2008/3固定だけど、任意の期間のカレンダーを生成できるようにしてみるとか。
祝日の情報はコードからは指定せず、(祝日情報のない)表をブラウザに表示させた状態で、任意の日付をクリックするとその日が祝日になる仕組み。
どうせ祝日なんざ政治でコロコロ変えられるから、下手にコード化しなくてもいいのかもしれない。


デザインについて。
31x12の表でも良かったんだけど、手帖用の同種のカレンダーで見かけた、曜日が横に並ぶ構造のが萌えだったのでそいつをパクらせて頂いた。
色付けした日曜日が真っ直ぐ横断するから見た目に綺麗。
ただし月の初めが解りにくくなる。今にして思えば CSS で empty-cells:hide; を指定しても良かったかもしれない。


HTMLで作ったことの利点は、CSSを使ってデザインの変更が容易なこと。
ただ、こんくらいの、フツーの表の形式であれば、エクセルとかの表計算ソフトを使った方が早いかもしれない。
私はエクセル持ってないし、１時間でこれならまぁ上出来かな、と思うけど。
というか、こんな事をコードを書いて実現しようとするあたり、もしかしたら自分が変態なんじゃないかって思ってきた。


で、このカレンダーを机の前の仕切にピン留めするわけだけども、直接ピン留めすると追加書き込みとかに不便なので、透明なクリアファイルをピン留めしてその中に放り込むことにした。これは我ながら良策だと思う。
それと、目につくところに年間のスケジュールを貼っておくのは良いと思った。いやマジで。


[rakuten:umeyashiki:1343441:image]
先日ちょっと触れたHARIBOグミ、ステラプレイスの地下にあるとの某情報を受け、買ってきた。
あの量で315円なら、普通に果汁グミとか買うよりもむしろよっぽど安い。
そして食べてみた。
…やばい、これは良い。
ありがとうのっち。さすがは世界のブロガー、良い物を紹介しはる。