neale
/
woozle-scoreboard
mirror of https://github.com/nealey/woozle-scoreboard
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Holy crap it works

This commit is contained in:
Neale Pickett 2014-01-19 18:25:38 -07:00
parent d3054c4e1d
commit 0f3e875f67
41 changed files with 248 additions and 1827 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
START_SCOREBOARD.html
View File

@ -1,36 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>LADD Roller Derby Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/style.css">
</head>
<body>
<h1>LADD Scoreboard</h1>
<p>
Having problems? Try something other than Internet Explorer!
Chrome and Firefox have both been tested extensively.
</p>
<ul>
<li><a href="scoreboard.html">Normal layout</a>, or <a href="classic.html">with team names</a></li>
<li><a href="crg.html">CRG-style layout</a>, or <a href="crg-nologo.html">CRG without logos</a></li>
<li><a href="highvis.html">High-visibility</a></li>
<li><a href="micro.html">Timers-only</a></li>
<li>Flags: <a href="flag-us.html">USA</a> <a href="flag-ca.html">Canada</a> <a href="flag-mx.html">Mexico</a></li>
</ul>
<h1>Documentation</h1>
<ul>
<li><a href="http://youtu.be/MXOzmmnHqXU">operation tutorial</a></li>
<li><a href="http://youtu.be/lH1VZ2kFatY">installation tutorial</a></li>
<li><a href="res/usage.html">Text documentation</a></li>
</ul>
<address>
Neale Pickett &lt;<a href="mailto:neale&#64;woozle&#46;org">neale&#64;woozle&#46;org</a>&gt;
</address>
</body>
</html>

100
classic.html
View File

@ -1,100 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/scoreboard.css">
<style type="text/css">
#name-a, #name-b {
font-family: PermanentMarker, monospace, sans-serif;
position: absolute;
top: 0;
font-size: 75%;
}
#name-a {
left: 0;
}
#name-b {
right: 0;
}
.logo {
margin-top: 1em;
max-height: 1.5em;
}
#score-a, #score-b {
position: absolute;
font-size: 90%;
top: auto;
bottom: 0em;
}
#jammer-a, #jammer-b {
bottom: 1.5em;
}
#timeouts-a, #timeouts-b {
bottom: 3em;
}
</style>
<script type="text/javascript" src="logos/logos.js"></script>
<script type="text/javascript" src="res/scoreboard.js"></script>
</head>
<body>
<!--
HTML5 says not to use tables for layout. Since this is
a highly-styled page, it looks awful without CSS. Sorry.
-->
<div id="scoreboard">
<p class="left">
<span class="name" id="name-a" onclick="handle(event);">Home</span>
<img class="logo" src="" alt="A" id="logo-a" onclick="handle(event);">
<span class="timeouts" id="timeouts-a" onclick="handle(event);">0</span>
<span class="jammer" id="jammer-a" onclick="handle(event);">★</span>
<span class="score" id="score-a" onclick="handle(event);">-</span>
</p>
<p>
<span id="period" onclick="handle(event);">--:--</span>
<span id="periodtext" onclick="handle(event);"></span>
<span id="jam" onclick="handle(event);">-:--.-</span>
<span id="jamtext" onclick="handle(event);"></span>
<span id="jamno" onclick="handle(event);">0</span>
</p>
<p class="right">
<span class="name" id="name-b" onclick="handle(event);">Vis</span>
<img class="logo" src="" alt="B" id="logo-b" onclick="handle(event);">
<span class="timeouts" id="timeouts-b" onclick="handle(event);">0</span>
<span class="jammer" id="jammer-b" onclick="handle(event);">★</span>
<span class="score" id="score-b" onclick="handle(event);">-</span>
</p>
</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>

192
crg-nologo.html
View File

@ -1,192 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<style type="text/css">
html {
height: 100%;
background: #000000; /* Old browsers */
background: -moz-linear-gradient(top, #000000 0%, #888888 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#888888)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #000000 0%,#888888 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #000000 0%,#888888 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #000000 0%,#888888 100%); /* IE10+ */
background: linear-gradient(to bottom, #000000 0%,#888888 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#888888',GradientType=0 ); /* IE6-9 */
font-family: arial, "Numbus Sans L Bold", sans-serif;
font-weight: bold;
text-align: center;
}
.button {
background: rgb(242,245,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(242,245,246,1) 0%, rgba(227,234,237,1) 37%, rgba(200,215,220,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,245,246,1)), color-stop(37%,rgba(227,234,237,1)), color-stop(100%,rgba(200,215,220,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
border-radius: 0.3em;
color: black;
}
#scoreboard *[id] {
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
user-select: none;
}
#team-a {
position: absolute;
left: 25%;
width: 3em;
margin-left: -1.5em;
top: 0;
}
#team-b {
position: absolute;
right: 25%;
width: 3em;
margin-right: -1.5em;
top: 0;
}
img, p {
margin: 0.1em;
}
.name {
color: white;
font-size: 50%;
height: 4em;
}
.score {
position: relative;
top: -0.3em;
width: 2.2em;
margin: auto;
}
#timeouts {
font-size: 30%;
position: absolute;
top: 6.2em;
left: 50%;
width: 4.5em;
margin-left: -2.25em;
}
.label {
font-size: 80%;
}
.to {
margin: 1em 0;
width: 2em;
}
#timeouts-a {
float: left;
}
#timeouts-b {
float: right;
}
#pcol {
font-size: 66%;
position: absolute;
left: 25%;
width: 5em;
margin-left: -2.5em;
bottom: 0;
}
.text {
width: 6em;
font-size: 50%;
margin: 0.1em auto;
}
.timer {
width: 4em;
margin: 0.1em auto;
}
#jcol {
font-size: 66%;
position: absolute;
right: 25%;
width: 5em;
margin-right: -2.5em;
bottom: 0;
}
</style>
<script type="text/javascript" src="res/scoreboard.js"></script>
<script type="text/javascript">
longnames = true;
tenths = false;
</script>
</head>
<body>
<!--
HTML5 says not to use tables for layout. Since this is
a highly-styled page, it looks awful without CSS. Sorry.
-->
<div id="scoreboard">
<div id="team-a">
<p class="name" id="name-a" onclick="handle(event);">Home</p>
<p class="score button" id="score-a" onclick="handle(event);">-</p>
</div>
<div id="timeouts">
<p class="label button">Timeouts</p>
<p class="to button" id="timeouts-a" onclick="handle(event);">0</p>
<p class="to button" id="timeouts-b" onclick="handle(event);">0</p>
</div>
<div id="team-b">
<p class="name" id="name-b" onclick="handle(event);">Home</p>
<p class="score button" id="score-b" onclick="handle(event);">-</p>
</div>
<div id="pcol">
<p class="text button" id="periodtext" onclick="handle(event);"></p>
<p class="timer button"><span id="period" onclick="handle(event);">--:--</span></p>
</div>
<div id="jcol">
<p class="text button" id="jtxt">
<span id="jamtext" onclick="handle(event);"></span>
<span id="jamno" onclick="handle(event);">0</span>
</p>
<p class="timer button"><span id="jam" onclick="handle(event);">-:--</span></p>
</div>
</div>
</body>
</html>

