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

Working with new codebase

This commit is contained in:
Neale Pickett 2014-02-15 19:50:16 -07:00
parent 2d13a91e62
commit e4b7164c3e
4 changed files with 58 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
res/background.js
View File

@ -1,5 +1,8 @@
chrome.app.runtime.onLaunched.addListener(function() { chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('res/scoreboard.html', { chrome.app.window.create('res/scoreboard.html', {
'state': 'fullscreen' "bounds": {
"height": 100,
"width": 450
}
}) })
}) })

29
res/scoreboard.css
View File

@ -34,11 +34,21 @@ input {
display: inline; display: inline;
} }
.kitty, .img { .team .logo {
position: absolute; position: absolute;
left: -10000px; left: 10%;
} }
.team .logo * {
display: none;
}
.team .color {
display: inline;
width: 0.5em;
margin-top: 0.60em;
}
.team { .team {
position: absolute; position: absolute;
left: 0; left: 0;
@ -56,12 +66,10 @@ input {
#team-a { #team-a {
top: 0; top: 0;
background: #6c6;
} }
#team-b { #team-b {
top: 50%; top: 50%;
background: #c44;
} }
.name { .name {
@ -94,12 +102,16 @@ input {
} }
#clocks * { .clocks * {
position: absolute; position: absolute;
right: 0.1em; right: 0.1em;
text-align: right; text-align: right;
} }
.setup {
background-color: rgba(0, 255, 0, 0.2);
}
#period { #period {
top: -0.2em; top: -0.2em;
} }
@ -109,6 +121,7 @@ input {
} }
#jamtext { #jamtext {
display: none;
color: #cc0; color: #cc0;
bottom: 0.1em; bottom: 0.1em;
right: 3em; right: 3em;
@ -121,8 +134,10 @@ input {
} }
#preset { #preset {
top: 1em; font-size: 40%;
right: 3em; bottom: 45%;
left: 5%;
right: auto;
} }
#close { #close {

8
res/scoreboard.html
View File

@ -24,14 +24,12 @@
<script type="text/javascript" src="kitty.js"></script> <script type="text/javascript" src="kitty.js"></script>
<script type="text/javascript" src="scoreboard.js"></script> <script type="text/javascript" src="scoreboard.js"></script>
</head> </head>
<body> <body data-x="13" data-y="3">
<div id="scoreboard"> <div id="scoreboard">
<div class="team" id="team-a"> <div class="team" id="team-a">
<span class="jammer" id="jammer-a">★</span> <span class="jammer" id="jammer-a">★</span>
<input class="name" id="name-a" value="HOME"> <input class="name" id="name-a" value="HOME">
<div class="logo" id="logo-a"> <div class="logo" id="logo-a">
<img class="img" id="img-a" src="" alt="A">
<canvas class="kitty" id="kitty-a"></canvas>
<input type="color" class="setup color" id="color-a" value="#666666"> <input type="color" class="setup color" id="color-a" value="#666666">
<input type="image" class="setup load" id="load-a" src="ic_picture.png"> <input type="image" class="setup load" id="load-a" src="ic_picture.png">
</div> </div>
@ -41,10 +39,8 @@
<div class="team" id="team-b"> <div class="team" id="team-b">
<span class="jammer" id="jammer-b">★</span> <span class="jammer" id="jammer-b">★</span>
<input class="name" id="name-b" value="HOME"> <input class="name" id="name-b" value="VIS">
<div class="logo" id="logo-b"> <div class="logo" id="logo-b">
<img class="img" id="img-b" src="" alt="B">
<canvas class="kitty" id="kitty-b"></canvas>
<input type="color" class="setup color" id="color-b" value="#ffffff"> <input type="color" class="setup color" id="color-b" value="#ffffff">
<input type="image" class="setup load" id="load-b" src="ic_picture.png"> <input type="image" class="setup load" id="load-b" src="ic_picture.png">
</div> </div>

43
res/scoreboard.js
View File

@ -225,8 +225,8 @@ function transition(newstate) {
} }
// Reset lead jammer indicators // Reset lead jammer indicators
e("jammer-a").className = ""; e("jammer-a").className = "jammer";
e("jammer-b").className = ""; e("jammer-b").className = "jammer";
var setupElements = document.getElementsByClassName("setup") var setupElements = document.getElementsByClassName("setup")
for (var i = 0; i < setupElements.length; i += 1) { for (var i = 0; i < setupElements.length; i += 1) {
@ -287,11 +287,11 @@ function score(team, points) {
function leadJammer(team) { function leadJammer(team) {
tgt = e("jammer-" + team); tgt = e("jammer-" + team);
var on = ! tgt.className; var on = (tgt.className.indexOf("lead") == -1);
e("jammer-a").className = ""; e("jammer-a").className = "jammer";
e("jammer-b").className = ""; e("jammer-b").className = "jammer";
if (on) tgt.className = "lead"; if (on) tgt.className = "lead jammer";
} }
function changeLogo(team) { function changeLogo(team) {
@ -622,21 +622,38 @@ function start() {
} }
function fgColor(color) {
var v = 0
for (var i = 0; i < 3; i += 1) {
v += parseInt(color.substr(1+i*2, 2), 16)
}
if (v / 3 >= 0x88) {
return "#000000"
} else {
return "#ffffff"
}
}
function recolor(team) { function recolor(team) {
var i = e("img-" + team) var i = e("img-" + team)
var k = e("kitty-" + team) var k = e("kitty-" + team)
var n = e("name-" + team) var t = e("team-" + team)
var color = e("color-" + team).value var color = e("color-" + team).value
i.style.display = "none" if (k.style) {
k.style.display = "inline" i.style.display = "none"
n.style.backgroundColor = color k.style.display = "inline"
kitty(k.getContext("2d"), color) kitty(k.getContext("2d"), color)
} else {
t.style.backgroundColor = color
t.style.color = fgColor(color)
}
} }
function resize() { function resize() {
var w = window.innerWidth / 7 var w = window.innerWidth / Number(document.body.getAttribute("data-x") || 7)
var h = window.innerHeight / 5 var h = window.innerHeight / Number(document.body.getAttribute("data-y") || 5)
var fs = Math.min(w, h) var fs = Math.min(w, h)
document.body.style.fontSize = Math.min(w, h) + 'px' document.body.style.fontSize = Math.min(w, h) + 'px'