Updating sensors logics with mock data

Change-Id: Icede8defdae3a677db5c13dcd6324a1117ce25db
Signed-off-by: Iftekharul Islam <iislam@us.ibm.com>
diff --git a/app/server-health/controllers/sensors-controller.html b/app/server-health/controllers/sensors-controller.html
index 15720c1..64a0fff 100644
--- a/app/server-health/controllers/sensors-controller.html
+++ b/app/server-health/controllers/sensors-controller.html
@@ -5,7 +5,7 @@
     <section class="row column">
         <div class="page-header">
             <h2 class="inline h4">Sensors present in the system</h2>
-            <button class="inline btn-export float-right">Export</button>
+            <a ng-href="data:text/json;charset=utf-8,{{export_data}}" class="inline btn-export float-right"  download="{{export_name}}" ng-show="filteredSensorData.length">Export</a>
         </div>
     </section>
 
@@ -14,20 +14,22 @@
         <!-- search -->
         <div class="content__search">
             <label for="content__search-input">Sensors Search</label>
-            <input id="content__search-input" type="text" placeholder="Filter issues"/>
-            <input id="content__search-submit" type="submit" class="btn btn-secondary" value="Submit"/>
+            <input id="content__search-input" type="text" placeholder="Filter issues" ng-model="customSearch" ng-keydown="doSearchOnEnter($event)"/>
+            <input id="content__search-submit" type="submit" class="btn btn-secondary" value="Submit" ng-click="doSearchOnClick()"/>
         </div>
+
         <div class="toggle-filter">
-            <button class="inline first btn-primary">All
+            <button class="inline first btn-primary" ng-click="toggleSeverityAll()"
+                    ng-class="selectedSeverity.all ? 'btn-primary' : 'btn-secondary'">All
             </button>
-            <button class="inline " ng-click="togglehigh = !togglehigh"
-                    ng-class="togglehigh ? 'btn-primary' : 'btn-secondary'">Critical
+            <button class="inline " ng-click="toggleSeverity('critical')"
+                    ng-class="selectedSeverity.critical ? 'btn-primary' : 'btn-secondary'">Critical
             </button>
-            <button class="inline" ng-click="togglemed = !togglemed"
-                    ng-class="togglemed ? 'btn-primary' : 'btn-secondary'">Warning
+            <button class="inline" ng-click="toggleSeverity('warning')"
+                    ng-class="selectedSeverity.warning ? 'btn-primary' : 'btn-secondary'">Warning
             </button>
-            <button class="inline last" ng-click="togglelow = !togglelow"
-                    ng-class="togglelow ? 'btn-primary' : 'btn-secondary'">Normal
+            <button class="inline last" ng-click="toggleSeverity('normal')"
+                    ng-class="selectedSeverity.normal ? 'btn-primary' : 'btn-secondary'">Normal
             </button>
         </div>
     </section> <!-- end filter -->
@@ -38,25 +40,25 @@
     </div>
     </section>
 
-    <section id="sensor__details" class="row column">
+    <section id="sensor__details" class="row column" ng-hide="!data.display_headers">
         <div class="row column header-row">
             <div class="column small-10 large-11 header__actions-bar">
                 <p class="inline priority-tag-circ high-priority" aria-label="High Priority"></p>
-                <p class="inline sensor__heading sensor__category">Fan speed (RPMs)</p>
-                <p class="inline sensor__heading middle">Reading</p>
-                <p class="inline float-right sensor__heading right">State</p>
+                <p class="inline sensor__heading sensor__category">{{data.display_headers[0]}}</p>
+                <p class="inline sensor__heading middle">{{data.display_headers[1]}}</p>
+                <p class="inline float-right sensor__heading right">{{data.display_headers[2]}}</p>
             </div>
             <div class="column small-2 large-1 sensor__heading trigger-col"></div>
         </div>
 
         <!-- Sensor -->
-        <div class="row column accord-row" ng-class="{'active': sensors__metadatarow, 'selected': sensors__selected}">
+        <div ng-repeat="sensor in (filteredSensorData = (data.data|filter:filterBySeverity|filter:filterBySearchTerms))" class="row column accord-row" ng-class="{'active': sensors__metadatarow, 'selected': sensors__selected}">
             <div class="row">
                 <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow = ! sensors__metadatarow">
                     <p class="inline priority-tag-circ high-priority" aria-label="High Priority"></p>
-                    <p class="inline sensor__title">Fan Speed 1</p>
-                    <p class="inline sensor__reading">6200 <span>rpms</span></p>
-                    <p class="inline float-right sensor__critical-label">Critical</p>
+                    <p class="inline sensor__title">{{sensor.title}}</p>
+                    <p class="inline sensor__reading">{{sensor.reading}}</p>
+                    <p class="inline float-right" ng-class="{'sensor__critical-label': sensor.status == 'critical', 'sensor__warning-label': sensor.status == 'warning', 'sensor__normal-label': sensor.status == 'normal'}">{{sensor.status}}</p>
                 </div>
                 <div class="column small-2 large-1">
                     <button class="accord-trigger" ng-class="{'active': sensors__metadatarow}" ng-click="sensors__metadatarow = ! sensors__metadatarow"></button>
