Skip to content

Instantly share code, notes, and snippets.

@shashi
Forked from anonymous/todo.css
Last active December 22, 2015 02:29
Show Gist options
  • Save shashi/6404140 to your computer and use it in GitHub Desktop.
Save shashi/6404140 to your computer and use it in GitHub Desktop.
/* CSS declarations go here */
.wrapper {
width: 960px;
margin: 10px auto;
}
ul {
list-style: none;
}
ul li {
padding: 0.5em;
}
ul li:hover {
background: #f1f1f1;
}
<head>
<title>todo</title>
</head>
<body>
<div class="wrapper">
{{> list}}
{{> addTodo}}
</div>
</body>
<template name="list">
<h1>Todo</h1>
<ul>
{{#each todoList}}
{{> todoItem}}
{{/each}}
</ul>
</template>
<template name="todoItem">
<li><input type="checkbox" class="done" {{#if done}}checked="checked"{{/if}}"></input> {{title}} </li>
</template>
<template name="addTodo">
<input type="text" id="newTitle"></input> <input type="button" class="addOff btn btn-primary" value="Add"></input>
</template>
TodoItems = new Meteor.Collection("todoitems");
if (Meteor.isClient) {
Template.list.todoList = function () {
return TodoItems.find().fetch();
};
Template.addTodo.events({
'click .addOff': function () {
//alert("Creating new todo: " + $("#newTitle").val());
var newTodo = {
title: $("#newTitle").val(),
done: ! this.done
};
TodoItems.insert(newTodo);
}
});
Template.todoItem.events({
'change .done': function (a, b) {
TodoItems.update(this._id, {$set: {done: true}});
}
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment