summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authordakkar <dakkar@thenautilus.net>2024-02-03 17:13:21 +0000
committerdakkar <dakkar@thenautilus.net>2024-02-03 17:13:21 +0000
commitfb1e64ec617774c79e86ba157951dc5df0117016 (patch)
tree259c8fbe8fec32cccb7594c0545301816ea01f14
parentnicer icons (diff)
downloadHomePanel-fb1e64ec617774c79e86ba157951dc5df0117016.tar.gz
HomePanel-fb1e64ec617774c79e86ba157951dc5df0117016.tar.bz2
HomePanel-fb1e64ec617774c79e86ba157951dc5df0117016.zip
some colours
-rw-r--r--forecast.html.tt211
1 files changed, 118 insertions, 93 deletions
diff --git a/forecast.html.tt b/forecast.html.tt
index 7b90714..ae3402b 100644
--- a/forecast.html.tt
+++ b/forecast.html.tt
@@ -1,94 +1,119 @@
[%
- USE Number.Format(DECIMAL_DIGITS=1);
- cur = f.currently; today = f.daily.data.0;
- today_start = f.hourly.data.0.time.clone
- today_stop = f.hourly.data.0.time.clone.add('days'=>1);
- hourly = f.hourly.slice('from', today_start, 'to', today_stop);
- MACRO hours_length(span) BLOCK;
- d=span.stop_time.subtract_datetime(span.start_time);
- format_duration(
- 'pattern','%k',
- 'base',span.start_time,
- 'normalize',1).format_duration(d);
- END;
- MACRO time(d) BLOCK;
- d.clone.set_time_zone('Europe/London').strftime('%H:%M');
- END;
- MACRO minsec_until(d) BLOCK;
- dur=d.subtract_datetime(now);
- format_duration(
- 'pattern','%M:%S',
- 'base',now,
- 'normalize',1).format_duration(dur);
- END;
+ USE Number.Format(DECIMAL_DIGITS=1);
+ cur = f.currently; today = f.daily.data.0;
+ today_start = f.hourly.data.0.time.clone
+ today_stop = f.hourly.data.0.time.clone.add('days'=>1);
+ hourly = f.hourly.slice('from', today_start, 'to', today_stop);
+ MACRO hours_length(span) BLOCK;
+ d=span.stop_time.subtract_datetime(span.start_time);
+ format_duration(
+ 'pattern','%k',
+ 'base',span.start_time,
+ 'normalize',1).format_duration(d);
+ END;
+ MACRO time(d) BLOCK;
+ d.clone.set_time_zone('Europe/London').strftime('%H:%M');
+ END;
+ MACRO minsec_until(d) BLOCK;
+ dur=d.subtract_datetime(now);
+ format_duration(
+ 'pattern','%M:%S',
+ 'base',now,
+ 'normalize',1).format_duration(dur);
+ END;
-%]
<html>
<head>
<title>Forecast</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta http-equiv="refresh" content="5" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
<style type="text/css">
- body, table {
- font-size: 30px;
- }
-
- table { border-collapse: collapse; empty-cells: show }
- table td { border: dotted thin black; padding: 3px }
-
- div.forecast dt { display: none }
- div.forecast dd { display: inline; margin: 0; border: 0 }
-
- .icon img {
- width: 2em; height: 2em;
- float: left; margin: 0 5px 5px 0;
- }
-
- div.currently, div.next-hour, div.next-day, div.next-week {
- width: 24%;
- position: absolute; top: 5px;
- }
-
- div.currently { left: 5px }
- div.next-hour { left: 25% }
- div.next-day { left: 50% }
- div.next-week { right: 5px }
-
- div.today {
- position: absolute; top: 8em; left: 5px;
- float: left; clear: none;
- width: 40%;
- margin-right: 5px;
- }
-
- dl.today dt.temperature, dl.today dd.temperature { display: inherit }
- dl.today dt.sunrise, dl.today dt.sunset { display: inline }
-
- div.bus {
- position: absolute; left: 38%; top: 10em;
- }
-
- div.bus td.destination { width: 5em }
-
- div.tube {
- position: absolute; left: 5px; top: 20em;
- width: 75%;
- }
-
- div.tube table { font-size: 75% }
-
- div.tube td.status { width: 8em }
- div.tube td.details { width: 10em }
-
- div.timeline { position: absolute; right: 5px; bottom: 5px; }
- div.timeline table { font-size: 75% }
-
- .stripes {
- text-align: center;
- border: solid thin black;
- }
- .stripes span {
- vertical-align: middle;
- }
+ body, table {
+ font-size: 30px;
+ }
+
+ table { border-collapse: collapse; empty-cells: show }
+ table td { border: dotted thin black; padding: 3px }
+
+ div.forecast dt { display: none }
+ div.forecast dd { display: inline; margin: 0; border: 0 }
+
+ .icon img {
+ height: 2em;
+ float: left; margin: 0 5px 5px 0;
+ }
+
+ div.currently, div.next-hour, div.next-day, div.next-week {
+ width: 24%;
+ position: absolute; top: 5px;
+ }
+
+ div.currently { left: 5px }
+ div.next-hour { left: 25% }
+ div.next-day { left: 50% }
+ div.next-week { right: 5px }
+
+ div.today {
+ position: absolute; top: 8em; left: 5px;
+ float: left; clear: none;
+ width: 40%;
+ margin-right: 5px;
+ }
+
+ dl.today dt.temperature, dl.today dd.temperature { display: inherit }
+ dl.today dt.sunrise, dl.today dt.sunset { display: inline }
+
+ td.line {
+ font-family: sans;
+ font-weight: bold;
+ text-transform: uppercase;
+ text-align: center;
+ }
+
+ div.bus {
+ position: absolute; left: 38%; top: 10em;
+ }
+
+ div.bus td.line { background-color: #DC241F; color: #fff }
+
+ div.bus td.destination { width: 5em }
+
+ div.tube {
+ position: absolute; left: 5px; top: 20em;
+ width: 75%;
+ }
+
+ .bakerloo { background-color: #B26300; color: #fff; }
+ .central { background-color: #DC241F; color: #fff; }
+ .circle { background-color: #FFC80A; color: #fff; }
+ .district { background-color: #007D32; color: #fff; }
+ .dlr { background-color: #00AFAD; color: #fff; }
+ .elizabeth { background-color: #60399E; color: #fff; }
+ .hammersmith-city { background-color: #F589A6; color: #fff; }
+ .jubilee { background-color: #838D93; color: #fff; }
+ .london-overground { background-color: #FA7B05; color: #fff; }
+ .metropolitan { background-color: #9B0058; color: #fff; }
+ .northern { background-color: #000000; color: #fff; }
+ .piccadilly { background-color: #0019A8; color: #fff; }
+ .victoria { background-color: #039BE5; color: #fff; }
+ .waterloo-city { background-color: #76D0BD; color: #fff; }
+
+ div.tube table { font-size: 75% }
+
+ div.tube td.status { width: 8em }
+ div.tube td.details { width: 10em }
+
+ div.timeline { position: absolute; right: 5px; bottom: 5px; }
+ div.timeline table { font-size: 75% }
+
+ .stripes {
+ text-align: center;
+ border: solid thin black;
+ }
+ .stripes span {
+ vertical-align: middle;
+ }
</style>
</head>
<body>
@@ -151,11 +176,11 @@
</thead>
<tbody>
[% FOREACH p IN b.predictions %]
- <tr>
- <td class="line">[% p.lineName %]</td>
- <td class="destination">[% p.destinationName %]</td>
- <td class="eta">[% minsec_until(p.expectedArrival) %]</td>
- </tr>
+ <tr>
+ <td class="line">[% p.lineName %]</td>
+ <td class="destination">[% p.destinationName %]</td>
+ <td class="eta">[% minsec_until(p.expectedArrival) %]</td>
+ </tr>
[% END %]
</tbody>
</table>
@@ -178,11 +203,11 @@
</thead>
<tbody>
[% FOREACH line IN t.lines %]
- <tr>
- <td class="line">[% line.name %]</td>
- <td class="status">[% line.status.statusSeverityDescription %]</td>
- <td class="details">[% line.status.reason %]</td>
- </tr>
+ <tr>
+ <td class="line [% line.id %]">[% line.name %]</td>
+ <td class="status">[% line.status.statusSeverityDescription %]</td>
+ <td class="details">[% line.status.reason %]</td>
+ </tr>
[% END %]
</tbody>
</table>