Skip to content

T
todomvc
Commit ccad8ec9 authored by Pascal Hartig's avatar Pascal Hartig
Browse files
Options

CanJS: jshint style

parent 8c233266
Hide whitespace changes
Inline Side-by-side
Showing with 119 additions and 115 deletions
architecture-examples/canjs/index.html
View file @ ccad8ec9
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>CanJS • TodoMVC</title> <title>CanJS • TodoMVC</title>
<link rel="stylesheet" href="../../assets/base.css"> <link rel="stylesheet" href="../../assets/base.css">
<!--[if IE]> <!--[if IE]>
<script src="../../assets/ie.js"></script> <script src="../../assets/ie.js"></script>
<![endif]--> <![endif]-->
</head> </head>
<body> <body>
<section id="todoapp"> <section id="todoapp">
</section> </section>
<div id="info"> <div id="info">
<p>Double-click to edit a todo</p> <p>Double-click to edit a todo</p>
<p>Written by <a href="http://bitovi.com">Bitovi</a></p> <p>Written by <a href="http://bitovi.com">Bitovi</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p> <p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</div> </div>
<script src="../../assets/jquery.min.js"></script> <script src="../../assets/jquery.min.js"></script>
<script src="../../assets/base.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.jquery-1.1.0.min.js"></script>
<script src="js/lib/can.mustache.min.js"></script> <script src="js/lib/can.mustache.min.js"></script>
<script src="js/lib/can.localstorage.min.js"></script> <script src="js/lib/can.localstorage.min.js"></script>
<script src="js/models/todo.js"></script> <script src="js/models/todo.js"></script>
<script src="js/todos/todos.js"></script> <script src="js/todos/todos.js"></script>
<script src="js/app.js"></script> <script src="js/app.js"></script>
</body> </body>
</html> </html>
architecture-examples/canjs/js/app.js
View file @ ccad8ec9
(function() { /*global $ Todos Models Mustache can*/
$(function() { (function () {
'use strict';
$(function () {
// Set up a route that maps to the `filter` attribute // Set up a route that maps to the `filter` attribute
can.route( ':filter' ); can.route(':filter');
// Delay routing until we initialized everything // Delay routing until we initialized everything
can.route.ready(false); can.route.ready(false);
// View helper for pluralizing strings // View helper for pluralizing strings
Mustache.registerHelper('plural', function(str, count) { Mustache.registerHelper('plural', function (str, count) {
return str + (count !== 1 ? 's' : ''); return str + (count !== 1 ? 's' : '');
}); });
// Initialize the app // Initialize the app
Models.Todo.findAll({}, function(todos) { Models.Todo.findAll({}, function (todos) {
new Todos('#todoapp', { new Todos('#todoapp', {
todos: todos, todos: todos,
state : can.route, state: can.route,
view : 'views/todos.mustache' view : 'views/todos.mustache'
}); });
}); });
......
architecture-examples/canjs/js/models/todo.js
View file @ ccad8ec9
...@@ -9,30 +9,30 @@ ...@@ -9,30 +9,30 @@
}, { }, {
// Returns if this instance matches a given filter // Returns if this instance matches a given filter
// (currently `active` and `complete`) // (currently `active` and `complete`)
matches : function() { matches : function () {
var filter = can.route.attr('filter'); var filter = can.route.attr('filter');
return !filter || (filter === 'active' && !this.attr('complete')) return !filter || (filter === 'active' && !this.attr('complete')) ||
|| (filter === 'completed' && this.attr('complete')); (filter === 'completed' && this.attr('complete'));
} }
}); });
// List for Todos // List for Todos
Todo.List = can.Model.List({ Todo.List = can.Model.List({
completed: function() { completed: function () {
var completed = 0; var completed = 0;
this.each(function(todo) { this.each(function (todo) {
completed += todo.attr('complete') ? 1 : 0; completed += todo.attr('complete') ? 1 : 0;
}); });
return completed; return completed;
}, },
remaining: function() { remaining: function () {
return this.attr('length') - this.completed(); return this.attr('length') - this.completed();
}, },
allComplete: function() { allComplete: function () {
return this.attr('length') === this.completed(); 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) { (function (namespace, undefined) {
'use strict'; 'use strict';
...@@ -10,13 +10,13 @@ ...@@ -10,13 +10,13 @@
} }
}, { }, {
// Initialize the Todos list // Initialize the Todos list
init: function() { init: function () {
// Render the Todos // Render the Todos
this.element.append(can.view(this.options.view, this.options)); this.element.append(can.view(this.options.view, this.options));
}, },
// Listen for when a new Todo has been entered // 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()); var value = can.trim(el.val());
if (e.keyCode === ENTER_KEY && value !== '') { if (e.keyCode === ENTER_KEY && value !== '') {
new Models.Todo({ new Models.Todo({
...@@ -29,33 +29,35 @@ ...@@ -29,33 +29,35 @@
}, },
// Handle a newly created Todo // Handle a newly created Todo
'{Models.Todo} created': function(list, e, item) { '{Models.Todo} created': function (list, e, item) {
this.options.todos.push(item); this.options.todos.push(item);
// Reset the filter so that you always see your new todo // Reset the filter so that you always see your new todo
this.options.state.attr('filter', ''); this.options.state.attr('filter', '');
}, },
// Listener for when the route changes // 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 // 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') this.element.find('#filters').find('a').removeClass('selected')
.end().find('[href="' + window.location.hash + '"]').addClass('selected'); .end().find('[href="' + window.location.hash + '"]').addClass('selected');
}, },
// Listen for editing a Todo // Listen for editing a Todo
'.todo dblclick': function(el) { '.todo dblclick': function (el) {
el.data('todo').attr('editing', true).save(function() { el.data('todo').attr('editing', true).save(function () {
el.children('.edit').focus(); el.children('.edit').focus();
}); });
}, },
// Update a todo // Update a todo
updateTodo: function(el) { updateTodo: function (el) {
var value = can.trim(el.val()), var value = can.trim(el.val()),
todo = el.closest('.todo').data('todo'); todo = el.closest('.todo').data('todo');
// If we don't have a todo we don't need to do anything // If we don't have a todo we don't need to do anything
if(!todo) return; if (!todo) {
return;
}
if (value === '') { if (value === '') {
todo.destroy(); todo.destroy();
...@@ -68,36 +70,36 @@ ...@@ -68,36 +70,36 @@
}, },
// Listen for an edited Todo // Listen for an edited Todo
'.todo .edit keyup': function(el, e) { '.todo .edit keyup': function (el, e) {
if (e.keyCode === ENTER_KEY) { if (e.keyCode === ENTER_KEY) {
this.updateTodo(el); this.updateTodo(el);
} }
}, },
'.todo .edit focusout' : "updateTodo", '.todo .edit focusout' : 'updateTodo',
// Listen for the toggled completion of a Todo // Listen for the toggled completion of a Todo
'.todo .toggle click': function(el) { '.todo .toggle click': function (el) {
el.closest('.todo').data('todo') el.closest('.todo').data('todo')
.attr('complete', el.is(':checked')) .attr('complete', el.is(':checked'))
.save(); .save();
}, },
// Listen for a removed Todo // Listen for a removed Todo
'.todo .destroy click': function(el) { '.todo .destroy click': function (el) {
el.closest('.todo').data('todo').destroy(); el.closest('.todo').data('todo').destroy();
}, },
// Listen for toggle all completed Todos // Listen for toggle all completed Todos
'#toggle-all click': function (el) { '#toggle-all click': function (el) {
var toggle = el.prop('checked'); var toggle = el.prop('checked');
can.each(this.options.todos, function(todo) { can.each(this.options.todos, function (todo) {
todo.attr('complete', toggle).save(); todo.attr('complete', toggle).save();
}); });
}, },
// Listen for removing all completed Todos // 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--) { for (var i = this.options.todos.length - 1, todo; i > -1 && (todo = this.options.todos[i]); i--) {
if (todo.attr('complete')) { if (todo.attr('complete')) {
todo.destroy(); todo.destroy();
......
architecture-examples/canjs/views/todos.ejs
View file @ ccad8ec9
...@@ -4,36 +4,36 @@ ...@@ -4,36 +4,36 @@
</header> </header>
<section id="main" class="<%= todos.attr("length") === 0 ? "hidden" : "" %>"> <section id="main" class="<%= todos.attr("length") === 0 ? "hidden" : "" %>">
<input id="toggle-all" type="checkbox" <%= todos.allComplete() ? "checked" : "" %>> <input id="toggle-all" type="checkbox" <%= todos.allComplete() ? "checked" : "" %>>
<label for="toggle-all">Mark all as complete</label> <label for="toggle-all">Mark all as complete</label>
<ul id="todo-list"> <ul id="todo-list">
<% todos.each(function( todo ) { %> <% todos.each(function( todo ) { %>
<li class="todo <li class="todo
<%= todo.matches(state.attr('filter')) ? '' : 'hidden' %> <%= todo.matches(state.attr('filter')) ? '' : 'hidden' %>
<%= todo.attr('complete') ? 'completed' : '' %> <%= todo.attr('complete') ? 'completed' : '' %>
<%= todo.attr('editing') ? 'editing' : '' %>" <%= todo.attr('editing') ? 'editing' : '' %>"
<%= (el)-> el.data('todo', todo) %>> <%= (el)-> el.data('todo', todo) %>>
<div class="view"> <div class="view">
<input class="toggle" type="checkbox" <%= todo.attr('complete') ? 'checked' : '' %>> <input class="toggle" type="checkbox" <%= todo.attr('complete') ? 'checked' : '' %>>
<label><%= todo.attr('text') %></label> <label><%= todo.attr('text') %></label>
<button class="destroy"></button> <button class="destroy"></button>
</div> </div>
<input class="edit" value="<%= todo.attr('text') %>"> <input class="edit" value="<%= todo.attr('text') %>">
</li> </li>
<% }) %> <% }) %>
</ul> </ul>
</section> </section>
<footer id="footer" class="<%= todos.attr('length') === 0 ? 'hidden' : '' %>"> <footer id="footer" class="<%= todos.attr('length') === 0 ? 'hidden' : '' %>">
<span id="todo-count"> <span id="todo-count">
<strong><%= todos.remaining() %></strong> <strong><%= todos.remaining() %></strong>
item<%= todos.remaining() == 1 ? "" : "s" %> left item<%= todos.remaining() == 1 ? "" : "s" %> left
</span> </span>
<ul id="filters"> <ul id="filters">
<li><a class="selected" href="#!">All</a></li> <li><a class="selected" href="#!">All</a></li>
<li><a href="#!active">Active</a></li> <li><a href="#!active">Active</a></li>
<li><a href="#!completed">Completed</a></li> <li><a href="#!completed">Completed</a></li>
</ul> </ul>
<button id="clear-completed" class="<%= todos.completed() === 0 ? 'hidden' : '' %>"> <button id="clear-completed" class="<%= todos.completed() === 0 ? 'hidden' : '' %>">
Clear completed (<%= todos.completed() %>) Clear completed (<%= todos.completed() %>)
</button> </button>
</footer> </footer>
architecture-examples/canjs/views/todos.mustache
View file @ ccad8ec9
<header id="header"> <header id="header">
<h1>todos</h1> <h1>todos</h1>
<input id="new-todo" {{ (el) -> el.val('').focus() }} placeholder="What needs to be done?" autofocus=""> <input id="new-todo" {{ (el) -> el.val('').focus() }} placeholder="What needs to be done?" autofocus="">
</header> </header>
<section id="main" class="{{^todos}}hidden{{/todos}}"> <section id="main" class="{{^todos}}hidden{{/todos}}">
<input id="toggle-all" type="checkbox" {{#todos.allComplete}}checked="checked"{{/todos.allComplete}}> <input id="toggle-all" type="checkbox" {{#todos.allComplete}}checked="checked"{{/todos.allComplete}}>
<label for="toggle-all" >Mark all as complete</label> <label for="toggle-all" >Mark all as complete</label>
<ul id="todo-list"> <ul id="todo-list">
{{#todos}} {{#todos}}
<li class="todo {{^matches}}hidden{{/matches}} {{#complete}}completed{{/complete}} {{#editing}}editing{{/editing}}" {{data 'todo'}}> <li class="todo {{^matches}}hidden{{/matches}} {{#complete}}completed{{/complete}} {{#editing}}editing{{/editing}}" {{data 'todo'}}>
<div class="view"> <div class="view">
<input class="toggle" type="checkbox" {{#complete}}checked="checked"{{/complete}}> <input class="toggle" type="checkbox" {{#complete}}checked="checked"{{/complete}}>
<label>{{text}}</label> <label>{{text}}</label>
<button class="destroy"></button> <button class="destroy"></button>
</div> </div>
<input class="edit" type="text" value="{{text}}"> <input class="edit" type="text" value="{{text}}">
</li> </li>
{{/todos}} {{/todos}}
</ul> </ul>
</section> </section>
<footer id="footer" class="{{^todos}}hidden{{/todos}}"> <footer id="footer" class="{{^todos}}hidden{{/todos}}">
<span id="todo-count"> <span id="todo-count">
<strong>{{todos.remaining}}</strong> {{plural "item" todos.remaining}} left <strong>{{todos.remaining}}</strong> {{plural "item" todos.remaining}} left
</span> </span>
<ul id="filters"> <ul id="filters">
<li> <li>
<a class="selected" href="#!">All</a> <a class="selected" href="#!">All</a>
</li> </li>
<li> <li>
<a href="#!active">Active</a> <a href="#!active">Active</a>
</li> </li>
<li> <li>
<a href="#!completed">Completed</a> <a href="#!completed">Completed</a>
</li> </li>
</ul> </ul>
<button id="clear-completed" class="{{^todos.completed}}hidden{{/todos.completed}}"> <button id="clear-completed" class="{{^todos.completed}}hidden{{/todos.completed}}">
Clear completed ({{todos.completed}}) Clear completed ({{todos.completed}})
</button> </button>
</footer> </footer>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7