199
crg.html
View File

@ -1,199 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<style type="text/css">
html {
height: 100%;
background: #000000; /* Old browsers */
background: -moz-linear-gradient(top, #000000 0%, #888888 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#888888)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #000000 0%,#888888 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #000000 0%,#888888 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #000000 0%,#888888 100%); /* IE10+ */
background: linear-gradient(to bottom, #000000 0%,#888888 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#888888',GradientType=0 ); /* IE6-9 */
font-family: arial, "Numbus Sans L Bold", sans-serif;
font-weight: bold;
text-align: center;
}
.button {
background: rgb(242,245,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(242,245,246,1) 0%, rgba(227,234,237,1) 37%, rgba(200,215,220,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,245,246,1)), color-stop(37%,rgba(227,234,237,1)), color-stop(100%,rgba(200,215,220,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
border-radius: 0.3em;
color: black;
}
#scoreboard *[id] {
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
user-select: none;
}
#team-a {
position: absolute;
left: 25%;
width: 3em;
margin-left: -1.5em;
top: 0;
}
#team-b {
position: absolute;
right: 25%;
width: 3em;
margin-right: -1.5em;
top: 0;
}
img, p {
margin: 0.1em;
}
.name {
color: white;
font-size: 30%;
height: 2em;
}
.logo {
height: 1em;
}
.score {
position: relative;
top: -0.3em;
width: 2.2em;
margin: auto;
}
#timeouts {
font-size: 30%;
position: absolute;
top: 6.2em;
left: 50%;
width: 5em;
margin-left: -2.5em;
}
.label {
font-size: 80%;
}
.to {
margin: 1em 0;
width: 2em;
}
#timeouts-a {
float: left;
}
#timeouts-b {
float: right;
}
#pcol {
font-size: 66%;
position: absolute;
left: 25%;
width: 5em;
margin-left: -2.5em;
bottom: 0;
}
.text {
width: 6em;
font-size: 50%;
margin: 0.1em auto;
}
.timer {
width: 4em;
margin: 0.1em auto;
}
#jcol {
font-size: 66%;
position: absolute;
right: 25%;
width: 5em;
margin-right: -2.5em;
bottom: 0;
}
</style>
<script type="text/javascript" src="logos/logos.js"></script>
<script type="text/javascript" src="res/scoreboard.js"></script>
<script type="text/javascript">
longnames = true;
tenths = false;
</script>
</head>
<body>
<!--
HTML5 says not to use tables for layout. Since this is
a highly-styled page, it looks awful without CSS. Sorry.
-->
<div id="scoreboard">
<div id="team-a">
<p class="name" id="name-a" onclick="handle(event);">Home</p>
<img class="logo" src="" alt="A" id="logo-a" onclick="handle(event);">
<p class="score button" id="score-a" onclick="handle(event);">-</p>
</div>
<div id="timeouts">
<p class="label button">Timeouts</p>
<p class="to button" id="timeouts-a" onclick="handle(event);">0</p>
<p class="to button" id="timeouts-b" onclick="handle(event);">0</p>
</div>
<div id="team-b">
<p class="name" id="name-b" onclick="handle(event);">Home</p>
<img class="logo" src="" alt="B" id="logo-b" onclick="handle(event);">
<p class="score button" id="score-b" onclick="handle(event);">-</p>
</div>
<div id="pcol">
<p class="text button" id="periodtext" onclick="handle(event);"></p>
<p class="timer button"><span id="period" onclick="handle(event);">--:--</span></p>
</div>
<div id="jcol">
<p class="text button" id="jtxt">
<span id="jamtext" onclick="handle(event);"></span>
<span id="jamno" onclick="handle(event);">0</span>
</p>
<p class="timer button"><span id="jam" onclick="handle(event);">-:--</span></p>
</div>
</div>
</body>
</html>

99
highvis.html
View File

@ -1,99 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/scoreboard.css">
<style type="text/css">
body {
background: black;
color: white;
text-align: center;
}
#scoreboard {
font-size: 1.4em;
width: 100%;
}
#jam, #period, #score-a, #score-b, #jammer-a.lead, #jammer-b.lead {
color: white;
}
#score-a, #score-b {
position: absolute;
top: 1.4em;
}
#jammer-a, #jammer-b {
position: absolute;
bottom: 0;
}
#jamtext {
font-family: monospace;
}
#score-a, #jammer-a {
left: 10px;
}
#score-b, #jammer-b {
right: 10px;
}
html, p {
padding: 0;
margin: 0;
}
#notice {
position: absolute;
top: 10px;
left: 20%;
width: 60%;
background: white;
color: black;
font-family: sans-serif;
font-weight: bold;
}
</style>
<script type="text/javascript" src="res/scoreboard.js"></script>
<script type="text/javascript">
window.onkeypress = key;
jamtext = ["J", "L", "T", "Setup"];
tenths = true;
</script>
</head>
<body>
<div id="scoreboard">
<p>
<span id="period" onclick="handle(event);">--:--</span>
</p>
<p>
<span id="score-a" onclick="handle(event);">-</span>
<span id="jammer-a" onclick="handle(event);">★</span>
<span id="jamtext">-</span>
<span id="jammer-b" onclick="handle(event);">★</span>
<span id="score-b" onclick="handle(event);">-</span>
</p>
<p>
<span id="jam" onclick="handle(event);">-:--.-</span>
</p>
<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>
</div>
</body>
</html>

152
index.html
View File

