summaryrefslogtreecommitdiff
path: root/cgi
diff options
context:
space:
mode:
Diffstat (limited to 'cgi')
-rw-r--r--cgi/index.pl5
-rw-r--r--cgi/templates/clean.html.ep46
-rw-r--r--cgi/templates/layouts/default.html.ep151
3 files changed, 131 insertions, 71 deletions
diff --git a/cgi/index.pl b/cgi/index.pl
index f50fec7..6d635c2 100644
--- a/cgi/index.pl
+++ b/cgi/index.pl
@@ -83,6 +83,7 @@ sub handle_request {
for my $result (@results) {
my $platform = ( split( / /, $result->platform ) )[0];
+ my $delay = 0;
if ($via) {
my @route = $result->route;
if ( not( any { $_ =~ m{$via}io } @route ) ) {
@@ -97,6 +98,9 @@ sub handle_request {
if ( $info eq '+0' ) {
$info = undef;
}
+ if ( $info and $info =~ m{ \+ (\d+) }x ) {
+ $delay = $1;
+ }
if ( $hide_low_delay and $info ) {
$info =~ s{ (?: ca\. \s* )? \+ [ 1 2 3 4 ] $ }{}x;
}
@@ -112,6 +116,7 @@ sub handle_request {
destination => $result->destination,
platform => $platform,
info => $info,
+ delay => $delay,
}
);
}
diff --git a/cgi/templates/clean.html.ep b/cgi/templates/clean.html.ep
index 021b7f1..635c3ad 100644
--- a/cgi/templates/clean.html.ep
+++ b/cgi/templates/clean.html.ep
@@ -1,48 +1,48 @@
% if (@{$departures}) {
<div class="displayclean">
+<ul>
% my $i = 0;
% for my $departure (@{$departures}) {
% $i++;
-<div class="display <% if (($i % 2) == 0) { %> separator<% } %>">
-
-<div class="train">
+<li>
+<span class="line">
%= $departure->{train}
-</div>
-
-<div class="destination">
-%= $departure->{destination}
-</div>
-
-<div class="platform">
-%= $departure->{platform}
-</div>
-
-<div class="time">
-%= $departure->{time}
-</div>
-
-<div class="via">
+</span>
+<span class="route">
% my $via_max = @{$departure->{via}};
% my $via_cur = 0;
% for my $stop (@{$departure->{via}}) {
% $via_cur++;
-<span><%= $stop %><% if ($via_cur < $via_max) { %> - <% } %></span>
+<%= $stop %><% if ($via_cur < $via_max) { %> - <% } %>
% }
-</div>
+</span>
+<span class="dest">
+%= $departure->{destination}
+</span>
+<span class="countdown">
+% if ($departure->{delay}) {
+<span class="delay">(+<%= $departure->{delay} %>)</span>
+% }
+</span>
+<span class="time">
+%= $departure->{time}
+</span>
+</li>
+<!--
% if ($departure->{info}) {
<div class="info">
%= $departure->{info}
</div>
% }
-
-</div> <!-- display -->
+-->
% }
-</div> <!-- outer -->
+</ul>
+</div> <!-- displayclean -->
% }
% else {
diff --git a/cgi/templates/layouts/default.html.ep b/cgi/templates/layouts/default.html.ep
index a47a2f7..1f1c952 100644
--- a/cgi/templates/layouts/default.html.ep
+++ b/cgi/templates/layouts/default.html.ep
@@ -20,72 +20,127 @@
}
% }
- div.displayclean div.display {
- font-family: Sans-Serif;
- position: relative;
- margin-bottom: 0;
- margin-top: 0;
- padding-top: 0;
- padding-bottom: 0;
- width: 100%;
- height: 4.4em;
+ div.displayclean {
+ background-color:#F8F8F8;
+ position:absolute;
+ top:5px;
+ left:5px;
+ border-width:1px 2px;
+ width:100%;
+ height:499px;
+ }
+
+ div.displayclean ul {
+ position:absolute;
+ width:100%;
+ background-color:#F8F8F8;
+ top: -3px;
+ left: 0;
+
+ list-style-type:none;
+ margin:0;
+ padding:0;
+ border-width:1px 0 25px;
+ border-style:solid;
+ border-color:#CCCCCC;
}
- div.displayclean div.display div {
- overflow: hidden;
- position: absolute;
- height: 100%;
+ div.displayclean li {
+ height:70px;
+ background-color:#F8F8F8;
+ padding:5px;
+ display:block;
+ border-width:1px 0;
+ border-style:solid;
+ border-color:#CCCCCC;
+ width:95%;
+ position:relative;
}
- div.displayclean div.time {
- left: 0;
- top: 10%;
- height: 1em;
- font-size: 150%;
+ div.displayclean li .line {
+ color:#FFFFFF;
+ background-color:#666666;
+ font-weight:bold;
+ font-size:28px;
+ padding:3px 8px 2px 5px;
+ position:absolute;
+ top:7px;
+ left:1%;
}
- div.displayclean div.train {
- left: 0;
- width: 42%;
- color: #000000;
- font-size: 200%;
- font-weight: bold;
- text-align: right;
+ div.displayclean li .tram {
+ background-color:#CC0000;
}
- div.displayclean div.via {
- top: 57%;
- left: 44%;
+ div.displayclean li .sbahn {
+ background-color:#006E10;
+ -webkit-border-radius: 30px;
+ -moz-border-radius: 30px;
+ border-radius: 30px;
}
- div.displayclean div.via span {
- margin-right: 0.4em;
- font-size: 95%;
- color: #333333;
+ div.displayclean li .ubahn {
+ background-color:#001090;
}
- div.displayclean div.destination {
- left: 44%;
- width: 78%;
- font-size: 200%;
+ div.displayclean li .bus {
+ background-color:#991199;
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+ border-radius: 10px;
}
- div.displayclean div.platform {
- right: 0;
- font-size: 200%;
+ div.displayclean li .route {
+ color:#444444;
+ font-size:21px;
+ position:absolute;
+ top:5px;
+ left:10em;
}
- div.displayclean div.info {
- left: 0;
- top: 57%;
- width: 44%;
- font-size: 80%;
- line-height: 150%;
- color: #dd0000;
+ div.displayclean li .dest {
+ color:#000000;
+ font-weight:bold;
+ font-size:46px;
+ position:absolute;
+ top:23px;
+ left:4.5em;
}
- div.displayclean div.separator {
- border-bottom: 0.1em solid #000066;
+ div.displayclean li .countdown {
+ color:#000000;
+ font-size:48px;
+ position:absolute;
+ right:5px;
+ bottom:2px;
+ }
+
+ div.displayclean li .header {
+ color:#000000;
+ font-size:55px;
+ font-weight:bold;
+ padding-top:8px;
+ border-width-top:0;
+ display:block;
+ text-align:center;
+ }
+
+ div.displayclean li .head {
+ border-bottom-width:0;
+ }
+
+ div.displayclean li .countdown .delay {
+ font-size:38px;
+ color:#FF0000;
+ padding-right:7px;
+ }
+
+ div.displayclean li .time {
+ color:#000000;
+ font-size:24px;
+ position:absolute;
+ right:5px;
+ top:5px;
}
div.displaymulti {