makup improvements

static/css/sources/components/builds.less

@@ -6,9 +6,13 @@
 	}
 }
 
+.builds {
+	padding: 0 15px;
+}
+
 .build {
-	.clearfix;
-	padding: 15px;
+	.row();
+	padding: 15px 0;
 	margin-bottom: 3px;
 
 	&__in-progress {
@@ -27,17 +31,21 @@
 	}
 
 	&_controls {
-		margin-top: 3px;
+		.make-md-column(3);
+		.make-xs-column(3);
+		.text-right;
+		margin-top: 8px;
+	}
+	&_content {
+		.make-md-column(9);
+		.make-xs-column(9);
 	}
 
 	&_header {
-		margin-bottom: 2px;
-		font-size: 16px;
+		margin-bottom: 6px;
+		font-size: 18px;
 		a {
 			font-size: inherit;
 		}
 	}
-	&_terminal {
-		margin-top: 10px;
-	}
 }

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

@@ -14,55 +14,66 @@ mixin statusText(build)
 - var build = this.props.build;
 
 .build(class="build__#{build.status}")
-	.build_controls.pull-right
-		a(href="javascript:void(0);", onClick=this.onBuildSelect(build.id))
-			i.fa.fa-2x.fa-repeat(title="Rebuild", onClick=this.onRebuildProject(build.project.name))
+	.build_content
+		div.build_header
+			if build.number
+				if build.status !== 'queued'
+					Link(to="build", params={id: build.id})
+						span Build #
+						span= build.number
+				else
+						span Build #
+						span= build.number
 
-	.build_header
-		if build.status !== 'queued'
-			Link(to="build", params={id: build.id})
-				span= build.project.name
-		else
-			span= build.project.name
+			if build.waitReason
+				span  (
+				span= build.waitReason
+				span , waiting)
 
-		if build.number
-			span 
-			span #
-			span= build.number
+			if build.status === 'in-progress' && build.currentStep
+				span  (
+				span= build.currentStep
+				span )
 
-		if build.waitReason
-			span  (
-			span= build.waitReason
-			span , waiting)
+		div
+			if build.project
+				span.build_info
+					Scm(scm=build.project.scm.type)
+					| 
+					Link(to="project", params={name: build.project.name})
+						span= build.project.name
+			if build.endDate
+				span.build_info
+					i.fa.fa-fw.fa-clock-o
+					| 
+					Duration(duration=(build.endDate - build.startDate))
+			| 
+			if build.scm
+				span.build_info
+					i.fa.fa-fw.fa-comment-o
+					| 
+					span= build.scm.rev.comment
+			| 
+			if !build.endDate
+				if build.startDate
+					span.build_info
+						i.fa.fa-fw.fa-clock-o
+						| started at 
+						DateTime(date=new Date(build.startDate))
+				else
+					span.build_info
+						i.fa.fa-fw.fa-clock-o
+						| queued at 
+						DateTime(date=new Date(build.createDate))
 
-		if build.status === 'in-progress' && build.currentStep
-			span  (
-			span= build.currentStep
-			span )
-	div
-		if build.scm
-			span.build_info
-				i.fa.fa-fw.fa-code-fork
-				span= build.scm.rev.id
 
-			span.build_info
-				i.fa.fa-fw.fa-comment-o
+	.build_controls
+		if build.completed
+			a.btn.btn-sm.btn-default(href="javascript:void(0);", onClick=this.onRebuildProject(build.project.name))
+				i.fa.fa-fw.fa-repeat(title="Rebuild")
 				| 
-				span= build.scm.rev.comment
-
-		if build.endDate
-			span.build_info
-				i.fa.fa-fw.fa-clock-o
-				| built at 
-				DateTime(date=new Date(build.endDate))
+				| Build again
 		else
-			if build.startDate
-				span.build_info
-					i.fa.fa-fw.fa-clock-o
-					| started at 
-					DateTime(date=new Date(build.startDate))
-			else
-				span.build_info
-					i.fa.fa-fw.fa-clock-o
-					| queued at 
-					DateTime(date=new Date(build.createDate))
+			//-.progress
+				//-.progress-bar.progress-bar-success(style={width: '60%'})
+

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

