Infobeamer rC3 2021 - WiP
This commit is contained in:
Ral
parent
b377d00af3
commit
ea5f956e3d
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,308 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="robots" content="noindex, noarchive">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<title>Transfonter demo</title>
|
||||
<link href="stylesheet.css" rel="stylesheet">
|
||||
<style>
|
||||
/*
|
||||
http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
/* demo styles */
|
||||
body {
|
||||
background: #f0f0f0;
|
||||
color: #000;
|
||||
}
|
||||
.page {
|
||||
background: #fff;
|
||||
width: 920px;
|
||||
margin: 0 auto;
|
||||
padding: 20px 20px 0 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.font-container {
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
margin-bottom: 40px;
|
||||
line-height: 1.3;
|
||||
white-space: nowrap;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
h1 {
|
||||
position: relative;
|
||||
background: #444;
|
||||
font-size: 32px;
|
||||
color: #fff;
|
||||
padding: 10px 20px;
|
||||
margin: 0 -20px 12px -20px;
|
||||
}
|
||||
.letters {
|
||||
font-size: 25px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.s10:before {
|
||||
content: '10px';
|
||||
}
|
||||
.s11:before {
|
||||
content: '11px';
|
||||
}
|
||||
.s12:before {
|
||||
content: '12px';
|
||||
}
|
||||
.s14:before {
|
||||
content: '14px';
|
||||
}
|
||||
.s18:before {
|
||||
content: '18px';
|
||||
}
|
||||
.s24:before {
|
||||
content: '24px';
|
||||
}
|
||||
.s30:before {
|
||||
content: '30px';
|
||||
}
|
||||
.s36:before {
|
||||
content: '36px';
|
||||
}
|
||||
.s48:before {
|
||||
content: '48px';
|
||||
}
|
||||
.s60:before {
|
||||
content: '60px';
|
||||
}
|
||||
.s72:before {
|
||||
content: '72px';
|
||||
}
|
||||
.s10:before, .s11:before, .s12:before, .s14:before,
|
||||
.s18:before, .s24:before, .s30:before, .s36:before,
|
||||
.s48:before, .s60:before, .s72:before {
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 10px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
color: #999;
|
||||
padding-right: 6px;
|
||||
}
|
||||
pre {
|
||||
display: block;
|
||||
padding: 9px;
|
||||
margin: 0 0 12px;
|
||||
font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
|
||||
font-size: 13px;
|
||||
line-height: 1.428571429;
|
||||
color: #333;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #ccc;
|
||||
overflow-x: auto;
|
||||
border-radius: 4px;
|
||||
}
|
||||
/* responsive */
|
||||
@media (max-width: 959px) {
|
||||
.page {
|
||||
width: auto;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="page">
|
||||
<div class="demo">
|
||||
<h1 style="font-family: 'Changa'; font-weight: 500; font-style: normal;">Changa Medium</h1>
|
||||
<pre title="Usage">.your-style {
|
||||
font-family: 'Changa';
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
}</pre>
|
||||
<pre title="Preload (optional)">
|
||||
<link rel="preload" href="Changa-Medium.woff2" as="font" type="font/woff2" crossorigin></pre>
|
||||
<div class="font-container" style="font-family: 'Changa'; font-weight: 500; font-style: normal;">
|
||||
<p class="letters">
|
||||
abcdefghijklmnopqrstuvwxyz<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
0123456789.:,;()*!?'@#<>$%&^+-=~
|
||||
</p>
|
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="demo">
|
||||
<h1 style="font-family: 'Space Mono'; font-weight: normal; font-style: normal;">Space Mono</h1>
|
||||
<pre title="Usage">.your-style {
|
||||
font-family: 'Space Mono';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}</pre>
|
||||
<pre title="Preload (optional)">
|
||||
<link rel="preload" href="SpaceMono-Regular.woff2" as="font" type="font/woff2" crossorigin></pre>
|
||||
<div class="font-container" style="font-family: 'Space Mono'; font-weight: normal; font-style: normal;">
|
||||
<p class="letters">
|
||||
abcdefghijklmnopqrstuvwxyz<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
0123456789.:,;()*!?'@#<>$%&^+-=~
|
||||
</p>
|
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="demo">
|
||||
<h1 style="font-family: 'Space Mono'; font-weight: bold; font-style: italic;">Space Mono Bold Italic</h1>
|
||||
<pre title="Usage">.your-style {
|
||||
font-family: 'Space Mono';
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}</pre>
|
||||
<pre title="Preload (optional)">
|
||||
<link rel="preload" href="SpaceMono-BoldItalic.woff2" as="font" type="font/woff2" crossorigin></pre>
|
||||
<div class="font-container" style="font-family: 'Space Mono'; font-weight: bold; font-style: italic;">
|
||||
<p class="letters">
|
||||
abcdefghijklmnopqrstuvwxyz<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
0123456789.:,;()*!?'@#<>$%&^+-=~
|
||||
</p>
|
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="demo">
|
||||
<h1 style="font-family: 'Space Mono'; font-weight: bold; font-style: normal;">Space Mono Bold</h1>
|
||||
<pre title="Usage">.your-style {
|
||||
font-family: 'Space Mono';
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}</pre>
|
||||
<pre title="Preload (optional)">
|
||||
<link rel="preload" href="SpaceMono-Bold.woff2" as="font" type="font/woff2" crossorigin></pre>
|
||||
<div class="font-container" style="font-family: 'Space Mono'; font-weight: bold; font-style: normal;">
|
||||
<p class="letters">
|
||||
abcdefghijklmnopqrstuvwxyz<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
0123456789.:,;()*!?'@#<>$%&^+-=~
|
||||
</p>
|
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="demo">
|
||||
<h1 style="font-family: 'Changa'; font-weight: 600; font-style: normal;">Changa SemiBold</h1>
|
||||
<pre title="Usage">.your-style {
|
||||
font-family: 'Changa';
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}</pre>
|
||||
<pre title="Preload (optional)">
|
||||
<link rel="preload" href="Changa-SemiBold.woff2" as="font" type="font/woff2" crossorigin></pre>
|
||||
<div class="font-container" style="font-family: 'Changa'; font-weight: 600; font-style: normal;">
|
||||
<p class="letters">
|
||||
abcdefghijklmnopqrstuvwxyz<br>
|
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
|
||||
0123456789.:,;()*!?'@#<>$%&^+-=~
|
||||
</p>
|
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,45 +0,0 @@
|
|||
@font-face {
|
||||
font-family: 'Changa';
|
||||
src: url('Changa-Medium.woff2') format('woff2'),
|
||||
url('Changa-Medium.woff') format('woff');
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Space Mono';
|
||||
src: url('SpaceMono-Regular.woff2') format('woff2'),
|
||||
url('SpaceMono-Regular.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Space Mono';
|
||||
src: url('SpaceMono-BoldItalic.woff2') format('woff2'),
|
||||
url('SpaceMono-BoldItalic.woff') format('woff');
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Space Mono';
|
||||
src: url('SpaceMono-Bold.woff2') format('woff2'),
|
||||
url('SpaceMono-Bold.woff') format('woff');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Changa';
|
||||
src: url('Changa-SemiBold.woff2') format('woff2'),
|
||||
url('Changa-SemiBold.woff') format('woff');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
163
public/index.css
163
public/index.css
|
|
@ -1,163 +0,0 @@
|
|||
/*
|
||||
* This is free and unencumbered software released into the public domain.
|
||||
*
|
||||
* Anyone is free to copy, modify, publish, use, compile, sell, or
|
||||
* distribute this software, either in source code form or as a compiled
|
||||
* binary, for any purpose, commercial or non-commercial, and by any
|
||||
* means.
|
||||
*
|
||||
* In jurisdictions that recognize copyright laws, the author or authors
|
||||
* of this software dedicate any and all copyright interest in the
|
||||
* software to the public domain. We make this dedication for the benefit
|
||||
* of the public at large and to the detriment of our heirs and
|
||||
* successors. We intend this dedication to be an overt act of
|
||||
* relinquishment in perpetuity of all present and future rights to this
|
||||
* software under copyright law.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||
* IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
|
||||
* OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
|
||||
* ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||
* OTHER DEALINGS IN THE SOFTWARE.
|
||||
*
|
||||
* For more information, please refer to <http://unlicense.org/>
|
||||
*/
|
||||
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
background: #000;
|
||||
color: #FFF;
|
||||
font-family: 'Orbitron';
|
||||
text-shadow: 3px 3px #000;
|
||||
}
|
||||
|
||||
/* === FAHRPLAN === */
|
||||
#schedule {
|
||||
position: fixed;
|
||||
left: 5%;
|
||||
right: 5%;
|
||||
top: 10%;
|
||||
bottom: 10%;
|
||||
|
||||
font-family: 'Orbitron';
|
||||
font-size: 34px;
|
||||
}
|
||||
|
||||
#schedule .header {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
#schedule .list .item {
|
||||
margin-bottom: 10px;
|
||||
border-left: 5px solid #7b7b7b;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#schedule .list .item .title {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#schedule .list .item .sub {
|
||||
color: #cbcbcb;
|
||||
font-size: 26px;
|
||||
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#schedule-here-container, #schedule-main-container, #schedule-other-container {
|
||||
background-color: rgba(10, 10, 10, 0.5);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
#schedule-here-container {
|
||||
position: absolute;
|
||||
right: 52%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
#schedule-main-container {
|
||||
position: absolute;
|
||||
right: 52%;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
#schedule-other-container {
|
||||
position: absolute;
|
||||
left: 52%;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
#schedule-here-container .header {
|
||||
color: #b145fb;
|
||||
}
|
||||
#schedule-main-container .header {
|
||||
color: #6820e4;
|
||||
}
|
||||
#schedule-other-container .header {
|
||||
color: #45b5e3;
|
||||
}
|
||||
|
||||
|
||||
/* === TICKER === */
|
||||
#bottom-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
margin-bottom: 20px;
|
||||
font-size: 14px;
|
||||
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#ticker-wrap {
|
||||
width: 100%;
|
||||
padding-left: 100%; /* Push contents to right side of screen */
|
||||
}
|
||||
|
||||
@keyframes ticker {
|
||||
0% { transform: translate3d(-20%, 0, 0); }
|
||||
100% { transform: translate3d(-100%, 0, 0); }
|
||||
}
|
||||
|
||||
#ticker {
|
||||
/* Basically move items from right side of screen to left in infinite loop */
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
padding-right: 100%;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
animation-name: ticker;
|
||||
animation-duration: 120s;
|
||||
}
|
||||
|
||||
#ticker > .item{
|
||||
display: inline-block; /* Lay items in a horizontal line */
|
||||
padding: 10px 36px;
|
||||
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
#ticker > .item > img {
|
||||
height: 32px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#ticker > .item > span.user {
|
||||
color: #fff;
|
||||
margin: 0 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#ticker > .item > span.content {
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
|
@ -1,72 +1,16 @@
|
|||
<!--
|
||||
This is free and unencumbered software released into the public domain.
|
||||
|
||||
Anyone is free to copy, modify, publish, use, compile, sell, or
|
||||
distribute this software, either in source code form or as a compiled
|
||||
binary, for any purpose, commercial or non-commercial, and by any
|
||||
means.
|
||||
|
||||
In jurisdictions that recognize copyright laws, the author or authors
|
||||
of this software dedicate any and all copyright interest in the
|
||||
software to the public domain. We make this dedication for the benefit
|
||||
of the public at large and to the detriment of our heirs and
|
||||
successors. We intend this dedication to be an overt act of
|
||||
relinquishment in perpetuity of all present and future rights to this
|
||||
software under copyright law.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||
IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
|
||||
OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
|
||||
ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||
OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
||||
For more information, please refer to <http://unlicense.org/>
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!doctype html><html lang=en>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" href="favicon.ico">
|
||||
<link rel="stylesheet" href="index.css">
|
||||
<!--<script src="recent.js"></script>-->
|
||||
<title>rC3 Stream Overlay</title>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="width=device-width,initial-scale=1,shrink-to-fit=no">
|
||||
<title>rC3 NOWHERE</title>
|
||||
<link rel=stylesheet href=https://infobeamer.montage2.de/main.min.98d83e9b389cfb42e02b6dc50f4985bde2bd17d3359d391d6154c0a69918bfc0.css>
|
||||
<script src=https://infobeamer.montage2.de/js/config.a954e77ac7f60b43bb37f71a04934bbf522575b4b8bbc6e214d7b0371e2c81a4.js integrity="sha256-qVTnesf2C0O7N/caBJNLv1IldbS4u8biFNewNx4sgaQ="></script>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div id="schedule">
|
||||
<div id="schedule-here-container">
|
||||
<div class="header">
|
||||
Next up here:
|
||||
</div>
|
||||
<div class="list" id="schedule-here">
|
||||
</div>
|
||||
</div>
|
||||
<div id="schedule-main-container">
|
||||
<div class="header">
|
||||
Next up on Main:
|
||||
</div>
|
||||
<div class="list" id="schedule-main">
|
||||
</div>
|
||||
</div>
|
||||
<div id="schedule-other-container">
|
||||
<div class="header">
|
||||
Next up on other channels:
|
||||
</div>
|
||||
<div class="list" id="schedule-other">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="bottom-bar" class="visible">
|
||||
<div id="ticker-wrap">
|
||||
<div id="ticker">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<main id=main>
|
||||
</main>
|
||||
|
||||
<script src="index.js"></script>
|
||||
<script src=https://infobeamer.montage2.de/js/preact/preact.min.0c204e20934f1e09cfe86fbcf1d069d842f988fc71efe3a923021c08892c71c8.js integrity="sha256-DCBOIJNPHgnP6G+88dBp2EL5iPxx7+OpIwIcCIksccg="></script>
|
||||
<script src=https://infobeamer.montage2.de/js/htm/htm.80e39afe20fd61183412eda89efa10532d57945e6364642aceacd50eb2384b4b.js integrity="sha256-gOOa/iD9YRg0Eu2onvoQUy1XlF5jZGQqzqzVDrI4S0s="></script>
|
||||
<script src=https://infobeamer.montage2.de/main.a55a1f2e9cf4680a90c5ba10a56774cc3eb771e1ac4d87608327474e6bc0b664.js integrity="sha256-pVofLpz0aAqQxboQpWd0zD63ceGsTYdggydHTmvAtmQ=" type=module></script>
|
||||
</body>
|
||||
</html>
|
||||
203
public/index.js
203
public/index.js
|
|
@ -1,203 +0,0 @@
|
|||
/*
|
||||
* This is free and unencumbered software released into the public domain.
|
||||
*
|
||||
* Anyone is free to copy, modify, publish, use, compile, sell, or
|
||||
* distribute this software, either in source code form or as a compiled
|
||||
* binary, for any purpose, commercial or non-commercial, and by any
|
||||
* means.
|
||||
*
|
||||
* In jurisdictions that recognize copyright laws, the author or authors
|
||||
* of this software dedicate any and all copyright interest in the
|
||||
* software to the public domain. We make this dedication for the benefit
|
||||
* of the public at large and to the detriment of our heirs and
|
||||
* successors. We intend this dedication to be an overt act of
|
||||
* relinquishment in perpetuity of all present and future rights to this
|
||||
* software under copyright law.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
|
||||
* IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
|
||||
* OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
|
||||
* ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
||||
* OTHER DEALINGS IN THE SOFTWARE.
|
||||
*
|
||||
* For more information, please refer to <http://unlicense.org/>
|
||||
*/
|
||||
|
||||
|
||||
var channel_here = "407d1fb0-068d-4605-99e8-435fe599bd10";
|
||||
var channel_main_1 = "rC1";
|
||||
var channel_main_2 = "rC2";
|
||||
|
||||
// Not included in Frab XML
|
||||
slug_map = {
|
||||
bitwaescherei: "feb91cb1-eb66-43f1-a86f-f8d43909fbe0",
|
||||
c3lounge: "ffa2f0d2-ca0b-41b6-a5cc-78ffc3fe15ff",
|
||||
chaoszone: "084fed6f-8da2-4870-b8c2-7a2b1dce88bd",
|
||||
csh: "ebc42052-10f7-4aef-bbe9-cfe9026880cc",
|
||||
cwtv: "48f5bce3-5b46-44d8-9f36-90bed9bd4be0",
|
||||
hacc: "60dd7f55-9f88-4de6-ad98-b9c4e2810300",
|
||||
r3s: "c4a577e2-52e7-4f6f-a5c0-e3822d64f84a",
|
||||
sendezentrum: "feb91cb1-eb66-43f1-a86f-f8d43909fbe0",
|
||||
}
|
||||
|
||||
var fahrplan = {};
|
||||
var tweets = {};
|
||||
|
||||
/* === EXTERNAL DATA === */
|
||||
function update_tweets() {
|
||||
var request = new XMLHttpRequest();
|
||||
request.open('GET', 'tweets-rc3.json', true);
|
||||
request.onload = function() {
|
||||
if (this.status >= 200 && this.status < 400) {
|
||||
tweets = JSON.parse(this.response);
|
||||
update_tweet_ticker();
|
||||
} else { console.log(this); }
|
||||
};
|
||||
request.onerror = function(e) { console.log(e); };
|
||||
request.send();
|
||||
}
|
||||
|
||||
function update_fahrplan() {
|
||||
var request = new XMLHttpRequest();
|
||||
request.open('GET', 'fahrplan.json', true);
|
||||
request.onload = function() {
|
||||
if (this.status >= 200 && this.status < 400) {
|
||||
fahrplan = JSON.parse(this.response);
|
||||
update_fahrplan_html();
|
||||
} else { console.log(this); }
|
||||
};
|
||||
request.onerror = function(e) { console.log(e); };
|
||||
request.send();
|
||||
}
|
||||
|
||||
/* === FAHRPLAN === */
|
||||
var n_here = 3;
|
||||
var n_main = 3;
|
||||
var n_other = 8;
|
||||
|
||||
function parse_schedule() {
|
||||
var fahrplan_parsed = {
|
||||
"here": [],
|
||||
"main": [],
|
||||
"other": [],
|
||||
}
|
||||
|
||||
for (var i in fahrplan) {
|
||||
if (fahrplan_parsed.here.length < n_here
|
||||
&& (fahrplan[i].roomguid == channel_here || fahrplan[i].room == channel_here)) {
|
||||
fahrplan_parsed.here.push({
|
||||
title: fahrplan[i].title,
|
||||
sub: fahrplan[i].start + " D" + fahrplan[i].day + ", " + fahrplan[i].personnames,
|
||||
});
|
||||
} else if (fahrplan_parsed.main.length < n_main
|
||||
&& (fahrplan[i].roomguid == channel_main_1 || fahrplan[i].room == channel_main_1
|
||||
|| fahrplan[i].roomguid == channel_main_2 || fahrplan[i].room == channel_main_2)) {
|
||||
fahrplan_parsed.main.push({
|
||||
title: fahrplan[i].title,
|
||||
sub: fahrplan[i].start + " D" + fahrplan[i].day + " @ " + fahrplan[i].room + ", " + fahrplan[i].personnames,
|
||||
});
|
||||
} else if (fahrplan_parsed.other.length < n_other
|
||||
&& fahrplan[i].roomguid != channel_here && fahrplan[i].room != channel_here
|
||||
&& fahrplan[i].roomguid != channel_main_1 && fahrplan[i].room != channel_main_1
|
||||
&& fahrplan[i].roomguid != channel_main_2 && fahrplan[i].room != channel_main_2) {
|
||||
fahrplan_parsed.other.push({
|
||||
title: fahrplan[i].title,
|
||||
sub: fahrplan[i].start + " D" + fahrplan[i].day + " @ " + fahrplan[i].room,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return fahrplan_parsed;
|
||||
}
|
||||
|
||||
function update_fahrplan_html() {
|
||||
fahrplan_parsed = parse_schedule();
|
||||
var els = {
|
||||
here: document.getElementById("schedule-here"),
|
||||
main: document.getElementById("schedule-main"),
|
||||
other: document.getElementById("schedule-other"),
|
||||
}
|
||||
|
||||
els.here.innerHTML = "";
|
||||
els.main.innerHTML = "";
|
||||
els.other.innerHTML = "";
|
||||
|
||||
for (var group in els) {
|
||||
for (var i in fahrplan_parsed[group]) {
|
||||
var el = document.createElement("div");
|
||||
el.className = "item";
|
||||
|
||||
var title = document.createElement("div");
|
||||
title.className = "title";
|
||||
title.innerText = fahrplan_parsed[group][i].title;
|
||||
el.appendChild(title);
|
||||
|
||||
var sub = document.createElement("div");
|
||||
sub.className = "sub";
|
||||
sub.innerText = fahrplan_parsed[group][i].sub;
|
||||
el.appendChild(sub);
|
||||
|
||||
els[group].appendChild(el);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* === TWEETS === */
|
||||
function update_tweet_ticker() {
|
||||
var ticker = document.getElementById("ticker");
|
||||
ticker.innerHTML = "";
|
||||
for (var i in tweets.data) {
|
||||
//console.log(tweets.data[i].text);
|
||||
var item = document.createElement("div");
|
||||
item.className = "item";
|
||||
|
||||
// Look up user
|
||||
var user;
|
||||
for (var useri in tweets.includes.users) {
|
||||
if (tweets.includes.users[useri].id == tweets.data[i].author_id)
|
||||
user = tweets.includes.users[useri];
|
||||
}
|
||||
|
||||
var img = document.createElement("img");
|
||||
img.src = user.profile_image_url;
|
||||
item.appendChild(img);
|
||||
|
||||
var user_el = document.createElement("span");
|
||||
user_el.className = "user";
|
||||
var uname = user.username;
|
||||
user_el.innerText = "@" + uname + ":";
|
||||
item.appendChild(user_el);
|
||||
|
||||
var content = document.createElement("span");
|
||||
content.className = "content";
|
||||
var text = tweets.data[i].text;
|
||||
text = text.replace(/\n/g, "↲");
|
||||
content.innerText = text;
|
||||
item.appendChild(content);
|
||||
|
||||
ticker.appendChild(item);
|
||||
}
|
||||
}
|
||||
|
||||
(function() {
|
||||
var query = location.search.substr(1);
|
||||
var result = {};
|
||||
query.split("&").forEach(function(part) {
|
||||
var item = part.split("=");
|
||||
result[item[0]] = decodeURIComponent(item[1]);
|
||||
});
|
||||
|
||||
if (result.room !== undefined)
|
||||
channel_here = result.room;
|
||||
|
||||
if (slug_map[channel_here] !== undefined)
|
||||
channel_here = slug_map[channel_here];
|
||||
|
||||
update_fahrplan();
|
||||
update_tweets();
|
||||
setInterval(update_fahrplan,60000);
|
||||
setInterval(update_tweets, 60000);
|
||||
})();
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
(() => {
|
||||
// <stdin>
|
||||
window.infoBeamerConfig = /* @__PURE__ */ new Map();
|
||||
window.infoBeamerConfig.set("workerBaseURL", "/");
|
||||
window.infoBeamerConfig.set("scheduleURL", "/fahrplan.json");
|
||||
window.infoBeamerConfig.set("scheduleFetchInterval", 10);
|
||||
window.infoBeamerConfig.set("twitterURL", "/tweets-rc3.json");
|
||||
window.infoBeamerConfig.set("twitterFetchInterval", 60);
|
||||
window.infoBeamerConfig.set("musicURL", "/music.json");
|
||||
window.infoBeamerConfig.set("musicFetchInterval", 60);
|
||||
console.log("Info Beamer Configuration: ");
|
||||
console.log(window.infoBeamerConfig);
|
||||
})();
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
let fetchType;
|
||||
let fetchInterval;
|
||||
let fetchURL;
|
||||
|
||||
|
||||
onmessage = function(e) {
|
||||
let msgType = e.data.msgType;
|
||||
|
||||
fetchType = e.data.fetchType;
|
||||
fetchURL = e.data.fetchURL;
|
||||
fetchInterval = 1000 * e.data.fetchInterval;
|
||||
|
||||
console.log("Configiuration Message:");
|
||||
console.log(' Fetch type: ' + fetchType);
|
||||
console.log(' Using fetch url: ' + fetchURL);
|
||||
console.log(' Fetching data each [ms]: ' + fetchInterval);
|
||||
};
|
||||
|
||||
|
||||
function doFetch() {
|
||||
let now = new Date();
|
||||
|
||||
if (fetchURL) {
|
||||
fetch(fetchURL).then(
|
||||
b => b.json()).then(
|
||||
j => postMessage({msgType: fetchType,
|
||||
json: j,
|
||||
timestamp: now}))
|
||||
.catch(e => console.log(e.message));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Periodic resource fetching
|
||||
(function periodicFetch() {
|
||||
doFetch();
|
||||
setTimeout(periodicFetch, fetchInterval);
|
||||
})();
|
||||
|
|
@ -0,0 +1 @@
|
|||
!function(){var n=function(t,e,s,u){var r;e[0]=0;for(var h=1;h<e.length;h++){var p=e[h++],a=e[h]?(e[0]|=p?1:2,s[e[h++]]):e[++h];3===p?u[0]=a:4===p?u[1]=Object.assign(u[1]||{},a):5===p?(u[1]=u[1]||{})[e[++h]]=a:6===p?u[1][e[++h]]+=a+"":p?(r=t.apply(a,n(t,a,s,["",null])),u.push(r),a[0]?e[0]|=2:(e[h-2]=0,e[h]=r)):u.push(a)}return u},t=new Map,e=function(e){var s=t.get(this);return s||(s=new Map,t.set(this,s)),(s=n(this,s.get(e)||(s.set(e,s=function(n){for(var t,e,s=1,u="",r="",h=[0],p=function(n){1===s&&(n||(u=u.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?h.push(0,n,u):3===s&&(n||u)?(h.push(3,n,u),s=2):2===s&&"..."===u&&n?h.push(4,n,0):2===s&&u&&!n?h.push(5,0,!0,u):s>=5&&((u||!n&&5===s)&&(h.push(s,0,u,e),s=6),n&&(h.push(s,n,0,e),s=6)),u=""},a=0;a<n.length;a++){a&&(1===s&&p(),p(a));for(var o=0;o<n[a].length;o++)t=n[a][o],1===s?"<"===t?(p(),h=[h],s=3):u+=t:4===s?"--"===u&&">"===t?(s=1,u=""):u=t+u[0]:r?t===r?r="":u+=t:'"'===t||"'"===t?r=t:">"===t?(p(),s=1):s&&("="===t?(s=5,e=u,u=""):"/"===t&&(s<5||">"===n[a][o+1])?(p(),3===s&&(h=h[0]),s=h,(h=h[0]).push(2,0,s),s=0):" "===t||"\t"===t||"\n"===t||"\r"===t?(p(),s=2):u+=t),3===s&&"!--"===u&&(s=4,h=h[0])}return p(),h}(e)),s),arguments,[])).length>1?s:s[0]};"undefined"!=typeof module?module.exports=e:self.htm=e}();
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,45 @@
|
|||
let scheduleFetchInterval;
|
||||
let scheduleURL;
|
||||
|
||||
|
||||
onmessage = function(e) {
|
||||
let msgType = e.data.msgType;
|
||||
|
||||
if (msgType === "ScheduleFetchConfig") {
|
||||
scheduleURL = e.data.scheduleURL;
|
||||
scheduleFetchInterval = 1000 * e.data.scheduleFetchInterval;
|
||||
|
||||
console.log("Message: " + msgType);
|
||||
console.log('Using schedule url: ' + scheduleURL);
|
||||
console.log('Fetching data each [ms]: ' + scheduleFetchInterval);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function scheduleFetch() {
|
||||
let now = new Date();
|
||||
|
||||
if (scheduleURL) {
|
||||
fetch(scheduleURL).then(
|
||||
b => b.json()).then(
|
||||
j => postMessage({msgType: "ScheduleUpdate",
|
||||
schedule: j,
|
||||
timestamp: now}))
|
||||
.catch(e => console.log(e.message));
|
||||
}
|
||||
// TODO: Hook up schedule processing functions
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// TODO: Fix run once and then periodic
|
||||
scheduleFetch();
|
||||
|
||||
(function periodicScheduleFetch() {
|
||||
setTimeout(function() {
|
||||
scheduleFetch();
|
||||
periodicScheduleFetch();
|
||||
}, scheduleFetchInterval);
|
||||
})();
|
||||
|
|
@ -0,0 +1,189 @@
|
|||
"use strict";
|
||||
(() => {
|
||||
// ns-hugo:/home/raoul-web/rc3_2021/html-infobeamer-content/assets/js/dom.js
|
||||
var html = htm.bind(preact.h);
|
||||
var schedule_meta_here_dom = (schedule) => {
|
||||
let inner = html`${schedule.map((talk) => html`
|
||||
<div class="talk-here-meta-box">
|
||||
<div class="speaker">${talk.personnames}:</div>
|
||||
<div class="title">${talk.title}</div>
|
||||
<div class="start-duration">
|
||||
<span class="start">Starting at ${talk.start}</span>
|
||||
<span class="duration">Duration: ${talk.duration} minutes</span>
|
||||
</div>
|
||||
</div>
|
||||
`)}`;
|
||||
return inner;
|
||||
};
|
||||
var schedule_abstract_here_dom = (schedule) => {
|
||||
let inner = html``;
|
||||
let placeHolder = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec ut urna. Curabitur lorem risus, sagittis vitae, accumsan a, iaculis id, metus. Suspendisse potenti. Fusce nonummy commodo dui. Fusce venenatis ligula in pede. Aliquam velit dui, commodo quis, porttitor eget, convallis et, nisi. Nam sed nisl nec elit suscipit ullamcorper. Cras ac enim vel dui vestibulum suscipit. Suspendisse venenatis. Nam pharetra. Pellentesque et arcu. Nam sed nisl nec elit suscipit ullamcorper. Aenean turpis ipsum, rhoncus vitae, posuere vitae, euismod sed, ligula. Integer risus velit, facilisis eget, viverra et, venenatis id, leo. Aenean ligula. Mauris sed nulla quis nisi interdum tempor. Nullam libero nunc, tristique eget, laoreet eu, sagittis id, ante. Aliquam sed erat. Vestibulum viverra varius enim. Donec at diam a tellus dignissim vestibulum. Nullam sapien mauris, venenatis at, fermentum at, tempus eu, urna.";
|
||||
schedule.forEach((talk) => {
|
||||
let abstract = talk.abstract !== void 0 ? talk.abstract : placeHolder;
|
||||
inner = html`<span class="text">${abstract}</span>`;
|
||||
});
|
||||
return inner;
|
||||
};
|
||||
var schedule_all_list_dom = (schedule) => {
|
||||
let inner = html`
|
||||
${schedule.map((talk) => html`
|
||||
<div class="item">
|
||||
<div>
|
||||
<div class="title">${talk.title}</div>
|
||||
</div>
|
||||
<div class="details">
|
||||
<span class="start">${talk.start}</span>
|
||||
<span class="day">Day ${talk.day}</span>
|
||||
<span class="stage">${talk.room}</span>
|
||||
</div>
|
||||
</div>`)}`;
|
||||
return inner;
|
||||
};
|
||||
var update_schedule_dom = (schedule) => {
|
||||
const here_roomguid = "";
|
||||
const here_room = "Chaos-West TV";
|
||||
const here_number_events = 1;
|
||||
const all_number_events = 10;
|
||||
let allData = schedule.slice(0, all_number_events);
|
||||
let hereData = schedule.filter((i) => i.room === here_room).slice(0, 1);
|
||||
let nextHereMetaDom = schedule_meta_here_dom(hereData);
|
||||
let nextHereAbstractDom = schedule_abstract_here_dom(hereData);
|
||||
let nextAllMetaDom = schedule_all_list_dom(allData);
|
||||
let inner = html`
|
||||
<div class="slide">
|
||||
<div class="schedule">
|
||||
<div class="left">
|
||||
<div class="panel meta">
|
||||
<div class="header">Next Up Here</div>
|
||||
<div class="content">${nextHereMetaDom}</div>
|
||||
</div>
|
||||
<div class="panel abstract">
|
||||
<div class="header">Abstract</div>
|
||||
<div class="content">${nextHereAbstractDom}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="panel list">
|
||||
<div class="header">Next Up at rC3</div>
|
||||
<div class="content">${nextAllMetaDom}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
return inner;
|
||||
};
|
||||
var music_playing_now_dom = (music) => {
|
||||
let inner = html`
|
||||
<div class="music">
|
||||
${music.map((current) => html`
|
||||
<div class="line1">
|
||||
<span class="header">Now playing:</span>
|
||||
<span class="license">(${current.license})</span>
|
||||
</div>
|
||||
<div class="line2">
|
||||
<span class="artist">${current.artist}</span>
|
||||
<span>—</span>
|
||||
<span class="title">${current.title}</span>
|
||||
</div>`)}
|
||||
</div>`;
|
||||
return inner;
|
||||
};
|
||||
function update_main_slide(data) {
|
||||
let schedule = data.schedule;
|
||||
let music = data.music;
|
||||
let twitter = data.twitter;
|
||||
let scheduleDom = update_schedule_dom(schedule);
|
||||
let musicDom = music_playing_now_dom(music);
|
||||
let twitterDom = void 0;
|
||||
let inner = html`
|
||||
${scheduleDom}
|
||||
${musicDom}
|
||||
${twitterDom}
|
||||
`;
|
||||
const anchorElId = "main";
|
||||
const el = document.getElementById(anchorElId);
|
||||
preact.render(inner, el);
|
||||
}
|
||||
|
||||
// <stdin>
|
||||
var scheduleData = JSON.constructor([]);
|
||||
var musicData = JSON.constructor([]);
|
||||
var twitterData = JSON.constructor([]);
|
||||
if (window.Worker) {
|
||||
const workerBaseURL = window.infoBeamerConfig.get("workerBaseURL");
|
||||
const scheduleWorkerCode = workerBaseURL + "js/schedule_worker.js";
|
||||
console.log("Loading schedule worker JS from: " + scheduleWorkerCode);
|
||||
const scheduleWorker = new Worker(scheduleWorkerCode);
|
||||
const scheduleURL = window.infoBeamerConfig.get("scheduleURL");
|
||||
const scheduleFetchInterval = window.infoBeamerConfig.get("scheduleFetchInterval");
|
||||
scheduleWorker.postMessage({
|
||||
msgType: "ScheduleFetchConfig",
|
||||
scheduleURL,
|
||||
scheduleFetchInterval
|
||||
});
|
||||
scheduleWorker.onmessage = function(e) {
|
||||
let msgType = e.data.msgType;
|
||||
if (msgType === "ScheduleUpdate") {
|
||||
scheduleData = e.data.schedule;
|
||||
let time = e.data.timestamp;
|
||||
console.log("Message: " + msgType + " at " + time);
|
||||
console.log(scheduleData);
|
||||
update_screen();
|
||||
}
|
||||
};
|
||||
const musicWorkerCode = workerBaseURL + "js/generic_fetch_worker.js";
|
||||
console.log("Loading worker JS from: " + musicWorkerCode);
|
||||
const musicWorker = new Worker(musicWorkerCode);
|
||||
const musicType = "Music";
|
||||
const musicURL = window.infoBeamerConfig.get("musicURL");
|
||||
const musicFetchInterval = window.infoBeamerConfig.get("musicFetchInterval");
|
||||
musicWorker.postMessage({
|
||||
fetchType: musicType,
|
||||
fetchURL: musicURL,
|
||||
fetchInterval: musicFetchInterval
|
||||
});
|
||||
musicWorker.onmessage = function(e) {
|
||||
let msgType = e.data.msgType;
|
||||
if (msgType === musicType) {
|
||||
musicData = JSON.constructor([e.data.json.current]);
|
||||
let time = e.data.timestamp;
|
||||
console.log("Message: " + msgType + " at " + time);
|
||||
console.log(musicData);
|
||||
update_screen();
|
||||
}
|
||||
};
|
||||
const twitterWorkerCode = workerBaseURL + "js/generic_fetch_worker.js";
|
||||
console.log("Loading worker JS from: " + twitterWorkerCode);
|
||||
const twitterWorker = new Worker(twitterWorkerCode);
|
||||
const twitterType = "Twitter";
|
||||
const twitterURL = window.infoBeamerConfig.get("twitterURL");
|
||||
const twitterFetchInterval = window.infoBeamerConfig.get("twitterFetchInterval");
|
||||
twitterWorker.postMessage({
|
||||
fetchType: twitterType,
|
||||
fetchURL: twitterURL,
|
||||
fetchInterval: twitterFetchInterval
|
||||
});
|
||||
twitterWorker.onmessage = function(e) {
|
||||
let msgType = e.data.msgType;
|
||||
if (msgType === twitterType) {
|
||||
twitterData = e.data.json;
|
||||
let time = e.data.timestamp;
|
||||
console.log("Message: " + msgType + " at " + time);
|
||||
console.log(twitterData);
|
||||
update_screen();
|
||||
}
|
||||
};
|
||||
} else {
|
||||
console.log("Your browser doesn't support web workers.");
|
||||
}
|
||||
function update_screen() {
|
||||
let time = new Date();
|
||||
console.log("Updating screen at at: " + time);
|
||||
update_main_slide({ schedule: scheduleData, music: musicData, twitter: twitterData });
|
||||
}
|
||||
function main_loop() {
|
||||
update_screen();
|
||||
setTimeout(main_loop, 10 * 1e3);
|
||||
}
|
||||
main_loop();
|
||||
})();
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue