Annotation of todotxt/Text-Todo-REST-API/example/htdocs/index.html, Revision 1.12
1.2 andrew 1: <html><head>
1.12 ! andrew 2: <!-- $AFresh1: index.html,v 1.11 2010/02/18 05:35:04 andrew Exp $ -->
1.7 andrew 3: <title>todo.txt - ajax client</title>
4: <link rel="stylesheet" href="todo.css">
1.9 andrew 5:
1.7 andrew 6: <script src="scriptaculous/lib/prototype.js"></script>
7: <script src="scriptaculous/src/scriptaculous.js?load=effects,controls"></script>
1.2 andrew 8: <script type='text/javascript'>
1.4 andrew 9:
1.9 andrew 10: var TODO = function () {
11: var base_url = '/~andrew/user-bin/todo.cgi',
1.11 andrew 12: editors = {},
1.10 andrew 13:
1.11 andrew 14: makeEntryEditor = function(list, entry) {
15: var url = base_url + '/' + list + '/entry/' + entry.line,
16: id = entry.id;
17:
1.12 ! andrew 18: if (!id) {
! 19: id = 'entry_' + entry.line;
! 20: }
! 21:
! 22: if (editors[id]) {
! 23: editors[id].dispose();
! 24: delete editors[id];
! 25: }
! 26:
! 27: editors[id] = new Ajax.InPlaceEditor( id, url + '.json', {
! 28: cols: 80,
! 29: rows: 1,
! 30: callback: function(form, value) {
! 31: entry.oldText = entry.text;
! 32: entry.text = value;
! 33: return entry;
! 34: },
! 35: onComplete: function (transport, element) {
! 36: if (transport && transport.responseJSON) {
! 37: updateEntry( list, transport.responseJSON, element);
1.10 andrew 38: }
1.11 andrew 39: }
1.12 ! andrew 40: }
! 41: );
1.10 andrew 42: },
43:
1.12 ! andrew 44: updateEntry = function(list, entry, element) {
! 45: if (!entry.id) {
! 46: entry.id = 'entry_' + entry.line;
! 47: }
! 48: var liId = 'li_' + entry.id;
1.10 andrew 49:
1.12 ! andrew 50: if (parseInt(entry.line) !== $(liId).value) {
1.11 andrew 51: for (k in editors) {
52: if (editors.hasOwnProperty(k)) {
1.12 ! andrew 53: editors[k].dispose();
1.11 andrew 54: delete editors[k];
55: }
1.10 andrew 56: }
1.11 andrew 57: return getList(list);
1.10 andrew 58: }
1.12 ! andrew 59:
! 60: $(liId).update(
! 61: new Element('span', { id: entry.id }). update(entry.text)
! 62: ).insert({
! 63: top: new Element('input', {
! 64: type: 'checkbox' ,
! 65: id: 'do_' + entry.line,
! 66: checked: entry.done,
! 67: disabled: true,
! 68: })
! 69: });
! 70:
! 71: makeEntryEditor(list, entry);
1.10 andrew 72: },
73:
1.11 andrew 74: updateList = function (list, transport) {
75: var i,
1.9 andrew 76: todo = transport.responseJSON,
1.12 ! andrew 77: element = new Element('ol'),
! 78: entryElement;
1.9 andrew 79:
1.11 andrew 80: $("list").update( element );
1.9 andrew 81:
82: for (i=0; i <= todo.length; i++) {
1.11 andrew 83: todo[i].id = 'entry_' + todo[i].line;
84:
1.12 ! andrew 85: entryElement = new Element('li', {
! 86: id: 'li_' + todo[i].id,
! 87: value: todo[i].line
! 88: });
! 89:
! 90: element.insert(entryElement);
1.9 andrew 91:
1.12 ! andrew 92: updateEntry(list, todo[i], entryElement);
1.9 andrew 93: }
1.11 andrew 94: },
95:
96: getFiles = function () {
97: $('files').update("Getting Files . . .");
98:
99: new Ajax.Updater('files', base_url, {
100: method: 'get',
101: });
102: },
103:
104: getTags = function (list) {
105: $('tags').update("Getting Tags. . .");
106:
107: var url = base_url + '/' + list + '/tags';
1.9 andrew 108:
1.11 andrew 109: new Ajax.Request(url + '.json', {
110: method: 'get',
111: onSuccess: function (transport) {
112: var k,
113: data = transport.responseJSON,
114: element = new Element('ul');
115:
116: $("tags").update(element);
117: for (k in data) {
118: if (data.hasOwnProperty(k)) {
119: element.insert(
120: new Element('li', {
121: id: 'tag_' + k,
122: }).update( k + ": " + data[k] )
123: );
124: getTag(list, k);
125: }
126: }
127: },
128: });
129: },
1.9 andrew 130:
1.11 andrew 131: getTag = function( list, tag ) {
132: new Ajax.Request(base_url + '/' + list + '/tags/' + tag + '.json', {
133: method: 'get',
134: onSuccess: function (transport) {
135: if (transport && transport.responseJSON) {
136: var i,
137: myTags = transport.responseJSON,
138: element = new Element('ul');
139:
140: if (myTags.length) {
141: $('tag_' + tag).insert(element);
142:
143: for (i=0; i<myTags.length; i++) {
144: element.insert( new Element('li').
145: update( myTags[i] ));
1.9 andrew 146: }
147: }
1.11 andrew 148: }
149: }
150: });
151: },
1.9 andrew 152:
1.11 andrew 153: getList = function (list) {
154: $('list').update("Getting List . . .");
155:
156: new Ajax.Request(base_url + '/' + list + '.json', {
157: method: 'get',
158: onSuccess: function (transport) { updateList(list, transport) },
159: });
1.9 andrew 160:
1.11 andrew 161: };
162:
163: return {
164: getList: getList,
165: getFiles: getFiles,
166: getTags: getTags,
1.9 andrew 167: };
168: }();
1.7 andrew 169:
1.2 andrew 170: </script>
171: </head>
1.6 andrew 172:
1.9 andrew 173: <body onLoad="TODO.getList('todo');TODO.getTags('todo');TODO.getFiles()">
1.7 andrew 174: <h1>Files:</h1><div id='files'></div>
1.11 andrew 175: <h1>List:</h1> <div id='list'></div>
1.9 andrew 176: <h1>Tags:</h1> <div id='tags'></div>
1.1 andrew 177: </body></html>
FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>