@@ -11,6 +11,8 @@ define([
 ) {
 	template = template.locals({
 		DateTime: CommonComponents.DateTime,
+		Duration: CommonComponents.Duration,
+		Scm: CommonComponents.Scm,
 		Terminal: TerminalComponent,
 		Link: Router.Link
 	});
@@ -22,6 +24,7 @@ define([
 			};
 		},
 		onRebuildProject: function(projectName) {
+			console.log('onRebuildProject');
 			ProjectActions.run(projectName)
 		},
 		onShowTerminal: function(build) {

static/js/app/components/common/duration/index.jade

@@ -0,0 +1,4 @@
+span
+	span= this.props.duration / 1000
+	| 
+	span sec

static/js/app/components/common/duration/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+define([
+	'react', 'templates/app/components/common/duration/index'
+], function(React, template) {
+	return React.createClass({
+		render: template
+	});
+});

static/js/app/components/common/index.js

@@ -2,10 +2,12 @@
 
 define([
 	'./dateTime/index',
-	'./scm/index'
-], function(DateTime, Scm) {
+	'./scm/index',
+	'./duration/index'
+], function(DateTime, Scm, Duration) {
 	return {
 		DateTime: DateTime,
-		Scm: Scm
+		Scm: Scm,
+		Duration: Duration
 	};
 });

static/js/app/components/common/scm/index.jade

@@ -2,4 +2,4 @@ if this.props.scm
 	if this.props.scm === 'mercurial'
 		i.fa.fa-fw.fa-bitbucket
 	else
-		i.fa.fa-fw.fa-git
+		i.fa.fa-fw.fa-github

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

@@ -1,13 +1,26 @@
 .row 
 	.col-md-8
-		h1
+		h1.clearfix
 			.pull-right
-				span.badge.badge-default= this.state.project.scm ? this.state.project.scm.rev : ''
-
-			Scm(scm=this.state.project.scm ? this.state.project.scm.type : '')
-			span= this.state.project.name
+				button.btn.btn-sm.btn-primary.dropdown-toggle(
+					data-toggle="dropdown",
+					aria-expanded="false"
+				)
+					span= this.state.project.scm ? this.state.project.scm.rev : ''
+					| 
+					span.caret
+				| 
+				if this.state.project.name
+					button.btn.btn-sm.btn-success(onClick=this.onBuildProject)
+						i.fa.fa-fw.fa-play
+						| 
+						span Build
+			div
+				Scm(scm=this.state.project.scm ? this.state.project.scm.type : '')
+				span= this.state.project.name
 
 		hr
+
 		div.text-muted
 			- var lastDoneBuild = this.state.project.lastDoneBuild;
 			p Last successfully build: 

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

@@ -8,7 +8,8 @@ define([
 	'app/components/builds/list',
 	'app/components/common/scm/index',
 	'templates/app/components/projects/view/index',
-	'app/components/common/index'
+	'app/components/common/index',
+	'bootstrap/dropdown'
 ], function(React, Reflux, ProjectActions, BuildActions,
 	projectStore, Builds, Scm, template, CommonComponents
 ) {
@@ -26,6 +27,12 @@ define([
 				BuildActions.readAll({projectName: params.name});
 			}
 		},
+		onBuildProject: function() {
+			if (this.state.project.name) {
+				console.log(this.state.project.name);
+				ProjectActions.run(this.state.project.name);
+			}
+		},
 		componentDidMount: function() {
 			this.listenTo(projectStore, this.updateItem);
 		},

static/js/main.js

@@ -11,9 +11,11 @@ require.config({
 		socketio: '/socket.io/socket.io.js',
 		jquery: 'libs/jquery/jquery',
 		ansi_up: 'libs/ansi_up/ansi_up',
-		'bootstrap/collapse': 'libs/bootstrap/js/collapse'
+		'bootstrap/collapse': 'libs/bootstrap/js/collapse',
+		'bootstrap/dropdown': 'libs/bootstrap/js/dropdown'
 	},
 	shim: {
-		'bootstrap/collapse': ['jquery']
+		'bootstrap/collapse': ['jquery'],
+		'bootstrap/dropdown': ['jquery']
 	}
 });