X-Git-Url: https://git.sesse.net/?a=blobdiff_plain;f=score.js;h=273a311896ee3712ef8c87bc48d7971b4ab01f80;hb=52c58f61b5a9799ccbd8ef5dd067f502b81e9aaf;hp=5f8771cf6301d6370a0d8089eb25a2be94ab6c1d;hpb=525ab020c0d57fd40fab90d61a59796e985d978f;p=ultimatescore diff --git a/score.js b/score.js index 5f8771c..273a311 100644 --- a/score.js +++ b/score.js @@ -1,17 +1,33 @@ -var clock_running = false; -var clock_visible = false; -var comment_visible = false; -var lowerthird_visible = false; -var clock_left = 25 * 60; -var scoreA = 0; -var scoreB = 0; -var clock_origin; -var state = {}; +'use strict'; + +let clock_running = false; +let clock2_running = false; +let clock_visible = false; +let scorebug2_visible = false; +let comment_visible = false; +let lowerthird_visible = false; +let clock_elapsed = 0; +let clock2_elapsed = 0; +let clock_limit = 30 * 60; +let scoreA = 0; +let scoreB = 0; +let clock_origin; +let clock2_origin; +let state = {}; function setteams() { document.getElementById('team1').innerHTML = state['team1']; document.getElementById('team2').innerHTML = state['team2']; + + let sheets = { 'A': state['team1'], 'B': state['team2'] }; + loadquickl3s(sheets); +} + +function setteams2() +{ + document.getElementById('score2_team1').innerHTML = state['team1']; + document.getElementById('score2_team2').innerHTML = state['team2']; } function setcolors() @@ -27,6 +43,13 @@ function setscore() update_score(); } +function setscore2() +{ + scoreA = state['score1']; + scoreB = state['score2']; + document.getElementById('score2_score').innerHTML = scoreA + " â€“ " + scoreB; +} + function startclock() { if (!clock_running) { @@ -36,31 +59,81 @@ function startclock() showclock(); } +function startclock2() +{ + if (!clock2_running) { + clock2_origin = Date.now(); + clock2_running = true; + } + // No showclock. +} + function stopclock() { if (!clock_running) return; - clock_left = time_left(); + clock_elapsed = time_elapsed(); clock_origin = Date.now(); clock_running = false; } +function stopclock2() +{ + if (!clock2_running) return; + clock2_elapsed = time2_elapsed(); + clock2_origin = Date.now(); + clock2_running = false; +} + function setclock(amount) { - clock_left = amount; + clock_elapsed = amount; clock_origin = Date.now(); update_clock(); } +function setclock2(amount) +{ + clock2_elapsed = amount; + clock2_origin = Date.now(); + update_clock2(); +} + function setclockfromstate() { - var amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']); + let amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']); setclock(amount); } +// No setclock2fromstate. + +function adjustclockfromstate() +{ + let amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']); + let elapsed = time_elapsed_raw(); + if (Math.abs(amount - elapsed) >= 2.0) { + setclock(amount); + } +} + +function adjustclock2fromstate() +{ + let amount = parseInt(state['clock_min']) * 60 + parseInt(state['clock_sec']); + let elapsed = time_elapsed2_raw(); + if (Math.abs(amount - elapsed) >= 2.0) { + setclock2(amount); + } +} + +function setclocklimitfromstate() +{ + let amount = parseInt(state['clock_limit_min']) * 60 + parseInt(state['clock_limit_sec']); + clock_limit = amount; +} + function showclock() { if (clock_visible) return; - var clockbug = document.getElementById('clockbug'); + let clockbug = document.getElementById('clockbug'); clockbug.className = 'clockbug clockbug-animate-in'; clock_visible = true; } @@ -68,7 +141,7 @@ function showclock() function hideclock() { if (!clock_visible) return; - var clockbug = document.getElementById('clockbug'); + let clockbug = document.getElementById('clockbug'); clockbug.className = 'clockbug clockbug-animate-out'; clock_visible = false; } @@ -81,7 +154,7 @@ function setcomment() function showcomment() { if (comment_visible) return; - var commentbug = document.getElementById('commentbug'); + let commentbug = document.getElementById('commentbug'); commentbug.className = 'commentbug commentbug-animate-in'; comment_visible = true; } @@ -89,7 +162,7 @@ function showcomment() function hidecomment() { if (!comment_visible) return; - var commentbug = document.getElementById('commentbug'); + let commentbug = document.getElementById('commentbug'); commentbug.className = 'commentbug commentbug-animate-out'; comment_visible = false; } @@ -98,19 +171,6 @@ function showlowerthird() { if (lowerthird_visible) return; - // With no flexbox, this is how it has to be... - var f = document.getElementById('lowerthird-headline'); - var g = document.getElementById('lowerthird-headline-content'); - f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px'; - - f = document.getElementById('lowerthird-subheading'); - g = document.getElementById('lowerthird-subheading-content'); - f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px'; - - f = document.getElementById('lowerthird-picture'); - g = document.getElementById('lowerthird-picture-content'); - f.style.paddingTop = Math.round((f.clientHeight - g.clientHeight) / 2) + 'px'; - document.getElementById('lowerthird-headline').className = 'lowerthird-headline lowerthird-headline-animate-in'; document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-in'; document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-in'; @@ -124,7 +184,7 @@ function setandshowlowerthird() { document.getElementById('lowerthird-headline-content').innerHTML = state['text1']; document.getElementById('lowerthird-subheading-content').innerHTML = state['text2']; - var img = document.getElementById('lowerthird-img'); + let img = document.getElementById('lowerthird-img'); if (state['image'] === undefined) { img.style.display = 'none'; } else { @@ -141,26 +201,80 @@ function hidelowerthird() document.getElementById('lowerthird-headline-content').className = 'lowerthird-headline-content lowerthird-headline-content-animate-out'; document.getElementById('lowerthird-subheading').className = 'lowerthird-subheading lowerthird-subheading-animate-out'; document.getElementById('lowerthird-subheading-content').className = 'lowerthird-subheading-content lowerthird-subheading-content-animate-out'; - document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-hidden lowerthird-picture-animate-out'; + document.getElementById('lowerthird-picture').className = 'lowerthird-picture lowerthird-picture-animate-out'; document.getElementById('lowerthird-picture-content').className = 'lowerthird-picture-content lowerthird-picture-content-animate-out'; lowerthird_visible = false; } -function time_left() +function time_elapsed_raw() +{ + let elapsed = (Date.now() - clock_origin) * 1e-3; + if (clock_elapsed + elapsed >= clock_limit) { + clock_elapsed = clock_limit; + clock_origin = Date.now(); + clock_running = false; + return clock_limit; + } + return clock_elapsed + elapsed; +} + +function time_elapsed2_raw() +{ + let elapsed = (Date.now() - clock2_origin) * 1e-3; + if (clock2_elapsed + elapsed >= clock_limit) { + // No separate clock 2 limit. + return clock_limit; + } + return clock2_elapsed + elapsed; +} + +function time_elapsed() +{ + return Math.floor(time_elapsed_raw()); +} + +function time_elapsed2() { - var elapsed = (Date.now() - clock_origin) * 1e-3; - if (elapsed > clock_left) return 0; - return Math.ceil(clock_left - elapsed); + return Math.floor(time_elapsed2_raw()); } function update_clock() { - var left = time_left(); - var min = Math.floor(left / 60); - var sec = left % 60; + let elapsed = time_elapsed(); + let min = Math.floor(elapsed / 60); + let sec = elapsed % 60; if (sec < 10) sec = "0" + sec; - document.getElementById('clock').innerHTML = min + ":" + sec; + let text = min + ":" + sec; + + if (false) { + // This is a hack around the fact that Exo has variable-width numerals. + // It doesn't look fantastic, but for the clock, it's better not to have + // the text jumping around. + let html = ""; + for (let i = 0; i < text.length; ++i) { + if (text.charAt(i) === ':') { + html += ':'; + } else { + html += "
" + text.charAt(i) + "
"; + } + } + document.getElementById('clock').innerHTML = html; + } else { + document.getElementById('clock').innerHTML = text; + } +} + +function update_clock2() +{ + let elapsed = time_elapsed2(); + let min = Math.floor(elapsed / 60); + let sec = elapsed % 60; + + if (sec < 10) sec = "0" + sec; + let text = min + ":" + sec; + + document.getElementById('clock2').innerHTML = text; } function goalA() @@ -198,29 +312,66 @@ function update_score() document.getElementById('score').innerHTML = scoreA + " â€“ " + scoreB; } -/* called by caspar only */ +/* called by the Nageru theme only */ function play() { document.getElementById('manualcontrols').style.display = 'none'; document.getElementById('area').style.display = 'none'; - - // Old CEF workaround - document.getElementById('lowerthird-subheading').style.top = '638px'; } function update(v) { console.log('[[[' + v + ']]]'); - var j = JSON.parse(v); - for(var key in j) state[key] = j[key]; + let j = JSON.parse(v); + for(let key in j) state[key] = j[key]; } setInterval(function() { if (clock_running) { update_clock(); } + if (clock2_running) { + update_clock2(); + } }, 100); update_score(); //play(); //startclock(); + +let websocket = null; + +function open_ws() +{ + console.log("Connecting..."); + try { + if (websocket) + websocket.close(); + websocket = new WebSocket("ws://127.0.0.1:5250/"); + websocket.onopen = function(evt) { + console.log("Connected to client."); + }; + websocket.onclose = function(evt) { + console.log("Disconnected from client."); + setTimeout(open_ws, 100); + }; + websocket.onmessage = function(evt) { + let msg = evt.data; + let m = msg.match(/^update (.*)/); + if (m !== null) { + update(m[1]); + } + m = msg.match(/^eval (.*)/); + if (m !== null) { + eval(m[1]); + } + }; + websocket.onerror = function(evt) { + console.log('Error: ' + evt.data); + }; + } catch (exception) { + console.log('Error: ' + exception); + setTimeout(open_ws, 100); + } +}; +open_ws();