Merge pull request #55 from EventStore/include-queries-style

Change the include queries style
EventStore · Feb 10, 2015 · 5df3f87 · 5df3f87
2 parents a3e9e7b + 7432efa
commit 5df3f87
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 5 deletions.
diff --git a/src/css/main.css b/src/css/main.css
@@ -364,6 +364,10 @@ kbd {
     border-radius: 0.25rem;
     cursor: pointer
 }
+.page-nav__item a.highlight, .page-nav__item button.highlight, .page-nav__item input[type="submit"].highlight {
+    background: #6BA300;
+    color: #fff;
+}
 .page-nav__item button{
 	height:34px;
  }
@@ -514,4 +518,4 @@ tbody .table-subheading {
 #toast-container.toast-bottom-full-width > div {
     position:relative;
     bottom:35px;
-}
+}
diff --git a/src/js/modules/projections/controllers/ProjectionsListCtrl.js b/src/js/modules/projections/controllers/ProjectionsListCtrl.js
@@ -56,6 +56,9 @@ define(['./_module'], function (app) {
 			};
 
 			$scope.includeQueries = false;
+			$scope.toggleIncludeQueries = function(){
+				$scope.includeQueries = !$scope.includeQueries;
+			}
 			$scope.$watch('includeQueries', function (newVal, oldVal) {
 				if(newVal !== oldVal) {
 					all.update({params: [newVal]});
@@ -67,4 +70,4 @@ define(['./_module'], function (app) {
 			});
 		}
 	]);
-});
+});
diff --git a/src/js/modules/projections/templates/templates.js b/src/js/modules/projections/templates/templates.js
@@ -78,7 +78,7 @@ try {
 }
 module.run(['$templateCache', function($templateCache) {
   $templateCache.put('projections.list.tpl.html',
-    '<header class=page-header><h2 class=page-title>Projections</h2><ul class=page-nav><li class=page-nav__item><a ng-click=disableAll($event)>Disable All</a></li><li class=page-nav__item><a ng-click=enableAll($event)>Enable All</a></li><li class=page-nav__item><input type=checkbox ng-model="includeQueries">Include Queries</li><li class=page-nav__item><a ui-sref=^.new>New Projection</a></li></ul></header><table class=table-projections><thead><tr><th>Name</th><th>Status</th><th>Mode</th><th>Done</th><th>Read / Write in Progress</th><th>Write Queues</th><th>Partitions Cached</th><th>Rate (events/s)</th><th colspan=2>Events</th></tr><tr><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th class=table-subheading>Processed</th><th class=table-subheading>Buffered</th></tr></thead><tbody><tr ng-repeat="projection in projections"><td><a ui-sref="^.item.details({location: projection.location})">{{ projection.name }}</a></td><td>{{ projection.status }}{{ projection.checkpointStatus }}</td><td>{{ projection.mode }}</td><td>{{ projection.progress.toFixed(1) }}%</td><td>{{ projection.readsInProgress }} / {{ projection.writesInProgress }}</td><td>{{ projection.writePendingEventsAfterCheckpoint }} / {{ projection.writePendingEventsBeforeCheckpoint }}</td><td>{{ projection.partitionsCached }}</td><td>{{ projection.eventsPerSecond }}</td><td>{{ projection.eventsProcessedAfterRestart }}</td><td>{{ projection.bufferedEvents }}</td></tr><tr ng-hide=projections><td colspan=10><em>No projections</em></td></tr></tbody></table>');
+    '<header class=page-header><h2 class=page-title>Projections</h2><ul class=page-nav><li class=page-nav__item><a ng-click=disableAll($event)>Disable All</a></li><li class=page-nav__item><a ng-click=enableAll($event)>Enable All</a></li><li class=page-nav__item><a ng-if=includeQueries class=highlight ng-click=toggleIncludeQueries()>Don\'t Include Queries</a> <a ng-if=!includeQueries ng-click=toggleIncludeQueries()>Include Queries</a></li><li class=page-nav__item><a ui-sref=^.new>New Projection</a></li></ul></header><table class=table-projections><thead><tr><th>Name</th><th>Status</th><th>Mode</th><th>Done</th><th>Read / Write in Progress</th><th>Write Queues</th><th>Partitions Cached</th><th>Rate (events/s)</th><th colspan=2>Events</th></tr><tr><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th></th><th class=table-subheading>Processed</th><th class=table-subheading>Buffered</th></tr></thead><tbody><tr ng-repeat="projection in projections"><td><a ui-sref="^.item.details({location: projection.location})">{{ projection.name }}</a></td><td>{{ projection.status }}{{ projection.checkpointStatus }}</td><td>{{ projection.mode }}</td><td>{{ projection.progress.toFixed(1) }}%</td><td>{{ projection.readsInProgress }} / {{ projection.writesInProgress }}</td><td>{{ projection.writePendingEventsAfterCheckpoint }} / {{ projection.writePendingEventsBeforeCheckpoint }}</td><td>{{ projection.partitionsCached }}</td><td>{{ projection.eventsPerSecond }}</td><td>{{ projection.eventsProcessedAfterRestart }}</td><td>{{ projection.bufferedEvents }}</td></tr><tr ng-hide=projections><td colspan=10><em>No projections</em></td></tr></tbody></table>');
 }]);
 })();
 

diff --git a/src/js/modules/projections/views/projections.list.tpl.html b/src/js/modules/projections/views/projections.list.tpl.html
@@ -9,7 +9,8 @@ <h2 class="page-title">Projections</h2>
 					<a ng-click="enableAll($event)">Enable All</a>
 				</li>
 				<li class="page-nav__item">
-					<input type="checkbox" ng-model="includeQueries" />Include Queries
+					<a ng-if="includeQueries" class="highlight" ng-click="toggleIncludeQueries()">Don't Include Queries</a>
+					<a ng-if="!includeQueries" ng-click="toggleIncludeQueries()">Include Queries</a>
 				</li>
 				<li class="page-nav__item">
 					<a ui-sref="^.new">New Projection</a>
@@ -61,4 +62,4 @@ <h2 class="page-title">Projections</h2>
 				</tr>
 			</tbody>
 		</table>
-	</main>
+	</main>