7 files changed, 214 insertions, 78 deletions
diff --git a/www/index.html b/www/index.html
index 924fe39..f08908e 100644
--- a/www/index.html
+++ b/www/index.html
@@ -6,6 +6,7 @@
   <meta name="author" content="Christian Pointner <equinox@helsinki.at>">
 
   <link rel="shortcut icon" href="/img/favicon.ico" />
+  <link href="/styles/common.css" rel="stylesheet">
   <link href="/styles/main.css" rel="stylesheet">
   <script src="/javascript/jquery/jquery.min.js"></script>
   <script src="/js/utils.js"></script>
diff --git a/www/nextshows.html b/www/nextshows.html
new file mode 100644
index 0000000..8426b9d
--- /dev/null
+++ b/www/nextshows.html
@@ -0,0 +1,31 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+  <title>Coming Up next on Radio Helsinki</title>
+  <meta charset="utf-8">
+  <meta name="author" content="Christian Pointner <equinox@helsinki.at>">
+
+  <link rel="shortcut icon" href="/img/favicon.ico" />
+  <link href="/styles/common.css" rel="stylesheet">
+  <link href="/styles/nextshows.css" rel="stylesheet">
+  <script src="/javascript/jquery/jquery.min.js"></script>
+  <script src="/js/utils.js"></script>
+  <script src="/js/clock.js"></script>
+ </head>
+ <body>
+   <div id="container">
+     <div id="header">
+       <div id="clock">
+         <span class="clock-date"></span>
+         <span class="clock-time"></span>
+         <span class="current-week"></span>
+       </div>
+     </div>
+   </div>
+
+  <script type="text/javascript">
+    clock_init();
+  </script>
+
+ </body>
+</html>
diff --git a/www/styles/common.css b/www/styles/common.css
new file mode 100644
index 0000000..179601f
--- /dev/null
+++ b/www/styles/common.css
@@ -0,0 +1,97 @@
+/*
+ *  rhrdweb
+ *
+ *  Copyright (C) 2016 Christian Pointner <equinox@helsinki.at>
+ *
+ *  This file is part of rhrdweb.
+ *
+ *  rhrdweb is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  any later version.
+ *
+ *  rhrdweb is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with rhrdweb. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+body {
+  background-color: #eee;
+  font-family: Sans-Serif;
+}
+
+#container {
+  text-align: center;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.label {
+  display: inline;
+  padding: .2em .6em .3em;
+  font-size: 75%;
+  font-weight: bold;
+  line-height: 1;
+  color: #ffffff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  border-radius: .25em;
+  position: relative;
+  top: -1px;
+}
+a.label:hover,
+a.label:focus {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+.label:empty {
+  display: none;
+}
+.label-default {
+  background-color: #777777;
+}
+.label-default[href]:hover,
+.label-default[href]:focus {
+  background-color: #5e5e5e;
+}
+.label-primary {
+  background-color: #428bca;
+}
+.label-primary[href]:hover,
+.label-primary[href]:focus {
+  background-color: #3071a9;
+}
+.label-success {
+  background-color: #5cb85c;
+}
+.label-success[href]:hover,
+.label-success[href]:focus {
+  background-color: #449d44;
+}
+.label-info {
+  background-color: #5bc0de;
+}
+.label-info[href]:hover,
+.label-info[href]:focus {
+  background-color: #31b0d5;
+}
+.label-warning {
+  background-color: #f0ad4e;
+}
+.label-warning[href]:hover,
+.label-warning[href]:focus {
+  background-color: #ec971f;
+}
+.label-danger {
+  background-color: #d9534f;
+}
+.label-danger[href]:hover,
+.label-danger[href]:focus {
+  background-color: #c9302c;
+}
diff --git a/www/styles/main.css b/www/styles/main.css
index 638f4d2..5aae273 100644
--- a/www/styles/main.css
+++ b/www/styles/main.css
@@ -19,17 +19,6 @@
  *  along with rhrdweb. If not, see <http://www.gnu.org/licenses/>.
  */
 
-body {
-  background-color: #eee;
-  font-family: Sans-Serif;
-}
-
-#container {
-  text-align: center;
-  margin-left: auto;
-  margin-right: auto;
-}
-
 #clock {
   display: block;
   width: 100%;
@@ -79,69 +68,3 @@ body {
   display:table;
   margin:0 auto;
 }
