index.js

import Todo from 'model'
import TodoView from 'view'

let firstThing = new Todo("write better specs")
let secondThing = new Todo("drink a ''pac à l'eau''")

let firstThingView = new TodoView(firstThing)
let secondThingView = new TodoView(secondThing)

document.body.appendChild(firstThingView)
document.body.appendChild(secondThingV)

firstThing.title = firstThing.title + " in a gist"
// will update the first todo view with the new title

// ...

model.js

export class Todo {
	constructor (title, done = false) {
		this.title = title
		this.done = done
	}

	open () {
		this.done = false
	}

	close () {
		this.done = true
	}

	toggle () {
		this.done = !this.done
	}
}

template.html

<li>
	<div on-double-click="{{edit}}">
		<input type="checkbox" bind-to="todo.title">
		<label>{{todo.title}}</label>
		<button on-click="{{delete}}"></button>
	</div>
	<input on-enter="{{save}}" value="{{todo.title}}">
</li>

view.js

import weiv from 'weiv'
import events from 'events'
import template from 'template.html'

class View {
	constructor (todo) {
		this.todo = todo
		this.editing = false
	}

	edit () {
		this.editing = true
	}

	save () {
		this.editing = false
	}

	delete () {
		// ...
	}
}

export weiv(View)
	.engine(bindings(template))
	.use(events())