@ -1,152 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Roller Derby Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/style.css">
</head>
<body>
<h1>LADD Roller Derby Scoreboard</h1>
<p>
This is a free WFTDA-rules scoreboard, created with ease-of-use
in mind. It is known to work on PC, Mac, Android, iOS, or Linux, using any
common web browser.
</p>
<p id="screenshot">
<img src="res/screenshot.png">
<br>
<a href="scoreboard.html">Try it right now</a>: click on things
to make them change.
</p>
<h1>Features</h1>
<ul>
<li>
Free to use, share, and change (GPLv3)
</li>
<li>
No Internet connection required
</li>
<li>
Easy mouse-driven (with hotkeys) setup and operation
</li>
<li>
No complicated installation procedure: just open a web page
</li>
<li>
Looks <em>good</em>, with colors tuned for high-visibility
on projectors
</li>
<li>
Appearance can be customized in HTML and CSS; comes with
several pre-written themes
</li>
<li>
Runs on practically anything, including older computers,
smartphones, and tablets
</li>
<li>
Ships with <a href="logos/logos.html">an ever-expanding set of
team logos</a>
</li>
<li>
The <b>only</b> scoreboard conforming to 9.1.5.4, requiring
<a href="penalties.html">penalty tracking</a>.
</li>
</ul>
<h1>Themes</h1>
<ul>
<li><a href="scoreboard.html">Normal layout</a> similar to most
other roller derby scoreboards</li>
<li><a href="crg.html">CRG-style layout</a>, or <a href="crg-nologo.html">CRG without logos</a></li>
<li><a href="penalties.html">Penalty tracking</a> layout</li>
<li><a href="highvis.html">High-visibility</a> for
low-power projectors or outdoor bouts</li>
<li><a href="micro.html">Timers-only</a> if you track
scores some other way</li>
<li><a href="flag.html">US Flag</a> in case you need it</li>
<li>Build your own using only HTML5 and CSS</li>
</ul>
<h1>Documentation</h1>
<p>
Watch a <a href="http://youtu.be/MXOzmmnHqXU">5-minute video
tutorial</a> or read the
<a href="res/usage.html">Full documentation</a> which comes bundled with the
download.
</p>
<h1>Download</h1>
<p>
<a href="http://woozle.org/~neale/g.cgi/scoreboard/snapshot/scoreboard-5.1.zip">Download
version 5.1</a> to your hard drive to run a scoreboard
without Internet access (<strong>recommended</strong>:
<a href="http://youtu.be/lH1VZ2kFatY">watch how</a>). This
includes the documentation.
</p>
<p>
If your scoreboard computer has an Internet connection, you don't
need to download anything at all. Just load up
the <a href="scoreboard.html">full-screen version</a> from this
page and you're all set.
</p>
<p>
You can
also <a href="http://woozle.org/~neale/g.cgi/scoreboard">browse
the source tree</a> or clone it with git:
<pre>git clone http://woozle.org/~neale/projects/scoreboard</pre>
</p>
<h1>Other Derby Stuff By Me</h1>
<ul>
<li>
I have several other software packages for NSOs and skaters at
<a href="http://woozle.org/derby/">woozle.org</a>
</li>
<li>
I also keep a <a href="res/others.html">list of other free
scoreboard programs</a>. If the LADD scoreboard isn't
right for you, try one of these!
</li>
</ul>
<h1>Contact Me</h1>
<p>
If you'd like me to add your team logo, have an idea for improvement,
or just want to say hi, please send me an email. I especially
like hearing from people who are using the software: I love knowing
I'm able to help people out.
</p>
<address>
Neale Pickett &lt;<a href="mailto:neale&#64;woozle&#46;org">neale&#64;woozle&#46;org</a>&gt;
</address>
</body>
</html>

BIN
logos/black.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.7 KiB

After

Width:  |  Height:  |  Size: 19 KiB

BIN
logos/blue.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.3 KiB

After

Width:  |  Height:  |  Size: 21 KiB

BIN
logos/bwbs.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
logos/campers.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 129 KiB

BIN
logos/green.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 16 KiB

1
logos/logos.html
View File

@ -3,6 +3,7 @@
<head>
<title>Roller Derby Logos</title>
<link rel="stylesheet" type="text/css" href="../res/style.css">
<meta charset="utf-8">
<style type="text/css">
#gallery {
}

89
logos/logos.js
View File

@ -1,48 +1,55 @@
teams = [
["LA", "bombs.png", "Los Alamos M'Atom Bombs"],
["ARG", "animas.png", "Animas Valley Roller Girls"],
["Taos", "taos.png", "Taos Whiplashes"],
["RIP", "rip.png", "Rollergirls In Pagosa"],
["4CRG", "4crg.png", "4 Corners Roller Girls"],
["DRG", "durango.png", "Durango Roller Girls"],
["SFe", "brawlers.png", "Disco Brawlers"],
["HCRD", "aurora.png", "High City Derby Divas"],
["Moab", "moab.png", "Moab Roller Derby"],
["Bots", "hobots.png", "Albuquerque Ho-Bots"],
["HNR", "hustlen.png", "HCDD Hustle N' Rollers"],
["DD", "doubledown.png", "HCDD Double Down"],
["DCD", "dcd.png", "Duke City Derby"],
["RMRG", "rmrg.png", "Rocky Mountain Roller Girls"],
["DD", "doomsdames.png", "Albuquerque Doomsdames"],
["TEX", "texpistols.png", "El Paso Tex Pistols"],
["PWH", "pistol.png", "El Paso Pistol Whip-Hers"],
["MT", "minorthreat.png", "Minor Threat"],
["CCR", "choicecity.png", "Choice City Rebels"],
["DIA", "dia.png", "Derby Intelligence Agency"],
["TRD", "tucson.png", "Tucson Roller Derby"],
["TST", "saddletramps.jpg","Tucson Saddle Tramps"],
["TC", "tallcity.png", "Tall City Roller Betties"],
["SS", "ssdd.png", "South Side Derby Dames"],
["WTRD", "wtrd.png", "West Texas Roller Dollz"],
["FDD", "fdd.png", "Faultline Derby Devilz"],
["CHPA", "chupas.png", "New Mexico Chupacabras"],
["TKRD", "tulare-kings.png", "Tulare Kings Roller Derby"],
["CHRY", "cherries.png", "Los Alamos Cherry Bombs"],
["PLG", "plague.png", "Zombie Plague"],
["BDB", "bd-betties.png", "Black Diamond Betties"],
["SKS", "sirens.png", "Sea to Sky Sirens"],
["BBDD", "bbdd.png", "Battle Born Derby Demons"],
["OKVD", "okvd.png", "Oklahoma Victory Dolls"],
["MM", "munecas.png", "Muñecas Muertas"],
["MARI", "marionettes.png", "Albuquerque Marionettes"],
["LA", "bombs.png", "Los Alamos M'Atom Bombs"],
["ARG", "animas.png", "Animas Valley Roller Girls"],
["Taos", "taos.png", "Taos Whiplashes"],
["RIP", "rip.png", "Rollergirls In Pagosa"],
["4CRG", "4crg.png", "4 Corners Roller Girls"],
["DRG", "durango.png", "Durango Roller Girls"],
["SFe", "brawlers.png", "Disco Brawlers"],
["HCRD", "aurora.png", "High City Derby Divas"],
["Moab", "moab.png", "Moab Roller Derby"],
["Bots", "hobots.png", "Albuquerque Ho-Bots"],
["HNR", "hustlen.png", "HCDD Hustle N' Rollers"],
["DD", "doubledown.png", "HCDD Double Down"],
["DCD", "dcd.png", "Duke City Derby"],
["RMRG", "rmrg.png", "Rocky Mountain Roller Girls"],
["DD", "doomsdames.png", "Albuquerque Doomsdames"],
["TEX", "texpistols.png", "El Paso Tex Pistols"],
["PWH", "pistol.png", "El Paso Pistol Whip-Hers"],
["MT", "minorthreat.png", "Minor Threat"],
["CCR", "choicecity.png", "Choice City Rebels"],
["DIA", "dia.png", "Derby Intelligence Agency"],
["TRD", "tucson.png", "Tucson Roller Derby"],
["TST", "saddletramps.jpg", "Tucson Saddle Tramps"],
["TC", "tallcity.png", "Tall City Roller Betties"],
["SS", "ssdd.png", "South Side Derby Dames"],
["WTRD", "wtrd.png", "West Texas Roller Dollz"],
["FDD", "fdd.png", "Faultline Derby Devilz"],
["CHPA", "chupas.png", "New Mexico Chupacabras"],
["TKRD", "tulare-kings.png", "Tulare Kings Roller Derby"],
["CHRY", "cherries.png", "Los Alamos Cherry Bombs"],
["PLG", "plague.png", "Zombie Plague"],
["BDB", "bd-betties.png", "Black Diamond Betties"],
["SKS", "sirens.png", "Sea to Sky Sirens"],
["BBDD", "bbdd.png", "Battle Born Derby Demons"],
["OKVD", "okvd.png", "Oklahoma Victory Dolls"],
["MM", "munecas.png", "Muñecas Muertas"],
["MARI", "marionettes.png", "Albuquerque Marionettes"],
["QSDD", "qsdd.png", "Quad Skate Derby Dames"],
["BWBS", "bwbs.png", "Backwoods Bombshells"],
["CRH", "redhots.png", "Chicago Red Hots"],
["HCRG", "campers.png", "Happy Camper Rollergirls"]
];
teams.sort();
// Add special teams at the beginning
teams.splice(0, 0,
["Blk", "black.png", "Black Team"],
["Wht", "white.png", "White Team"],
["Grn", "green.png", "Green Team"],
["Rng", "orange.png", "Orange Team"],
["Blu", "blue.png", "Blue Team"]
["Blk", "black.png", "Black Team"],
["Wht", "white.png", "White Team"],
["Red", "red.png", "Red Team"],
["Rng", "orange.png", "Orange Team"],
["Ylo", "yellow.png", "Yellow Team"],
["Grn", "green.png", "Green Team"],
["Blu", "blue.png", "Blue Team"],
["Vlt", "violet.png", "Violet Team"]
);

