このページの本文へ

Quartz Composer×JavaScriptでRSSリーダーを作ろう (3/3)

2009年09月29日 15時01分更新

文●古籏一浩

  • この記事をはてなブックマークに追加
本文印刷

RSSリーダーにJavaScriptを追加する

 Quartz Composer入門の仕上げとして、読み込むRSSフィードのURLを時間経過で自動変更するプログラムを完成させましょう。新規にRSSリーダーを作成するのは面倒ですので、RSSリーダーのコア部分は連載第11回で紹介した標準のテンプレートを使い、フィードのURLを切り換える部分だけをJavaScriptで作成します。ここではASCII.jp、nikkei BPnet、asahi.comの3つのRSSフィードを取得し、表示します。

デフォルトで用意されているRSSリーダー

デフォルトで用意されているRSSリーダーのテンプレート。新規作成画面でRSSを選択するだけで、このような画面になります

 はじめに、RSSリーダーのテンプレートにある「RSSFeed URL (Requird)」部品の接続を解除します。接続の解除は接続先の●の部分をつかんで外すように動かします。部品を切り離せたらLibraryパレットからJavaScriptを配置し、スクリプトを以下のように変更します。


function (__string outputURL) main (__number inputTime)
{
    var result = new Object();
    var URL = [   "feed://www.ascii.jp/cate/1/rss.xml",
                "feed://nikkeibp.jp/jp/flash/index.rdf",
                "feed://www3.asahi.com/rss/index.rdf"
                    ];
    var dt = new Date();
    var S = dt.getSeconds();
    S = Math.floor(S / (60 / URL.length)); // 60sec / Count
    result.outputURL = URL[S];
    return result;
}


 URL配列に表示するRSSフィードのURLを記述しています。今回は3つのURLを指定していますが、URLの追加/削減もできます。また、記事を切り替える速度は、Get the Article部品の「●Article Duration」の●をダブルクリックすると変更できます。たとえば、3を入れると3秒ごとに記事の表示が切り替わります。

 スクリプトを入力し終わったらRSS Importerの「●URL」につなげます。これで完成です、と言いたいところですが、このままだとプログラムの起動時の一回しかフィードが読み込まれません。そこで、リアルタイムクロックの時と同様に(関連記事)JavaScript部品にSystem Timeを入力して、プログラムを実行するトリガーとして機能させます。次の図のようになれば今回のプログラムは完成です。

RSSリーダーにJavaScriptを組み込んだ状態

RSSリーダーにJavaScriptを組み込んだ状態

正しく動作すれば20秒ごとに各社のRSSデータが読み込まれ記事が表示されます

正しく動作すれば20秒ごとに各社のRSSデータが読み込まれ記事が表示されます


 Quartz Composerは、コードを一切書かなくても手軽に綺麗な映像を作成でき、十分楽しめるツールですが、より複雑なものを作りたい場合に、今回紹介したような方法でJavaScriptをうまく活用するとよいでしょう。この機会にQuartz Composerを試してみてはどうでしょうか。

■Amazon.co.jpで購入


* 注意:本記事で作成したサンプルをスクリーンセーバーには使用したり、ファインダー上で表示すると、表示が乱れる場合があります。また、Quartz Composer上のViewer、スクリーンセーバー、ファインダーの表示は同じ結果にならない場合があります。

前へ 1 2 3 次へ

この連載の記事

一覧へ

この記事の編集者は以下の記事をオススメしています