アプリケーションのオフライン動作対応の第一弾として、列車時刻を格納した「路線ファイル(JSON形式)」をローカルストレージに保存するように修正する。(路線ファイルをサーバからロードする頻度が減少する分、動作の高速化も期待できる。)
[現在のフロー]
(1)「路線一覧ファイル」をサーバからロード
– 路線一覧ファイルは、路線名や最新版の生成日付などを保持している。
(2)路線を選択したタイミングで「路線ファイル」をサーバからロード
– 路線ファイルは、駅名や列車時刻表を保持している。(路線ごとに別ファイル)
[修正後のフロー]
(1)「路線一覧ファイル」をサーバからロード (不変)
(2)路線を選択したタイミングで「路線ファイル」をローカルストレージからロード
(3)「路線一覧ファイル」をチェックして、最新版があればサーバから路線ファイルをロード
修正後は、最新版をロードする前にローカルデータもロードしている点が冗長になっているが、今後、路線一覧ファイルのオフライン対応を行うタイミングで効率化する予定。[TODO]
路線一覧ファイルは以下のように、1つの路線が配列の1要素(オブジェクト)になっている。
// JSONファイルに手動でコメントを追記したもの { "lines": [ { "ln_key": "9999999", // 路線キー "ln_upd": "2013/05/09", // 路線データの生成日 "ln_name": "[JR]路線名", // 路線名 "ln_file": "T9999999.json" // JSONファイル名 }, { /* 2番目の路線, ... */ } ] }
JSON形式の路線ファイルは、路線ごとに用意しているので、ファイル名をローカルストレージに保存する際のキーとして使用する。
実際のコードは以下のとおり。
// JavaScript function loadRail(line, callback){ // ローカルストレージに保存する際のキー(JSONファイル名 例:T9999999.json) var ls_key = line.ln_file; // キーを指定してローカルストレージから路線データをロードする var ls_val = localStorage.getItem(ls_key); if (ls_val == null) { // ローカルストレージに路線データが保存されていないとき(初回)はサーバからロードする loadRailRemote(line, callback); } else { gCurRail = JSON.parse(ls_val); if ( gCurRail.upd < gCurLine.ln_upd ){ // サーバに最新の路線ファイルがある場合:サーバからロードする loadRailRemote(line, callback); } else { // ローカルが最新版の場合:ローカルストレージのデータをそのまま使用する callback(); } } } function loadRailRemote(line, callback){ // サーバにあるJSONファイルのフルパス名 var uri = '/json/tt/' + line.ln_file; // サーバから非同期的にファイルロード loadJsonAsync(uri, function(d){ gCurRail = d; // ロードした内容を文字列に変換して、ローカルストレージに保存 localStorage.setItem(line.ln_file, JSON.stringify(d)); callback(); }); }
ピンバック: 列車時刻表(9) - データストアに保存した乗車予定を表示する | Try Lifelog