Make penalty tracker vanish if empty after setup
This commit is contained in:
parent
a7951b26a5
commit
78bb2099cc
161
penalties.js
161
penalties.js
|
|
@ -1,161 +0,0 @@
|
|||
function penalties (team) {
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
var mindiv = minors.getElementsByTagName("div");
|
||||
var majdiv = majors.getElementsByTagName("div");
|
||||
var sk8div = sk8ers.getElementsByTagName("div");
|
||||
|
||||
var ret = [];
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
ret.push([sk8div[i].text,
|
||||
mindiv[i].value || 0,
|
||||
majdiv[i].value || 0]);
|
||||
}
|
||||
|
||||
return ret;
|
||||
}
|
||||
|
||||
function penalties_save () {
|
||||
var name_a = document.getElementById("name-a").innerHTML;
|
||||
var name_b = document.getElementById("name-b").innerHTML;
|
||||
|
||||
var pen_a = JSON.stringify(penalties("a"));
|
||||
var pen_b = JSON.stringify(penalties("b"));
|
||||
|
||||
localStorage["rdsb_penalties_a"] = pen_a;
|
||||
localStorage["rdsb_penalties_b"] = pen_b;
|
||||
|
||||
console.log(name_a);
|
||||
localStorage["rdsb_roster " + name_a] = pen_a;
|
||||
localStorage["rdsb_roster " + name_b] = pen_b;
|
||||
}
|
||||
|
||||
function penalties_setdiv (div, value) {
|
||||
if (div.text == undefined) {
|
||||
div.value = value;
|
||||
div.style.height = (value||0) + "em";
|
||||
div.innerHTML = value?value:"";
|
||||
} else {
|
||||
div.text = value;
|
||||
div.innerHTML = value?"":"•";
|
||||
for (var i in value) {
|
||||
var c = value[i];
|
||||
// XXX: use CSS "text-wrap: unrestricted" when supported
|
||||
div.innerHTML += c + " ";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function penalties_load (team, values) {
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
var mindiv = minors.getElementsByTagName("div");
|
||||
var majdiv = majors.getElementsByTagName("div");
|
||||
var sk8div = sk8ers.getElementsByTagName("div");
|
||||
|
||||
for (var i = 0; i < values.length; i += 1) {
|
||||
penalties_setdiv(sk8div[i], values[i][0]);
|
||||
penalties_setdiv(mindiv[i], values[i][1]);
|
||||
penalties_setdiv(majdiv[i], values[i][2]);
|
||||
}
|
||||
}
|
||||
|
||||
function penalties_setTeamName (team, name) {
|
||||
var roster_in = localStorage["rdsb_roster " + name];
|
||||
var roster_out = [];
|
||||
|
||||
if (roster_in) {
|
||||
roster_in = JSON.parse(roster_in);
|
||||
}
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
if (! roster_in) {
|
||||
roster_out.push(["", 0, 0]);
|
||||
} else {
|
||||
roster_out.push([roster_in[i][0], 0, 0])
|
||||
}
|
||||
}
|
||||
penalties_load(team, roster_out);
|
||||
}
|
||||
|
||||
function penalties_click (event) {
|
||||
var element = event.currentTarget;
|
||||
var pops = element.parentNode;
|
||||
var div = element.getElementsByTagName("div")[0];
|
||||
var inc = event.shiftKey?-1:1;
|
||||
var val;
|
||||
|
||||
if (pops.className == "minors") {
|
||||
val = ((div.value || 0) + inc + 4) % 4;
|
||||
if ((inc == 1) && (val == 0)) {
|
||||
var majdiv = div.majdiv;
|
||||
|
||||
penalties_setdiv(majdiv, ((majdiv.value || 0) + 1) % 9);
|
||||
}
|
||||
} else if (pops.className == "majors") {
|
||||
val = ((div.value || 0) + inc + 9) % 9;
|
||||
} else {
|
||||
val = prompt("Enter skater number", div.text);
|
||||
}
|
||||
|
||||
if (val != undefined) {
|
||||
penalties_setdiv(div, val);
|
||||
penalties_save();
|
||||
}
|
||||
}
|
||||
|
||||
function penalties_init () {
|
||||
// Populate ALL THREE ROWS AT ONCE because I'm crazy like that.
|
||||
for (var j = 0; j < 2; j += 1) {
|
||||
var team = (j==0)?"a":"b";
|
||||
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
var td;
|
||||
var div;
|
||||
|
||||
var majdiv = document.createElement("div");
|
||||
td = document.createElement("td");
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(majdiv);
|
||||
majors.appendChild(td);
|
||||
|
||||
|
||||
td = document.createElement("td");
|
||||
div = document.createElement("div");
|
||||
div.majdiv = majdiv;
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(div);
|
||||
minors.appendChild(td);
|
||||
|
||||
|
||||
div = document.createElement("div");
|
||||
div.text = "";
|
||||
div.appendChild(document.createTextNode("•"));
|
||||
td = document.createElement("td");
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(div);
|
||||
sk8ers.appendChild(td);
|
||||
}
|
||||
}
|
||||
|
||||
if (localStorage.rdsb_penalties_a) {
|
||||
penalties_load("a", JSON.parse(localStorage.rdsb_penalties_a));
|
||||
}
|
||||
if (localStorage.rdsb_penalties_b) {
|
||||
penalties_load("b", JSON.parse(localStorage.rdsb_penalties_b));
|
||||
}
|
||||
}
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
}
|
||||
|
||||
#penalties td {
|
||||
cursor: crosshair;
|
||||
cursor: pointer;
|
||||
border: 1px solid rgba(255, 255, 255, 0.075);
|
||||
padding: 0;
|
||||
vertical-align: bottom;
|
||||
|
|
@ -107,3 +107,31 @@
|
|||
width: 1em;
|
||||
line-height: 75%;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Notices
|
||||
*/
|
||||
#penalties.notice {
|
||||
display: none;
|
||||
}
|
||||
#notice div {
|
||||
font-family: Crack Babies, Comunicacion Digital, sans-serif;
|
||||
font-size: 1000%;
|
||||
display: none;
|
||||
}
|
||||
#notice .active {
|
||||
display: block;
|
||||
-moz-animation-duration: 0.5s;
|
||||
-moz-animation-name: grow;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-moz-animation-direction: alternate;
|
||||
}
|
||||
|
||||
@-moz-keyframes grow {
|
||||
0% {color: red;}
|
||||
50% {color: yellow;}
|
||||
75% {color: blue;}
|
||||
100% {color: magenta;}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -37,61 +37,11 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
#penalties.notice {
|
||||
display: none;
|
||||
}
|
||||
#notice div {
|
||||
font-family: sans-serif;
|
||||
font-size: 800%;
|
||||
display: none;
|
||||
}
|
||||
#notice .active {
|
||||
display: block;
|
||||
-moz-animation-duration: 0.5s;
|
||||
-moz-animation-name: grow;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-moz-animation-direction: alternate;
|
||||
}
|
||||
|
||||
@-moz-keyframes grow {
|
||||
0% {color: red;}
|
||||
50% {color: yellow;}
|
||||
75% {color: blue;}
|
||||
100% {color: magenta;}
|
||||
}
|
||||
|
||||
</style>
|
||||
<link rel="stylesheet" type="text/css" href="scoreboard.css">
|
||||
<script type="text/javascript" src="logos.js"></script>
|
||||
<script type="text/javascript" src="scoreboard.js"></script>
|
||||
<script type="text/javascript" src="penalties.js"></script>
|
||||
<script type="text/javascript">
|
||||
var notice_timer;
|
||||
|
||||
function notice_expire(n) {
|
||||
var p = document.getElementById("penalties");
|
||||
var pClassName = "";
|
||||
|
||||
for (var i = 0; i < 10; i += 1) {
|
||||
var e = document.getElementById("notice-" + i);
|
||||
|
||||
if (! e) continue;
|
||||
if (i == n) {
|
||||
e.className = "active";
|
||||
pClassName = "notice";
|
||||
} else {
|
||||
e.className = "";
|
||||
}
|
||||
}
|
||||
if (p) p.className = pClassName;
|
||||
}
|
||||
|
||||
function notice(n) {
|
||||
clearTimeout(notice_timer);
|
||||
notice_timer = setTimeout(function() {notice_expire()}, 8000);
|
||||
notice_expire(n);
|
||||
}
|
||||
|
||||
window.onkeypress = key;
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -143,16 +93,20 @@ function notice(n) {
|
|||
<tr class="sk8ers"></tr>
|
||||
</table>
|
||||
|
||||
<!-- Right here would be an excellent place for a sponsor logo -->
|
||||
|
||||
<table id="penalties-b">
|
||||
<tr class="majors"></tr>
|
||||
<tr class="minors"></tr>
|
||||
<tr class="sk8ers"></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="notice">
|
||||
<div id="notice-1">Power Jam</div>
|
||||
<div id="notice-2">Grand Slam</div>
|
||||
<div id="notice-3">Ouch!</div>
|
||||
<div id="notice-4">OMG</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
251
scoreboard.js
251
scoreboard.js
|
|
@ -145,6 +145,11 @@ function transition(newstate) {
|
|||
if ((newstate == undefined) || (newstate == state)) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ((state == SETUP) && penalties_duck) {
|
||||
penalties_duck();
|
||||
}
|
||||
|
||||
state = newstate;
|
||||
|
||||
if (state == JAM) {
|
||||
|
|
@ -172,6 +177,219 @@ function transition(newstate) {
|
|||
e("jammer-b").className = "";
|
||||
}
|
||||
|
||||
/***********************************
|
||||
* Penalties
|
||||
*/
|
||||
function penalties (team) {
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
var mindiv = minors.getElementsByTagName("div");
|
||||
var majdiv = majors.getElementsByTagName("div");
|
||||
var sk8div = sk8ers.getElementsByTagName("div");
|
||||
|
||||
var ret = [];
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
ret.push([sk8div[i].text,
|
||||
mindiv[i].value || 0,
|
||||
majdiv[i].value || 0]);
|
||||
}
|
||||
|
||||
return ret;
|
||||
}
|
||||
|
||||
function penalties_save () {
|
||||
var ls = localStorage || {};
|
||||
|
||||
var name_a = document.getElementById("name-a").innerHTML;
|
||||
var name_b = document.getElementById("name-b").innerHTML;
|
||||
|
||||
var pen_a = JSON.stringify(penalties("a"));
|
||||
var pen_b = JSON.stringify(penalties("b"));
|
||||
|
||||
ls["rdsb_penalties_a"] = pen_a;
|
||||
ls["rdsb_penalties_b"] = pen_b;
|
||||
|
||||
ls["rdsb_roster " + name_a] = pen_a;
|
||||
ls["rdsb_roster " + name_b] = pen_b;
|
||||
}
|
||||
|
||||
function penalties_setdiv (div, value) {
|
||||
if (div.text == undefined) {
|
||||
div.value = value;
|
||||
div.style.height = (value||0) + "em";
|
||||
div.innerHTML = value?value:"";
|
||||
} else {
|
||||
div.text = value;
|
||||
div.innerHTML = value?"":"•";
|
||||
for (var i in value) {
|
||||
var c = value[i];
|
||||
// XXX: use CSS "text-wrap: unrestricted" when supported
|
||||
div.innerHTML += c + " ";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function penalties_load (team, values) {
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
var mindiv = minors.getElementsByTagName("div");
|
||||
var majdiv = majors.getElementsByTagName("div");
|
||||
var sk8div = sk8ers.getElementsByTagName("div");
|
||||
|
||||
for (var i = 0; i < values.length; i += 1) {
|
||||
penalties_setdiv(sk8div[i], values[i][0]);
|
||||
penalties_setdiv(mindiv[i], values[i][1]);
|
||||
penalties_setdiv(majdiv[i], values[i][2]);
|
||||
}
|
||||
}
|
||||
|
||||
function penalties_setTeamName (team, name) {
|
||||
var ls = localStorage || {};
|
||||
var roster_in = ls["rdsb_roster " + name];
|
||||
var roster_out = [];
|
||||
|
||||
if (roster_in) {
|
||||
roster_in = JSON.parse(roster_in);
|
||||
}
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
if (! roster_in) {
|
||||
roster_out.push(["", 0, 0]);
|
||||
} else {
|
||||
roster_out.push([roster_in[i][0], 0, 0])
|
||||
}
|
||||
}
|
||||
penalties_load(team, roster_out);
|
||||
}
|
||||
|
||||
function penalties_click (event) {
|
||||
var element = event.currentTarget;
|
||||
var pops = element.parentNode;
|
||||
var div = element.getElementsByTagName("div")[0];
|
||||
var inc = event.shiftKey?-1:1;
|
||||
var val;
|
||||
|
||||
if (pops.className == "minors") {
|
||||
val = ((div.value || 0) + inc + 4) % 4;
|
||||
if ((inc == 1) && (val == 0)) {
|
||||
var majdiv = div.majdiv;
|
||||
|
||||
penalties_setdiv(majdiv, ((majdiv.value || 0) + 1) % 9);
|
||||
}
|
||||
} else if (pops.className == "majors") {
|
||||
val = ((div.value || 0) + inc + 9) % 9;
|
||||
} else {
|
||||
val = prompt("Enter skater number", div.text);
|
||||
}
|
||||
|
||||
if (val != undefined) {
|
||||
penalties_setdiv(div, val);
|
||||
penalties_save();
|
||||
}
|
||||
}
|
||||
|
||||
// Remove penalties area if there are no players set
|
||||
function penalties_duck () {
|
||||
var pen = document.getElementById("penalties");
|
||||
var a = penalties("a");
|
||||
var b = penalties("b");
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
if (a[i][0] || b[i][0]) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
pen.style.display = "none";
|
||||
}
|
||||
|
||||
function penalties_init () {
|
||||
var ls = localStorage || {};
|
||||
|
||||
// Populate ALL THREE ROWS AT ONCE because I'm crazy like that.
|
||||
for (var j = 0; j < 2; j += 1) {
|
||||
var team = (j==0)?"a":"b";
|
||||
|
||||
var table = document.getElementById("penalties-" + team);
|
||||
var minors = table.getElementsByClassName("minors")[0];
|
||||
var majors = table.getElementsByClassName("majors")[0];
|
||||
var sk8ers = table.getElementsByClassName("sk8ers")[0];
|
||||
|
||||
for (var i = 0; i < 20; i += 1) {
|
||||
var td;
|
||||
var div;
|
||||
|
||||
var majdiv = document.createElement("div");
|
||||
td = document.createElement("td");
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(majdiv);
|
||||
majors.appendChild(td);
|
||||
|
||||
|
||||
td = document.createElement("td");
|
||||
div = document.createElement("div");
|
||||
div.majdiv = majdiv;
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(div);
|
||||
minors.appendChild(td);
|
||||
|
||||
|
||||
div = document.createElement("div");
|
||||
div.text = "";
|
||||
div.appendChild(document.createTextNode("•"));
|
||||
td = document.createElement("td");
|
||||
td.onclick = penalties_click;
|
||||
td.appendChild(div);
|
||||
sk8ers.appendChild(td);
|
||||
}
|
||||
}
|
||||
|
||||
if (ls.rdsb_penalties_a) {
|
||||
penalties_load("a", JSON.parse(ls.rdsb_penalties_a));
|
||||
}
|
||||
if (ls.rdsb_penalties_b) {
|
||||
penalties_load("b", JSON.parse(ls.rdsb_penalties_b));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/***********************************
|
||||
* Notices
|
||||
*/
|
||||
var notice_timer;
|
||||
|
||||
function notice_expire(n) {
|
||||
var p = document.getElementById("penalties");
|
||||
var pClassName = "";
|
||||
|
||||
for (var i = 0; i < 10; i += 1) {
|
||||
var e = document.getElementById("notice-" + i);
|
||||
|
||||
if (! e) continue;
|
||||
if (i == n) {
|
||||
e.className = "active";
|
||||
pClassName = "notice";
|
||||
} else {
|
||||
e.className = "";
|
||||
}
|
||||
}
|
||||
if (p) p.className = pClassName;
|
||||
}
|
||||
|
||||
function notice(n) {
|
||||
clearTimeout(notice_timer);
|
||||
notice_timer = setTimeout(function() {notice_expire()}, 8000);
|
||||
notice_expire(n);
|
||||
}
|
||||
|
||||
function e(id) {
|
||||
return document.getElementById(id);
|
||||
|
|
@ -185,6 +403,10 @@ function score(team, points) {
|
|||
te.innerHTML = ts;
|
||||
}
|
||||
|
||||
/***********************************
|
||||
* Event handlers
|
||||
*/
|
||||
|
||||
var logo = {a:-1, b:-1};
|
||||
|
||||
function handle(event) {
|
||||
|
|
@ -224,10 +446,8 @@ function handle(event) {
|
|||
e("name-" + team).innerHTML = t[0];
|
||||
tgt.src = "logos/" + t[1];
|
||||
|
||||
if (window.penalties) {
|
||||
penalties_setTeamName(team, t[0]);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
score(team, -adj);
|
||||
}
|
||||
|
|
@ -343,12 +563,11 @@ function key(event) {
|
|||
case "7":
|
||||
case "8":
|
||||
case "9":
|
||||
case "0":
|
||||
var n = Number(c);
|
||||
|
||||
if (window.notice) {
|
||||
window.notice(n);
|
||||
}
|
||||
}
|
||||
|
||||
transition(newstate);
|
||||
}
|
||||
|
|
@ -362,16 +581,18 @@ function dfl(v, d) {
|
|||
}
|
||||
|
||||
function save() {
|
||||
localStorage.rdsb_name_a = e("name-a").innerHTML;
|
||||
localStorage.rdsb_name_b = e("name-b").innerHTML;
|
||||
localStorage.rdsb_logo_a = e("logo-a").src;
|
||||
localStorage.rdsb_logo_b = e("logo-b").src;
|
||||
localStorage.rdsb_score_a = e("score-a").innerHTML;
|
||||
localStorage.rdsb_score_b = e("score-b").innerHTML;
|
||||
localStorage.rdsb_score_a = e("timeouts-a").innerHTML;
|
||||
localStorage.rdsb_score_b = e("timeouts-b").innerHTML;
|
||||
localStorage.rdsb_period = period;
|
||||
localStorage.rdsb_period_clock = e("period").remaining();
|
||||
var ls = localStorage || {};
|
||||
|
||||
ls.rdsb_name_a = e("name-a").innerHTML;
|
||||
ls.rdsb_name_b = e("name-b").innerHTML;
|
||||
ls.rdsb_logo_a = e("logo-a").src;
|
||||
ls.rdsb_logo_b = e("logo-b").src;
|
||||
ls.rdsb_score_a = e("score-a").innerHTML;
|
||||
ls.rdsb_score_b = e("score-b").innerHTML;
|
||||
ls.rdsb_timeout_a = e("timeouts-a").innerHTML;
|
||||
ls.rdsb_timeout_b = e("timeouts-b").innerHTML;
|
||||
ls.rdsb_period = period;
|
||||
ls.rdsb_period_clock = e("period").remaining();
|
||||
}
|
||||
|
||||
function start() {
|
||||
|
|
@ -395,9 +616,7 @@ function start() {
|
|||
save_itimer = setInterval(save, 1000);
|
||||
}
|
||||
|
||||
if (window.penalties) {
|
||||
window.penalties_init();
|
||||
}
|
||||
|
||||
e("periodtext").innerHTML = periodtext[period];
|
||||
e("jamtext").innerHTML = "Setup";
|
||||
|
|
|
|||
Loading…
Reference in New Issue