2011/01/23

世界の車窓から.js

昨日、世界の車窓からを見てて、かなり良い曲が流れていた。
The　Shores　of　the　Swilly』 by.Phil　Coulterって曲です。


世界の車窓からっていつも良い曲を使ってる気がしたので、そんな曲をすぐに調べれるように
「世界の車窓から」を見ながら一覧表を作りました。


Demo:
http://shinya-api.appspot.com/sandbox/shasou.html

shasou.js:
/**
  * created_atの日付がよくわからんことになってるので、
  * とりあえずこれはつかわない。
  */
//   function makeEtc(e) {
//    var date = e.created_at.split(" ");
//    console.dir(date);
//    return date[2] + "日　" + date[3];
//   }
/**
  * その他項目を作る
  */
function getMusicNm(al) {
 var i;
 var buffer = "";
 for (i = 4; i < al.length; i++) {
  buffer += al[i];
 }
 return buffer;
}

/**
  * テーブルに表示する内容
  * いつも決まったフォーマットで呟かれないのが難点
  */
function shasouParser(elem) {
 var al = elem.text.split(" ");
 if (al.length < 5) {
  //return makeEtc(elem);
  return "----";
 } else {
  return "
" + al[0] + " "+ al[1] + "放送" + al[2] + "" + al[3] + "" + getMusicNm(al) + "";
 }
}

/**
  * JSON取得
  */
$(function() {
  $.getJSON("http://api.twitter.com/1/statuses/user_timeline/Sekai_no_Shasou.json?callback=?", function(d) {
   var i;
   var appendStr = "";   var table = document.getElementById("ta");   for (i = 0; i < d.length; i++) {
    var elem = d[i];
      appendStr += shasouParser(elem);
   }
   appendStr += "
";
   table.innerHTML =appendStr;
 }, "json");
});
こんな感じのスクリプトを、以下のようなHMTLで呼んでやる。 hoge.html: 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<style>
 body {
  background-color: #696969;
 }
 table { 
  width: 100%;
  border-collapse: collapse;
 } 
 table td { 
  border: 1px #4cdd09 solid;
 } 
</style>
<h1>世界の車窓から</h1>
<table>
 <thead>
  <tr>
   <td>放送</td>
   <td>シリーズ名</td>
   <td>タイトル</td>
   <td>その他</td>
  </tr>
 </thead>
 <tbody id="ta">
 </tbody>
</table>
<script type="text/javascript" src="shasou.js"></script>


やぱjQueryだと作業効率良い良い（＾ω＾）
車窓、いいよ車窓♪
Labels: ,