以前の BLOGRANGER TG touch では、タグマップ API を使い、そのタグをキーワードに Google ニュースを検索することで、タグに関連するニュースを探すというマッシュアップを手軽に実現できました。今回も、同じパターンを使って、タグに関連する動画を YouTube を使って探すというマッシュアップを実現してみました。以前に作った BLOGRANGER TG tube を少し改造してみました。
BLOGRANGER TG tube とは、今現在のブログ界の様子を表す仮想地図をスクロールしながら、ブログ界の話題と繋がりのある動画をビジュアルに探すことを目的とした HTML/Ajax ベースのマッシュアップアプリケーションです。
BLOGRANGER TG API を使って仮想地図を表示します。そして、その仮想地図の中央付近の話題と繋がりのある動画を YouTube Data API を使って検索し、その動画のサムネイルをグルっと一周する円として表示します。さらに、その動画のサムネイルをクリックすると、その動画を Flash Player を使って再生します。
BLOGRANGER TG tube は jQuery を使って API を繋ぎ合わせ、jQuery プラグインを使ってビジュアルな表現を実現しています。そのソースコードや実装の説明は、次のとおりまとめてありますので、参考になればと思います。
- コールバックのイベントハンドリングを容易にする jQuery JSONP プラグイン
- Interface Elements の Carousel と YouTube Data API で動画のサムネイルを回転表示する
- Flash Plugin を使って Youtube の動画を再生する
Jquery in Action Bear Bibeault Yehuda Katz by G-Tools |
0 件のコメント:
コメントを投稿