BIN
logos/orange.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.3 KiB

After

Width:  |  Height:  |  Size: 20 KiB

BIN
logos/qsdd.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 944 KiB

BIN
logos/red.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

BIN
logos/redhots.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 70 KiB

BIN
logos/violet.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
logos/white.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 21 KiB

BIN
logos/yellow.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

71
micro.html
View File

@ -1,71 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/scoreboard.css">
<style type="text/css">
body {
background: black;
}
#scoreboard {
font-size: 2em;
text-align: center;
}
#jam, #period {
position: inherit;
margin: inherit;
width: inherit;
left: inherit;
color: white;
}
#jamtext {
font-family: inherit;
font-size: 50%;
margin: inherit;
width: inherit;
position: inherit;
bottom: 0em;
left: 0em;
}
html, p {
padding: 0;
margin: 0;
}
</style>
<script type="text/javascript" src="res/scoreboard.js"></script>
<script type="text/javascript">
jamtext = ["J", "L", "T", "S"];
tenths = false;
</script>
</head>
<body>
<div id="scoreboard">
<p>
<span id="period" onclick="handle(event);">--:--</span>
</p>
<p>
<span id="jamtext">S</span>
<span id="jam" onclick="handle(event);">-:--</span>
</p>
</div>
</body>
</html>

140
penalties.html
View File

@ -1,140 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>LADD Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="res/scoreboard.css">
<style type="text/css">
#jam {
bottom: auto;
top: 2em;
}
#jamtext {
bottom: auto;
top: 1.5em;
}
#jamno {
bottom: auto;
top: 3em;
}
.timeouts {
margin: 0em 6em;
}
.jammer {
margin: 0em 3em;
}
/*
* Penalties
*/
#penalties-a, #penalties-b {
position: absolute;
font-size: 13%;
bottom: 2px;
border-collapse: collapse;
}
#penalties-a {
left: 0;
}
#penalties-b {
right: 0;
}
#penalties td {
cursor: pointer;
border: 1px solid rgba(255, 255, 255, 0.075);
padding: 0;
vertical-align: bottom;
}
#penalties .minors td {
height: 3em;
}
#penalties .majors td {
height: 8em;
}
#penalties .minors div {
background-color: #880;
color: black;
}
#penalties .majors div {
background-color: #800;
}
#penalties .sk8ers td {
font-family: sans-serif;
vertical-align: top;
width: 1em;
line-height: 75%;
}
</style>
<script type="text/javascript" src="logos/logos.js"></script>
<script type="text/javascript" src="res/scoreboard.js"></script>
<script type="text/javascript" src="res/penalties.js"></script>
<script type="text/javascript">
tenths = true;
</script>
</head>
<body>
<div id="scoreboard">
<p class="left">
<img class="logo" id="logo-a" src="" alt="A" onclick="handle(event);">
<span class="timeouts" id="timeouts-a" onclick="handle(event);">0</span>
<span class="jammer" id="jammer-a" onclick="handle(event);">★</span>
<span class="score" id="score-a" onclick="handle(event);">-</span>
</p>
<p class="center">
<span id="period" onclick="handle(event);">--:--</span>
<span id="jam" onclick="handle(event);">-:--.-</span>
<span id="jamtext" onclick="handle(event);"></span>
<span id="jamno" onclick="handle(event);">0</span>
</p>
<p class="right">
<img class="logo" id="logo-b" src="" alt="B" onclick="handle(event);">
<span class="timeouts" id="timeouts-b" onclick="handle(event);">0</span>
<span class="jammer" id="jammer-b" onclick="handle(event);">★</span>
<span class="score" id="score-b" onclick="handle(event);">-</span>
</p>
</div>
<div id="penalties">
<table id="penalties-a">
<tr class="majors"></tr>
<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="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>

BIN
res/BadGirl.swf
View File

Binary file not shown.

BIN
res/FasterFaster.swf
View File

Binary file not shown.

BIN
res/HolyShot.swf
View File

Binary file not shown.

BIN
res/Ouch.swf
View File

Binary file not shown.

BIN
res/Pow.swf
View File

Binary file not shown.

BIN
res/Zounds.swf
View File

Binary file not shown.

30
res/adverts.js
View File

@ -1,30 +0,0 @@
var advert_num = 100
var advert_itimer
function adverterror() {
if (advert_num > 1) {
advert_num = 1
rotate_advert()
} else {
var e = document.getElementById("advert")
clearInterval(advert_itimer)
e.style.visibility = "hidden"
}
}
function rotate_advert() {
var e = document.getElementById("advert")
var sn
if (advert_num < 10) {
sn = "0" + advert_num
} else {
sn = advert_num
}
e.src = "ads/ad" + sn + ".jpg"
advert_num = advert_num + 1
}
advert_itimer = setInterval(rotate_advert, 15000)

BIN
res/icon.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.0 KiB

After

Width:  |  Height:  |  Size: 5.6 KiB

98
res/jammer.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 11 KiB

58
res/kitty.svg
View File

