Skip to content

Instantly share code, notes, and snippets.

@oieioi

oieioi/index.html

Last active September 10, 2015 09:46
Show Gist options
  • Save oieioi/1cce2c489c039433168f to your computer and use it in GitHub Desktop.
Save oieioi/1cce2c489c039433168f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>mithriltest</title>
<script src="//cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"></script>
<script>
// Namespace
var todo = {};
// Model
todo.Todo = function(data){
this.description = m.prop(data.description);
this.done = m.prop(false);
};
// Collection
todo.TodoList = Array;
// View Model
todo.vm = (function() {
var vm = {};
vm.init = function(){
vm.list = new todo.TodoList();
vm.description = m.prop("");
vm.add = function() {
if(vm.description()) {
vm.list.push(new todo.Todo({description: vm.description()}));
vm.description("");
}
};
}
return vm;
})();
// Controller
todo.controller = function() {
todo.vm.init();
};
// View
todo.view = function() {
return m("html", [
m("body", [
m("input", {onchange: m.withAttr("value", todo.vm.description), value: todo.vm.description()}),
m("button", {onclick: todo.vm.add}, "追加"),
m("table", [
todo.vm.list.map(function(task, index){
return m("tr", [
m("td", [
m("label", {style: {textDecoration: task.done() ? "line-through": "none"}}, [
m("input[type=checkbox]", {onclick: m.withAttr("checked", task.done), checked: task.done()}),
task.description()
])
])
])
})
])
])
]);
};
m.mount(document, {controller: todo.controller, view: todo.view});
</script>
</head>
<body>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment