Skip to content

T
todomvc
Commit 941a0ac9 authored by Sindre Sorhus's avatar Sindre Sorhus
Browse files
Options

Agility - code style

parent 2b5c9aca
Show whitespace changes
Inline Side-by-side
Showing with 79 additions and 76 deletions
architecture-examples/agilityjs/index.html
View file @ 941a0ac9
<!doctype html>
<html lang="en">
<head>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Agility.js • TodoMVC</title>
<link rel="stylesheet" href="components/todomvc-common/base.css">
</head>
<body>
</head>
<body>
<section id="todoapp">
<header id="header">
<h1>todos</h1>
......@@ -22,7 +22,7 @@
<label data-bind="title"></label>
<button class="destroy"></button>
</div>
<input class="edit" type="text" data-bind="title">
<input class="edit" data-bind="title">
</li>
</ul>
</section>
......@@ -52,5 +52,5 @@
<script src="components/agility/agility.js"></script>
<script src="js/localstorage.js"></script>
<script src="js/app.js"></script>
</body>
</body>
</html>
architecture-examples/agilityjs/js/app.js
View file @ 941a0ac9
(function ($, $$) {
'use strict';
var ENTER_KEY = 13;
// Hack of taking out html elements from DOM so that agility's view can use it.
// We need 'outerhtml' also, as agilityjs will append DOM, so removing it.
// hack of taking out html elements from DOM so that agility's view can use it
// we need 'outerhtml' also, as agilityjs will append DOM, so removing it
var drawHtml = function (selector) {
return $(selector).remove().wrap('<div>').parent().html();
};
// Simple Two layer composition:
// individual 'todoitem' and 'app'lication which holds multiple todoitems.
// simple Two layer composition:
// individual 'todoitem' and 'app' which holds multiple todoitems
$(function () {
// todo item
var todoitem = $$({
......@@ -52,8 +53,10 @@
}
},
updateTitle: function () {
this.view.$().removeClass('editing');
var title = this.model.get('title').trim();
this.view.$().removeClass('editing');
if (title) {
this.model.set({
title: title
......@@ -66,7 +69,7 @@
collection: 'todos-agilityjs'
});
// The main application which holds todo items.
// the main application which holds todo items
var app = $$({
model: {
todoCount: '0',
......@@ -87,14 +90,14 @@
'append': function () {
this.updateStatus();
},
'keyup #new-todo': function (event) {
'keyup #new-todo': function (e) {
var title = $('#new-todo').val().trim();
if (event.which === ENTER_KEY && title) {
if (e.which === ENTER_KEY && title) {
var item = $$(todoitem, {
title: title
}).save();
this.append(item, '#todo-list');
event.target.value = ''; // clear input field
e.target.value = ''; // clear input field
}
},
'click #toggle-all': function () {
......@@ -116,20 +119,23 @@
// utility functions
updateStatus: function () {
// update counts
var count = this.size(),
completedCount = 0;
var count = this.size();
var completedCount = 0;
this.each(function (id, item) {
if (item.model.get('completed')) {
completedCount++;
}
});
this.model.set({
todoCount: count - completedCount + '',
pluralizer: (count - completedCount === 1 ? '' : 's'),
pluralizer: count - completedCount === 1 ? '' : 's',
completedCount: completedCount + '',
mainStyle: (count === 0 ? 'hidden' : ''),
clearBtnStyle: (completedCount === 0 ? 'hidden' : '')
mainStyle: count === 0 ? 'hidden' : '',
clearBtnStyle: completedCount === 0 ? 'hidden' : ''
});
// update toggle-all checked status
$('#toggle-all').prop('checked', completedCount === count);
// update the view according to the current filter.
......@@ -156,6 +162,7 @@
}
}
}).persist();
$$.document.prepend(app);
// load from localStorage
......@@ -166,16 +173,12 @@
var hash = location.hash;
app.applyFilter(hash);
$('#filters a').each(function () {
if (hash === $(this).attr('href')) {
$(this).addClass('selected');
} else {
$(this).removeClass('selected');
}
$(this).toggleClass('selected', hash === $(this).attr('href'));
});
});
if (location.hash) {
$(window).trigger('hashchange');
}
});
})(window.jQuery, window.agility);
architecture-examples/agilityjs/js/localstorage.js
View file @ 941a0ac9
......@@ -3,10 +3,10 @@
'use strict';
$$.adapter.localStorage = function (_params) {
var storageKey = (this._data.persist.baseUrl || '') + this._data.persist.collection,
storageStr = localStorage[storageKey],
items = (storageStr ? JSON.parse(storageStr) : {});
//
var storageKey = (this._data.persist.baseUrl || '') + this._data.persist.collection;
var storageStr = localStorage[storageKey];
var items = (storageStr ? JSON.parse(storageStr) : {});
if (_params.type === 'GET') {
if (_params.id !== undefined) { // normal get
if (typeof items[_params.id] === 'object') {
......
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