Skip to content

Commit dd986f6

Browse files
yyx990803yyx990803
committed
update todomvc example
1 parent 97ae25c commit dd986f6

File tree

13 files changed

+374
-1848
lines changed

13 files changed

+374
-1848
lines changed

‎examples/todomvc/bower_components/director/director.js‎

Lines changed: 0 additions & 719 deletions
This file was deleted.

‎examples/todomvc/bower_components/todomvc-common/base.css‎

Lines changed: 0 additions & 556 deletions
This file was deleted.

‎examples/todomvc/bower_components/todomvc-common/base.js‎

Lines changed: 0 additions & 209 deletions
This file was deleted.

‎examples/todomvc/bower_components/todomvc-common/bg.png‎

-2.08 KB
Binary file not shown.

‎examples/todomvc/index.html‎

Lines changed: 81 additions & 103 deletions
Original file line numberDiff line numberDiff line change
@@ -1,105 +1,83 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<head>
4-
<title>Todo</title>
5-
<meta charset="utf-8">
6-
<link rel="stylesheet" type="text/css" href="bower_components/todomvc-common/base.css">
7-
<style> [v-cloak] { display: none; } </style>
8-
</head>
9-
<body>
10-
<section id="todoapp">
11-
<header id="header">
12-
<h1>todos</h1>
13-
<input
14-
id="new-todo"
15-
autofocus
16-
autocomplete="off"
17-
placeholder="What needs to be done?"
18-
v-model="newTodo"
19-
v-on="keyup:addTodo | key 'enter'"
20-
>
21-
</header>
22-
<section id="main" v-show="todos.length" v-cloak>
23-
<input
24-
id="toggle-all"
25-
type="checkbox"
26-
v-model="allDone"
27-
>
28-
<ul id="todo-list">
29-
<li
30-
class="todo"
31-
v-repeat="todos | filterTodos"
32-
v-class="
33-
completed : completed,
34-
editing : this == editedTodo
35-
"
36-
>
37-
<div class="view">
38-
<input
39-
class="toggle"
40-
type="checkbox"
41-
v-model="completed"
42-
>
43-
<label v-text="title" v-on="dblclick: editTodo(this)"></label>
44-
<button class="destroy" v-on="click: removeTodo(this)"></button>
45-
</div>
46-
<input
47-
class="edit"
48-
type="text"
49-
v-model="title"
50-
v-todo-focus="this == editedTodo"
51-
v-on="
52-
blur : doneEdit(this),
53-
keyup : doneEdit(this) | key 'enter',
54-
keyup : cancelEdit(this) | key 'esc'
55-
"
56-
>
57-
</li>
58-
</ul>
59-
</section>
60-
<footer id="footer" v-show="todos.length" v-cloak>
61-
<span id="todo-count">
62-
<strong v-text="remaining"></strong> {{remaining | pluralize 'item'}} left
63-
</span>
64-
<ul id="filters">
65-
<li><a href="#/all" v-class="selected: activeFilter == 'all'">All</a></li>
66-
<li><a href="#/active" v-class="selected: activeFilter == 'active'">Active</a></li>
67-
<li><a href="#/completed" v-class="selected: activeFilter == 'completed'">Completed</a></li>
68-
</ul>
69-
<button id="clear-completed" v-on="click:removeCompleted" v-show="todos.length > remaining">
70-
Clear completed ({{todos.length - remaining}})
71-
</button>
72-
</footer>
73-
</section>
74-
<footer id="info">
75-
<p>Double-click to edit a todo</p>
76-
<p>Powered by <a href="http://vuejs.org">Vue.js</a></p>
77-
<p>Created by <a href="http://evanyou.me">Evan You</a></p>
78-
</footer>
1+
<!doctype html>
2+
<html data-framework="vue">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Vue.js • TodoMVC</title>
6+
<link rel="stylesheet" href="node_modules/todomvc-app-css/index.css">
7+
<style> [v-cloak] { display: none; } </style>
8+
</head>
9+
<body>
10+
<section class="todoapp">
11+
<header class="header">
12+
<h1>todos</h1>
13+
<input class="new-todo"
14+
autofocus autocomplete="off"
15+
placeholder="What needs to be done?"
16+
v-model="newTodo"
17+
v-on="keyup:addTodo | key 'enter'">
18+
</header>
19+
<section class="main" v-show="todos.length" v-cloak>
20+
<input class="toggle-all" type="checkbox" v-model="allDone">
21+
<ul class="todo-list">
22+
<li class="todo"
23+
v-repeat="todo: filteredTodos"
24+
v-class="completed: todo.completed, editing: todo == editedTodo">
25+
<div class="view">
26+
<input class="toggle" type="checkbox" v-model="todo.completed">
27+
<label v-on="dblclick: editTodo(todo)">{{todo.title}}</label>
28+
<button class="destroy" v-on="click: removeTodo(todo)"></button>
29+
</div>
30+
<input class="edit" type="text"
31+
v-model="todo.title"
32+
v-todo-focus="todo == editedTodo"
33+
v-on="blur: doneEdit(todo),
34+
keyup: doneEdit(todo) | key 'enter',
35+
keyup: cancelEdit(todo) | key 'esc'">
36+
</li>
37+
</ul>
38+
</section>
39+
<footer class="footer" v-show="todos.length" v-cloak>
40+
<span class="todo-count">
41+
<strong v-text="remaining"></strong> {{remaining | pluralize 'item'}} left
42+
</span>
43+
<ul class="filters">
44+
<li><a href="#/all" v-class="selected: visibility == 'all'">All</a></li>
45+
<li><a href="#/active" v-class="selected: visibility == 'active'">Active</a></li>
46+
<li><a href="#/completed" v-class="selected: visibility == 'completed'">Completed</a></li>
47+
</ul>
48+
<button class="clear-completed" v-on="click:removeCompleted" v-show="todos.length > remaining">
49+
Clear completed
50+
</button>
51+
</footer>
52+
</section>
53+
<footer class="info">
54+
<p>Double-click to edit a todo</p>
55+
<p>Written by <a href="http://evanyou.me">Evan You</a></p>
56+
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
57+
</footer>
7958