@@ -67,7 +69,7 @@
                     <div class="threshold-chart__wrapper">
                         <span class="threshold__label low">Low</span>
                         <div class="threshold-chart">
-                            <span class="threshold__marker thresh__high-critical" style="left: 90%;"><span class="threshold__value">6200 RPMs</span></span>
+                            <span class="threshold__marker"  ng-class="{'thresh__high-critical': sensor.status == 'critical', 'thresh__low-warn': sensor.status == 'warning', 'thresh__normal': sensor.status == 'normal'}" style="left: {{sensor.indicator}};"><span class="threshold__value">{{sensor.reading}}</span></span>
                             <span class="threshold thresh__low-critical"></span>
                             <span class="threshold thresh__low-warn"></span>
                             <span class="threshold thresh__normal"></span>
@@ -77,94 +79,8 @@
                         <span class="threshold__label high">High</span>
                     </div>
                 </div>
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Events</p>-->
-                    <!--<a href="#/overview/log">View 5 events related to Fan 1</a>-->
-                <!--</div>-->
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Hardware</p>-->
-                    <!--<a href="">Chassis0</a>-->
-                <!--</div>-->
             </div>
         </div>
 
-        <!-- Sensor -->
-        <div class="row column accord-row" ng-class="{'active': sensors__metadatarow2, 'selected': sensors__selected}">
-            <div class="row">
-                <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow2 = ! sensors__metadatarow2">
-                    <p class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></p>
-                    <p class="inline sensor__title">Fan Speed 2</p>
-                    <p class="inline sensor__reading">4600 <span>rpms</span></p>
-                </div>
-                <div class="column small-2 large-1">
-                    <button class="accord-trigger" ng-class="{'active': sensors__metadatarow2}" ng-click="sensors__metadatarow2 = ! sensors__metadatarow2"></button>
-                </div>
-            </div>
-            <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow2}">
-                <div class="column small-12">
-                    <div class="threshold-chart__wrapper">
-                        <span class="threshold__label low">Low</span>
-                        <div class="threshold-chart">
-                            <span class="threshold__marker thresh__normal" style="left: 40%;"><span class="threshold__value">4600 RPMs</span></span>
-                            <span class="threshold thresh__low-critical"></span>
-                            <span class="threshold thresh__low-warn"></span>
-                            <span class="threshold thresh__normal"></span>
-                            <span class="threshold thresh__high-warn"></span>
-                            <span class="threshold thresh__high-critical"></span>
-                        </div>
-                        <span class="threshold__label high">High</span>
-                    </div>
-                </div>
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Events</p>-->
-                    <!--<a href="#/overview/log">View 5 events related to Fan 1</a>-->
-                <!--</div>-->
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Hardware</p>-->
-                    <!--<p>None</p>-->
-                <!--</div>-->
-            </div>
-        </div>
-
-        <!-- Sensor -->
-        <div class="row column accord-row" ng-class="{'active': sensors__metadatarow3, 'selected': sensors__selected}">
-            <div class="row">
-                <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow3 = ! sensors__metadatarow3">
-                    <p class="inline priority-tag-circ warn-priority" aria-label="Medium Priority"></p>
-                    <p class="inline sensor__title">Fan Speed 3</p>
-                    <p class="inline sensor__reading">1200 <span>rpms</span></p>
-                    <p class="inline float-right sensor__warning-label">warning</p>
-                </div>
-                <div class="column small-2 large-1">
-                    <button class="accord-trigger" ng-class="{'active': sensors__metadatarow3}"
-                            ng-click="sensors__metadatarow3 = ! sensors__metadatarow3"></button>
-                </div>
-            </div>
-            <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow3}">
-                <div class="column small-12">
-                    <div class="threshold-chart__wrapper">
-                        <span class="threshold__label low">Low</span>
-                        <div class="threshold-chart">
-                            <span class="threshold__marker thresh__low-warn" style="left: 15%;"><span class="threshold__value">1200 RPMs</span></span>
-                            <span class="threshold thresh__low-critical"></span>
-                            <span class="threshold thresh__low-warn"></span>
-                            <span class="threshold thresh__normal"></span>
-                            <span class="threshold thresh__high-warn"></span>
-                            <span class="threshold thresh__high-critical"></span>
-                        </div>
-                        <span class="threshold__label high">High</span>
-                    </div>
-                </div>
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Events</p>-->
-                    <!--<a href="#/overview/log">View 5 events related to Fan 1</a>-->
-                <!--</div>-->
-                <!--<div class="column small-12 large-6">-->
-                    <!--<p class="h5 content-header">Associated Hardware</p>-->
-                    <!--<a href="">Chassis0</a>-->
-                <!--</div>-->
-            </div>
-        </div>
     </section>
-    <paginate ng-include="paginate"></paginate>
 </div> <!-- end event log -->