アプリを起動すると initTopPage() 関数を直ちに呼び出します。この関数を使用して、トップページ ( ホーム画面のページ ) の初期化を行います。ここでの初期化処理とは、保存されているメモを取得して、一覧で表示することです ( 取得処理は、memo.js ファイル内で定義されている getMemoList() 関数を経由して行われます )。アプリの初回起動時など、既存のメモがない場合には、「 No memo found 」 が表示されます 。
この関数のソースコードを次に記します。
...
///// Initialize top page
function initTopPage() {
$("#TopListView").empty();
var list = getMemoList();
for (var i in list) {
var memo = list[i];
var d = new Date(memo.time);
var date = d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getDate();
$li = $("<li><a href='#' class='show'><h3></h3><p></p></a><a href='#' class='delete'>Delete</a></li>");
$li.data("id", memo.id);
$li.find("h3").text(date);
$li.find("p").text(memo.text);
$("#TopListView").prepend($li);
}
if (list.length == 0) {
$li = $("<li>No memo found</li>");
$("#TopListView").prepend($li);
}
$("#TopListView").listview("refresh"); // Call refresh after manipulating list
}
...
///// Save memo and return to top page
function onSaveBtn() {
var text = $("#Memo").val();
if (text != '') {
// Save to local storage
addMemo(text);
// Clear form
$("#Memo").val("");
// Initialize top page
initTopPage();
}
$.mobile.changePage("#TopPage", { reverse: true });
}
///// Delete memo
function onDeleteLink() {
if (!confirm("Are you sure to delete this memo?")) {
return;
}
var $li = $(this).parent();
var id = $li.data("id");
deleteMemo(id);
initTopPage();
// Return to top
$.mobile.changePage("#TopPage", { reverse: true });
}