@ -15,10 +15,10 @@
viewBox="-187.81991 -187.81991 1165.08 1165.222"
id="svg10326"
inkscape:version="0.48.4 r9939"
sodipodi:docname="hellokitty.svg"
inkscape:export-filename="/home/neale/src/scoreboard/res/icon.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
sodipodi:docname="kitty.svg"
inkscape:export-filename="/home/neale/src/scoreboard/logos/violet.png"
inkscape:export-xdpi="299.61871"
inkscape:export-ydpi="299.61871">
<metadata
id="metadata18">
<rdf:RDF>
@ -40,18 +40,18 @@
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="788"
inkscape:window-height="882"
inkscape:window-width="1077"
inkscape:window-height="805"
id="namedview16"
showgrid="false"
inkscape:object-paths="true"
inkscape:zoom="1.03"
inkscape:cx="72.473605"
inkscape:cy="18.300614"
inkscape:window-x="0"
inkscape:window-y="14"
inkscape:zoom="4.12"
inkscape:cx="66.601148"
inkscape:cy="63.446618"
inkscape:window-x="7"
inkscape:window-y="20"
inkscape:window-maximized="0"
inkscape:current-layer="svg10326" />
inkscape:current-layer="g3123" />
<defs
id="defs10328" />
<g
@ -62,7 +62,7 @@
inkscape:connector-curvature="0"
id="path3836"
d="M 942.80005,-2006.7798 C 786.58839,702.685 4002.3946,664.9787 4444.0965,654.2055 c 441.702,-10.7732 3786.7868,5.3866 3522.8429,-2725.6246 -393.2225,-2246.2163 -2082.6716,-2161.2958 -3436.6571,-2165.4172 -1408.0332,-4.286 -3388.1777,296.2636 -3587.48225,2230.0565 z"
style="fill:#707070;fill-opacity:1;stroke:#000000;stroke-width:200.27253723;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
style="fill:#808080;fill-opacity:1;stroke:#000000;stroke-width:200.27253723000001173;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
<path
d="m 2371.3064,-1356.7112 c 0,0 37,241 193,290 0,0 73,22 147,-7 0,0 72,-28 119,-93 0,0 45,-63 54,-158 0,0 7,-66 -3,-173 0,0 -15,-74 -54,-134 0,0 -44,-68 -106,-96 0,0 -469.1426,-162.9385 -512.9158,-114.6523 -43.7732,48.2862 299.5961,136.972 251.5961,161.972 0,0 -114.6803,86.6803 -88.6803,323.6803"
id="path2995"
@ -90,7 +90,7 @@
inkscape:connector-curvature="0"
id="path3062"
d="m 1449.1414,-3137.9679 0,1249.6936 -754.12537,0 C 1082.8519,-6391.4802 7762.2483,-6434.5732 8354.7753,-2049.8727 l -797.2182,0 -21.5464,-1012.6826 c -743.3522,312.4234 -4729.4435,290.8768 -6086.8693,-75.4126 z"
style="fill:#2e2e2c;fill-opacity:1;stroke:none" />
style="fill:#333333;fill-opacity:1;stroke:none" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
@ -132,25 +132,29 @@
inkscape:connector-curvature="0"
id="path3852"
d="m 3767.3612,-2871.1229 c 0,-355.5162 212.3876,-2250.1385 330.8931,-2411.7368 l 1217.2588,55.9985 c -107.7322,301.6501 -311.2826,1811.3539 -257.4165,2382.3345 z"
style="fill:#b7b7b7;fill-opacity:1;fill-rule:nonzero;stroke:none" />
style="fill:#cccccc;fill-opacity:1;fill-rule:nonzero;stroke:none" />
<path
style="fill:none;stroke:#000000;stroke-width:200.27253723;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
d="m 1449.1414,-3137.9679 0,1249.6936 -754.12537,0 C 1082.8519,-6391.4802 7762.2483,-6434.5732 8354.7753,-2049.8727 l -797.2182,0 -21.5464,-1012.6826 c -743.3522,312.4234 -4729.4435,290.8768 -6086.8693,-75.4126 z"
id="path3856"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccc" />
<path
sodipodi:nodetypes="cccc"
inkscape:connector-curvature="0"
id="path9502"
d="m 5838.2978,-4701.1388 c 537.8182,102.8903 1300.7265,561.6477 1626.8271,911.5751 39.6465,-458.826 14.7488,-1033.8964 -245.3019,-1379.9002 -394.3676,-57.2371 -1037.4309,280.0147 -1381.5252,468.3251 z"
style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:200.27253723;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
<path
style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:200.27253723;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
d="m 3397.0185,-4731.6101 c -537.8182,102.8903 -1300.7265,561.6477 -1626.8271,911.5751 -39.6465,-458.826 -14.7488,-1033.8963 245.3019,-1379.9001 394.3676,-57.2372 1037.4309,280.0146 1381.5252,468.325 z"
id="path3850"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccc" />
<g
id="g3003"
style="fill:#666666;fill-opacity:1">
<path
style="fill:#666666;fill-opacity:1;stroke:#000000;stroke-width:200.27253723000001173;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
d="m 5838.2978,-4701.1388 c 537.8182,102.8903 1300.7265,561.6477 1626.8271,911.5751 39.6465,-458.826 14.7488,-1033.8964 -245.3019,-1379.9002 -394.3676,-57.2371 -1037.4309,280.0147 -1381.5252,468.3251 z"
id="path9502"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccc" />
<path
sodipodi:nodetypes="cccc"
inkscape:connector-curvature="0"
id="path3850"
d="m 3397.0185,-4731.6101 c -537.8182,102.8903 -1300.7265,561.6477 -1626.8271,911.5751 -39.6465,-458.826 -14.7488,-1033.8963 245.3019,-1379.9001 394.3676,-57.2372 1037.4309,280.0146 1381.5252,468.325 z"
style="fill:#666666;fill-opacity:1;stroke:#000000;stroke-width:200.27253723000001173;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
</g>
</g>
</svg>
<!-- version: 20090314, original size: 8945 6260.6636, border: 3% -->

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 8.6 KiB

143
res/others.html
View File

