gun/examples/todo/index.html
2015-07-03 22:48:38 -07:00

38 lines
1.1 KiB
HTML

<html>
<body onload="ready()">
<h2>ToDo List</h2>
<form id="addToDo"><input id="todoItem" /><button>Add</button></form>
<ul id="todos"></ul>
<script src="../../gun.js"></script>
<script>
// by Forrest Tait! Edited by Mark Nadal.
function ready(){
var $ = document.querySelector.bind(document);
var gun = Gun(location.origin + '/gun').get('example/todo/data');
gun.on(function renderToDo(val){
var todoHTML = '';
for(field in val) {
if(!val[field] || field == '_') continue;
todoHTML += '<li style="width:400px;height:2em;">'
+ (val[field]||'').toString().replace(/\</ig, '&lt;')
+ '<button style="float:right;" onclick=removeToDo("'+field+'")>X</button></li>';
}
$("#todos").innerHTML = todoHTML;
});
$("#addToDo").onsubmit = function(){
gun.set(($("#todoItem").value||'').toString().replace(/\</ig, '&lt;'));
$("#todoItem").value = "";
return false;
};
window.removeToDo = function(id){
gun.path(id).put(null);
}
}
function randomId(){
return ''+(new Date()).getTime()+Math.round((Math.random()*1000));
}
</script>
</body>
</html>