project page draft

resources/builds.js

@@ -10,9 +10,19 @@ module.exports = function(app) {
 	resource.use('readAll', function(req, res, next) {
 		Steppy(
 			function() {
-				var findParams = _(req.data).pick('offset', 'limit');
+				var data = req.data || {};
+
+				var start = {};
+				if (data.projectName) {
+					start.projectName = data.projectName;
+				}
+				if (data.descCreateDate) {
+					start.descCreateDate = data.descCreateDate;
+				}
+
+				var findParams = _(data).pick('offset', 'limit');
+				findParams.start = start;
 				findParams.limit = findParams.limit || 20;
-				findParams.start = {descCreateDate: ''};
 
 				db.builds.find(findParams, this.slot());
 			},

resources/projects.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var Steppy = require('twostep').Steppy,
+	_ = require('underscore'),
 	createBuildDataResource = require('../distributor').createBuildDataResource,
 	logger = require('../lib/logger')('projects resource');
 
@@ -18,6 +19,10 @@ module.exports = function(app) {
 		res.send(app.projects);
 	});
 
+	resource.use('read', function(req, res) {
+		res.send(_(app.projects).findWhere(req.data));
+	});
+
 	resource.use('run', function(req, res) {
 		var projectName = req.data.projectName;
 		logger.log('Run the project: "%s"', projectName);

static/js/app/actions/project.js

@@ -3,7 +3,8 @@
 define(['reflux'], function(Reflux) {
 	var Actions = Reflux.createActions([
 		'run',
-		'readAll'
+		'readAll',
+		'read'
 	]);
 
 	return Actions;

static/js/app/app.js

@@ -19,7 +19,11 @@ define([
 	var routes = (
 		Route({name: 'index', path: '/'},
 			Route({name: 'dashboard', path: '/', handler: Components.App}),
-			Route({name: 'projects', path: 'projects', handler: Components.Project.List}),
+			Route({
+				name: 'projects',
+				path: 'projects/:name',
+				handler: Components.Project.View
+			}),
 			Route({name: 'build', path: 'builds/:id', handler: Components.Build.View})
 		)
 	);

static/js/app/components/builds/item.jade

@@ -66,7 +66,3 @@ mixin statusText(build)
 					i.fa.fa-fw.fa-clock-o
 					| queued at 
 					DateTime(date=new Date(build.createDate))
-
-	if this.state.showTerminal
-		.build_terminal
-			Terminal(build=build.id)

static/js/app/components/builds/list.jade

@@ -1,6 +1,5 @@
-- console.log('builds', items)
 .builds
-	if !items.length
+	if !this.state.items.length
-		p Build queue is empty
+		p Build list is empty
-	each build, index in items
+	each build, index in this.state.items
 		Item(build=build, key=build.id)

static/js/app/components/builds/list.js

@@ -7,6 +7,10 @@ define([
 	'app/stores/builds',
 	'templates/app/components/builds/list'
 ], function(React, Reflux, Item, buildsStore, template) {
+	template = template.locals({
+		Item: Item
+	});
+
 	var Component = React.createClass({
 		mixins: [Reflux.ListenerMixin],
 		componentDidMount: function() {
@@ -15,12 +19,7 @@ define([
 		updateItems: function(items) {
 			this.setState({items: items});
 		},
-		render: function() {
+		render: template,
-			return template({
-				Item: Item,
-				items: this.state.items
-			});
-		},
 		getInitialState: function() {
 			return {
 				items: []

static/js/app/components/projects/index.js

@@ -1,9 +1,11 @@
 'use strict';
 
 define([
-	'app/components/projects/selector/index'
+	'app/components/projects/selector/index',
-], function(Selector) {
+	'app/components/projects/view/index'
+], function(Selector, View) {
 	return {
-		Selector: Selector
+		Selector: Selector,
+		View: View
 	};
 });

static/js/app/components/projects/selector/index.js

@@ -1,10 +1,14 @@
 'use strict';
 
 define([
-	'react', 'reflux', 'app/actions/project',
+	'react', 'react-router', 'reflux', 'app/actions/project',
-	'app/stores/project',
+	'app/stores/projects',
 	'templates/app/components/projects/selector/index'
-], function(React, Reflux, ProjectActions, projectsStore, template) {
+], function(React, Router, Reflux, ProjectActions, projectsStore, template) {
+	template = template.locals({
+		Link: Router.Link
+	});
+
 	return React.createClass({
 		mixins: [Reflux.ListenerMixin],
 		componentDidMount: function() {

static/js/app/components/projects/view/index.jade

@@ -0,0 +1,2 @@
+h1= this.state.project.name
+Builds()

static/js/app/components/projects/view/index.js

@@ -0,0 +1,35 @@
+'use strict';
+
+define([
+	'react', 'reflux',
+	'app/actions/project',
+	'app/actions/build',
+	'app/stores/project',
+	'app/components/builds/list',
+	'templates/app/components/projects/view/index'
+], function(React, Reflux, ProjectActions, BuildActions,
+	projectStore, Builds, template
+) {
+	template = template.locals({
+		Builds: Builds
+	});
+
+	return React.createClass({
+		mixins: [Reflux.ListenerMixin],
+		componentDidMount: function() {
+			ProjectActions.read({name: this.props.params.name});
+			BuildActions.readAll({projectName: this.props.params.name});
+
+			this.listenTo(projectStore, this.updateItem);
+		},
+		updateItem: function(project) {
+			this.setState({project: project});
+		},
+		getInitialState: function() {
+			return {
+				project: {}
+			}
+		},
+		render: template,
+	});
+});

static/js/app/stores/builds.js

@@ -27,9 +27,9 @@ define([
 			resource.subscribe('change', this.onChange);
 		},
 
-		onReadAll: function() {
+		onReadAll: function(params) {
 			var self = this;
-			resource.sync('readAll', function(err, builds) {
+			resource.sync('readAll', params, function(err, builds) {
 				if (err) throw err;
 				self.builds = builds;
 				self.trigger(self.builds);

static/js/app/stores/project.js

@@ -1,22 +1,28 @@
 'use strict';
 
 define([
+	'underscore',
 	'reflux', 'app/actions/project', 'app/resources'
-], function(Reflux, ProjectActions, resources) {
+], function(_, Reflux, ProjectActions, resources) {
 	var resource = resources.projects;
 
 	var Store = Reflux.createStore({
 		listenables: ProjectActions,
-		onRun: function(projectName) {
+		project: null,
-			resource.sync('run', {projectName: projectName}, function(err, result) {
+
-				console.log('run project, shoould get queue');
+		onChange: function(data, action) {
-			});
 		},
-		onReadAll: function() {
+
+		init: function() {
+			resource.subscribe('change', this.onChange);
+		},
+
+		onRead: function(params) {
 			var self = this;
-			resource.sync('readAll', function(err, projects) {
+			resource.sync('read', params, function(err, project) {
 				if (err) throw err;
-				self.trigger(projects);
+				self.project = project;
+				self.trigger(self.project);
 			});
 		}
 	});

static/js/app/stores/projects.js

@@ -0,0 +1,25 @@
+'use strict';
+
+define([
+	'reflux', 'app/actions/project', 'app/resources'
+], function(Reflux, ProjectActions, resources) {
+	var resource = resources.projects;
+
+	var Store = Reflux.createStore({
+		listenables: ProjectActions,
+		onRun: function(projectName) {
+			resource.sync('run', {projectName: projectName}, function(err, result) {
+				console.log('run project, shoould get queue');
+			});
+		},
+		onReadAll: function() {
+			var self = this;
+			resource.sync('readAll', function(err, projects) {
+				if (err) throw err;
+				self.trigger(projects);
+			});
+		}
+	});
+
+	return Store;
+});