@ -1,143 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Free Derby Scoreboard Software</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<style type="text/css">
table {
border-collapse: collapse;
}
td {
border: solid white 1px;
}
</style>
</head>
<body>
<h1>Free Derby Scoreboard Software</h1>
<p>
This is a list of no-cost roller derby scoreboard software I have
found. Mine is at the top, because I think it's the best. I might
be wrong, though! Try the rest out and see for yourself.
</p>
<table>
<tr>
<th>Name</th>
<th>Source?</th>
<th>Platform</th>
<th>Windows</th>
<th>Notes</th>
</tr>
<tr>
<td><a href="http://woozle.org/scoreboard/">LADD Scoreboard</a></td>
<td>YES</td>
<td>JavaScript (web browser)</td>
<td>1</td>
<td>Easy to operate, easy to read; also, I wrote it :)</td>
</tr>
<tr>
<td><a href="http://poang.gg/">POÄNG</a> (formerly <a href="http://www.david.kleinschmidt.name/qcrg-scoreboard/">QCRG Scoreboard</a>)</td>
<td>YES</td>
<td>Adobe AIR</td>
<td>2</td>
<td>Nice clean layout</td>
</tr>
<tr>
<td><a href="http://sourceforge.net/projects/derbyscoreboard/">CRD Scoreboard</a></td>
<td>YES</td>
<td>Java</td>
<td>2</td>
<td>Interesting cli/srv model allowing multiple operators on a LAN</td>
</tr>
<tr>
<td><a href="http://labs.metro-six.com/derbyscore/">Derby Score</a></td>
<td>YES</td>
<td>Java</td>
<td>2</td>
<td>Could use some visual polish, but I like the author's attitude</td>
</tr>
<tr>
<td><a href="http://rdnation.com/roller-derby-scoreboard">Thor's Hammer</a></td>
<td>no</td>
<td>Windows</td>
<td>2</td>
<td></td>
</tr>
<tr>
<td><a href="http://www.rollerderbyproductions.com/">JamTracker</a></td>
<td>no</td>
<td>Adobe AIR</td>
<td>2</td>
<td>Busy layout</td>
</tr>
<tr>
<td><a href="http://www.rinxter.com/">Rinxter</a></td>
<td>no?</td>
<td>Windows</td>
<td>2</td>
<td>If Oracle made a scoreboard, this would be it. It's <strong>massive</strong>: generates reports!</td>
</tr>
<tr>
<td><a href="http://www.zebrahuddle.com/index.php?action=downloads;sa=view&id=1">DerbyBoard</a></td>
<td>no</td>
<td>Windows</td>
<td>2</td>
<td>What an incredible waste of screen real estate! I hope you play somewhere very dark.</td>
</tr>
<tr>
<td><a href="http://www.pcscoreboards.com/rollerderbyscoreboardpro/">Scoreboard Pro</a></td>
<td>no</td>
<td>Windows</td>
<td>2</td>
<td>The author does not appear to have read WFTDA's rules.</td>
</table>
<dl>
<dt>Source?</dt>
<dd>
Whether you can download and modify the source code. Important to
many nerds like myself.
</dd>
<dt>Platform</dt>
<dd>
What you need to buy/install before you can run it.
</dd>
<dt>Windows</dt>
<dd>
<dl>
<dt>1</dt>
<dd>
Operator interacts directly with the image on the projector.
What you see is what the audience sees.
</dd>
<dt>2</dt>
<dd>
Separate interface for operator and audience, like an old-school
7-panel display scoreboard. What you see is a control panel;
the audience sees something different.
</dd>
</dl>
</dd>
</dl>
<address>
Neale Pickett &lt;<a href="mailto:neale&#64;woozle&#46;org">neale&#64;woozle&#46;org</a>&gt;
</address>
</body>
</html>

161
res/penalties.js
View File

@ -1,161 +0,0 @@
/***********************************
* Penalties
*/
function penalties (team) {
var table = document.getElementById("penalties-" + team);
var majors = table.getElementsByClassName("majors")[0];
var sk8ers = table.getElementsByClassName("sk8ers")[0];
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,
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 majors = table.getElementsByClassName("majors")[0];
var sk8ers = table.getElementsByClassName("sk8ers")[0];
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(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 == "majors") {
val = ((div.value || 0) + inc + 9) % 9;
} else if (state == SETUP) {
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 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 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);
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));
}
}

BIN
res/scoreboard-explained.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 47 KiB

38
res/scoreboard.css
View File

@ -20,6 +20,16 @@ body {
margin: 0;
}
input {
font: inherit;
}
input[readonly] {
color: inherit;
background: inherit;
border: inherit;
}
#scoreboard {
cursor: default;
font-family: sans-serif;
@ -106,11 +116,11 @@ body {
position: absolute;
bottom: 0em;
left: 50%;
width: 3em;
margin-left: -1.5em;
width: 3.5em;
margin-left: -1.75em;
}
#jamtext, #periodtext {
#jamtext, #periodtext, #preset {
text-align: center;
font-family: PermanentMarker, sans-serif;
font-weight: normal;
@ -126,6 +136,11 @@ body {
top: 1.4em;
}
#preset {
top: 40%;
color: cyan;
}
#jamtext {
bottom: 1.4em;
}
@ -193,17 +208,16 @@ body {
* Notices
*/
#notice {
display: none;
position: absolute;
bottom: 1.3em;
left: 50%;
width: 4em;
display: none;
position: absolute;
bottom: 1.3em;
left: 50%;
width: 4em;
height: 3em;
margin-left: -2em;
margin-left: -2em;
text-align: center;
}
#notice embed {
width: 100%;
#notice img {
height: 100%;
}

236
res/scoreboard.js
View File

