フィードと連携(その2)

Tociyuki::Diary - フィードと連携javascript の再利用性を上げるために、リファクタリングしました。
https://tociyuki.sakura.ne.jp/util/geotkbure.03.js
この版を用いた、HTML のスクリプト要素の典型的な記述は次のとおりです。

var map=new GMap($('map'));
map.setMapType(G_MAP_TYPE);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
var items=new GeoItems(map,$('list'));
items.getItems('http://example.jp/index.rdf',new TkbureRss(),1);
  1. クラスをロジック担当の GeoItems、マーカー用配列組み立て担当の TkbureRss に分割しました。
  2. ロジック担当の GeoItems は、Ajax でデータを取得し、マーカー用配列組み立てオブジェクトに作ってもらった配列を使って DOM ツリーを組み上げます。
  3. リスト項目のハイパーリンクへのリスナー登録を prototype.js でおこなうようにしました。これによって、コンストラクタの呼び出し方が変わりました。
  4. マーカーを置き終わった後のオートセンタリングの有無の指定をコンストラクタから getItems にパラメータの移動をおこないました。
  5. GeoItems は、データ・フォーマットに依存しないようになりました。
  6. GeoItems コンストラクタの必須要素は GMaps のインスタンス map だけにしました。リスト要素を省略すると、リストの組み立てをおこなわなくなります。
  7. リスト要素は ul か ol のどちらか一方です。
  8. GeoItems の getItems メソッドを呼び出すと、第一引数の url からデータを取得し、第二引数に渡したオブジェクトの parseResponse メソッドを呼び出してマーカー情報の配列を受け取り、マーカー登録とリストの組み立てをおこないます。第三引数はオートセンタリングの指定です。
  9. マーカー情報の配列の要素は、{x:経度、y:緯度、listHtml:li要素のinnerHTML、infoHtml:infoWindowのinnerHTML}のようにします。XML の DOM ツリーを探索するのが面倒ならば、JSON を使って一発 eval で済ませるのが楽です。
  10. マーカーとリストの再描画をおこなえるようにコードを記述していますが、この機能はまだ実験段階です。近いうちに、RSS for archive の実験として、画面遷移なしでマーカーの書き換えをできるようにしようと企んでいます。