複数のRSSを1つにまとめ、ソートして表示するサンプル

サイト上にRSSを表示する方法の一つとしてGoogle AJAX Feed APIは非常に簡単で便利ですが、複数のフィードを1つにまとめ、ソートして表示することはできません。
1つにまとめることはできるのですが、

  • サイトAのフィード
    • サイトAの4/9の記事
    • サイトAの4/6の記事
    • サイトAの4/3の記事
  • サイトBのフィード
    • サイトBの4/8の記事
    • サイトBの4/5の記事
    • サイトBの4/2の記事
  • サイトCのフィード
    • サイトCの4/7の記事
    • サイトCの4/4の記事
    • サイトCの4/1の記事

となるので、全てのフィードを合わせてのソートができません。
ということで

  • サイトA・B・Cのフィード
    • サイトAの4/9の記事
    • サイトBの4/8の記事
    • サイトCの4/7の記事
    • サイトAの4/6の記事
    • サイトBの4/5の記事
    • サイトCの4/4の記事
    • サイトAの4/3の記事
    • サイトBの4/2の記事
    • サイトCの4/1の記事

と表示させるプログラムを書きました。

デモ

http://kuwappa.web2.jp/hatena/rss/

サンプルは

の3種類のフィードから3件ずつ記事を取得し、日付で昇順ソートして表示。

  • index.html
  • GoogleAjaxFeedApi_maregAndSort_compression.js
  • GoogleAjaxFeedApi_maregAndSort_override.js

の3ファイルから構成されており、全てutf-8

index.html

サンプルということでbodyのonloadに動作のトリガを全て詰め込んでいます。

//インスタンス生成。引数としてインスタンス名を指定(eval用)
o_feed=new GoogleAjaxFeedApi_maregAndSort_override('o_feed');

//ソートのキー
//datetime、date、year、month、day、time、week、title、link、content、contentSnippet
o_feed.set_sortKey('datetime');

//ソート形式(asc:昇順、desc:降順)
o_feed.set_sortMode('desc');

//表示させるhtml要素のidを指定。サンプルでは<div id="feed"></div>
o_feed.set_idView('feed');

//表示させるフィードを指定。引数は順にurl、表示記事数、フィードタイトル
o_feed.add_feed('http://b.hatena.ne.jp/entrylist?mode=rss', 3, 'はてブ');
o_feed.add_feed('http://www.youtube.com/rss/global/our_blog.rss', 3, 'YOUTUBE新着');
o_feed.add_feed('http://www.amazon.co.jp/rss/bestsellers/books/492352/ref=pd_ts_rss_link', 3, 'amazon書籍best10');

//上記までが設定で、以下のbatch()で表示を行う
o_feed.batch();

GoogleAjaxFeedApi_maregAndSort_compression.js

プログラムの本体です。

GoogleAjaxFeedApi_maregAndSort_override.js

表示用htmlソースを組み上げるメソッドだけを切り分けてあります。
オーバーライドできるようになっているので、表示させるサイトにあった形になるように修正してください。


以上、簡単ではありますが解説でした。
ご自由にお使いください。
ライセンスはMITです。