@ -26,13 +26,15 @@
/* Times for various rulesets */
var presets = [
["WFTDA", 1800, 120, 30],
["USARS", 1800, 90, 30],
["MADE", 900, 90, 30]
["WFTDA", 30 * 60 * 1000, 120 * 1000, 30 * 1000, 3],
["USARS", 30 * 60 * 1000, 90 * 1000, 30 * 1000, 3],
["RDCL", 15 * 60 * 1000, 60 * 1000, 30 * 1000, 3],
["MADE", 15 * 60 * 1000, 90 * 1000, 30 * 1000, 1]
];
var period_time = presets[0][1] * 1000;
var jam_time = presets[0][2] * 1000;
var lineup_time = presets[0][3] * 1000;
var period_time;
var jam_time;
var lineup_time;
var timeouts;
/* State names */
var SETUP = 0;
@ -41,10 +43,10 @@ var LINEUP = 2;
var TIMEOUT = 3;
var periodtext = [
chrome.i18n.getMessage("timeToGame"),
chrome.i18n.getMessage("period1"),
chrome.i18n.getMessage("halftime"),
chrome.i18n.getMessage("period2")
chrome.i18n.getMessage("period2"),
chrome.i18n.getMessage("timeToGame")
];
var jamtext = [
chrome.i18n.getMessage("jam"),
@ -66,9 +68,16 @@ function update() {
}
}
function e(id) {
ret = document.getElementById(id);
if (! ret) {
return Array();
}
return ret;
}
// Create a timer on [element].
// If [callback] is defined, call it when time runs out.
function startTimer(element, callback) {
function startTimer(element) {
var startTime;
var running = false;
var set_duration = 0;
@ -76,28 +85,30 @@ function startTimer(element, callback) {
var className;
// Re-calculate and update displayed time
function refresh () {
var remain = Math.abs(Math.ceil(element.remaining() / 1000));
var min = Math.floor(remain / 60);
var sec = remain % 60;
function refresh (force) {
var remain = Math.ceil(element.remaining() / 1000);
var min = Math.floor(Math.abs(remain) / 60);
var sec = Math.abs(remain) % 60;
if (! running) {
element.className = className + " paused";
if (! force) {
return;
}
}
// Set classes
element.className = className;
if ((! className) && (remain <= 20)) {
element.className += " lowtime";
}
if (! running) {
element.className += " paused";
element.className = className + " lowtime";
} else {
element.className = className;
}
// Has the timer run out?
if ((set_duration > 0) && (remain <= 0)) {
duration = 0;
sec = 0;
running = false;
if (callback) {
callback();
}
element.stop();
}
sec = Math.ceil(sec);
@ -107,11 +118,23 @@ function startTimer(element, callback) {
}
var t = min + ":" + sec;
if (t != element.innerHTML) {
element.innerHTML = t;
if (t != element.value) {
element.value = t;
}
}
function inputHandler() {
var t = element.value.split(":");
var sec = (Number(t[0]) * 60) + Number(t[1]);
if (isNaN(sec) || (sec <= 0) || (sec > (59 * 60))) {
// Ignore goofy values
return;
}
element.set(sec * 1000, className);
}
// Return remaining time in milliseconds
element.remaining = function() {
if (running) {
@ -129,7 +152,8 @@ function startTimer(element, callback) {
set_duration = t;
duration = t;
className = cn;
refresh();
refresh(true);
}
// Start timer
@ -150,6 +174,9 @@ function startTimer(element, callback) {
refresh();
}
element.readOnly = true;
element.addEventListener("input", inputHandler);
timer_updates.push(refresh);
}
@ -164,10 +191,6 @@ function transition(newstate) {
return;
}
if ((state == SETUP) && window.penalties) {
penalties_duck();
}
state = newstate;
if (state == JAM) {
@ -177,11 +200,13 @@ function transition(newstate) {
jtext.innerHTML = jamtext[0];
jamno += 1;
jno.innerHTML = jamno;
pt.readOnly = true;
} else if (state == LINEUP) {
pt.start();
jt.set(lineup_time, "lineup");
jt.start();
jtext.innerHTML = jamtext[1];
pt.readOnly = true;
} else if (state == TIMEOUT) {
pt.stop();
if (pt.remaining() <= 0) {
@ -190,11 +215,13 @@ function transition(newstate) {
jt.set(0, "timeout");
jt.start();
jtext.innerHTML = jamtext[2];
pt.readOnly = false;
}
// Reset lead jammer indicators
e("jammer-a").className = "";
e("jammer-b").className = "";
e("preset").style.display = "none";
save();
}
@ -205,32 +232,27 @@ function transition(newstate) {
* Notices
*/
var notices = [
false,
'<embed src="res/Zounds.swf" type="text/html">',
'<embed src="res/Ouch.swf" type="text/html">',
'<embed src="res/Pow.swf" type="text/html">',
'<embed src="res/HolyShot.swf" type="text/html">',
'<embed src="res/FasterFaster.swf" type="text/html">',
'<embed src="res/BadGirl.swf" type="text/html">',
'<embed src="res/banana.gif" type="image/gif">',
];
var notices = {
"banana": '<img src="res/banana.gif">'
};
var notice_timer;
function notice_expire() {
var c = document.getElementById("notice");
var c = e("notice");
c.innerHTML = "";
c.style.display = "none";
}
function notice(n) {
var c = document.getElementById("notice");
var c = e("notice");
c.style.display = "block";
if (notices[n]) {
c.innerHTML = notices[n];
if (c.innerHTML != notices[n]) {
c.innerHTML = notices[n];
c.style.display = "block";
}
clearTimeout(notice_timer);
notice_timer = setTimeout(function() {notice_expire()}, 8000);
} else {
@ -238,16 +260,9 @@ function notice(n) {
}
}
function e(id) {
ret = document.getElementById(id);
if (! ret) {
return Array();
}
return ret;
}
function score(team, points) {
var te = document.getElementById("score-" + team);
var te = e("score-" + team);
var ts = Number(te.innerHTML);
ts += points;
@ -287,12 +302,7 @@ function handle(event) {
name = t[0];
e("name-" + team).innerHTML = name;
tgt.src = "logos/" + t[1];
if (window.penalties) {
penalties_setTeamName(team, t[0]);
}
} else {
score(team, -adj);
}
@ -307,7 +317,9 @@ function handle(event) {
var v = Number(tgt.innerHTML);
v -= adj;
if (v == -1) v = 3;
if (v == -1) {
v = timeouts;
}
tgt.innerHTML = v;
break;
case "period":
@ -350,6 +362,9 @@ function handle(event) {
score(team, adj);
}
break;
case "preset":
load_preset(+1);
break;
case "close":
window.close();
break;
@ -379,12 +394,18 @@ function key(event) {
case 190:
c = ".";
break;
case 221:
c = e.shiftKey ? "}" : "]";
case 191:
c = "/";
break;
case 219:
c = e.shiftKey ? "{" : "[";
break;
case 221:
c = e.shiftKey ? "}" : "]";
break;
case 222:
c = e.shiftKey ? "\"" : "'";
break;
default:
if ((k >= 48) && (k <= 90)) {
c = String.fromCharCode(k);
@ -399,19 +420,17 @@ function key(event) {
bige = e;
console.log("Key " + k + " pressed: " + c + " === " + e.which);
switch (c) {
case "up":
if ((state == TIMEOUT) || (state == SETUP)) {
var pt = document.getElementById("period");
var pt = e("period");
var rem = pt.remaining();
pt.set(rem + 1000);
}
break;
case "down":
if ((state == TIMEOUT) || (state == SETUP)) {
var pt = document.getElementById("period");
var pt = e("period");
var rem = pt.remaining();
pt.set(rem - 1000);
}
@ -430,15 +449,15 @@ function key(event) {
case "[":
score('a', 1);
break;
case "b":
case "'":
case "]":
score('b', 1);
break;
case "A":
case "z":
case "{":
score('a', -1);
break;
case "B":
case "/":
case "}":
score('b', -1);
break;
@ -448,19 +467,9 @@ function key(event) {
case ".":
leadJammer('b');
break;
case "1":
case "2":
case "3":
case "4":
case "5":
case "6":
case "7":
case "8":
case "9":
case "0":
var n = Number(c);
window.notice(n);
case "g":
window.notice("banana");
break;
}
transition(newstate);
@ -470,9 +479,7 @@ function key(event) {
function save() {
chrome.storage.local.set(
{
"period_time": period_time,
"jam_time": jam_time,
"lineup_time": lineup_time,
"preset": e("preset").innerHTML,
"logo_a": e("logo-a").src,
"logo_b": e("logo-b").src,
@ -485,35 +492,64 @@ function save() {
);
}
function load_preset(preset_name) {
var inc = false;
var pn = 0;
if (preset_name == +1) {
preset_name = e("preset").innerHTML;
inc = true;
}
for (var i in presets) {
if (presets[i][0] == preset_name) {
pn = Number(i);
break;
}
}
if (inc) {
pn = (pn + 1) % presets.length;
}
preset_name = presets[pn][0];
period_time = presets[pn][1];
jam_time = presets[pn][2];
lineup_time = presets[pn][3];
timeouts = presets[pn][4];
e("preset").innerHTML = preset_name;
e("jam").set(jam_time);
e("period").set(period_time);
e("timeouts-a").innerHTML = timeouts;
e("timeouts-b").innerHTML = timeouts;
e("score-a").innerHTML = 0;
e("score-b").innerHTML = 0;
}
function load() {
function load_cb(state) {
period_time = state.period_time;
jam_time = state.jam_time;
lineup_time = state.lineup_time;
load_preset(state.preset);
e("period").set((state.period_clock >= 0) ? state.period_clock : period_time);
e("logo-a").src = state.logo_a;
e("logo-b").src = state.logo_b;
e("score-a").innerHTML = state.score_a;
e("score-b").innerHTML = state.score_b;
e("timeouts-a").innerHTML = state.timeouts_a;
e("timeouts-b").innerHTML = state.timeouts_b;
var p = e("period");
startTimer(p);
p.set(state.period_clock);
e("timeouts-a").innerHTML = (state.timeouts_a >= 0) ? state.timeouts_a : timeouts;
e("timeouts-b").innerHTML = (state.timeouts_b >= 0) ? state.timeouts_b : timeouts;
}
chrome.storage.local.get({
"period_clock": period_time,
"preset": presets[0][0],
"period_clock": -1,
"score_a": 0,
"score_b": 0,
"logo_a": "logos/black.png",
"logo_b": "logos/white.png",
"timeouts_a": 3,
"timeouts_b": 3,
"period_time": period_time,
"jam_time": jam_time,
"lineup_time": lineup_time
"timeouts_a": -1,
"timeouts_b": -1
}, load_cb);
}
@ -542,14 +578,18 @@ function start() {
ei("jam");
ei("prefs");
ei("close");
ei("preset");
ei("periodtext").innerHTML = periodtext[period];
ei("jamtext").innerHTML = jamtext[3];
transition();
var p = e("period");
startTimer(p);
p.readOnly = false;
var j = e("jam");
startTimer(j);
j.set(jam_time);
update_itimer = setInterval(update, 200); // 5 times a second

BIN
res/screenshot.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 65 KiB

2
res/todo.txt
View File

@ -1,2 +0,0 @@
* When period ends and jam timer is toggled, period clock should not count up
* Auto-scale (3-digit score wrapped in Taos)

223
res/usage.html
View File

@ -1,223 +0,0 @@
<!DOCTYPE html>
<!--
Roller Derby Scoreboard Copyright © 2011 Neale Pickett
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful, but
WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
<http://www.gnu.org/licenses/>.
-->
<html>
<head>
<title>Using the LADD Roller Derby Scoreboard</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Using the LADD Roller Derby Scoreboard</h1>
<img src="scoreboard-explained.png" alt="Annotated scoreboard"
style="border: solid black 2px;">
<p>
If you don't like reading manuals, just start clicking on things;
it's supposed to be easy to figure out.
</p>
<dl>
<dt>Space Bar</dt>
<dd>Switch between Jam and Rotation</dd>
<dt>T</dt>
<dd>Enter timeout</dd>
<dt>A / Shift-A</dt>
<dd>Add / subtract a point on the left</dd>
<dt>B / Shift-B</dt>
<dd>Add / subtract a point on the right</dd>
<dt>F5</dt>
<dd>Enter Setup mode</dd>
</dl>
<h1>Setup</h1>
<ul>
<li>
When the state indicator says "Setup", you can click on almost
anything to change it.
</li>
<li>
Set the logo before you change the team name.
</li>
<li>
If your team's logo and name isn't in <a href="../logos/logos.html">the
list</a>, please email them to me so I can add them.
<li>
Reload the page (click "Reload" or type F5) to get back to Setup
mode. Scores, timeouts, and period clock time are all saved.
</li>
<li>
Type Space Bar or click the jam clock to begin the first jam.
</li>
</ul>
<h1>Running Jams</h1>
<ul>
<li>
Press Space Bar or click the jam clock to switch between 2:00
jams and 0:30 rotations.
</li>
<li>
Type "A" or "B" to add points to a team's score. You can also
click a score to add a point.
</li>
<li>
Type "Shift+A" or "Shift+B" to remove points from a team's
score. You can also click a team logo to remove a point.
</li>
</ul>
<h1>Timeouts</h1>
<ul>
<li>
Type "T" or click the period clock to enter into a timeout.
</li>
<li>
Click a team's timeout count to remove one from it. If it's at
0, click it to reset it to 3.
</li>
<li>
Click the period clock during a timeout to change the time left
in the period.
</li>
<li>
Type Space Bar or click the jam clock to exit timeout mode and
start the next jam.
</li>
</ul>
<h1>Periods</h1>
<ul>
<li>
Go into Timeout mode to re-set the period clock to 30:00. Click
it to change it to a different time.
</li>
<li>
Click the period indicator to cycle between "Period 1",
"Halftime", "Period 2", and "Break".
</li>
</ul>
<h1>Other cases</h1>
<dl>
<dt>Halftime / Double-header break</dt>
<dd>
<ol>
<li>Type "T" to enter timeout mode.</li>
<li>Click the period indicator until it says "Halftime" or
"Break"</li>
<li>Click the period clock.</li>
<li>Enter the duration of the break.</li>
<li>Type Space Bar to start counting down.</li>
<li>It's okay to let the jam clock reach 0:00.</li>
</ol>
</dd>
<dt>20-minute periods</dt>
<dd>
<ol>
<li>During Setup or Timeout, click the period clock.</li>
<li>Enter "20:00" for the new time.</li>
<li>Click the period indicator until it displays the
right period.</li>
</ol>
</dd>
</dl>
<h1>Advanced Tips</h1>
<ul>
<li>
Hold down the "Shift" key to make counters, logos, etc. go the
other direction.
</li>
<li>
Hold down the "Ctrl" or "Alt" key while clicking a team logo in
Setup mode to provide a URL.
</li>
<li>
Hold down the "Ctrl" or "Alt" key while clicking the period
indicator to change it to any text.
</li>
<li>
Timeouts can exceed three by clicking them while holding the
"Shift" key.
</li>
<li>
You can leave off minutes or seconds if they're zero: "30:" is
the same as "30:00", and "19" is the same as "0:19".
</li>
<li>
If part of the scoreboard changes background color, click
(without shift) somewhere on the background to get it back to
normal. It changed color because your browser was selecting
that part of the page for copy and paste!
</li>
</ul>
<h1>Customizing</h1>
<p>
If you use this, I want to add your logo and the logos of the
teams you play to the <a href="../logos/logos.html">included set of
logos</a>.
</p>
<p>
The scoreboard is written in HTML5, CSS, and JavaScript, so a web
designer should be able to season to taste. Send me what you come
up with, I want to see it!
</p>
<h1>If you have problems</h1>
<p>
If something goes wrong, please email me (link below) with as much
detail as you can remember, and I'll try to fix it for you and
everybody else. For example:
</p>
<blockquote>
<p>
I clicked the period timer during a timeout and the Team A logo
turned into a photo of a burrito.
</p>
</blockquote>
<h1>Enjoy!</h1>
<address>Neale Pickett <a href="mailto:neale&#64;woozle.org">&lt;neale&#64;woozle.org&gt;</a></address>
</body>
</html>

5
scoreboard.html
View File

@ -34,9 +34,10 @@
</p>
<p class="center">
<span id="period">--:--</span>
<input id="period" value="--:--">
<span id="periodtext"></span>
<span id="jam">-:--.-</span>
<span id="preset">-</span>
<input id="jam" value="-:--">
<span id="jamtext"></span>
</p>