-
-.label {
-  display: inline;
-  padding: .2em .6em .3em;
-  font-size: 75%;
-  font-weight: bold;
-  line-height: 1;
-  color: #ffffff;
-  text-align: center;
-  white-space: nowrap;
-  vertical-align: baseline;
-  border-radius: .25em;
-  position: relative;
-  top: -1px;
-}
-a.label:hover,
-a.label:focus {
-  color: #ffffff;
-  text-decoration: none;
-  cursor: pointer;
-}
-.label:empty {
-  display: none;
-}
-.label-default {
-  background-color: #777777;
-}
-.label-default[href]:hover,
-.label-default[href]:focus {
-  background-color: #5e5e5e;
-}
-.label-primary {
-  background-color: #428bca;
-}
-.label-primary[href]:hover,
-.label-primary[href]:focus {
-  background-color: #3071a9;
-}
-.label-success {
-  background-color: #5cb85c;
-}
-.label-success[href]:hover,
-.label-success[href]:focus {
-  background-color: #449d44;
-}
-.label-info {
-  background-color: #5bc0de;
-}
-.label-info[href]:hover,
-.label-info[href]:focus {
-  background-color: #31b0d5;
-}
-.label-warning {
-  background-color: #f0ad4e;
-}
-.label-warning[href]:hover,
-.label-warning[href]:focus {
-  background-color: #ec971f;
-}
-.label-danger {
-  background-color: #d9534f;
-}
-.label-danger[href]:hover,
-.label-danger[href]:focus {
-  background-color: #c9302c;
-}
diff --git a/www/styles/nextshows.css b/www/styles/nextshows.css
new file mode 100644
index 0000000..9199b99
--- /dev/null
+++ b/www/styles/nextshows.css
@@ -0,0 +1,52 @@
+/*
+ *  rhrdweb
+ *
+ *  Copyright (C) 2016 Christian Pointner <equinox@helsinki.at>
+ *
+ *  This file is part of rhrdweb.
+ *
+ *  rhrdweb is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  any later version.
+ *
+ *  rhrdweb is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with rhrdweb. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+body, #container {
+  margin: 0;
+  padding: 0;
+  font-size: 42px;
+}
+
+#header {
+  background-color: #101010;
+  width: 100%;
+  margin: 0;
+  padding: 0.5em;
+  color: white;
+}
+
+#clock span {
+  font-size: 1.2em;
+}
+
+#clock span.current-week {
+  display: none;
+}
+
+#clock span.clock-date {
+  padding: 0.1em;
+  font-weight: bold;
+}
+
+#clock span.clock-time {
+  padding: 0.1em;
+  font-weight: bold;
+}
diff --git a/www/styles/weeks.css b/www/styles/weeks.css
index 5536059..634da59 100644
--- a/www/styles/weeks.css
+++ b/www/styles/weeks.css
@@ -27,6 +27,38 @@
   margin-bottom: 5em;
 }
 
+#clock {
+  display: block;
+  width: 100%;
+  height: 100%;
+  vertical-align: middle;
+  text-align: center;
+  margin: 0;
+}
+
+#clock span {
+  display:table;
+  margin:0 auto;
+}
+
+#clock span.current-week {
+  margin-top: 1em;
+  padding: 0.3em 2em;
+  font-size: 1.2em;
+}
+
+#clock span.clock-date {
+  padding: 0.2em;
+  font-weight: bold;
+  font-size: 1.4em;
+}
+
+#clock span.clock-time {
+  padding: 0.2em;
+  font-weight: bold;
+  font-size: 1.6em;
+}
+
 #buttons {
   margin-top: 3em;
 }
diff --git a/www/weeks.html b/www/weeks.html
index 56880d7..53e2dbf 100644
--- a/www/weeks.html
+++ b/www/weeks.html
@@ -6,7 +6,7 @@
   <meta name="author" content="Christian Pointner <equinox@helsinki.at>">
 
   <link rel="shortcut icon" href="/img/favicon.ico" />
-  <link href="/styles/main.css" rel="stylesheet">
+  <link href="/styles/common.css" rel="stylesheet">
   <link href="/styles/weeks.css" rel="stylesheet">
   <script src="/javascript/jquery/jquery.min.js"></script>
   <script src="/js/utils.js"></script>