2007/10/07

最近貼られたラベルのリスト

ラベルリストを表示するウィジェットはデフォルトで用意されていますが、「貼られた回数順」か「あいうえお順」しか選択肢がありません。

しかし、例えば具体的なサービス名や作品名などの固有名詞をラベルにしている場合、ここ半年言及していないのに"A"で始まるからという理由で"Amazon"のタグが一番上に表示されていても大した役に立ちません。流行物を追いかけているブログほどラベルリストが役立たずになってしまいます。

そこでBloggerのサイトフィード機能の一つ、JSONフィード出力機能を使って「直近のエントリーに貼られたラベルリストを抜き出して表示する」というのをやってみました。

  1.  1:RecentoryLabels = {  
  2.  2:"labels"  : {},  
  3.  3:            // labelsオブジェクトに未登録のラベルを追加  
  4.  4:"init"    : function(_aJsonData) {  
  5.  5:  
  6.  6:              // JSONフィードからエントリー配列(root.feed.entory)を取得  
  7.  7:              var entrys = _aJsonData["feed"]["entry"];  
  8.  8:  
  9.  9:              // 各エントリーのラベル配列(entory.category)を取得  
  10. 10:              for (i in entrys) {  
  11. 11:                var updated   = entrys[i]["updated"]["$t"];  
  12. 12:                var categorys = entrys[i]["category"];  
  13. 13:                for (j in categorys) {  
  14. 14:                  // JSONフィード自体が更新日の降順でソートされているので、  
  15. 15:                  // 既に登録されている=そっちの方が新しい  
  16. 16:                  if (!(categorys[j]["term"in this.labels)) {  
  17. 17:                    // 更新時間のマッピングは特に意味なし  
  18. 18:                    this.labels[categorys[j]["term"]] = updated;  
  19. 19:                  }  
  20. 20:                }  
  21. 21:              }  
  22. 22:              this.disp();  
  23. 23:            },  
  24. 24:"disp"    : function() {  
  25. 25:              // 出力用にlabelsオブジェクトを配列に  
  26. 26:              var s = [];  
  27. 27:              for(i in this.labels) s.push(i);  
  28. 28:  
  29. 29:              // "recentory_labels"というDIVかなんかを用意しておく。  
  30. 30:              if (out = document.getElementById("recentory_labels")) {  
  31. 31:                // カンマ区切りで表示  
  32. 32:                out.innerHTML = s.join(", ");  
  33. 33:              }  
  34. 34:            }  
  35. 35:}  
1:RecentoryLabels = { 2:"labels" : {}, 3: // labelsオブジェクトに未登録のラベルを追加 4:"init" : function(_aJsonData) { 5: 6: // JSONフィードからエントリー配列(root.feed.entory)を取得 7: var entrys = _aJsonData["feed"]["entry"]; 8: 9: // 各エントリーのラベル配列(entory.category)を取得 10: for (i in entrys) { 11: var updated = entrys[i]["updated"]["$t"]; 12: var categorys = entrys[i]["category"]; 13: for (j in categorys) { 14: // JSONフィード自体が更新日の降順でソートされているので、 15: // 既に登録されている=そっちの方が新しい 16: if (!(categorys[j]["term"] in this.labels)) { 17: // 更新時間のマッピングは特に意味なし 18: this.labels[categorys[j]["term"]] = updated; 19: } 20: } 21: } 22: this.disp(); 23: }, 24:"disp" : function() { 25: // 出力用にlabelsオブジェクトを配列に 26: var s = []; 27: for(i in this.labels) s.push(i); 28: 29: // "recentory_labels"というDIVかなんかを用意しておく。 30: if (out = document.getElementById("recentory_labels")) { 31: // カンマ区切りで表示 32: out.innerHTML = s.join(", "); 33: } 34: } 35:}
  1. 1:<body>  
  2. 2:  <div id="recentory_labels"></div>  
  3. 3:  <script src="http://knyijong.blogspot.com/feeds/posts/default?orderby=updated&alt=json-in-script&callback=RecentoryLabels.init"></script>  
  4. 4:</body>  
1:<body> 2: <div id="recentory_labels"></div> 3: <script src="http://knyijong.blogspot.com/feeds/posts/default?orderby=updated&alt=json-in-script&callback=RecentoryLabels.init"></script> 4:</body>

"RecentoryLabels.init"をコールバック関数に指定してJSONフィードを呼びます。disp中のgetElementByIdがnullを返さないように、JSONフィードの呼び出しは出力する場所より後に書く必要があるみたいです。

実際にはJavaScriptの32行目辺りをいじってラベル名をクリックしたらラベル別ページに飛ぶ、といったAタグを入れる予定ですが、メンドイので導入は気が向いたら。

出来ればクライアント(JavaScript)じゃなくてサーバサイドでやりたいですが、Yahoo Pipesでも使わないと無理でしょうか。

出力イメージです。このエントリー直前までのこのブログのラベルを「最近貼られた順」に240px幅の枠にクラウドっぽく表示した図。