Шрифт:
onbeforeunload
Сохраняет текущую версию заметки на сервере, если она еще не была выгружена.
oninput
Всякий раз, когда текст в элементе
<textarea>
изменяется, он сохраняется в объекте localStorage
, и запускается таймер. Если пользователь не продолжит редактирование в течение 5 секунд, заметка будет выгружена на сервер.
onoffline
Когда броузер переключается в автономный режим, в строке состояния выводится сообщение.
ononline
Когда броузер подключается к сети, выполняется проверка наличия на сервере более новой версии заметки и выполняется сохранение текущей версии.
onupdateready
Если появилась новая версия приложения, выводится сообщение в строке состояния, сообщающее об этом пользователю.
onnoupdate
Если приложение не изменилось, сообщает пользователю, что он или она работает с текущей версией.
А теперь, после краткого обзора логики работы приложения PermaNote, в примере 20.7 приводится ее реализация.
Пример 20.7'. permanote.js
// Некоторые необходимые переменные
var editor, statusline, savebutton, idletimer;
// При первой загрузке приложения
window.onload = function {
// Инициализировать локальное хранилище, если это первый запуск
if (localStorage.note == null)
localStorage.note = "";
if (localStorage.lastModified == null) localStorage.lastModified = 0;
if (localStorage.lastSaved == null) localStorage.lastSaved = 0;
// Отыскать элементы, которые составляют пользовательский интерфейс редактора.
// Инициализировать глобальные переменные,
editor = document.getElementById("editor");
statusline = document.getElementById("statusline");
savebutton = document.getElementById("savebutton");
editor.value = localStorage.note; // Восстановить сохраненную заметку
editor.disabled = true; // Но запретить редактирование до синхр.
// При вводе нового текста в элемент textarea
editor.addEventListener("input",
function (e) {
// Сохранить новую заметку в localStorage
localStorage.note = editor.value;
localStorage.lastModified = Date.now;
// Переустановить таймер ожидания
if (idletimer) clearTimeout(idletimer);
idletimer = setTimeout(save, 5000);
// Разрешить кнопку сохранения
savebutton.disabled = false;
},
false);
// При каждой загрузке приложения пытаться синхронизироваться с сервером
sync;
};
// Сохраняет заметку на сервере перед уходом со страницы
window.onbeforeunload = function {
if (localStorage.lastModified > localStorage.lastSaved) save;