Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
T
todomvc
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Eugene Shen
todomvc
Commits
ccad8ec9
Commit
ccad8ec9
authored
Feb 20, 2013
by
Pascal Hartig
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
CanJS: jshint style
parent
8c233266
Changes
6
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
119 additions
and
115 deletions
+119
-115
architecture-examples/canjs/index.html
architecture-examples/canjs/index.html
+26
-26
architecture-examples/canjs/js/app.js
architecture-examples/canjs/js/app.js
+8
-6
architecture-examples/canjs/js/models/todo.js
architecture-examples/canjs/js/models/todo.js
+7
-7
architecture-examples/canjs/js/todos/todos.js
architecture-examples/canjs/js/todos/todos.js
+17
-15
architecture-examples/canjs/views/todos.ejs
architecture-examples/canjs/views/todos.ejs
+28
-28
architecture-examples/canjs/views/todos.mustache
architecture-examples/canjs/views/todos.mustache
+33
-33
No files found.
architecture-examples/canjs/index.html
View file @
ccad8ec9
<!doctype html>
<html
lang=
"en"
>
<head>
<meta
charset=
"utf-8"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"IE=edge,chrome=1"
>
<title>
CanJS • TodoMVC
</title>
<link
rel=
"stylesheet"
href=
"../../assets/base.css"
>
<!--[if IE]>
<script src="../../assets/ie.js"></script>
<![endif]-->
</head>
<body>
<section
id=
"todoapp"
>
</section>
<div
id=
"info"
>
<p>
Double-click to edit a todo
</p>
<p>
Written by
<a
href=
"http://bitovi.com"
>
Bitovi
</a></p>
<p>
Part of
<a
href=
"http://todomvc.com"
>
TodoMVC
</a></p>
</div>
<head>
<meta
charset=
"utf-8"
>
<meta
http-equiv=
"X-UA-Compatible"
content=
"IE=edge,chrome=1"
>
<title>
CanJS • TodoMVC
</title>
<link
rel=
"stylesheet"
href=
"../../assets/base.css"
>
<!--[if IE]>
<script src="../../assets/ie.js"></script>
<![endif]-->
</head>
<body>
<section
id=
"todoapp"
>
</section>
<div
id=
"info"
>
<p>
Double-click to edit a todo
</p>
<p>
Written by
<a
href=
"http://bitovi.com"
>
Bitovi
</a></p>
<p>
Part of
<a
href=
"http://todomvc.com"
>
TodoMVC
</a></p>
</div>
<script
src=
"../../assets/jquery.min.js"
></script>
<script
src=
"../../assets/base.js"
></script>
<script
src=
"../../assets/jquery.min.js"
></script>
<script
src=
"../../assets/base.js"
></script>
<script
src=
"js/lib/can.jquery-1.1.0.min.js"
></script>
<script
src=
"js/lib/can.mustache.min.js"
></script>
<script
src=
"js/lib/can.localstorage.min.js"
></script>
<script
src=
"js/models/todo.js"
></script>
<script
src=
"js/todos/todos.js"
></script>
<script
src=
"js/app.js"
></script>
</body>
<script
src=
"js/lib/can.jquery-1.1.0.min.js"
></script>
<script
src=
"js/lib/can.mustache.min.js"
></script>
<script
src=
"js/lib/can.localstorage.min.js"
></script>
<script
src=
"js/models/todo.js"
></script>
<script
src=
"js/todos/todos.js"
></script>
<script
src=
"js/app.js"
></script>
</body>
</html>
architecture-examples/canjs/js/app.js
View file @
ccad8ec9
(
function
()
{
$
(
function
()
{
/*global $ Todos Models Mustache can*/
(
function
()
{
'
use strict
'
;
$
(
function
()
{
// Set up a route that maps to the `filter` attribute
can
.
route
(
'
:filter
'
);
can
.
route
(
'
:filter
'
);
// Delay routing until we initialized everything
can
.
route
.
ready
(
false
);
// View helper for pluralizing strings
Mustache
.
registerHelper
(
'
plural
'
,
function
(
str
,
count
)
{
Mustache
.
registerHelper
(
'
plural
'
,
function
(
str
,
count
)
{
return
str
+
(
count
!==
1
?
'
s
'
:
''
);
});
// Initialize the app
Models
.
Todo
.
findAll
({},
function
(
todos
)
{
Models
.
Todo
.
findAll
({},
function
(
todos
)
{
new
Todos
(
'
#todoapp
'
,
{
todos
:
todos
,
state
:
can
.
route
,
state
:
can
.
route
,
view
:
'
views/todos.mustache
'
});
});
...
...
architecture-examples/canjs/js/models/todo.js
View file @
ccad8ec9
...
...
@@ -9,30 +9,30 @@
},
{
// Returns if this instance matches a given filter
// (currently `active` and `complete`)
matches
:
function
()
{
matches
:
function
()
{
var
filter
=
can
.
route
.
attr
(
'
filter
'
);
return
!
filter
||
(
filter
===
'
active
'
&&
!
this
.
attr
(
'
complete
'
))
||
(
filter
===
'
completed
'
&&
this
.
attr
(
'
complete
'
));
return
!
filter
||
(
filter
===
'
active
'
&&
!
this
.
attr
(
'
complete
'
))
||
(
filter
===
'
completed
'
&&
this
.
attr
(
'
complete
'
));
}
});
// List for Todos
Todo
.
List
=
can
.
Model
.
List
({
completed
:
function
()
{
completed
:
function
()
{
var
completed
=
0
;
this
.
each
(
function
(
todo
)
{
this
.
each
(
function
(
todo
)
{
completed
+=
todo
.
attr
(
'
complete
'
)
?
1
:
0
;
});
return
completed
;
},
remaining
:
function
()
{
remaining
:
function
()
{
return
this
.
attr
(
'
length
'
)
-
this
.
completed
();
},
allComplete
:
function
()
{
allComplete
:
function
()
{
return
this
.
attr
(
'
length
'
)
===
this
.
completed
();
}
});
...
...
architecture-examples/canjs/js/todos/todos.js
View file @
ccad8ec9
/*global can
, Models, $
*/
/*global can
Models
*/
(
function
(
namespace
,
undefined
)
{
'
use strict
'
;
...
...
@@ -10,13 +10,13 @@
}
},
{
// Initialize the Todos list
init
:
function
()
{
init
:
function
()
{
// Render the Todos
this
.
element
.
append
(
can
.
view
(
this
.
options
.
view
,
this
.
options
));
},
// Listen for when a new Todo has been entered
'
#new-todo keyup
'
:
function
(
el
,
e
)
{
'
#new-todo keyup
'
:
function
(
el
,
e
)
{
var
value
=
can
.
trim
(
el
.
val
());
if
(
e
.
keyCode
===
ENTER_KEY
&&
value
!==
''
)
{
new
Models
.
Todo
({
...
...
@@ -29,33 +29,35 @@
},
// Handle a newly created Todo
'
{Models.Todo} created
'
:
function
(
list
,
e
,
item
)
{
'
{Models.Todo} created
'
:
function
(
list
,
e
,
item
)
{
this
.
options
.
todos
.
push
(
item
);
// Reset the filter so that you always see your new todo
this
.
options
.
state
.
attr
(
'
filter
'
,
''
);
},
// Listener for when the route changes
'
{state} change
'
:
function
()
{
'
{state} change
'
:
function
()
{
// Remove the `selected` class from the old link and add it to the link for the current location hash
this
.
element
.
find
(
'
#filters
'
).
find
(
'
a
'
).
removeClass
(
'
selected
'
)
.
end
().
find
(
'
[href="
'
+
window
.
location
.
hash
+
'
"]
'
).
addClass
(
'
selected
'
);
},
// Listen for editing a Todo
'
.todo dblclick
'
:
function
(
el
)
{
el
.
data
(
'
todo
'
).
attr
(
'
editing
'
,
true
).
save
(
function
()
{
'
.todo dblclick
'
:
function
(
el
)
{
el
.
data
(
'
todo
'
).
attr
(
'
editing
'
,
true
).
save
(
function
()
{
el
.
children
(
'
.edit
'
).
focus
();
});
},
// Update a todo
updateTodo
:
function
(
el
)
{
updateTodo
:
function
(
el
)
{
var
value
=
can
.
trim
(
el
.
val
()),
todo
=
el
.
closest
(
'
.todo
'
).
data
(
'
todo
'
);
// If we don't have a todo we don't need to do anything
if
(
!
todo
)
return
;
if
(
!
todo
)
{
return
;
}
if
(
value
===
''
)
{
todo
.
destroy
();
...
...
@@ -68,36 +70,36 @@
},
// Listen for an edited Todo
'
.todo .edit keyup
'
:
function
(
el
,
e
)
{
'
.todo .edit keyup
'
:
function
(
el
,
e
)
{
if
(
e
.
keyCode
===
ENTER_KEY
)
{
this
.
updateTodo
(
el
);
}
},
'
.todo .edit focusout
'
:
"
updateTodo
"
,
'
.todo .edit focusout
'
:
'
updateTodo
'
,
// Listen for the toggled completion of a Todo
'
.todo .toggle click
'
:
function
(
el
)
{
'
.todo .toggle click
'
:
function
(
el
)
{
el
.
closest
(
'
.todo
'
).
data
(
'
todo
'
)
.
attr
(
'
complete
'
,
el
.
is
(
'
:checked
'
))
.
save
();
},
// Listen for a removed Todo
'
.todo .destroy click
'
:
function
(
el
)
{
'
.todo .destroy click
'
:
function
(
el
)
{
el
.
closest
(
'
.todo
'
).
data
(
'
todo
'
).
destroy
();
},
// Listen for toggle all completed Todos
'
#toggle-all click
'
:
function
(
el
)
{
var
toggle
=
el
.
prop
(
'
checked
'
);
can
.
each
(
this
.
options
.
todos
,
function
(
todo
)
{
can
.
each
(
this
.
options
.
todos
,
function
(
todo
)
{
todo
.
attr
(
'
complete
'
,
toggle
).
save
();
});
},
// Listen for removing all completed Todos
'
#clear-completed click
'
:
function
()
{
'
#clear-completed click
'
:
function
()
{
for
(
var
i
=
this
.
options
.
todos
.
length
-
1
,
todo
;
i
>
-
1
&&
(
todo
=
this
.
options
.
todos
[
i
]);
i
--
)
{
if
(
todo
.
attr
(
'
complete
'
))
{
todo
.
destroy
();
...
...
architecture-examples/canjs/views/todos.ejs
View file @
ccad8ec9
...
...
@@ -4,36 +4,36 @@
</header>
<section id="main" class="<%= todos.attr("length") === 0 ? "hidden" : "" %>">
<input id="toggle-all" type="checkbox" <%= todos.allComplete() ? "checked" : "" %>>
<label for="toggle-all">Mark all as complete</label>
<ul id="todo-list">
<input id="toggle-all" type="checkbox" <%= todos.allComplete() ? "checked" : "" %>>
<label for="toggle-all">Mark all as complete</label>
<ul id="todo-list">
<% todos.each(function( todo ) { %>
<li class="todo
<%= todo.matches(state.attr('filter')) ? '' : 'hidden' %>
<%= todo.attr('complete') ? 'completed' : '' %>
<%= todo.attr('editing') ? 'editing' : '' %>"
<%= (el)-> el.data('todo', todo) %>>
<div class="view">
<input class="toggle" type="checkbox" <%= todo.attr('complete') ? 'checked' : '' %>>
<label><%= todo.attr('text') %></label>
<button class="destroy"></button>
</div>
<input class="edit" value="<%= todo.attr('text') %>">
</li>
<% }) %>
<li class="todo
<%= todo.matches(state.attr('filter')) ? '' : 'hidden' %>
<%= todo.attr('complete') ? 'completed' : '' %>
<%= todo.attr('editing') ? 'editing' : '' %>"
<%= (el)-> el.data('todo', todo) %>>
<div class="view">
<input class="toggle" type="checkbox" <%= todo.attr('complete') ? 'checked' : '' %>>
<label><%= todo.attr('text') %></label>
<button class="destroy"></button>
</div>
<input class="edit" value="<%= todo.attr('text') %>">
</li>
<% }) %>
</ul>
</section>
<footer id="footer" class="<%= todos.attr('length') === 0 ? 'hidden' : '' %>">
<span id="todo-count">
<strong><%= todos.remaining() %></strong>
item<%= todos.remaining() == 1 ? "" : "s" %> left
</span>
<ul id="filters">
<li><a class="selected" href="#!">All</a></li>
<li><a href="#!active">Active</a></li>
<li><a href="#!completed">Completed</a></li>
</ul>
<button id="clear-completed" class="<%= todos.completed() === 0 ? 'hidden' : '' %>">
Clear completed (<%= todos.completed() %>)
</button>
<span id="todo-count">
<strong><%= todos.remaining() %></strong>
item<%= todos.remaining() == 1 ? "" : "s" %> left
</span>
<ul id="filters">
<li><a class="selected" href="#!">All</a></li>
<li><a href="#!active">Active</a></li>
<li><a href="#!completed">Completed</a></li>
</ul>
<button id="clear-completed" class="<%= todos.completed() === 0 ? 'hidden' : '' %>">
Clear completed (<%= todos.completed() %>)
</button>
</footer>
architecture-examples/canjs/views/todos.mustache
View file @
ccad8ec9
<header
id=
"header"
>
<h1>
todos
</h1>
<input
id=
"new-todo"
{{
(
el
)
-
>
el
.
val
(
''
).
focus
()
}}
placeholder=
"What needs to be done?"
autofocus=
""
>
<h1>
todos
</h1>
<input
id=
"new-todo"
{{
(
el
)
-
>
el
.
val
(
''
).
focus
()
}}
placeholder=
"What needs to be done?"
autofocus=
""
>
</header>
<section
id=
"main"
class=
"
{{^
todos
}}
hidden
{{/
todos
}}
"
>
<input
id=
"toggle-all"
type=
"checkbox"
{{#
todos
.
allComplete
}}
checked=
"checked"
{{/
todos
.
allComplete
}}
>
<label
for=
"toggle-all"
>
Mark all as complete
</label>
<ul
id=
"todo-list"
>
{{#
todos
}}
<li
class=
"todo
{{^
matches
}}
hidden
{{/
matches
}}
{{#
complete
}}
completed
{{/
complete
}}
{{#
editing
}}
editing
{{/
editing
}}
"
{{
data
'todo'
}}
>
<div
class=
"view"
>
<input
class=
"toggle"
type=
"checkbox"
{{#
complete
}}
checked=
"checked"
{{/
complete
}}
>
<label>
{{
text
}}
</label>
<button
class=
"destroy"
></button>
</div>
<input
class=
"edit"
type=
"text"
value=
"
{{
text
}}
"
>
</li>
{{/
todos
}}
</ul>
<input
id=
"toggle-all"
type=
"checkbox"
{{#
todos
.
allComplete
}}
checked=
"checked"
{{/
todos
.
allComplete
}}
>
<label
for=
"toggle-all"
>
Mark all as complete
</label>
<ul
id=
"todo-list"
>
{{#
todos
}}
<li
class=
"todo
{{^
matches
}}
hidden
{{/
matches
}}
{{#
complete
}}
completed
{{/
complete
}}
{{#
editing
}}
editing
{{/
editing
}}
"
{{
data
'todo'
}}
>
<div
class=
"view"
>
<input
class=
"toggle"
type=
"checkbox"
{{#
complete
}}
checked=
"checked"
{{/
complete
}}
>
<label>
{{
text
}}
</label>
<button
class=
"destroy"
></button>
</div>
<input
class=
"edit"
type=
"text"
value=
"
{{
text
}}
"
>
</li>
{{/
todos
}}
</ul>
</section>
<footer
id=
"footer"
class=
"
{{^
todos
}}
hidden
{{/
todos
}}
"
>
<span
id=
"todo-count"
>
<strong>
{{
todos
.
remaining
}}
</strong>
{{
plural
"item"
todos
.
remaining
}}
left
</span>
<ul
id=
"filters"
>
<li>
<a
class=
"selected"
href=
"#!"
>
All
</a>
</li>
<li>
<a
href=
"#!active"
>
Active
</a>
</li>
<li>
<a
href=
"#!completed"
>
Completed
</a>
</li>
</ul>
<button
id=
"clear-completed"
class=
"
{{^
todos
.
completed
}}
hidden
{{/
todos
.
completed
}}
"
>
Clear completed (
{{
todos
.
completed
}}
)
</button>
<span
id=
"todo-count"
>
<strong>
{{
todos
.
remaining
}}
</strong>
{{
plural
"item"
todos
.
remaining
}}
left
</span>
<ul
id=
"filters"
>
<li>
<a
class=
"selected"
href=
"#!"
>
All
</a>
</li>
<li>
<a
href=
"#!active"
>
Active
</a>
</li>
<li>
<a
href=
"#!completed"
>
Completed
</a>
</li>
</ul>
<button
id=
"clear-completed"
class=
"
{{^
todos
.
completed
}}
hidden
{{/
todos
.
completed
}}
"
>
Clear completed (
{{
todos
.
completed
}}
)
</button>
</footer>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment