<html><head>
<!-- $AFresh1: index.html,v 1.10 2010/02/17 02:16:28 andrew Exp $ -->
<title>todo.txt - ajax client</title>
<link rel="stylesheet" href="todo.css">
<script src="scriptaculous/lib/prototype.js"></script>
<script src="scriptaculous/src/scriptaculous.js?load=effects,controls"></script>
<script type='text/javascript'>
var TODO = function () {
var base_url = '/~andrew/user-bin/todo.cgi',
editors = {},
makeEntryEditor = function(id, list_url) {
var url = list_url + '/entry/' + id;
if (!editors[id]) {
editors[id] = {
list_url: list_url,
editor: new Ajax.InPlaceEditor(
id, url + '.json', {
cols: 80,
rows: 1,
onComplete: updateEntry,
}
),
};
}
},
updateEntry = function(transport, element) {
var list_url = editors[element.id].list_url,
entry;
if (transport && transport.responseJSON) {
entry = transport.responseJSON;
element.update(entry.text);
if (element.id !== entry.md5) {
if (editors[element.id]) {
editors[element.id].editor.dispose();
delete editors[element.id];
}
element.id = entry.md5;
makeEntryEditor(element.id, list_url);
}
}
},
updateList = function (list_url, transport) {
var i,
todo = transport.responseJSON,
url = '';
$("list").update();
for (i=0; i <= todo.length; i++) {
$('list').insert({
bottom: new Element('div',
{ id: todo[i].md5 }
).update(todo[i].text)
}
);
makeEntryEditor(todo[i].md5, list_url);
}
};
return {
getFiles: function () {
$('files').update("Getting Files . . .");
new Ajax.Updater('files', base_url, {
method: 'get',
});
},
getTags: function (list) {
var url = base_url + '/' + list + '/tags';
$('tags').update("Getting Tags. . .");
new Ajax.Request(url + '.json', {
method: 'get',
onSuccess: function (transport) {
var data = transport.responseJSON,
k,
html = '';
for (k in data) {
if (data.hasOwnProperty(k)) {
html += k + ": " + data[k] + "<br/>\n";
}
}
$("tags").innerHTML = html;
},
});
},
getList: function (list) {
var url = base_url + '/' + list;
$('list').update("Getting List . . .");
new Ajax.Request(url + '.json', {
method: 'get',
onSuccess: function (transport) { updateList(url, transport) },
});
},
};
}();
</script>
</head>
<body onLoad="TODO.getList('todo');TODO.getTags('todo');TODO.getFiles()">
<h1>Files:</h1><div id='files'></div>
<h1>Tags:</h1> <div id='tags'></div>
<h1>List:</h1> <div id='list'></div>
</body></html>