blob: b742f07ea2c954232b97e1c6a5991abaa5c04923 [file] [log] [blame]
Iftekharul Islam8947e702017-07-27 10:28:07 -05001<div id="sensors">
2 <div class="row column">
3 <h1>Sensors</h1>
4 </div>
5 <section class="row column">
6 <div class="page-header">
7 <h2 class="inline h4">Sensors present in the system</h2>
8
9 </div>
10 </section>
11 <!-- Filters -->
12 <section class="row column">
13 <!-- filters -->
14 <div class="event-log__filters">
15 <!-- severity filter -->
16 <div class="dropdown__wrapper">
17 <button class="dropdown__button" ng-click="severityFilter = severityFilter == true ? false : true;"
18 ng-class="{'active' : severityFilter}">All Severity
19 </button>
20 <ul class="dropdown__list multi-select inline" ng-show="severityFilter">
21 <li>
22 <button>All severity (999)</button>
23 </li>
24 <li ng-click="dropdown_selectedHigh = !dropdown_selectedHigh; filterHigh = !filterHigh "
25 ng-class="{'active' : dropdown_selectedHigh, 'active' : filterHigh}">
26 <button>High severity (999)</button>
27 </li>
28 <li ng-click="dropdown_selectedMed = !dropdown_selectedMed; filterMed = !filterMed"
29 ng-class="{'active' : dropdown_selectedMed, 'active' : filterMed}">
30 <button>Medium severity (999)</button>
31 </li>
32 <li ng-click="dropdown_selectedLow = !dropdown_selectedLow; filterLow = !filterLow"
33 ng-class="{'active' : dropdown_selectedLow, 'active' : filterLow}">
34 <button>Low severity (999)</button>
35 </li>
36 </ul>
37 </div>
38 <!-- date range -->
39 <div class="dropdown__wrapper">
40 <button class="dropdown__button" ng-click="dateFilter = dateFilter == true ? false : true;"
41 ng-class="{'active' : dateFilter}">Date Range
42 </button>
43 <div class="dropdown__list dropdown__date row" ng-show="dateFilter">
44 <div class="column small-6">
45 <label>Start Date</label>
46 <input type="date"/>
47 </div>
48 <div class="column small-6">
49 <label>End Date</label>
50 <input type="date"/>
51 </div>
52 </div>
53 </div>
54 <!-- Status filter -->
55 <div class="dropdown__wrapper">
56 <button class="dropdown__button" ng-click="statusFilter = statusFilter == true ? false : true;"
57 ng-class="{'active' : statusFilter}">Status
58 </button>
59 <ul class="dropdown__list multi-select inline" ng-show="statusFilter">
60 <li>
61 <button>All status (999)</button>
62 </li>
63 <li ng-click="dropdown_selectedResolved = !dropdown_selectedResolved; filterResolved = !filterResolved"
64 ng-class="{'active' : dropdown_selectedResolved, 'active' : filterResolved}">
65 <button>Resolved issues (999)</button>
66 </li>
67 <li ng-click="dropdown_selectedUnresolved = !dropdown_selectedUnresolved; filterUnresolved = !filterUnresolved"
68 ng-class="{'active' : dropdown_selectedUnresolved, 'active' : filterUnresolved}">
69 <button>Unresolved issues (999)</button>
70 </li>
71 </ul>
72 </div>
73 </div>
74 <!-- search -->
75 <div class="content__search">
76 <label for="content__search-input">Event Log Search</label>
77 <input id="content__search-input" type="text" placeholder="Filter issues"/>
78 <input id="sensors__search-submit" type="submit" class="btn btn-secondary" value="Submit"/>
79 <div class="sensors__search-tag-wrapper row"
80 ng-show="filterUnresolved || filterResolved || filterHigh || filterMed || filterLow">
81 <div class="column small-2 large-1 no-padding">
82 <p class="inline label tag-filter-label">Filtered by: </p>
83 </div>
84 <div class="column small-10 large-11 ">
85 <button class="tag custom">Custom Tag</button>
86 <button class="tag sensors__high" ng-click="filterHigh = !filterHigh" ng-show="filterHigh">High
87 priority
88 </button>
89 <button class="tag sensors__medium" ng-click="filterMed = !filterMed" ng-show="filterMed">Medium
90 priority
91 </button>
92 <button class="tag sensors__low" ng-click="filterLow = !filterLow" ng-show="filterLow">Low priority
93 </button>
94 <button class="tag sensors__resolved" ng-click="filterUnresolved = !filterUnresolved"
95 ng-show="filterUnresolved">Unresolved issues
96 </button>
97 <button class="tag sensors__resolved" ng-click="filterResolved = !filterResolved"
98 ng-show="filterResolved">Resolved issues
99 </button>
100 </div>
101 </div>
102 </div>
103 </section> <!-- end filter -->
104
105 <section id="sensor__details" class="row column">
106 <div id="header__actions-bar" class="row ">
107 <div class="column">
108 <p class="inline">icon here</p>
109 <h3 class="inline"><strong>Fan speed sensors</strong> <span class="h5">(RPMs)</span></h3>
110 </div>
111 </div>
112
113 <!-- Sensor -->
114 <div class="row column accord-row"
115 ng-class="{'active': sensors__metadatarow, 'selected': sensors__selected}">
116 <div class="row">
117 <div class="column small-10 large-11 sensor__info"
118 ng-click="sensors__metadatarow = ! sensors__metadatarow">
119 <p class="inline priority-tag high-priority">High</p>
120 <p class="inline sensor__title">Fan Speed 1</p>
121 <p class="inline sensor__reading float-right">6200 <span>rpms</span></p>
122 </div>
123 <div class="column small-2 large-1">
124 <button class="accord-trigger" ng-class="{'active': sensors__metadatarow}"
125 ng-click="sensors__metadatarow = ! sensors__metadatarow"></button>
126 </div>
127 </div>
128 <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow}">
129 <div class="column small-12">
130 <div class="threshold-chart">
131 <span class="threshold__marker" style="left: 90%;"><p class="threshold__value">6200</p></span>
132 <span class="threshold thresh__low-critical"></span>
133 <span class="threshold thresh__low-warn"></span>
134 <span class="threshold thresh__normal"></span>
135 <span class="threshold thresh__high-warn"></span>
136 <span class="threshold thresh__high-critical"></span>
137 </div>
138 </div>
139
140 <div class="column small-6">
141 <p class="h5 content-header">Associated Events</p>
142 <a href="#/overview/log">View 5 events related to Fan 1</a>
143 </div>
144 <div class="column small-6">
145 <p class="h5 content-header">Associated Hardware</p>
146 <a href="">None</a>
147 </div>
148 </div>
149 </div>
150
151 <!-- Sensor -->
152 <div class="row column accord-row"
153 ng-class="{'active': sensors__metadatarow2, 'selected': sensors__selected}">
154 <div class="row">
155 <div class="column small-10 large-11 sensor__info"
156 ng-click="sensors__metadatarow2 = ! sensors__metadatarow2">
157 <p class="inline priority-tag high-priority">High</p>
158 <p class="inline sensor__title">Fan Speed 2</p>
159 <p class="inline sensor__reading float-right">3600 <span>rpms</span></p>
160 </div>
161 <div class="column small-2 large-1">
162 <button class="accord-trigger" ng-class="{'active': sensors__metadatarow2}"
163 ng-click="sensors__metadatarow2 = ! sensors__metadatarow2"></button>
164 </div>
165 </div>
166 <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow2}">
167 <div class="column small-12">
168 <div class="threshold-chart">
169 <span class="threshold__marker" style="left: 50%"><p class="threshold__value">3600</p></span>
170 <span class="threshold thresh__low-critical"></span>
171 <span class="threshold thresh__low-warn"></span>
172 <span class="threshold thresh__normal"></span>
173 <span class="threshold thresh__high-warn"></span>
174 <span class="threshold thresh__high-critical"></span>
175 </div>
176 </div>
177
178 <div class="column small-6">
179 <p class="h5 content-header">Associated Events</p>
180 <a href="#/overview/log">View 5 events related to Fan 1</a>
181 </div>
182 <div class="column small-6">
183 <p class="h5 content-header">Associated Hardware</p>
184 <a href="">None</a>
185 </div>
186 </div>
187 </div>
188
189 </section>
190 <paginate ng-include="paginate"></paginate>
191</div> <!-- end event log -->