-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
137 lines (120 loc) · 5.36 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html>
<head>
<title>Gamify My Life</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
</head>
<body>
<script type="text/template" id="home">
<div data-role="header" data-theme="b">
<h1>Gamify My Life!</h1>
<div data-role="navbar" data-theme="a">
</div>
</div>
<div data-role="content" data-theme="a">
<h3> Task List </h3>
<ul data-role="listview" data-filter=false id="taskList">
<%
var tasks = this.collection.toJSON();
tasks.forEach(function(task) {
console.log("task: %o", task);
%>
<li data-taskId="<%= task.id %>"><a href=""><%= task.name %></a></li>
<%
});
%>
</ul>
</div>
<div data-role="footer" data-theme="b" data-position="fixed">
<nav data-role="navbar">
<ul>
<li><a href="#" data-icon="home">Home</a></li>
<li><a href="#todo/new" data-icon="edit">New Task</a></li>
<li><a href="#credits" data-icon="star">Credits</a></li>
</ul>
</nav>
</div>
</script>
<script type="text/template" id="newTask">
<div data-role="header" data-theme="b">
<h1>Create Task</h1>
<div data-role="navbar" data-theme="a">
</div>
</div>
<div data-role="content" data-theme="a">
<div data-role="fieldcontain">
<label for="taskName">Task Name:</label>
<input type="text" name="name" id="taskName" value="" />
</div>
<button id="saveButton">Save</button>
</div>
<div data-role="footer" data-theme="b" data-position="fixed">
<nav data-role="navbar">
<ul>
<li><a href="#" data-icon="home">Home</a></li>
<li><a href="#todo/new" data-icon="edit">New Task</a></li>
<li><a href="#credits" data-icon="star">Credits</a></li>
</ul>
</nav>
</div>
</script>
<script type="text/template" id="credits">
<div data-role="header" data-theme="b">
<h1>Your Credits</h1>
<div data-role="navbar" data-theme="a">
</div>
</div>
<div data-role="content" data-theme="a">
Currently, you have 0 credits.
</div>
<div data-role="footer" data-theme="b" data-position="fixed">
<nav data-role="navbar">
<ul>
<li><a href="#" data-icon="home">Home</a></li>
<li><a href="#todo/new" data-icon="edit">New Task</a></li>
<li><a href="#credits" data-icon="star">Credits</a></li>
</ul>
</nav>
</div>
</script>
<script type="text/template" id="editTask">
<div data-role="header" data-theme="b">
<h1>Edit Task</h1>
<div data-role="navbar" data-theme="a">
</div>
</div>
<div data-role="content" data-theme="a">
<h1>Do Laundry</h1>
<label for="textarea-a">Notes:</label>
<label><input type="checkbox" name="checkbox-0" id="myCheckbox" /> Completed </label>
<a id='lnkDialog' href="#dialog" data-rel="dialog" data-transition="pop" style='display:none;'></a>
</div>
<div data-role="footer" data-theme="b" data-position="fixed">
<nav data-role="navbar">
<ul>
<li><a href="#" data-icon="home">Home</a></li>
<li><a href="#todo/new" data-icon="edit">New Task</a></li>
<li><a href="#credits" data-icon="star">Credits</a></li>
</ul>
</nav>
</div>
</script>
<script type="text/template" id="confirmCompletionDialog">
<div data-role="header" data-theme="b">
<h1>Are you sure?</h1>
</div>
<div data-role="content">
<p> Are you sure you completed the task?</p>
<button id="completedTaskYes">Yes</button>
<button id="completedTaskNo">No</button>
</div>
</script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="./js/jqm-config.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<script src="./js/lib/underscore.js"></script>
<script src="./js/lib/backbone.js"></script>
<script src="./js/app.js"></script>
</body>
</html>