4 <meta http-equiv="content-type" value="text/html; charset=utf-8" />
5 <meta charset="utf-8" />
6 <!-- <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> -->
7 <link href="fonts/lato.css" rel="stylesheet">
8 <link href="score.css" rel="stylesheet">
12 <table class="scorebug">
14 <td class="team1color" id="team1color"></td>
15 <td class="team1" id="team1">PCL</td>
16 <td class="score" id="score">17 – 11</td>
17 <td class="team2" id="team2">NMBUI</td>
18 <td class="team2color" id="team2color"></td>
21 <table class="clockbug clockbug-hidden" id="clockbug">
23 <td class="clock" id="clock">25:00</td>
26 <table class="commentbug commentbug-hidden" id="commentbug">
28 <td class="comment" id="comment">Pagacap: First to 9 points</td>
31 <div class="lowerthird-headline lowerthird-headline-hidden" id="lowerthird-headline"><div class="lowerthird-headline-content lowerthird-headline-content-hidden" id="lowerthird-headline-content">
32 John Doe<br>Ola Nordmann
34 <div class="lowerthird-subheading lowerthird-subheading-hidden" id="lowerthird-subheading"><div class="lowerthird-subheading-content lowerthird-subheading-content-hidden" id="lowerthird-subheading-content">
35 Commentators, Trøndisk 2016
40 <th colspan="5">Current standings, TrønDisk 2017<br />Group A</th>
43 <tr class="subfooter">
44 <th class="rank"></th>
45 <th class="team"></th>
46 <th class="nplayed">P</th>
47 <th class="gd">GD</th>
48 <th class="pts">Pts</th>
52 <th class="rank">1</th>
53 <td class="team">Trondheim Frisbeeklubb</td>
54 <td class="nplayed">3</td>
55 <td class="gd">+7</td>
56 <td class="pts">6</td>
59 <th class="rank">2</th>
60 <td class="team">Pancake Circle Ltd.</td>
61 <td class="nplayed">2</td>
62 <td class="gd">+2</td>
63 <td class="pts">4</td>
66 <th class="rank">3</th>
67 <td class="team">Norges Handelshøyskole 1</td>
68 <td class="nplayed">2</td>
69 <td class="gd">-2</td>
70 <td class="pts">2</td>
73 <th class="rank">3</th>
74 <td class="team">Pick-up Team</td>
75 <td class="nplayed">2</td>
76 <td class="gd">-2</td>
77 <td class="pts">2</td>
80 <th class="rank">5</th>
81 <td class="team">Whatever Team</td>
82 <td class="nplayed">3</td>
83 <td class="gd">-11</td>
84 <td class="pts">0</td>
87 <td colspan="5">www.trondheimfrisbeeklubb.no | #trøndisk</td>
91 <div id="manualcontrols">
93 <a href="javascript:startclock()">start clock</a>
94 <a href="javascript:stopclock()">stop clock</a>
95 <a href="javascript:setclock(25*60)">reset clock</a>
96 <a href="javascript:showclock()">show clock</a>
97 <a href="javascript:hideclock()">hide clock</a>
100 <a href="javascript:goalA()">goal team A</a>
101 <a href="javascript:goalB()">goal team B</a>
102 <a href="javascript:ungoalA()">ungoal team A</a>
103 <a href="javascript:ungoalB()">ungoal team B</a>
104 <a href="javascript:resetscore()">reset score</a>
107 <a href="javascript:showcomment()">show comment</a>
108 <a href="javascript:hidecomment()">hide comment</a>
111 <a href="javascript:showlowerthird()">show lower third</a>
112 <a href="javascript:hidelowerthird()">hide lower third</a>
116 <script src="carousel.js" type="text/javascript" />
118 var clock_running = false;
119 var clock_visible = false;
120 var comment_visible = false;
121 var lowerthird_visible = false;
122 var clock_left = 25 * 60;
130 document.getElementById('team1').innerHTML = state['team1'];
131 document.getElementById('team2').innerHTML = state['team2'];
136 document.getElementById('team1color').style.backgroundColor = state['team1color'];
137 document.getElementById('team2color').style.backgroundColor = state['team2color'];
142 scoreA = state['score1'];
143 scoreB = state['score2'];
147 function startclock()
149 if (!clock_running) {
150 clock_origin = Date.now();
151 clock_running = true;
158 if (!clock_running) return;
159 clock_left = time_left();
160 clock_origin = Date.now();
161 clock_running = false;
164 function setclock(amount)
167 clock_origin = Date.now();
171 function setclockfromstate()
173 var amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']);
179 if (clock_visible) return;
180 var clockbug = document.getElementById('clockbug');
181 clockbug.className = 'clockbug clockbug-animate-in';
182 clock_visible = true;
187 if (!clock_visible) return;
188 var clockbug = document.getElementById('clockbug');
189 clockbug.className = 'clockbug clockbug-animate-out';
190 clock_visible = false;
193 function setcomment()
195 document.getElementById('comment').innerHTML = state['comment'];
198 function showcomment()
200 if (comment_visible) return;
201 var commentbug = document.getElementById('commentbug');
202 commentbug.className = 'commentbug commentbug-animate-in';
203 comment_visible = true;
206 function hidecomment()
208 if (!comment_visible) return;
209 var commentbug = document.getElementById('commentbug');
210 commentbug.className = 'commentbug commentbug-animate-out';
211 comment_visible = false;
214 function showlowerthird()
216 if (lowerthird_visible) return;
218 // With no flexbox, this is how it has to be...
219 var f = document.getElementById('lowerthird-headline');
220 var g = document.getElementById('lowerthird-headline-content');
221 f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
223 f = document.getElementById('lowerthird-subheading');
224 g = document.getElementById('lowerthird-subheading-content');
225 f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
227 document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-animate-in';
228 document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-in';
229 document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-in';
230 document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-in';
231 lowerthird_visible = true;
234 function setandshowlowerthird()
236 document.getElementById('lowerthird-headline-content').innerHTML = state['text1'];
237 document.getElementById('lowerthird-subheading-content').innerHTML = state['text2'];
241 function hidelowerthird()
243 if (!lowerthird_visible) return;
244 document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-hidden lowerthird-headline-animate-out';
245 document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-out';
246 document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-out';
247 document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-out';
248 lowerthird_visible = false;
253 var elapsed = (Date.now() - clock_origin) * 1e-3;
254 if (elapsed > clock_left) return 0;
255 return Math.ceil(clock_left - elapsed);
258 function update_clock()
260 var left = time_left();
261 var min = Math.floor(left / 60);
264 if (sec < 10) sec = "0" + sec;
265 document.getElementById('clock').innerHTML = min + ":" + sec;
282 if (scoreA > 0) --scoreA;
288 if (scoreB > 0) --scoreB;
292 function resetscore()
298 function update_score()
300 document.getElementById('score').innerHTML = scoreA + " – " + scoreB;
303 /* called by caspar only */
306 document.getElementById('manualcontrols').style.display = 'none';
307 document.getElementById('area').style.display = 'none';
309 // Old CEF workaround
310 document.getElementById('lowerthird-subheading').style.top = '638px';
315 console.log('[[[' + v + ']]]');
316 var j = JSON.parse(v);
317 for(var key in j) state[key] = j[key];
320 setInterval(function() {