diff options
author | Christian Pointner <equinox@helsinki.at> | 2016-09-29 14:20:54 (GMT) |
---|---|---|
committer | Christian Pointner <equinox@helsinki.at> | 2016-09-29 14:22:52 (GMT) |
commit | db696189e8b0b40878b5d734b0cdf2ff3ac240d5 (patch) | |
tree | 4f66273d7ca5b83f1766269df4c860300daf5705 /www | |
parent | abff311cf69765ce7afebfb1523d37717af88e8e (diff) |
make clock reusable, basic scaffolding for main app
Diffstat (limited to 'www')
-rw-r--r-- | www/index.html | 48 | ||||
-rw-r--r-- | www/js/rhctl.js (renamed from www/js/system.js) | 16 | ||||
-rw-r--r-- | www/nextshows.html | 1 | ||||
-rw-r--r-- | www/styles/clock.css | 52 | ||||
-rw-r--r-- | www/styles/main.css | 44 | ||||
-rw-r--r-- | www/styles/nextshows.css | 5 | ||||
-rw-r--r-- | www/styles/weeks.css | 32 | ||||
-rw-r--r-- | www/weeks.html | 1 |
8 files changed, 97 insertions, 102 deletions
diff --git a/www/index.html b/www/index.html index 3b7c067..f576a6b 100644 --- a/www/index.html +++ b/www/index.html @@ -9,33 +9,41 @@ <link href="/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="/styles/common.css" rel="stylesheet"> + <link href="/styles/clock.css" rel="stylesheet"> <link href="/styles/main.css" rel="stylesheet"> - - <script src="/javascript/react/react.js"></script> - <script src="/javascript/react/react-dom.js"></script> -<!-- - <script src="/javascript/react/react.min.js"></script> - <script src="/javascript/react/react-dom.min.js"></script> ---> - <script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script> - <!-- <script src="/javascript/jquery/jquery.min.js"></script> --> - <!-- <script src="/js/utils.js"></script> --> - <!-- <script src="/js/clock.js"></script> --> + <script src="/javascript/jquery/jquery.min.js"></script> + <script src="/js/utils.js"></script> + <script src="/js/clock.js"></script> + <script src="/js/rhctl.js"></script> </head> <body> - <div id="container"> - <img src="/img/helsinki.png" alt="Radio Helsinki Logo" /> - <h1>Radio Helsinki - Automation Status</h1> + <div id="main" class="container-fluid"> + <div class="row"> + <div id="logo" class="col-md-2 col-md-offset-1"> + <img src="/img/helsinki.png" alt="Radio Helsinki Logo" /> + </div> + <div id="title" class="col-md-5"> + <h1>Radio Helsinki - Automation Status</h1> + </div> + <div class="col-md-2"> + <div id="clock"> + <span class="current-week"></span> + <span class="clock-date"></span> + <span class="clock-time"></span> + </div> + </div> + </div> - <div id="clock"></div> + <div class="row"> + <div id="rhctl" class="col-md-6 col-md-offset-3"> + </div> + </div> </div> - <!-- <script type="text/javascript"> --> - <!-- clock_init(); --> - <!-- </script> --> - <script type="text/babel"> - ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('clock')); + <script type="text/javascript"> + clock_init(); + rhctl_init(); </script> </body> diff --git a/www/js/system.js b/www/js/rhctl.js index 0c7bba6..c70f8ee 100644 --- a/www/js/system.js +++ b/www/js/rhctl.js @@ -21,18 +21,6 @@ 'use strict'; -function system_init() { - $.getJSON( "/rh-bin/activesystem.json", function(data) { - if(data.status == "OK") { - var systemspan = $('#system span.system-name').removeClass().addClass('system-name').addClass('label'); - - if(data.system == "master") { - systemspan.addClass('label-success').text(data.system); - } else if(data.system == "standby") { - systemspan.addClass('label-danger').text(data.system); - } else { - systemspan.addClass('label-default').text("unkown"); - } - } - }); +function rhctl_init() { + $('#rhctl').append($('<h2>').text("coming soon")); } diff --git a/www/nextshows.html b/www/nextshows.html index f668219..a801396 100644 --- a/www/nextshows.html +++ b/www/nextshows.html @@ -6,6 +6,7 @@ <meta name="author" content="Christian Pointner <equinox@helsinki.at>"> <link rel="shortcut icon" href="/img/favicon.ico" /> + <link href="/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="/styles/common.css" rel="stylesheet"> <link href="/styles/nextshows.css" rel="stylesheet"> <script src="/javascript/jquery/jquery.min.js"></script> diff --git a/www/styles/clock.css b/www/styles/clock.css new file mode 100644 index 0000000..9b028e2 --- /dev/null +++ b/www/styles/clock.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/>. + */ + +#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; +} diff --git a/www/styles/main.css b/www/styles/main.css index 5aae273..016b6ff 100644 --- a/www/styles/main.css +++ b/www/styles/main.css @@ -19,52 +19,24 @@ * along with rhrdweb. If not, see <http://www.gnu.org/licenses/>. */ -#clock { +#main { display: block; width: 100%; height: 100%; - vertical-align: middle; - text-align: center; - margin: 0; + margin-top: 100px; } -#clock span { - display:table; - margin:0 auto; +#logo { + margin-top: -60px; } -#clock span.current-week { - margin-top: 1em; - padding: 0.3em 2em; - font-size: 1.2em; +#title h1 { + padding-left: 1em; } -#clock span.clock-date { - padding: 0.2em; +#title h1 { font-weight: bold; - font-size: 1.4em; } -#clock span.clock-time { - padding: 0.2em; - font-weight: bold; - font-size: 1.6em; -} - -#system { - display: block; - width: 100%; - height: 100%; - vertical-align: middle; - text-align: center; - margin-top: 2em; -} - -#system span { - margin-top: 1em; - padding: 0.3em 2em; - font-size: 1.2em; - font-weight: bold; - display:table; - margin:0 auto; +#rhctl { } diff --git a/www/styles/nextshows.css b/www/styles/nextshows.css index 67ae14c..d354c8d 100644 --- a/www/styles/nextshows.css +++ b/www/styles/nextshows.css @@ -35,6 +35,11 @@ body { #clock { padding: 0.1em; + width: 100%; + height: 100%; + vertical-align: middle; + text-align: center; + margin: 0; } #clock span { diff --git a/www/styles/weeks.css b/www/styles/weeks.css index c3b0649..aac76de 100644 --- a/www/styles/weeks.css +++ b/www/styles/weeks.css @@ -28,38 +28,6 @@ margin-top: 10em; } -#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 { display: block; width: 100%; diff --git a/www/weeks.html b/www/weeks.html index 8ca1e7c..4a9241c 100644 --- a/www/weeks.html +++ b/www/weeks.html @@ -8,6 +8,7 @@ <link rel="shortcut icon" href="/img/favicon.ico" /> <link href="/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="/styles/common.css" rel="stylesheet"> + <link href="/styles/clock.css" rel="stylesheet"> <link href="/styles/weeks.css" rel="stylesheet"> <script src="/javascript/jquery/jquery.min.js"></script> <script src="/js/utils.js"></script> |