XML2JSON+javascriptテンプレートエンジンでRSS表示

drk7.jpさんでXML2JSON serviceという面白いサービスが開始されました。

ということで早速ハックしてみました。

 

前のエントリーで書いたJavascriptテンプレートと組み合わせてめちゃくちゃ簡単にRSSを表示できます。

サンプルはこちら

使い方ですが、多分ソースをみてもらったほうが速いです。

//サンプルHTMLから抜粋

JavaScript:
  1. Event.observe(window, "load", function(){
  2.         new XML2JSON("<a href="http://feeds.feedburner.com/Inforno">http://feeds.feedburner.com/Inforno</a>", {container: "test", template : {element:"template"}});
  3. });


初期化コードはコレだけです。 containerでinnerHTMLに結果を流し込みたいElementを指定します。 templateはLyase.View.renderの引数と同じです。 例ではtextareaエレメントのid:"tempalte"のinnerHTMLをテンプレートとして扱います。

HTML:
  1. //テンプレート
  2.   <textarea id="template" style="display:none;">
  3.    
  4. <h3><%= context.channel.title %></h3>
  5.    
  6. <ul class="items">
  7.       <% context.channel.item.each(function(item,index){%>
  8.        
  9.     <li><a href="<%= item.link%>" target="_blank"><%= item.title%></a></li>
  10.         <% if(index> 5){throw $break;}%>
  11.       <%})%>
  12.    </ul>
  13.   </textarea>


こんな感じでテンプレートがかけるので、デザインの変更が大変楽になります。 またJSONデータ取得時のonloadを好きなメソッドに置き換えることもできるのでLyase.Viewを使わなくてもXML2JSONライブラリだけで おいしくいただけます。すきに改造してやってください、たいしたものじゃないですし(笑

 

Posted at 1am on 02/20/06 | no comments | Tags : read on

About

about me
yuin()
文学部文化学科卒という生粋の文系趣味プログラマ。
ベンチャー企業でアルバイトを経て、某大手企業で働いてます。    
主にRuby、Javascript、PHP、JAVA,Python,C,Scala,Schemeなどを使っています。
今はPythonな感じかもしれない。今後作曲活動なども復活するかもしれない。

Pages