Commit c3cb6430 authored by Arthur Verschaeve's avatar Arthur Verschaeve

Migrate `spine` example to `todomvc-app-css`

Ref gh-1110
parent 2e8ef0cf
node_modules/todomvc-app-css/*
!node_modules/todomvc-app-css/index.css
node_modules/todomvc-common/*
!node_modules/todomvc-common/base.js
!node_modules/todomvc-common/base.css
node_modules/jquery/**
!node_modules/jquery/dist/jquery.js
node_modules/handlebars/**
!node_modules/handlebars/dist/handlebars.js
node_modules/spine/**
!node_modules/spine/lib/spine.js
!node_modules/spine/lib/route.js
!node_modules/spine/lib/local.js
{
"name": "todomvc-spine",
"version": "0.0.0",
"dependencies": {
"spine": "~1.0.9",
"todomvc-common": "~0.3.0",
"handlebars": "~1.0.0-rc.3",
"jquery": "~1.8.3"
}
}
...@@ -3,7 +3,8 @@ ...@@ -3,7 +3,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Spine.js • TodoMVC</title> <title>Spine.js • TodoMVC</title>
<link rel="stylesheet" href="bower_components/todomvc-common/base.css"> <link rel="stylesheet" href="node_modules/todomvc-common/base.css">
<link rel="stylesheet" href="node_modules/todomvc-app-css/index.css">
</head> </head>
<body> <body>
<section id="todoapp"> <section id="todoapp">
...@@ -50,12 +51,12 @@ ...@@ -50,12 +51,12 @@
</li> </li>
{{/this}} {{/this}}
</script> </script>
<script src="bower_components/todomvc-common/base.js"></script> <script src="node_modules/todomvc-common/base.js"></script>
<script src="bower_components/jquery/jquery.js"></script> <script src="node_modules/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script> <script src="node_modules/handlebars/dist/handlebars.js"></script>
<script src="bower_components/spine/lib/spine.js"></script> <script src="node_modules/spine/lib/spine.js"></script>
<script src="bower_components/spine/lib/route.js"></script> <script src="node_modules/spine/lib/route.js"></script>
<script src="bower_components/spine/lib/local.js"></script> <script src="node_modules/spine/lib/local.js"></script>
<script src="js/controllers/todos.js"></script> <script src="js/controllers/todos.js"></script>
<script src="js/models/todo.js"></script> <script src="js/models/todo.js"></script>
......
// Generated by CoffeeScript 1.4.0 // Generated by CoffeeScript 1.8.0
(function() { (function() {
var Spine; var Spine;
...@@ -14,12 +14,16 @@ ...@@ -14,12 +14,16 @@
result = JSON.stringify(this); result = JSON.stringify(this);
return localStorage[this.className] = result; return localStorage[this.className] = result;
}, },
loadLocal: function() { loadLocal: function(options) {
var result; var result;
if (options == null) {
options = {};
}
if (!options.hasOwnProperty('clear')) {
options.clear = true;
}
result = localStorage[this.className]; result = localStorage[this.className];
return this.refresh(result || [], { return this.refresh(result || [], options);
clear: true
});
} }
}; };
...@@ -28,3 +32,5 @@ ...@@ -28,3 +32,5 @@
} }
}).call(this); }).call(this);
//# sourceMappingURL=local.js.map
// Generated by CoffeeScript 1.4.0 // Generated by CoffeeScript 1.8.0
(function() { (function() {
var $, Spine, escapeRegExp, hashStrip, namedParam, splatParam, var $, Path, Route, Spine, escapeRegExp, hashStrip, namedParam, splatParam,
__hasProp = {}.hasOwnProperty, __hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
__slice = [].slice; __slice = [].slice;
...@@ -17,7 +17,55 @@ ...@@ -17,7 +17,55 @@
escapeRegExp = /[-[\]{}()+?.,\\^$|#\s]/g; escapeRegExp = /[-[\]{}()+?.,\\^$|#\s]/g;
Spine.Route = (function(_super) { Path = (function(_super) {
__extends(Path, _super);
function Path(path, callback) {
var match;
this.path = path;
this.callback = callback;
this.names = [];
if (typeof path === 'string') {
namedParam.lastIndex = 0;
while ((match = namedParam.exec(path)) !== null) {
this.names.push(match[1]);
}
splatParam.lastIndex = 0;
while ((match = splatParam.exec(path)) !== null) {
this.names.push(match[1]);
}
path = path.replace(escapeRegExp, '\\$&').replace(namedParam, '([^\/]*)').replace(splatParam, '(.*?)');
this.route = new RegExp("^" + path + "$");
} else {
this.route = path;
}
}
Path.prototype.match = function(path, options) {
var i, match, param, params, _i, _len;
if (options == null) {
options = {};
}
if (!(match = this.route.exec(path))) {
return false;
}
options.match = match;
params = match.slice(1);
if (this.names.length) {
for (i = _i = 0, _len = params.length; _i < _len; i = ++_i) {
param = params[i];
options[this.names[i]] = param;
}
}
Route.trigger('before', this);
return this.callback.call(null, options) !== false;
};
return Path;
})(Spine.Module);
Route = (function(_super) {
var _ref; var _ref;
__extends(Route, _super); __extends(Route, _super);
...@@ -26,28 +74,15 @@ ...@@ -26,28 +74,15 @@
Route.historySupport = ((_ref = window.history) != null ? _ref.pushState : void 0) != null; Route.historySupport = ((_ref = window.history) != null ? _ref.pushState : void 0) != null;
Route.routes = [];
Route.options = { Route.options = {
trigger: true, trigger: true,
history: false, history: false,
shim: false, shim: false,
replace: false replace: false,
redirect: false
}; };
Route.add = function(path, callback) { Route.routers = [];
var key, value, _results;
if (typeof path === 'object' && !(path instanceof RegExp)) {
_results = [];
for (key in path) {
value = path[key];
_results.push(this.add(key, value));
}
return _results;
} else {
return this.routes.push(new this(path, callback));
}
};
Route.setup = function(options) { Route.setup = function(options) {
if (options == null) { if (options == null) {
...@@ -69,6 +104,11 @@ ...@@ -69,6 +104,11 @@
}; };
Route.unbind = function() { Route.unbind = function() {
var unbindResult;
unbindResult = Spine.Events.unbind.apply(this, arguments);
if (arguments.length > 0) {
return unbindResult;
}
if (this.options.shim) { if (this.options.shim) {
return; return;
} }
...@@ -80,7 +120,7 @@ ...@@ -80,7 +120,7 @@
}; };
Route.navigate = function() { Route.navigate = function() {
var args, lastArg, options, path; var args, lastArg, options, path, routes;
args = 1 <= arguments.length ? __slice.call(arguments, 0) : []; args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
options = {}; options = {};
lastArg = args[args.length - 1]; lastArg = args[args.length - 1];
...@@ -95,14 +135,22 @@ ...@@ -95,14 +135,22 @@
return; return;
} }
this.path = path; this.path = path;
this.trigger('navigate', this.path);
if (options.trigger) { if (options.trigger) {
this.matchRoute(this.path, options); this.trigger('navigate', this.path);
routes = this.matchRoutes(this.path, options);
if (!routes.length) {
if (typeof options.redirect === 'function') {
return options.redirect.apply(this, [this.path, options]);
} else {
if (options.redirect === true) {
this.redirect(this.path);
}
}
} }
if (options.shim) {
return;
} }
if (this.history && options.replace) { if (options.shim) {
return true;
} else if (this.history && options.replace) {
return history.replaceState({}, document.title, this.path); return history.replaceState({}, document.title, this.path);
} else if (this.history) { } else if (this.history) {
return history.pushState({}, document.title, this.path); return history.pushState({}, document.title, this.path);
...@@ -111,6 +159,48 @@ ...@@ -111,6 +159,48 @@
} }
}; };
Route.create = function() {
var router;
router = new this;
this.routers.push(router);
return router;
};
Route.add = function(path, callback) {
return this.router.add(path, callback);
};
Route.prototype.add = function(path, callback) {
var key, value, _results;
if (typeof path === 'object' && !(path instanceof RegExp)) {
_results = [];
for (key in path) {
value = path[key];
_results.push(this.add(key, value));
}
return _results;
} else {
return this.routes.push(new Path(path, callback));
}
};
Route.prototype.destroy = function() {
var r;
this.routes.length = 0;
return this.constructor.routers = (function() {
var _i, _len, _ref1, _results;
_ref1 = this.constructor.routers;
_results = [];
for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
r = _ref1[_i];
if (r !== this) {
_results.push(r);
}
}
return _results;
}).call(this);
};
Route.getPath = function() { Route.getPath = function() {
var path; var path;
if (this.history) { if (this.history) {
...@@ -131,77 +221,70 @@ ...@@ -131,77 +221,70 @@
Route.change = function() { Route.change = function() {
var path; var path;
path = this.getPath(); path = Route.getPath();
if (path === this.path) { if (path === Route.path) {
return; return;
} }
this.path = path; Route.path = path;
return this.matchRoute(this.path); return Route.matchRoutes(Route.path);
}; };
Route.matchRoute = function(path, options) { Route.matchRoutes = function(path, options) {
var route, _i, _len, _ref1; var match, matches, router, _i, _len, _ref1;
_ref1 = this.routes; matches = [];
_ref1 = this.routers.concat([this.router]);
for (_i = 0, _len = _ref1.length; _i < _len; _i++) { for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
route = _ref1[_i]; router = _ref1[_i];
if (!(route.match(path, options))) { match = router.matchRoute(path, options);
continue; if (match) {
matches.push(match);
} }
this.trigger('change', route, path);
return route;
} }
if (matches.length) {
this.trigger('change', matches, path);
}
return matches;
}; };
function Route(path, callback) { Route.redirect = function(path) {
var match; return window.location = path;
this.path = path; };
this.callback = callback;
this.names = [];
if (typeof path === 'string') {
namedParam.lastIndex = 0;
while ((match = namedParam.exec(path)) !== null) {
this.names.push(match[1]);
}
splatParam.lastIndex = 0;
while ((match = splatParam.exec(path)) !== null) {
this.names.push(match[1]);
}
path = path.replace(escapeRegExp, '\\$&').replace(namedParam, '([^\/]*)').replace(splatParam, '(.*?)');
this.route = new RegExp("^" + path + "$");
} else {
this.route = path;
}
}
Route.prototype.match = function(path, options) { function Route() {
var i, match, param, params, _i, _len; this.routes = [];
if (options == null) {
options = {};
}
match = this.route.exec(path);
if (!match) {
return false;
} }
options.match = match;
params = match.slice(1); Route.prototype.matchRoute = function(path, options) {
if (this.names.length) { var route, _i, _len, _ref1;
for (i = _i = 0, _len = params.length; _i < _len; i = ++_i) { _ref1 = this.routes;
param = params[i]; for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
options[this.names[i]] = param; route = _ref1[_i];
if (route.match(path, options)) {
return route;
} }
} }
return this.callback.call(null, options) !== false; };
Route.prototype.trigger = function() {
var args, _ref1;
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
args.splice(1, 0, this);
return (_ref1 = this.constructor).trigger.apply(_ref1, args);
}; };
return Route; return Route;
})(Spine.Module); })(Spine.Module);
Spine.Route.change = Spine.Route.proxy(Spine.Route.change); Route.router = new Route;
Spine.Controller.include({ Spine.Controller.include({
route: function(path, callback) { route: function(path, callback) {
if (this.router instanceof Spine.Route) {
return this.router.add(path, this.proxy(callback));
} else {
return Spine.Route.add(path, this.proxy(callback)); return Spine.Route.add(path, this.proxy(callback));
}
}, },
routes: function(routes) { routes: function(routes) {
var key, value, _results; var key, value, _results;
...@@ -217,8 +300,14 @@ ...@@ -217,8 +300,14 @@
} }
}); });
Route.Path = Path;
Spine.Route = Route;
if (typeof module !== "undefined" && module !== null) { if (typeof module !== "undefined" && module !== null) {
module.exports = Spine.Route; module.exports = Route;
} }
}).call(this); }).call(this);
//# sourceMappingURL=route.js.map
hr {
margin: 20px 0;
border: 0;
border-top: 1px dashed #c5c5c5;
border-bottom: 1px dashed #f7f7f7;
}
.learn a {
font-weight: normal;
text-decoration: none;
color: #b83f45;
}
.learn a:hover {
text-decoration: underline;
color: #787e7e;
}
.learn h3,
.learn h4,
.learn h5 {
margin: 10px 0;
font-weight: 500;
line-height: 1.2;
color: #000;
}
.learn h3 {
font-size: 24px;
}
.learn h4 {
font-size: 18px;
}
.learn h5 {
margin-bottom: 0;
font-size: 14px;
}
.learn ul {
padding: 0;
margin: 0 0 30px 25px;
}
.learn li {
line-height: 20px;
}
.learn p {
font-size: 15px;
font-weight: 300;
line-height: 1.3;
margin-top: 0;
margin-bottom: 0;
}
#issue-count {
display: none;
}
.quote {
border: none;
margin: 20px 0 60px 0;
}
.quote p {
font-style: italic;
}
.quote p:before {
content: '“';
font-size: 50px;
opacity: .15;
position: absolute;
top: -20px;
left: 3px;
}
.quote p:after {
content: '”';
font-size: 50px;
opacity: .15;
position: absolute;
bottom: -42px;
right: 3px;
}
.quote footer {
position: absolute;
bottom: -40px;
right: 0;
}
.quote footer img {
border-radius: 3px;
}
.quote footer a {
margin-left: 5px;
vertical-align: middle;
}
.speech-bubble {
position: relative;
padding: 10px;
background: rgba(0, 0, 0, .04);
border-radius: 5px;
}
.speech-bubble:after {
content: '';
position: absolute;
top: 100%;
right: 30px;
border: 13px solid transparent;
border-top-color: rgba(0, 0, 0, .04);
}
.learn-bar > .learn {
position: absolute;
width: 272px;
top: 8px;
left: -300px;
padding: 10px;
border-radius: 5px;
background-color: rgba(255, 255, 255, .6);
transition-property: left;
transition-duration: 500ms;
}
@media (min-width: 899px) {
.learn-bar {
width: auto;
padding-left: 300px;
}
.learn-bar > .learn {
left: 8px;
}
}
/* global _ */
(function () { (function () {
'use strict'; 'use strict';
/* jshint ignore:start */
// Underscore's Template Module // Underscore's Template Module
// Courtesy of underscorejs.org // Courtesy of underscorejs.org
var _ = (function (_) { var _ = (function (_) {
...@@ -114,6 +116,7 @@ ...@@ -114,6 +116,7 @@
if (location.hostname === 'todomvc.com') { if (location.hostname === 'todomvc.com') {
window._gaq = [['_setAccount','UA-31081062-1'],['_trackPageview']];(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.src='//www.google-analytics.com/ga.js';s.parentNode.insertBefore(g,s)}(document,'script')); window._gaq = [['_setAccount','UA-31081062-1'],['_trackPageview']];(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.src='//www.google-analytics.com/ga.js';s.parentNode.insertBefore(g,s)}(document,'script'));
} }
/* jshint ignore:end */
function redirect() { function redirect() {
if (location.hostname === 'tastejs.github.io') { if (location.hostname === 'tastejs.github.io') {
...@@ -175,13 +178,17 @@ ...@@ -175,13 +178,17 @@
if (learnJSON.backend) { if (learnJSON.backend) {
this.frameworkJSON = learnJSON.backend; this.frameworkJSON = learnJSON.backend;
this.frameworkJSON.issueLabel = framework;
this.append({ this.append({
backend: true backend: true
}); });
} else if (learnJSON[framework]) { } else if (learnJSON[framework]) {
this.frameworkJSON = learnJSON[framework]; this.frameworkJSON = learnJSON[framework];
this.frameworkJSON.issueLabel = framework;
this.append(); this.append();
} }
this.fetchIssueCount();
} }
Learn.prototype.append = function (opts) { Learn.prototype.append = function (opts) {
...@@ -212,6 +219,26 @@ ...@@ -212,6 +219,26 @@
document.body.insertAdjacentHTML('afterBegin', aside.outerHTML); document.body.insertAdjacentHTML('afterBegin', aside.outerHTML);
}; };
Learn.prototype.fetchIssueCount = function () {
var issueLink = document.getElementById('issue-count-link');
if (issueLink) {
var url = issueLink.href.replace('https://github.com', 'https://api.github.com/repos');
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onload = function (e) {
var parsedResponse = JSON.parse(e.target.responseText);
if (parsedResponse instanceof Array) {
var count = parsedResponse.length
if (count !== 0) {
issueLink.innerHTML = 'This app has ' + count + ' open issues';
document.getElementById('issue-count').style.display = 'inline';
}
}
};
xhr.send();
}
};
redirect(); redirect();
getFile('learn.json', Learn); getFile('learn.json', Learn);
})(); })();
{
"private": true,
"dependencies": {
"spine": "^1.0.9",
"todomvc-common": "^1.0.1",
"todomvc-app-css": "^1.0.1",
"handlebars": "^1.0.0",
"jquery": "^1.8.3"
}
}
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