Movie.festimetable をバージョンアップしました。

Movie.festimetable update

Movie.festimetable をアップデートしました。

・指定のアーティストの動画だけ再生できるようにしました(類似アーティストの割合を指定可能にしました。
・再生中の曲がプレイリストの一番上に来るようにしました。

次は、シャッフルでもつけようかと思っています。

GoogleのJavaScript ライブラリ「JsTemplate」

GoogleからJavascriptのテンプレートエンジンシステム、JsTemplate がリリースされていたので、少し試して見ました。

こんな感じのJavascriptでshowDataメソッドを実行すると、

data = [{artist:"Teenagefunclub", title:"BANDWAGONESQUE"},
        {artist:"Haven", title:"All for a Reason"},
        {artist:"Gisli", title:"How About That?"},
        {artist:"Fizzgig", title:"Reset"}];

function showData() {
  var input = new JsEvalContext(data);
  var output = document.getElementById('t');
  jstProcess(input, output);
}

こんなHtmlが、

<div id="t">
  <ul jsselect="$this">
    <li>
      <span jscontent="artist"></span> / <span jscontent="title"></span>
    </li>
  </ul>
</div>

こんな風に出力されます。

<div jstcache="0">
  <ul jsinstance="0" jstcache="1" jsselect="$this">
    <li jstcache="0">
      <span jstcache="2" jscontent="artist">Teenagefunclub</span> / <span jstcache="3" jscontent="title">BANDWAGONESQUE</span>
    </li>
  </ul><ul jsinstance="1" jstcache="1" jsselect="$this">
    <li jstcache="0">
      <span jstcache="2" jscontent="artist">Haven</span> / <span jstcache="3" jscontent="title">All for a Reason</span>
    </li>
  </ul><ul jsinstance="2" jstcache="1" jsselect="$this">
    <li jstcache="0">
      <span jstcache="2" jscontent="artist">Gisli</span> / <span jstcache="3" jscontent="title">How About That?</span>
    </li>
  </ul><ul jsinstance="*3" jstcache="1" jsselect="$this">
    <li jstcache="0">
      <span jstcache="2" jscontent="artist">Fizzgig</span> / <span jstcache="3" jscontent="title">Reset</span>
    </li>
  </ul>
</div>

なかなか面白いです。
ここで、簡単に試すことができます。

でも、dataにURL入れてリンクとかにしたくないですか?

data = [{artist:"Teenagefunclub", url:"http://xxx.net/123"},
        {artist:"Haven", title:"http://xxx.net/456"}];

<ul>
  <li><a href="http://xxx.net/123">Teenagefunclub</a></li>
  <li><a href="http://xxx.net/456">Haven</a></li>
</ul>

みたいな感じ。

でも、属性値に指定データの中身を入れる事はまだできないぽいです。
今後に期待です。

YouTubeAPIでonYouTubePlayerReadyが呼ばれない

YouTube JavaScript Player APIでプレーヤーを制御するために、onYouTubePlayerReadyを実装する必要があります。
この関数は、プレーヤーの準備が完了すると呼び出されますが、WEBサーバー上で実行していないと呼ばれません。軽い気持ちでJavaScriptのみでなにか作っている場合は注意が必要です。(以前はまって、忘れてまたはまりました…)