switch to director

This commit is contained in:
Radek Stepan 2014-09-26 20:17:06 -07:00
parent 044ffeba46
commit 0bf4d91de9
18 changed files with 1025 additions and 415 deletions

View File

@ -35,7 +35,6 @@ module.exports = (grunt) ->
'vendor/ractive-adaptor/adaptor.js'
'vendor/firebase/firebase.js'
'vendor/firebase-simple-login/firebase-simple-login.js'
'vendor/grapnel/src/grapnel.js'
'vendor/superagent/superagent.js'
'vendor/localforage/dist/localforage.js'
'vendor/async/lib/async.js'
@ -43,6 +42,7 @@ module.exports = (grunt) ->
'vendor/d3/d3.js'
'vendor/d3-tip/index.js'
'vendor/marked/lib/marked.js'
'vendor/director/build/director.js'
# Our app.
'public/js/app.js'
]

View File

@ -8,7 +8,6 @@
"ractive-adaptor": "radekstepan/ractive-adaptor-ractive",
"firebase": "~1.0.21",
"firebase-simple-login": "~1.6.3",
"grapnel": "~0.4.2",
"github": "~0.9.0",
"localforage": "~0.9.2",
"superagent": "~0.19.0",
@ -16,6 +15,7 @@
"moment": "~2.8.3",
"d3": "~3.4.11",
"d3-tip": "~0.6.5",
"marked": "~0.3.2"
"marked": "~0.3.2",
"director": "~1.2.2"
}
}

View File

@ -410,7 +410,7 @@ table {
@font-face{font-family:'Fontello';src:url("../fonts/fontello.eot?74672344");src:url("../fonts/fontello.eot?74672344#iefix") format('embedded-opentype'),url("../fonts/fontello.woff?74672344") format('woff'),url("../fonts/fontello.ttf?74672344") format('truetype'),url("../fonts/fontello.svg?74672344#fontello") format('svg');font-weight:normal;font-style:normal}
.icon{vertical-align:middle;font-family:"Fontello";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;text-align:center;font-variant:normal;text-transform:none;}
.icon.spin6,.icon.spin4,.icon.spinner1{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-ms-animation:spin 2s infinite linear;animation:spin 2s infinite linear}
.icon[class^='spin'],.icon[class*=' spin']{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-ms-animation:spin 2s infinite linear;animation:spin 2s infinite linear}
@-moz-keyframes spin{0%{-moz-transform:rotate(0)}
100%{-moz-transform:rotate(360deg)}
}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0)}
@ -495,6 +495,7 @@ ul li{display:inline-block}
#content #projects .sort{float:right;line-height:30px}
#content #projects table{width:100%;}
#content #projects table tr td{background:#fcfcfc;padding:20px 30px;border-bottom:1px solid #eaecf2;}
#content #projects table tr td .project{color:inherit}
#content #projects table tr td .milestone .icon{font-size:10px;margin:0}
#content #projects table tr td .progress{width:200px;}
#content #projects table tr td .progress .percent,#content #projects table tr td .progress .due{color:#9399ad;font-size:13px}

View File

@ -3,7 +3,7 @@
@font-face{font-family:'Fontello';src:url("../fonts/fontello.eot?74672344");src:url("../fonts/fontello.eot?74672344#iefix") format('embedded-opentype'),url("../fonts/fontello.woff?74672344") format('woff'),url("../fonts/fontello.ttf?74672344") format('truetype'),url("../fonts/fontello.svg?74672344#fontello") format('svg');font-weight:normal;font-style:normal}
.icon{vertical-align:middle;font-family:"Fontello";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;text-align:center;font-variant:normal;text-transform:none;}
.icon.spin6,.icon.spin4,.icon.spinner1{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-ms-animation:spin 2s infinite linear;animation:spin 2s infinite linear}
.icon[class^='spin'],.icon[class*=' spin']{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-ms-animation:spin 2s infinite linear;animation:spin 2s infinite linear}
@-moz-keyframes spin{0%{-moz-transform:rotate(0)}
100%{-moz-transform:rotate(360deg)}
}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0)}
@ -88,6 +88,7 @@ ul li{display:inline-block}
#content #projects .sort{float:right;line-height:30px}
#content #projects table{width:100%;}
#content #projects table tr td{background:#fcfcfc;padding:20px 30px;border-bottom:1px solid #eaecf2;}
#content #projects table tr td .project{color:inherit}
#content #projects table tr td .milestone .icon{font-size:10px;margin:0}
#content #projects table tr td .progress{width:200px;}
#content #projects table tr td .progress .percent,#content #projects table tr td .progress .due{color:#9399ad;font-size:13px}

