alertlist: toggle play/pause button

closes #9355

public/app/features/alerting/partials/alert_list.html

@@ -1,18 +1,18 @@
 <navbar model="ctrl.navModel"></navbar>
 
 <div class="page-container" >
-	<div class="page-header">
-		<h1>Alert List</h1>
+  <div class="page-header">
+    <h1>Alert List</h1>
     <a class="btn btn-inverse" ng-click="ctrl.openHowTo()">
-			<i class="fa fa-info-circle"></i>
-			How to add an alert
-		</a>
+      <i class="fa fa-info-circle"></i>
+      How to add an alert
+    </a>
 
     <a class="btn btn-inverse" href="alerting/notifications" >
-			<i class="fa fa-cog"></i>
-			Configure notifications
-		</a>
-	</div>
+      <i class="fa fa-cog"></i>
+      Configure notifications
+    </a>
+  </div>
 
   <div class="gf-form-group">
     <div class="gf-form-inline">
@@ -34,9 +34,10 @@
           <div class="card-item-header">
             <div class="card-item-type">
               <a class="card-item-cog" bs-tooltip="'Pausing an alert rule prevents it from executing'" ng-click="ctrl.pauseAlertRule(alert.id)">
-								<i class="fa fa-pause"></i>
-							</a>
-							<a class="card-item-cog" href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert" bs-tooltip="'Edit alert rule'">
+                <i ng-show="alert.state !== 'paused'" class="fa fa-pause"></i>
+                <i ng-show="alert.state === 'paused'" class="fa fa-play"></i>
+              </a>
+              <a class="card-item-cog" href="dashboard/{{alert.dashboardUri}}?panelId={{alert.panelId}}&fullscreen&edit&tab=alert" bs-tooltip="'Edit alert rule'">
                 <i class="icon-gf icon-gf-settings"></i>
               </a>
             </div>