forked from PDXostc/dashboard
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
135 lines (122 loc) · 5.21 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<!--
* Copyright (c) 2014, Intel Corporation, Jaguar Land Rover
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
-->
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>DNA Dashboard</title>
<meta name="viewport" content="width=1080, height=1920, user-scalable=no" />
<link rel="stylesheet" href="./DNA_common/css/style.css"/>
<link rel="stylesheet" href="./css/dashboard.css"/>
<script type="text/javascript" src="./DNA_common/components/jQuery/jquery-1.8.2.js"></script>
<!-- Need to load dashboardControler.js before init.js, since init.js loads main and main instantiates a dashBoardControler object. -->
<script type="text/javascript" src="./js/dashboardControler.js"></script>
<script type="text/javascript" src="./js/vehicle_graphic_switch.js"></script>
<script type="text/javascript" src="./DNA_common/js/init.js"></script>
<script type="text/javascript">
/*includeJs("./DNA_common/js/predefAppModel.js");
includeJs("./DNA_common/js/installedApps.js");
includeJs("./DNA_common/js/keyControl.js");
includeJs("./DNA_common/js/actionCatcher.js");
includeJs("./DNA_common/js/HomeScreenMain.js");*/
includeJs("./js/main.js");
</script>
</head>
<body>
<!-- Begin #base -->
<div id="base">
<div id="topBar"></div>
<div id="app">
<div id="clockElement"></div>
<!-- BEGIN HTML ELEMENTS -->
<div class="flex-item">
<!-- 01. Speed, Fuel and Temperature Information -->
<div id="speed-fuel-temp-container">
<!-- Speed (Orange) -->
<div id="speed-container">
<h5>SPEED <span id="unit-mph" class="unit-description">MPH</span></h5>
<div id="speed-icon"></div>
<div id="speed-gauge-meter"></div>
<div id="speed-gauge-units"></div>
<p id="MPH">45 <span id="MPH-label">MPH</span></p>
<p id="odometer" class="label"><span id="OdometerValue">100,000.5</span> mi</p>
</div>
<div id="fuel-temp-container"> <!-- This container is for both the fuel and temperature information -->
<!-- Fuel (Yellow) -->
<div id="fuel-container">
<h5 class="yellow-viv">FUEL <span id="unit-gallons" class="unit-description">GALLONS</span></h5>
<div id="fuel-icon"></div>
<div id="fuel-gauge-meter"></div>
<div id="fuel-gauge-units"></div>
<ul>
<li><strong>LEVEL:</strong> <span id="FuelLevel">12</span> gallons</li>
<li><strong>RANGE:</strong> <span id="DistToEmpty">355</span> mi</li>
<li><strong>AVG:</strong> 20.7 mpg</li>
</ul>
</div>
<!-- Temperature (Green) -->
<div id="temperature-container">
<h5 class="green-viv">TEMPERATURE <span id="unit-temperature" class="unit-description green-lt">CELSIUS</span></h5>
<div id="temperature-icon"></div>
<ul>
<li><strong>OUTDOOR:</strong> <span id="OutdoorTemp">28.9</span>°</li>
<li><strong>INDOOR:</strong> <span id="InCarTemp">20.4</span>°</li>
</ul>
</div>
</div>
</div>
<!-- 02. Tire Pressure Information -->
<div id="tire-pressure-container">
<!-- Front Tires -->
<div class="front-tire-data tire-pressure-data left-PSI">
<div class="PSI-status-position PSI-status-OK "></div>
<h6>Left Front Tire</h6>
<p class="psi-text"><span id="psiFL">26.0</span> PSI</p>
</div>
<div class="front-tire-data tire-pressure-data right-PSI">
<div class="PSI-status-position PSI-status-OK"></div>
<h6>Right Front Tire</h6>
<p class="psi-text"><span id="psiFR">26.0</span> PSI</p>
</div>
<!-- Rear Tires -->
<div class="rear-tire-data tire-pressure-data left-PSI">
<div class="PSI-status-position PSI-status-OK "></div>
<h6>Left Rear Tire</h6>
<p class="psi-text"><span id="psiRL">26.0</span> PSI</p>
</div>
<div class="rear-tire-data tire-pressure-data right-PSI">
<div class="PSI-status-position PSI-status-OK "></div>
<h6>Right Rear Tire</h6>
<p class="psi-text"><span id="psiRR">26.0</span> PSI</p>
</div>
</div>
<!-- 03. Vehicle Graphics -->
<div id="vehicle-graphic" class="rangeRoverVehicle"></div> <!-- This is the large vehicle graphic with call out lines -->
<div id="vehicle-graphic-switches">
<div id="rangeRoverButton"><a class="button button-orange">Range Rover<a></div>
<div id="lr4Button"><a class="button button-orange">LR4<a></div>
<div id="fTypeButton"><a class="button button-orange">F-Type<a></div>
</div>
</div>
<!-- END CUSTOM ELEMENTS -->
</div>
<!--end of #app -->
<div id="bottomBar" class="bottomPanel bottomPanelImg"></div>
</div>
<!-- End #base -->
</body>
</html>