git.sesse.net Git - ultimatescore/blob - score.js

   1 var clock_running = false;
   2 var clock_visible = false;
   3 var comment_visible = false;
   4 var lowerthird_visible = false;
   5 var clock_left = 30 * 60;
   6 var scoreA = 0;
   7 var scoreB = 0;
   8 var clock_origin;
   9 var state = {};
  10
  11 function setteams()
  12 {
  13         document.getElementById('team1').innerHTML = state['team1'];
  14         document.getElementById('team2').innerHTML = state['team2'];
  15
  16         state = { 'A': state['team1'], 'B': state['team2'] };
  17         loadquickl3s();
  18 }
  19
  20 function setcolors()
  21 {
  22         document.getElementById('team1color').style.backgroundColor = state['team1color'];
  23         document.getElementById('team2color').style.backgroundColor = state['team2color'];
  24 }
  25
  26 function setscore()
  27 {
  28         scoreA = state['score1'];
  29         scoreB = state['score2'];
  30         update_score();
  31 }
  32
  33 function startclock()
  34 {
  35         if (!clock_running) {
  36                 clock_origin = Date.now();
  37                 clock_running = true;
  38         }
  39         showclock();
  40 }
  41
  42 function stopclock()
  43 {
  44         if (!clock_running) return;
  45         clock_left = time_left();
  46         clock_origin = Date.now();
  47         clock_running = false;
  48 }
  49
  50 function setclock(amount)
  51 {
  52         clock_left = amount;
  53         clock_origin = Date.now();
  54         update_clock();
  55 }
  56
  57 function setclockfromstate()
  58 {
  59         var amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']);
  60         setclock(amount);
  61 }
  62
  63 function showclock()
  64 {
  65         if (clock_visible) return;
  66         var clockbug = document.getElementById('clockbug');
  67         clockbug.className = 'clockbug clockbug-animate-in';
  68         clock_visible = true;
  69 }
  70
  71 function hideclock()
  72 {
  73         if (!clock_visible) return;
  74         var clockbug = document.getElementById('clockbug');
  75         clockbug.className = 'clockbug clockbug-animate-out';
  76         clock_visible = false;
  77 }
  78
  79 function setcomment()
  80 {
  81         document.getElementById('comment').innerHTML = state['comment'];
  82 }
  83
  84 function showcomment()
  85 {
  86         if (comment_visible) return;
  87         var commentbug = document.getElementById('commentbug');
  88         commentbug.className = 'commentbug commentbug-animate-in';
  89         comment_visible = true;
  90 }
  91
  92 function hidecomment()
  93 {
  94         if (!comment_visible) return;
  95         var commentbug = document.getElementById('commentbug');
  96         commentbug.className = 'commentbug commentbug-animate-out';
  97         comment_visible = false;
  98 }
  99
 100 function showlowerthird()
 101 {
 102         if (lowerthird_visible) return;
 103
 104         // With no flexbox, this is how it has to be...
 105         var f = document.getElementById('lowerthird-headline');
 106         var g = document.getElementById('lowerthird-headline-content');
 107         f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
 108
 109         f = document.getElementById('lowerthird-subheading');
 110         g = document.getElementById('lowerthird-subheading-content');
 111         f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
 112
 113         f = document.getElementById('lowerthird-picture');
 114         g = document.getElementById('lowerthird-picture-content');
 115         f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px';
 116
 117         document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-animate-in';
 118         document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-in';
 119         document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-in';
 120         document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-in';
 121         document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-animate-in';
 122         document.getElementById('lowerthird-picture-content').className = 'lowerthird-picture-content lowerthird-picture-content-animate-in';
 123         lowerthird_visible = true;
 124 }
 125
 126 function setandshowlowerthird()
 127 {
 128         document.getElementById('lowerthird-headline-content').innerHTML = state['text1'];
 129         document.getElementById('lowerthird-subheading-content').innerHTML = state['text2'];
 130         var img = document.getElementById('lowerthird-img');
 131         if (state['image'] === undefined) {
 132                 img.style.display = 'none';
 133         } else {
 134                 img.src = state['image'];
 135                 img.style.display = 'inline';
 136         }
 137         showlowerthird();
 138 }
 139
 140 function hidelowerthird()
 141 {
 142         if (!lowerthird_visible) return;
 143         document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-hidden lowerthird-headline-animate-out';
 144         document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-out';
 145         document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-out';
 146         document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-out';
 147         document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-hidden lowerthird-picture-animate-out';
 148         document.getElementById('lowerthird-picture-content').className = 'lowerthird-picture-content lowerthird-picture-content-animate-out';
 149         lowerthird_visible = false;
 150 }
 151
 152 function time_left()
 153 {
 154         var elapsed = (Date.now() - clock_origin) * 1e-3;
 155         if (elapsed > clock_left) return 0;
 156         return Math.ceil(clock_left - elapsed);
 157 }
 158
 159 function update_clock()
 160 {
 161         var left = time_left();
 162         var min = Math.floor(left / 60);
 163         var sec = left % 60;
 164
 165         if (sec < 10) sec = "0" + sec;
 166         document.getElementById('clock').innerHTML = min + ":" + sec;
 167 }
 168
 169 function goalA()
 170 {
 171         ++scoreA;
 172         update_score();
 173 }
 174
 175 function goalB()
 176 {
 177         ++scoreB;
 178         update_score();
 179 }
 180
 181 function ungoalA()
 182 {
 183         if (scoreA > 0) --scoreA;
 184         update_score();
 185 }
 186
 187 function ungoalB()
 188 {
 189         if (scoreB > 0) --scoreB;
 190         update_score();
 191 }
 192
 193 function resetscore()
 194 {
 195         scoreA = scoreB = 0;
 196         update_score();
 197 }
 198
 199 function update_score()
 200 {
 201         document.getElementById('score').innerHTML = scoreA + "&nbsp;–&nbsp;" + scoreB;
 202 }
 203
 204 /* called by caspar only */
 205 function play()
 206 {
 207         document.getElementById('manualcontrols').style.display = 'none';
 208         document.getElementById('area').style.display = 'none';
 209
 210         // Old CEF workaround
 211         document.getElementById('lowerthird-subheading').style.top = '638px';
 212 }
 213
 214 function update(v)
 215 {
 216         console.log('[[[' + v + ']]]');
 217         var j = JSON.parse(v);
 218         for(var key in j) state[key] = j[key];
 219 }
 220
 221 setInterval(function() {
 222         if (clock_running) {
 223                 update_clock();
 224         }
 225 }, 100);
 226 update_score();
 227
 228 //play();
 229 //startclock();