File diff suppressed because it is too large Load Diff

View File

@ -725,40 +725,43 @@
// router.coffee
root.require.register('burnchart/src/modules/router.js', function(exports, require, module) {
var el, mediator, route, router;
var el, mediator, route, router,
__slice = [].slice;
mediator = require('./mediator');
el = '#page';
route = function(page, req, evt) {
var Page;
route = function() {
var Page, args, page;
page = arguments[0], args = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
Page = require("../views/pages/" + page);
return new Page({
el: el,
'data': {
'route': req.params
'route': args
}
});
};
router = {
'': _.partial(route, 'index'),
'project/add': _.partial(route, 'addProject'),
'chart/:owner/:name/:milestone': _.partial(route, 'showChart'),
'reset': function() {
router = Router({
'/': _.partial(route, 'index'),
'/new/project': _.partial(route, 'new'),
'/:owner/:name': _.partial(route, 'project'),
'/:owner/:name/:milestone': _.partial(route, 'chart'),
'/reset': function() {
mediator.fire('!projects/clear');
return window.location.hash = '#';
},
'notify': function() {
'/notify': function() {
mediator.fire('!app/loading', true);
mediator.fire('!app/notify', 'You did something real good', 'warn');
return window.location.hash = '#';
}
};
});
module.exports = function() {
Grapnel.listen(router);
router.init('/');
return router;
};
@ -767,13 +770,13 @@
// header.mustache
root.require.register('burnchart/src/templates/header.js', function(exports, require, module) {
module.exports = ["<div id=\"head\">"," <div class=\"right\">"," {{#user.displayName}}"," {{user.displayName}} logged in"," {{else}}"," <a class=\"github\" on-click=\"!login\"><Icons icon=\"github\"/> Sign In</a>"," {{/user.displayName}}"," </div>",""," <a id=\"icon\" href=\"#\">"," <Icons icon=\"{{icon}}\"/>"," </a>",""," <div class=\"q\">"," <Icons icon=\"search\"/>"," <Icons icon=\"down-open\"/>"," <input type=\"text\" placeholder=\"Jump to...\">"," </div>",""," <ul>"," <li><a href=\"#project/add\" class=\"add\"><Icons icon=\"plus-circled\"/> Add a Project</a></li>"," <li><a href=\"#\" class=\"faq\">FAQ</a></li>"," <li><a href=\"#reset\">DB Reset</a></li>"," <li><a href=\"#notify\">Notify</a></li>"," </ul>","</div>"].join("\n");
module.exports = ["<div id=\"head\">"," <div class=\"right\">"," {{#user.displayName}}"," {{user.displayName}} logged in"," {{else}}"," <a class=\"github\" on-click=\"!login\"><Icons icon=\"github\"/> Sign In</a>"," {{/user.displayName}}"," </div>",""," <a id=\"icon\" href=\"#\">"," <Icons icon=\"{{icon}}\"/>"," </a>",""," <div class=\"q\">"," <Icons icon=\"search\"/>"," <Icons icon=\"down-open\"/>"," <input type=\"text\" placeholder=\"Jump to...\">"," </div>",""," <ul>"," <li><a href=\"#new/project\" class=\"add\"><Icons icon=\"plus-circled\"/> Add a Project</a></li>"," <li><a href=\"#\" class=\"faq\">FAQ</a></li>"," <li><a href=\"#reset\">DB Reset</a></li>"," <li><a href=\"#notify\">Notify</a></li>"," </ul>","</div>"].join("\n");
});
// hero.mustache
root.require.register('burnchart/src/templates/hero.js', function(exports, require, module) {
module.exports = ["{{^projects.list}}"," <div id=\"hero\">"," <div class=\"content\">"," <Icons icon=\"address\"/>"," <h2>See your project progress</h2>"," <p>Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>"," <div class=\"cta\">"," <a href=\"#project/add\" class=\"primary\"><Icons icon=\"plus-circled\"/> Add your project</a>"," <a href=\"#\" class=\"secondary\">Read the Guide</a>"," </div>"," </div>"," </div>","{{/projects.list}}"].join("\n");
module.exports = ["{{^projects.list}}"," <div id=\"hero\">"," <div class=\"content\">"," <Icons icon=\"address\"/>"," <h2>See your project progress</h2>"," <p>Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>"," <div class=\"cta\">"," <a href=\"#new/project\" class=\"primary\"><Icons icon=\"plus-circled\"/> Add your project</a>"," <a href=\"#\" class=\"secondary\">Read the Guide</a>"," </div>"," </div>"," </div>","{{/projects.list}}"].join("\n");
});
// icons.mustache
@ -794,10 +797,10 @@
module.exports = ["{{#text}}"," <div id=\"notify\" class=\"{{type}}\" style=\"top:{{-top}}px\">"," <Icons icon=\"megaphone\"/>"," <p>{{text}}</p>"," </div>","{{/text}}"].join("\n");
});
// addProject.mustache
root.require.register('burnchart/src/templates/pages/addProject.js', function(exports, require, module) {
// chart.mustache
root.require.register('burnchart/src/templates/pages/chart.js', function(exports, require, module) {
module.exports = ["<div id=\"content\" class=\"wrap\">"," <div id=\"add\">"," <div class=\"header\">"," <h2>Add a Project</h2>"," <p>Type in the name of the repository as you would normally. If you'd like to add a private GitHub project, <a href=\"#\">Sign In</a> first.</p>"," </div>",""," <div class=\"form\">"," <table>"," <tr>"," <td>"," <input type=\"text\" placeholder=\"user/repo\" autocomplete=\"off\" value=\"{{value}}\">"," </td>"," <td>"," <a on-click=\"submit\">Add</a>"," </td>"," </tr>"," </table>"," </div>"," </div>","</div>"].join("\n");
module.exports = ["<div id=\"title\">"," <div class=\"wrap\">"," <h2 class=\"title\">{{ format.title(milestone.title) }}</h2>"," <span class=\"sub\">{{{ format.due(milestone.due_on) }}}</span>"," <p class=\"description\">{{{ format.markdown(milestone.description) }}}</p>"," </div>","</div>","","<div id=\"content\" class=\"wrap\">"," <div id=\"chart\">"," <div id=\"svg\"></div>"," </div>","</div>"].join("\n");
});
// index.mustache
@ -806,16 +809,22 @@
module.exports = ["<div id=\"content\" class=\"wrap\">"," <Hero/>"," <Projects/>","</div>"].join("\n");
});
// showChart.mustache
root.require.register('burnchart/src/templates/pages/showChart.js', function(exports, require, module) {
// new.mustache
root.require.register('burnchart/src/templates/pages/new.js', function(exports, require, module) {
module.exports = ["<div id=\"title\">"," <div class=\"wrap\">"," <h2 class=\"title\">{{ format.title(milestone.title) }}</h2>"," <span class=\"sub\">{{{ format.due(milestone.due_on) }}}</span>"," <p class=\"description\">{{{ format.markdown(milestone.description) }}}</p>"," </div>","</div>","","<div id=\"content\" class=\"wrap\">"," <div id=\"chart\">"," <div id=\"svg\"></div>"," </div>","</div>"].join("\n");
module.exports = ["<div id=\"content\" class=\"wrap\">"," <div id=\"add\">"," <div class=\"header\">"," <h2>Add a Project</h2>"," <p>Type in the name of the repository as you would normally. If you'd like to add a private GitHub project, <a href=\"#\">Sign In</a> first.</p>"," </div>",""," <div class=\"form\">"," <table>"," <tr>"," <td>"," <input type=\"text\" placeholder=\"user/repo\" autocomplete=\"off\" value=\"{{value}}\">"," </td>"," <td>"," <a on-click=\"submit\">Add</a>"," </td>"," </tr>"," </table>"," </div>"," </div>","</div>"].join("\n");
});
// project.mustache
root.require.register('burnchart/src/templates/pages/project.js', function(exports, require, module) {
module.exports = ["<div id=\"title\">"," <div class=\"wrap\">"," <h2 class=\"title\">radekstepan/disposable</h2>"," </div>","</div>","","<div id=\"content\" class=\"wrap\">"," Project milestones go here","</div>"].join("\n");
});
// projects.mustache
root.require.register('burnchart/src/templates/projects.js', function(exports, require, module) {
module.exports = ["{{#projects.list.length}}"," <div id=\"projects\">"," <div class=\"header\">"," <a href=\"#\" class=\"sort\"><Icons icon=\"sort-alphabet\"/> Sorted by priority</a>"," <h2>Projects</h2>"," </div>",""," <table>"," {{#projects.list}}"," {{#milestones}}"," <tr>"," <td class=\"repo\">{{owner}}/{{name}}</td>"," <td>"," <a class=\"milestone\" href=\"#chart/{{owner}}/{{name}}/{{number}}\">{{ title }}</a>"," </td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">{{Math.floor(format.progress(closed_issues, open_issues))}}%</span>"," <span class=\"due\">{{{ format.due(due_on) }}}</span>"," <div class=\"outer bar\">"," <div class=\"inner bar {{format.onTime(this)}}\" style=\"width:{{format.progress(closed_issues, open_issues)}}%\"></div>"," </div>"," </div>"," </td>"," </tr>"," {{/milestones}}"," {{/projects.list}}",""," <!--"," <tr>"," <td><a class=\"repo\" href=\"#\">radekstepan/disposable</a></td>"," <td><span class=\"milestone\">Milestone 1.0 <span class=\"icon down-open\"></span></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">40%</span>"," <span class=\"due\">due on Friday</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:40%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr class=\"done\">"," <td><a class=\"repo\" href=\"#\">radekstepan/burnchart</a></td>"," <td><span class=\"milestone\">Beta Milestone <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">100%</span>"," <span class=\"due\">due tomorrow</span>"," <div class=\"outer bar\">"," <div class=\"inner bar green\" style=\"width:100%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr>"," <td><a class=\"repo\" href=\"#\">intermine/intermine</a></td>"," <td><span class=\"milestone\">Emma Release 96 <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">27%</span>"," <span class=\"due\">due in 2 weeks</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:27%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr>"," <td><a class=\"repo\" href=\"#\">microsoft/windows</a></td>"," <td><span class=\"milestone\">RC 9 <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">90%</span>"," <span class=\"due red\">overdue by a month</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:90%\"></div>"," </div>"," </div>"," </td>"," </tr>"," -->"," </table>",""," <div class=\"footer\">"," <a href=\"#\"><Icons icon=\"cog\"/> Edit</a>"," </div>"," </div>","{{/projects.list}}"].join("\n");
module.exports = ["{{#projects.list.length}}"," <div id=\"projects\">"," <div class=\"header\">"," <a href=\"#\" class=\"sort\"><Icons icon=\"sort-alphabet\"/> Sorted by priority</a>"," <h2>Projects</h2>"," </div>",""," <table>"," {{#projects.list}}"," {{#milestones}}"," <tr>"," <td class=\"repo\">"," <a class=\"project\" href=\"#{{owner}}/{{name}}\">{{owner}}/{{name}}</a>"," </td>"," <td>"," <a class=\"milestone\" href=\"#{{owner}}/{{name}}/{{number}}\">{{ title }}</a>"," </td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">{{Math.floor(format.progress(closed_issues, open_issues))}}%</span>"," <span class=\"due\">{{{ format.due(due_on) }}}</span>"," <div class=\"outer bar\">"," <div class=\"inner bar {{format.onTime(this)}}\" style=\"width:{{format.progress(closed_issues, open_issues)}}%\"></div>"," </div>"," </div>"," </td>"," </tr>"," {{/milestones}}"," {{/projects.list}}",""," <!--"," <tr>"," <td><a class=\"repo\" href=\"#\">radekstepan/disposable</a></td>"," <td><span class=\"milestone\">Milestone 1.0 <span class=\"icon down-open\"></span></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">40%</span>"," <span class=\"due\">due on Friday</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:40%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr class=\"done\">"," <td><a class=\"repo\" href=\"#\">radekstepan/burnchart</a></td>"," <td><span class=\"milestone\">Beta Milestone <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">100%</span>"," <span class=\"due\">due tomorrow</span>"," <div class=\"outer bar\">"," <div class=\"inner bar green\" style=\"width:100%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr>"," <td><a class=\"repo\" href=\"#\">intermine/intermine</a></td>"," <td><span class=\"milestone\">Emma Release 96 <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">27%</span>"," <span class=\"due\">due in 2 weeks</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:27%\"></div>"," </div>"," </div>"," </td>"," </tr>"," <tr>"," <td><a class=\"repo\" href=\"#\">microsoft/windows</a></td>"," <td><span class=\"milestone\">RC 9 <span class=\"icon down-open\"></span></a></td>"," <td>"," <div class=\"progress\">"," <span class=\"percent\">90%</span>"," <span class=\"due red\">overdue by a month</span>"," <div class=\"outer bar\">"," <div class=\"inner bar red\" style=\"width:90%\"></div>"," </div>"," </div>"," </td>"," </tr>"," -->"," </table>",""," <div class=\"footer\">"," <a href=\"#\"><Icons icon=\"cog\"/> Edit</a>"," </div>"," </div>","{{/projects.list}}"].join("\n");
});
// date.coffee
@ -1065,37 +1074,47 @@
});
// addProject.coffee
root.require.register('burnchart/src/views/pages/addProject.js', function(exports, require, module) {
// chart.coffee
root.require.register('burnchart/src/views/pages/chart.js', function(exports, require, module) {
var mediator, user;
var format, milestone, project;
mediator = require('../../modules/mediator');
milestone = require('../../modules/milestone');
user = require('../../models/user');
project = require('../../modules/project');
format = require('../../utils/format');
module.exports = Ractive.extend({
'template': require('../../templates/pages/addProject'),
'data': {
'value': 'radekstepan/disposable',
user: user
},
'template': require('../../templates/pages/chart'),
'adapt': [Ractive.adaptors.Ractive],
'data': {
format: format
},
init: function() {
var autocomplete;
document.title = 'Add a new project';
autocomplete = function(value) {};
this.observe('value', _.debounce(autocomplete, 200), {
'init': false
});
return this.on('submit', function() {
var name, owner, _ref;
_ref = this.get('value').split('/'), owner = _ref[0], name = _ref[1];
return mediator.fire('!projects/add', {
var name, owner, route, _ref,
_this = this;
_ref = this.get('route'), owner = _ref[0], name = _ref[1], milestone = _ref[2];
route = {
owner: owner,
name: name
}, function() {
return window.location.hash = '#';
name: name,
milestone: milestone
};
document.title = "" + owner + "/" + name + "/" + milestone;
return milestone.get(route, function(err, warn, obj) {
if (err) {
throw err;
}
if (warn) {
throw warn;
}
_this.set('milestone', obj);
route.milestone = obj;
return project(route, function(err) {
if (err) {
throw err;
}
return console.log('Done');
});
});
}
@ -1130,44 +1149,72 @@
});
// showChart.coffee
root.require.register('burnchart/src/views/pages/showChart.js', function(exports, require, module) {
// new.coffee
root.require.register('burnchart/src/views/pages/new.js', function(exports, require, module) {
var format, milestone, project;
var mediator, user;
milestone = require('../../modules/milestone');
mediator = require('../../modules/mediator');
project = require('../../modules/project');
user = require('../../models/user');
module.exports = Ractive.extend({
'template': require('../../templates/pages/new'),
'data': {
'value': 'radekstepan/disposable',
user: user
},
'adapt': [Ractive.adaptors.Ractive],
init: function() {
var autocomplete;
document.title = 'Add a new project';
autocomplete = function(value) {};
this.observe('value', _.debounce(autocomplete, 200), {
'init': false
});
return this.on('submit', function() {
var name, owner, _ref;
_ref = this.get('value').split('/'), owner = _ref[0], name = _ref[1];
return mediator.fire('!projects/add', {
owner: owner,
name: name
}, function() {
return window.location.hash = '#';
});
});
}
});
});
// project.coffee
root.require.register('burnchart/src/views/pages/project.js', function(exports, require, module) {
var Hero, Projects, format;
Hero = require('../hero');
Projects = require('../projects');
format = require('../../utils/format');
module.exports = Ractive.extend({
'template': require('../../templates/pages/showChart'),
'adapt': [Ractive.adaptors.Ractive],
'template': require('../../templates/pages/project'),
'components': {
Hero: Hero,
Projects: Projects
},
'data': {
format: format
},
init: function() {
var route,
_this = this;
route = this.get('route');
document.title = "" + route.owner + "/" + route.name;
return milestone.get(route, function(err, warn, obj) {
if (err) {
throw err;
}
if (warn) {
throw warn;
}
_this.set('milestone', obj);
route.milestone = obj;
return project(route, function(err) {
if (err) {
throw err;
}
return console.log('Done');
});
});
var name, owner, route, _ref;
_ref = this.get('route'), owner = _ref[0], name = _ref[1];
route = {
owner: owner,
name: name
};
return document.title = "" + owner + "/" + name;
}
});

View File

@ -2,25 +2,25 @@ mediator = require './mediator'
el = '#page'
route = (page, req, evt) ->
route = (page, args...) ->
Page = require "../views/pages/#{page}"
new Page { el, 'data': { 'route': req.params } }
new Page { el, 'data': { 'route': args } }
router =
'': _.partial route, 'index'
'project/add': _.partial route, 'addProject'
'chart/:owner/:name/:milestone': _.partial route, 'showChart'
router = Router
'/': _.partial route, 'index'
'/new/project': _.partial route, 'new'
'/:owner/:name': _.partial route, 'project'
'/:owner/:name/:milestone': _.partial route, 'chart'
# TODO: remove in production.
'reset': ->
'/reset': ->
mediator.fire '!projects/clear'
window.location.hash = '#'
'notify': ->
'/notify': ->
mediator.fire '!app/loading', yes
mediator.fire '!app/notify', 'You did something real good', 'warn'
window.location.hash = '#'
module.exports = ->
# Init the routes.
Grapnel.listen router
router.init '/'
router

View File

@ -271,6 +271,9 @@ ul
padding: 20px 30px
border-bottom: 1px solid #EAECF2
.project
color: inherit
.milestone
.icon
font-size: 10px

View File

@ -15,7 +15,7 @@
font-variant: normal
text-transform: none
&.spin6, &.spin4, &.spinner1
&[class^='spin'], &[class*=' spin']
animation: spin 2s infinite linear
@-moz-keyframes spin {

View File

@ -18,7 +18,7 @@
</div>
<ul>
<li><a href="#project/add" class="add"><Icons icon="plus-circled"/> Add a Project</a></li>
<li><a href="#new/project" class="add"><Icons icon="plus-circled"/> Add a Project</a></li>
<li><a href="#" class="faq">FAQ</a></li>
<li><a href="#reset">DB Reset</a></li>
<li><a href="#notify">Notify</a></li>

View File

@ -5,7 +5,7 @@
<h2>See your project progress</h2>
<p>Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
<div class="cta">
<a href="#project/add" class="primary"><Icons icon="plus-circled"/> Add your project</a>
<a href="#new/project" class="primary"><Icons icon="plus-circled"/> Add your project</a>
<a href="#" class="secondary">Read the Guide</a>
</div>
</div>

View File

@ -0,0 +1,9 @@
<div id="title">
<div class="wrap">
<h2 class="title">radekstepan/disposable</h2>
</div>
</div>
<div id="content" class="wrap">
Project milestones go here
</div>

View File

@ -9,9 +9,11 @@
{{#projects.list}}
{{#milestones}}
<tr>
<td class="repo">{{owner}}/{{name}}</td>
<td class="repo">
<a class="project" href="#{{owner}}/{{name}}">{{owner}}/{{name}}</a>
</td>
<td>
<a class="milestone" href="#chart/{{owner}}/{{name}}/{{number}}">{{ title }}</a>
<a class="milestone" href="#{{owner}}/{{name}}/{{number}}">{{ title }}</a>
</td>
<td>
<div class="progress">

View File

@ -4,16 +4,17 @@ format = require '../../utils/format'
module.exports = Ractive.extend
'template': require '../../templates/pages/showChart'
'template': require '../../templates/pages/chart'
'adapt': [ Ractive.adaptors.Ractive ]
'data': { format }
init: ->
route = @get 'route'
[ owner, name, milestone ] = @get 'route'
route = { owner, name, milestone }
document.title = "#{route.owner}/#{route.name}"
document.title = "#{owner}/#{name}/#{milestone}"
milestone.get route, (err, warn, obj) =>
throw err if err

View File

@ -3,7 +3,7 @@ user = require '../../models/user'
module.exports = Ractive.extend
'template': require '../../templates/pages/addProject'
'template': require '../../templates/pages/new'
'data': { 'value': 'radekstepan/disposable', user }

View File

@ -0,0 +1,17 @@
Hero = require '../hero'
Projects = require '../projects'
format = require '../../utils/format'
module.exports = Ractive.extend
'template': require '../../templates/pages/project'
'components': { Hero, Projects }
'data': { format }
init: ->
[ owner, name ] = @get 'route'
route = { owner, name }
document.title = "#{owner}/#{name}"