From 5b3621948b0bf24c0752e0081a19fb570ba90a3c Mon Sep 17 00:00:00 2001
From: Fabian Reinartz <fab.reinartz@gmail.com>
Date: Mon, 9 Nov 2015 12:03:36 +0100
Subject: [PATCH] Show firing duration

---
 ui/app/css/main.css         | 16 ++--------------
 ui/app/js/app.js            |  2 +-
 ui/app/partials/alert.html  | 25 ++-----------------------
 ui/app/partials/alerts.html |  4 ++--
 ui/app/partials/route.html  |  3 ---
 5 files changed, 7 insertions(+), 43 deletions(-)

diff --git a/ui/app/css/main.css b/ui/app/css/main.css
index 8e4956d9..8a0f127c 100644
--- a/ui/app/css/main.css
+++ b/ui/app/css/main.css
@@ -131,24 +131,12 @@ header #logo {
 	font-style: italic;
 }
 
-
-.route {
-	border-left: 1px dotted #c0c0c0;
-	background: #fff;
-}
-.route .route {
-	margin: 0 0 0 1.5em;
-}
-
-.route-header {
-	border-bottom: 1px solid #fff;
-	padding: .5em .6em;
-	background: rgba(47, 119, 209, .4);
+.silence-alert {
+	background: #f0f0f0;
 }
 
 .alert-group-header {
 	border-bottom: 1px solid #fff;
-	background: rgba(47, 119, 209, .4);
 	background: #f0f0f0;
 	padding: .5em .6em;
 }
diff --git a/ui/app/js/app.js b/ui/app/js/app.js
index 2a56e231..aa4f2917 100644
--- a/ui/app/js/app.js
+++ b/ui/app/js/app.js
@@ -25,7 +25,7 @@ angular.module('am.directives').directive('alert',
       restrict: 'E',
       scope: {
         alert: '=',
-        hiddenLabels: '='
+        group: '='
       },
       templateUrl: '/app/partials/alert.html'
     };
diff --git a/ui/app/partials/alert.html b/ui/app/partials/alert.html
index f5828724..bdcd65ef 100644
--- a/ui/app/partials/alert.html
+++ b/ui/app/partials/alert.html
@@ -2,13 +2,14 @@
 	<div class="overview group">
 		<div class="labels left" ng-click="toggleDetails()">
 			<span ng-repeat="(name, value) in alert.labels | orderBy:name">
-				<span ng-hide="hiddenLabels.indexOf(name) >= 0" class="lbl {{ name == 'alertname' ? 'lbl-highlight' : '' }}" outline>
+				<span ng-hide="group[name]" class="lbl {{ name == 'alertname' ? 'lbl-highlight' : '' }}">
 					{{ name }} = '{{ value }}'
 				</span>
 			</span>
 		</div>
 
 		<div class="right">
+			<button type="black" disabled small>Since {{ alert.startsAt | amCalendar }}</button>
 			<button class="silence-button" type="secondary" ng-click="toggleSilenceForm()" small upper>Silence</button>
 		</div>
 	</div>
@@ -49,26 +50,4 @@
 			</tbody>
 		</table>
 	</div>
-
-	<!-- <div class="container-right group">
-		<div class="right">
-			<button type="secondary" ng-click="toggleSilenceForm()" small>Silence</button>
-		</div>
-		
-		<div class="left">
-			<silence-form ng-show="showSilenceForm" silence="silence"></silence-form>
-
-			Details: <input class="collapse" ng-class="{open:collapse}" type="checkbox" ng-model="collapse"></input>
-			<div class="left" ng-show="collapse">
-				<table class="table-flat">
-					<tbody>
-						<tr ng-repeat="(name, val) in a.annotations | orderBy:name">
-							<td style="padding-right: 3em"><em>{{ name }}</em></td>
-							<td style="white-space: pre-line;">{{ val }}</td>
-						</tr>
-					</tbody>
-				</table>
-			</div>
-		</div>
-	</div> -->
 </div>
\ No newline at end of file
diff --git a/ui/app/partials/alerts.html b/ui/app/partials/alerts.html
index 763b1629..2b7746da 100644
--- a/ui/app/partials/alerts.html
+++ b/ui/app/partials/alerts.html
@@ -7,7 +7,7 @@
 <div id="alert-groups" ng-controller="AlertsCtrl">
 	<div ng-repeat="group in groups">
 		<div class="alert-group-header group">
-			<span ng-repeat="(ln, lv) in group.labels" class="lbl lbl-outline">
+			<span ng-repeat="(ln, lv) in group.labels" class="lbl {{ ln == 'alertname' ? 'lbl-highlight' : 'lbl-outline' }}">
 				{{ ln }} = '{{ lv }}'
 			</span>
 		</div>	
@@ -15,7 +15,7 @@
 		<div ng-repeat="g in group.groups">
 			<div ng-show="destinations.indexOf(g.routeOpts.sendTo) >= 0" class="alert-group" ng-show"g.alerts">
 				<div ng-repeat="a in g.alerts">
-					<alert class="list-item" alert="a" hiddenLabels="Object.keys(group.labels)"></alert>
+					<alert class="list-item" alert="a" group="group.labels"></alert>
 				</div>
 			</div>
 		</div>
diff --git a/ui/app/partials/route.html b/ui/app/partials/route.html
index 1af699a6..84791cd4 100644
--- a/ui/app/partials/route.html
+++ b/ui/app/partials/route.html
@@ -1,8 +1,5 @@
 <div class="route">
 	<div class="route-header group">
-		<!-- <div class="grouping-labels right">
-			<span ng-repeat="l in route.routeOpts.groupBy" class="lbl">{{ l }}</span>
-		</div> -->
 		<div class="route-matchers left">
 			<span ng-repeat="m in route.matchers" class="lbl lbl-outline">
 				{{ m.name }} =<span ng-show="m.isRegex">~</span> '{{ m.value }}'