80-
<!-- testing/benchmark only -->
81-
<script>
82-
var isPhantom = navigator.userAgent.indexOf('PhantomJS') > -1
83-
if (isPhantom) {
84-
localStorage.clear()
85-
} else {
86-
var now = window.performance && window.performance.now
87-
? function () { return window.performance.now() }
88-
: Date.now
89-
var metrics = { beforeLoad: now() }
90-
}
91-
</script>
92-
<!-- end testing/bench -->
59+
<!-- testing/benchmark only -->
60+
<script>
61+
var isPhantom = navigator.userAgent.indexOf('PhantomJS') > -1
62+
if (isPhantom) {
63+
localStorage.clear()
64+
} else {
65+
var now = window.performance && window.performance.now
66+
? function () { return window.performance.now() }
67+
: Date.now
68+
var metrics = { beforeLoad: now() }
69+
}
70+
</script>
71+
<!-- end testing/bench -->
9372

94-
<script src="../../dist/vue.js"></script>
95-
<script>metrics.afterLoad = now()</script>
96-
<script src="bower_components/director/director.js"></script>
97-
<script src="js/store.js"></script>
98-
<script>metrics.beforeRender = now()</script>
99-
<script src="js/app.js"></script>
100-
<script src="js/routes.js"></script>
101-
<script>metrics.afterRender = now()</script>
102-
<script src="js/perf.js"></script>
103-
104-
</body>
105-
</html>
73+
<script src="../../dist/vue.js"></script>
74+
<script>metrics.afterLoad = now()</script>
75+
<script src="node_modules/director/build/director.js"></script>
76+
<script src="js/store.js"></script>
77+
<script>metrics.beforeRender = now()</script>
78+
<script src="js/app.js"></script>
79+
<script src="js/routes.js"></script>
80+
<script>metrics.afterRender = now()</script>
81+
<script src="perf.js"></script>
82+
</body>
83+
</html>

0 commit comments

Comments
 (0)