Commit b6c18e2e authored by Kostantinos Margaritis's avatar Kostantinos Margaritis Committed by Pascal Hartig

Flight: Use new app CSS

Upgrade app to use modules from npm and adjust to new Todo UI. Flight
and jasmine-flight are still on bower due to the fact that
jasmine-fligth does not exist as an npm module and FlightJS is a UMD
bundle at npm.
parent 04ca1f29
node_modules/ node_modules/.bin/*
node_modules/depot/*
!node_modules/depot/depot.js
node_modules/es5-shim/*
!node_modules/es5-shim/es5-shim.js
!node_modules/es5-shim/es5-sham.js
node_modules/jquery/*
!node_modules/jquery/dist
node_modules/jquery/dist/*
!node_modules/jquery/dist/jquery.js
node_modules/flight/*
!node_modules/flight/lib
node_modules/requirejs/*
!node_modules/requirejs/require.js
node_modules/requirejs-text/*
!node_modules/requirejs-text/text.js
node_modules/todomvc-app-css/*
!node_modules/todomvc-app-css/index.css
node_modules/todomvc-common/*
!node_modules/todomvc-common/base.css
!node_modules/todomvc-common/base.js
node_modules/karma/*
node_modules/karma-chrome-launcher/*
node_modules/karma-firefox-launcher/*
node_modules/karma-ie-launcher/*
node_modules/karma-jasmine/*
node_modules/karma-phantomjs-launcher/*
node_modules/jasmine-jquery/*
node_modules/jasmine-flight/*
node_modules/karma-safari-launcher/*
node_modules/karma-requirejs/*
...@@ -4,12 +4,12 @@ ...@@ -4,12 +4,12 @@
require.config({ require.config({
baseUrl: './', baseUrl: './',
paths: { paths: {
jquery: 'bower_components/jquery/dist/jquery', jquery: 'node_modules/jquery/dist/jquery',
es5shim: 'bower_components/es5-shim/es5-shim', es5shim: 'node_modules/es5-shim/es5-shim',
es5sham: 'bower_components/es5-shim/es5-sham', es5sham: 'node_modules/es5-shim/es5-sham',
text: 'bower_components/requirejs-text/text', text: 'node_modules/requirejs-text/text',
flight: 'bower_components/flight', flight: 'node_modules/flight',
depot: 'bower_components/depot/depot', depot: 'node_modules/depot/depot',
app: 'app/js', app: 'app/js',
templates: 'app/templates', templates: 'app/templates',
ui: 'app/js/ui', ui: 'app/js/ui',
......
{
"name": "flight-todomvc",
"version": "0.0.0",
"dependencies": {
"depot": "~0.1.6",
"flight": "~1.3.0",
"jquery": "2.1.0",
"requirejs": "~2.1.15",
"todomvc-common": "~0.3.0",
"requirejs-text": "~2.0.13"
},
"devDependencies": {
"jasmine-flight": "~4.0.0",
"jasmine-jquery": "~2.0.5"
}
}
...@@ -3,7 +3,8 @@ ...@@ -3,7 +3,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Flight • Todo</title> <title>Flight • Todo</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">
...@@ -23,7 +24,7 @@ ...@@ -23,7 +24,7 @@
<p>Created by <a href="http://github.com/mkuklis">Michal Kuklis</a></p> <p>Created by <a href="http://github.com/mkuklis">Michal Kuklis</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p> <p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer> </footer>
<script src="bower_components/todomvc-common/base.js"></script> <script src="node_modules/todomvc-common/base.js"></script>
<script data-main="app/js/main" src="bower_components/requirejs/require.js"></script> <script data-main="app/js/main" src="node_modules/requirejs/require.js"></script>
</body> </body>
</html> </html>
...@@ -15,21 +15,22 @@ module.exports = function (config) { ...@@ -15,21 +15,22 @@ module.exports = function (config) {
// list of files / patterns to load in the browser // list of files / patterns to load in the browser
files: [ files: [
// loaded without require // loaded without require
'bower_components/es5-shim/es5-shim.js', 'node_modules/es5-shim/es5-shim.js',
'bower_components/es5-shim/es5-sham.js', 'node_modules/es5-shim/es5-sham.js',
'bower_components/jquery/dist/jquery.js', 'node_modules/jquery/dist/jquery.js',
'bower_components/jasmine-jquery/lib/jasmine-jquery.js', 'node_modules/jasmine-jquery/lib/jasmine-jquery.js',
'bower_components/jasmine-flight/lib/jasmine-flight.js', 'node_modules/jasmine-flight/lib/jasmine-flight.js',
// hack to load RequireJS after the shim libs // hack to load RequireJS after the shim libs
'node_modules/requirejs/require.js', 'node_modules/requirejs/require.js',
'node_modules/karma-requirejs/lib/adapter.js', 'node_modules/karma-requirejs/lib/adapter.js',
// loaded with require // loaded with require
{ pattern: 'bower_components/flight/**/*.js', included: false }, { pattern: 'node_modules/flight/lib/*.js', included: false },
{ pattern: 'bower_components/depot/**/*.js', included: false }, { pattern: 'node_modules/flight/index.js', included: false },
{ pattern: 'bower_components/requirejs-text/text.js', included: false }, { pattern: 'node_modules/depot/depot.js', included: false },
{ pattern: 'node_modules/requirejs-text/text.js', included: false },
{ pattern: 'app/**/*.js', included: false }, { pattern: 'app/**/*.js', included: false },
{ pattern: 'app/**/*.html', included: false }, { pattern: 'app/**/*.html', included: false },
{ pattern: 'test/spec/**/*_spec.js', included: false }, { pattern: 'test/spec/**/*_spec.js', included: false },
......
...@@ -21,7 +21,9 @@ ...@@ -21,7 +21,9 @@
var api = { var api = {
save: function (record) { save: function (record) {
var id; var id, ids;
this.refresh();
if (!record[this.idAttribute]) { if (!record[this.idAttribute]) {
record[this.idAttribute] = guid(); record[this.idAttribute] = guid();
...@@ -31,7 +33,9 @@ ...@@ -31,7 +33,9 @@
if (this.ids.indexOf(id) < 0) { if (this.ids.indexOf(id) < 0) {
this.ids.push(id); this.ids.push(id);
this.storageAdaptor.setItem(this.name, this.ids.join(",")); ids = this.ids.join(",");
this.storageAdaptor.setItem(this.name, ids);
this.store = ids;
} }
this.storageAdaptor.setItem(getKey(this.name, id), JSON.stringify(record)); this.storageAdaptor.setItem(getKey(this.name, id), JSON.stringify(record));
...@@ -73,6 +77,8 @@ ...@@ -73,6 +77,8 @@
if (!criteria) return this.all(); if (!criteria) return this.all();
this.refresh();
return this.ids.reduce(function (memo, id) { return this.ids.reduce(function (memo, id) {
record = jsonData(self.storageAdaptor.getItem(getKey(name, id))); record = jsonData(self.storageAdaptor.getItem(getKey(name, id)));
match = findMatch(criteria, record); match = findMatch(criteria, record);
...@@ -92,6 +98,8 @@ ...@@ -92,6 +98,8 @@
all: function () { all: function () {
var record, self = this, name = this.name; var record, self = this, name = this.name;
this.refresh();
return this.ids.reduce(function (memo, id) { return this.ids.reduce(function (memo, id) {
record = self.storageAdaptor.getItem(getKey(name, id)); record = self.storageAdaptor.getItem(getKey(name, id));
...@@ -121,6 +129,8 @@ ...@@ -121,6 +129,8 @@
destroyAll: function (criteria) { destroyAll: function (criteria) {
var attr, id, match, record, key; var attr, id, match, record, key;
this.refresh();
for (var i = this.ids.length - 1; i >= 0; i--) { for (var i = this.ids.length - 1; i >= 0; i--) {
id = this.ids[i]; id = this.ids[i];
key = getKey(this.name, id); key = getKey(this.name, id);
...@@ -151,7 +161,20 @@ ...@@ -151,7 +161,20 @@
}, },
size: function () { size: function () {
this.refresh();
return this.ids.length; return this.ids.length;
},
refresh: function () {
var store = this.storageAdaptor.getItem(this.name);
if (this.store && this.store === store) {
return;
}
this.ids = (store && store.split(",")) || [];
this.store = store;
} }
}; };
...@@ -202,7 +225,7 @@ ...@@ -202,7 +225,7 @@
} }
function depot(name, options) { function depot(name, options) {
var store, ids; var instance;
options = extend({ options = extend({
idAttribute: '_id', idAttribute: '_id',
...@@ -211,16 +234,15 @@ ...@@ -211,16 +234,15 @@
if (!options.storageAdaptor) throw new Error("No storage adaptor was found"); if (!options.storageAdaptor) throw new Error("No storage adaptor was found");
store = options.storageAdaptor.getItem(name); instance = Object.create(api, {
ids = (store && store.split(",")) || [];
return Object.create(api, {
name: { value: name }, name: { value: name },
store: { value: store },
ids: { value: ids, writable: true },
idAttribute: { value: options.idAttribute }, idAttribute: { value: options.idAttribute },
storageAdaptor: { value: options.storageAdaptor } storageAdaptor: { value: options.storageAdaptor }
}); });
instance.refresh();
return instance;
} }
return depot; return depot;
......
/** /**
* @license RequireJS text 2.0.13 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved. * @license RequireJS text 2.0.12 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved.
* Available via the MIT or new BSD license. * Available via the MIT or new BSD license.
* see: http://github.com/requirejs/text for details * see: http://github.com/requirejs/text for details
*/ */
...@@ -23,7 +23,7 @@ define(['module'], function (module) { ...@@ -23,7 +23,7 @@ define(['module'], function (module) {
masterConfig = (module.config && module.config()) || {}; masterConfig = (module.config && module.config()) || {};
text = { text = {
version: '2.0.13', version: '2.0.12',
strip: function (content) { strip: function (content) {
//Strips <?xml ...?> declarations so that external SVG and XML //Strips <?xml ...?> declarations so that external SVG and XML
...@@ -85,13 +85,13 @@ define(['module'], function (module) { ...@@ -85,13 +85,13 @@ define(['module'], function (module) {
parseName: function (name) { parseName: function (name) {
var modName, ext, temp, var modName, ext, temp,
strip = false, strip = false,
index = name.lastIndexOf("."), index = name.indexOf("."),
isRelative = name.indexOf('./') === 0 || isRelative = name.indexOf('./') === 0 ||
name.indexOf('../') === 0; name.indexOf('../') === 0;
if (index !== -1 && (!isRelative || index > 1)) { if (index !== -1 && (!isRelative || index > 1)) {
modName = name.substring(0, index); modName = name.substring(0, index);
ext = name.substring(index + 1); ext = name.substring(index + 1, name.length);
} else { } else {
modName = name; modName = name;
} }
...@@ -252,7 +252,7 @@ define(['module'], function (module) { ...@@ -252,7 +252,7 @@ define(['module'], function (module) {
try { try {
var file = fs.readFileSync(url, 'utf8'); var file = fs.readFileSync(url, 'utf8');
//Remove BOM (Byte Mark Order) from utf8 files if it is there. //Remove BOM (Byte Mark Order) from utf8 files if it is there.
if (file[0] === '\uFEFF') { if (file.indexOf('\uFEFF') === 0) {
file = file.substring(1); file = file.substring(1);
} }
callback(file); callback(file);
......
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);
})(); })();
{ {
"name": "flight-todomvc", "private": true,
"version": "0.0.0", "dependencies": {
"devDependencies": { "depot": "^0.1.6",
"karma": "~0.12.6", "es5-shim": "^2.0.0",
"karma-jasmine": "~0.2.0", "flightjs": "flightjs/flight#v1.3.0",
"karma-requirejs": "~0.2.2", "jasmine-flight": "flightjs/jasmine-flight#4.0.0",
"karma-chrome-launcher": "~0.1.0", "jquery": "^2.1.0",
"karma-ie-launcher": "~0.1.1", "requirejs": "^2.1.15",
"karma-firefox-launcher": "~0.1.0", "requirejs-text": "^2.0.12",
"karma-phantomjs-launcher": "~0.1.0", "todomvc-app-css": "^1.0.0",
"karma-safari-launcher": "~0.1.1" "todomvc-common": "^1.0.1"
}, },
"scripts": { "devDependencies": {
"test": "karma start --browsers Firefox --single-run" "karma": "^0.12.6",
} "karma-jasmine": "^0.2.0",
"karma-requirejs": "^0.2.2",
"karma-chrome-launcher": "^0.1.0",
"karma-ie-launcher": "^0.1.1",
"karma-firefox-launcher": "^0.1.0",
"karma-phantomjs-launcher": "^0.1.0",
"karma-safari-launcher": "^0.1.1",
"jasmine-jquery": "^2.0.5"
},
"scripts": {
"test": "karma start --browsers Firefox --single-run"
}
} }
...@@ -13,9 +13,9 @@ requirejs.config({ ...@@ -13,9 +13,9 @@ requirejs.config({
baseUrl: '/base', baseUrl: '/base',
paths: { paths: {
flight: 'bower_components/flight', flight: 'node_modules/flight',
depot: 'bower_components/depot/depot', depot: 'node_modules/depot/depot',
text: 'bower_components/requirejs-text/text', text: 'node_modules/requirejs-text/text',
ui: 'app/js/ui', ui: 'app/js/ui',
data: 'app/js/data', data: 'app/js/data',
app: 'app/js', app: 'app/js',
......
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