3 let clock_running = false;
4 let clock_visible = false;
5 let comment_visible = false;
6 let lowerthird_visible = false;
7 let clock_left = 30 * 60;
15 document.getElementById('team1').innerHTML = state['team1'];
16 document.getElementById('team2').innerHTML = state['team2'];
18 let sheets = { 'A': state['team1'], 'B': state['team2'] };
24 document.getElementById('team1color').style.backgroundColor = state['team1color'];
25 document.getElementById('team2color').style.backgroundColor = state['team2color'];
30 scoreA = state['score1'];
31 scoreB = state['score2'];
38 clock_origin = Date.now();
46 if (!clock_running) return;
47 clock_left = time_left();
48 clock_origin = Date.now();
49 clock_running = false;
52 function setclock(amount)
55 clock_origin = Date.now();
59 function setclockfromstate()
61 let amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']);
67 if (clock_visible) return;
68 let clockbug = document.getElementById('clockbug');
69 clockbug.className = 'clockbug clockbug-animate-in';
75 if (!clock_visible) return;
76 let clockbug = document.getElementById('clockbug');
77 clockbug.className = 'clockbug clockbug-animate-out';
78 clock_visible = false;
83 document.getElementById('comment').innerHTML = state['comment'];
86 function showcomment()
88 if (comment_visible) return;
89 let commentbug = document.getElementById('commentbug');
90 commentbug.className = 'commentbug commentbug-animate-in';
91 comment_visible = true;
94 function hidecomment()
96 if (!comment_visible) return;
97 let commentbug = document.getElementById('commentbug');
98 commentbug.className = 'commentbug commentbug-animate-out';
99 comment_visible = false;
102 function showlowerthird()
104 if (lowerthird_visible) return;
106 // With no flexbox, this is how it has to be...
107 let f = document.getElementById('lowerthird-headline');
108 let g = document.getElementById('lowerthird-headline-content');
109 f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
111 f = document.getElementById('lowerthird-subheading');
112 g = document.getElementById('lowerthird-subheading-content');
113 f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
115 f = document.getElementById('lowerthird-picture');
116 g = document.getElementById('lowerthird-picture-content');
117 f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
119 document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-animate-in';
120 document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-in';
121 document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-in';
122 document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-in';
123 document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-animate-in';
124 document.getElementById('lowerthird-picture-content').className = 'lowerthird-picture-content lowerthird-picture-content-animate-in';
125 lowerthird_visible = true;
128 function setandshowlowerthird()
130 document.getElementById('lowerthird-headline-content').innerHTML = state['text1'];
131 document.getElementById('lowerthird-subheading-content').innerHTML = state['text2'];
132 let img = document.getElementById('lowerthird-img');
133 if (state['image'] === undefined) {
134 img.style.display = 'none';
136 img.src = state['image'];
137 img.style.display = 'inline';
142 function hidelowerthird()
144 if (!lowerthird_visible) return;
145 document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-hidden lowerthird-headline-animate-out';
146 document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-out';
147 document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-out';
148 document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-out';
149 document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-hidden lowerthird-picture-animate-out';
150 document.getElementById('lowerthird-picture-content').className = 'lowerthird-picture-content lowerthird-picture-content-animate-out';
151 lowerthird_visible = false;
156 let elapsed = (Date.now() - clock_origin) * 1e-3;
157 if (elapsed > clock_left) return 0;
158 return Math.ceil(clock_left - elapsed);
161 function update_clock()
163 let left = time_left();
164 let min = Math.floor(left / 60);
167 if (sec < 10) sec = "0" + sec;
168 document.getElementById('clock').innerHTML = min + ":" + sec;
185 if (scoreA > 0) --scoreA;
191 if (scoreB > 0) --scoreB;
195 function resetscore()
201 function update_score()
203 document.getElementById('score').innerHTML = scoreA + " – " + scoreB;
206 /* called by caspar only */
209 document.getElementById('manualcontrols').style.display = 'none';
210 document.getElementById('area').style.display = 'none';
212 // Old CEF workaround
213 document.getElementById('lowerthird-subheading').style.top = '638px';
218 console.log('[[[' + v + ']]]');
219 let j = JSON.parse(v);
220 for(let key in j) state[key] = j[key];
223 setInterval(function() {