-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
89 lines (89 loc) · 5.43 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
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en" ng-app='MainApp' ng-cloak>
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Weather Tablet (Wall Based Tablet for Current Weather)</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="/img/apple-touch-icon.png">
<link rel="icon" href="/img/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/main.min.css">
<script type="text/javascript" src="/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
<script type="text/javascript" src="/js/vendor/skycons.js"></script>
<script type="text/javascript" src="/js/app.min.js"></script>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body style="overflow:hidden;">
<div id='main-page-container' ng-controller="homePageController">
<div class="container">
<div id="page-container" class="row" ng-show='!isWeatherLoading'>
<div id="current-conditions">
<div class="col-sm-6">
<h4 id="sunset-container">Dark @ {{currentWeather.daily.data[0].sunsetTime * 1000 | date:'h:mm a'}}</h4>
<canvas id="currentlyWeatherIcon" width="240" height="240"></canvas>
<div class="col-sm-7">
<h1 style="color:{{tempColors['apparentTemperature']}};">{{currentWeather.currently.apparentTemperature | number:0}}°</h1>
</div>
<div class="col-sm-5 extreme-temp-current" style="color:{{tempColors['dailyExtreme']}}">
[{{currentWeather.dailyExtremeType[0]}}: {{currentWeather.dailyExtreme[0] | number:0}}°]
</div><br/>
<h3 class="minute-summary">{{currentWeather.minutely.summary}}</h3>
</div>
<div id="forecast-list" class="col-sm-6">
<div style="padding:10px;">
<div>
<div class="forecast-item-day">{{currentWeather.daily.data[1].time * 1000 | date:'EEEE'}}</div>
<canvas id="forecastWeatherIcon1" width="80" height="80"></canvas>
<strong style="color:{{tempColors['data-1-max']}};"> {{currentWeather.daily.data[1].apparentTemperatureMax | number:0}} °</strong>
<span class="medium-text">
<span style="font-size: 18px;">Low:</span> <span style="color:{{tempColors['data-1-min']}};">{{currentWeather.daily.data[1].apparentTemperatureMin | number:0}} °</span>
</span>
<div class="daily-summary">{{currentWeather.daily.data[1].summary}}</div>
<div class='summary'>{{currentWeather.daily.data[1].summary}}</div>
<div class="forecast-item-day">{{currentWeather.daily.data[2].time * 1000 | date:'EEEE'}}</div>
<canvas id="forecastWeatherIcon2" width="80" height="80"></canvas>
<strong style="color:{{tempColors['data-2-max']}};">{{currentWeather.daily.data[2].apparentTemperatureMax | number:0}} °</strong>
<span class="medium-text">
<span style="font-size: 18px;">Low:</span> <span style="color:{{tempColors['data-2-min']}};">{{currentWeather.daily.data[2].apparentTemperatureMin | number:0}} °</span>
</span>
<div class="daily-summary">{{currentWeather.daily.data[2].summary}}</div>
<div class='summary'>{{currentWeather.daily.data[2].summary}}</div>
<div class="forecast-item-day">{{currentWeather.daily.data[3].time * 1000 | date:'EEEE'}}</div>
<canvas id="forecastWeatherIcon3" width="80" height="80"></canvas>
<strong style="color:{{tempColors['data-3-max']}};">{{currentWeather.daily.data[3].apparentTemperatureMax | number:0}} °</strong>
<span class="medium-text">
<span style="font-size: 18px;">Low:</span> <span style="color:{{tempColors['data-3-min']}};">{{currentWeather.daily.data[3].apparentTemperatureMin | number:0}} °</span>
</span>
<div class="daily-summary">{{currentWeather.daily.data[3].summary}}</div>
</div>
</div>
<br/>
</div>
<div id="hourly-precipitation" class="row">
<div class="col-sm-1 hourly-time-container" ng-repeat="hourly in hourlyWeather">
<div class="hourly-time" style="background-color: {{hourly.color}};">{{hourly.time*1000 | date:'h a'}}</div>
</div>
</div>
<div id="hourly-summary-container" class="row">
<h4 id="hourly-summary">{{currentWeather.hourly.summary}}</h4>
</div>
<!-- /container -->
</div>
<div id="loading-container" class="row" ng-show='isWeatherLoading'>
<div class="col-md-12">
<h1>Loading...</h1>
</div>
</div>
</body>
</html>