Store colors on disk & more

This commit is contained in:
Neale Pickett 2010-09-09 15:14:39 -06:00
parent 4bc5ba6eb3
commit fd8f53dae3
5 changed files with 113 additions and 100 deletions

View File

@ -1,7 +1,7 @@
#ifndef __COMMON_H__ #ifndef __COMMON_H__
#define __COMMON_H__ #define __COMMON_H__
#define teamdir "/var/lib/ctf/teams" #define teamdir "/var/lib/ctf/teams/names"
#define pointsdir "/var/lib/ctf/points/new" #define pointsdir "/var/lib/ctf/points/new"
int team_exists(char *teamhash); int team_exists(char *teamhash);

View File

@ -8,6 +8,38 @@ fi
# Don't overwrite files # Don't overwrite files
set -C set -C
# Assign a color. I spent two days selecting this color pallette for
# people with protanopia. Please don't change these colors.
nteams=$(ls /var/lib/ctf/teams/names/ | wc -l)
case $(expr $nteams % 15) in
0) color=8c7a69 ;;
1) color=7f7062 ;;
2) color=79614b ;;
3) color=a59281 ;;
4) color=a59485 ;;
5) color=4a4f5e ;;
6) color=454955 ;;
7) color=343c52 ;;
8) color=696f82 ;;
9) color=6b7182 ;;
10) color=516b55 ;;
11) color=4b614f ;;
12) color=395d3f ;;
13) color=6d8c72 ;;
14) color=708c75 ;;
*)
echo 'ERROR ERROR' 1>&2
echo 'DOES NOT COMPUTE' 1>&2
exit 69
;;
esac
# Compute hash of team name; they'll use this for everything in the
# contest instead of their team name, which makes stuff much easier on
# me since all team hashes are in the set /[0-9a-f]{8}/.
hash=$(echo "$1" | md5sum | cut -b 1-8) hash=$(echo "$1" | md5sum | cut -b 1-8)
echo "$1" > /var/lib/ctf/teams/$hash
echo "$1" > /var/lib/ctf/teams/names/$hash
echo "$color" > /var/lib/ctf/teams/colors/$hash
echo "Registered with hash $hash" echo "Registered with hash $hash"

View File

@ -30,7 +30,7 @@ function escape(s) {
} }
function print_bar(cat, team, n, d) { function print_bar(cat, team, n, d) {
printf("<div class=\"b%s score\"" \ printf("<div class=\"t%s score\"" \
" style=\"height: %.2f%%;\"" \ " style=\"height: %.2f%%;\"" \
" onmouseover=\"highlight('%s')\"" \ " onmouseover=\"highlight('%s')\"" \
" onmouseout=\"restore('%s')\">\n" \ " onmouseout=\"restore('%s')\">\n" \
@ -63,19 +63,6 @@ function output( t, c) {
} }
BEGIN { BEGIN {
# It took me like 7 hours to find a color palette that worked for
# people with protanopia. Don't change these colors.
colors[0] = "33cc33"
colors[1] = "863a3a"
colors[2] = "5c5ce6"
colors[3] = "bfbf4d"
colors[4] = "408080"
colors[5] = "b336b2"
colors[6] = "ffa500"
colors[7] = "00bfff"
colors[8] = "8db6cd"
ncolors = 9
# Only display two decimal places # Only display two decimal places
CONVFMT = "%.2f" CONVFMT = "%.2f"
@ -112,7 +99,7 @@ BEGIN {
getline colors_by_team[team] < fn getline colors_by_team[team] < fn
close(fn) close(fn)
fn = "/var/lib/ctf/teams/" team fn = "/var/lib/ctf/teams/names/" team
getline names_by_team[team] < fn getline names_by_team[team] < fn
close(fn) close(fn)
} }
@ -165,7 +152,7 @@ BEGIN {
print " body { width: 100%; }" print " body { width: 100%; }"
print " .score { overflow: hidden; color: black; }" print " .score { overflow: hidden; color: black; }"
for (team in teams) { for (team in teams) {
printf(" .b%s { background-color: #%s; }\n", printf(" .t%s { background-color: #%s; }\n",
team, colors_by_team[team]) team, colors_by_team[team])
} }
print " </style>" print " </style>"
@ -235,7 +222,7 @@ BEGIN {
print " </tr>" print " </tr>"
print " </table>" print " </table>"
print " <canvas id=\"chart\" width=\"800\" height=\"200\"></canvas>" print " <canvas id=\"chart\" width=\"800\" height=\"400\"></canvas>"
print " </body>" print " </body>"
print "</html>" print "</html>"
} }

View File

@ -1,13 +1,14 @@
/* green phosphor: #2a4 */
/**** document ****/ /**** document ****/
html { html {
background: #222 url(grunge.png) repeat-x; background: #112 url(grunge.png) repeat-x;
} }
body { body {
font-family: sans-serif; font-family: sans-serif;
color: #fff; color: #ddc;
margin: 50px 0 0 110px;
padding: 10px; padding: 10px;
max-width: 700px; max-width: 700px;
} }
@ -17,67 +18,16 @@ body {
h1:first-child { h1:first-child {
text-transform: lowercase; text-transform: lowercase;
font-size: 1.6em; font-size: 1.6em;
/* background-color: #222; */
/* opacity: 0.9; */
padding: 3px; padding: 3px;
color: #2a2;
margin: 0 0 1em 70px; margin: 0 0 1em 70px;
} }
h1:first-child:before { h1:first-child:before {
color: #fff; color: #ddc;
letter-spacing: -0.1em; letter-spacing: -0.1em;
content: "Capture The Flag: "; content: "Capture The Flag: ";
} }
/*** left side bar ***/
#navigation {
position: absolute;
background: #222;
opacity: 0.9;
top: 80px;
left: 0px;
padding: 0;
}
#navigation h3 {
font-size: 100%;
border-bottom: 2px solid #444;
}
#navigation ul {
list-style: none;
padding: 0;
margin: 0;
}
#navigation li a {
display: block;
height: 25px;
width: 90px;
padding: 5px;
margin: 5px;
background: inherit;
border-right: 4px solid #444;
color: #999;
text-transform: lowercase;
font-size: 0.9em;
}
#navigation li a:hover {
color: #f4f4f4;
background: #333;
border-right: 4px solid #2a2;
}
#navigation li .active {
color: #999;
background: #333;
border-right: 4px solid #444;
}
/**** body ****/ /**** body ****/
a img { a img {
@ -86,32 +36,29 @@ a img {
a { a {
text-decoration: none; text-decoration: none;
color: #2a2; color: #b71;
font-weight: bold; font-weight: bold;
} }
a:hover { a:hover {
color: #fff; background: #333;
background: #2a2;
font-weight: bold; font-weight: bold;
} }
h1, h2, h3 { h1, h2, h3 {
color: #999; color: #b71;
letter-spacing: -0.05em; letter-spacing: -0.05em;
} }
.readme { .readme {
color: #fff; background-color: #333;
background-color: #555;
margin: 1em; margin: 1em;
} }
pre { pre {
color: #fff; background-color: #333;
background-color: #222; border: solid #ddc 2px;
border: solid #ccc 2px;
padding: 0.25em; padding: 0.25em;
} }
@ -128,38 +75,81 @@ td {
p { p {
line-height: 1.4em; line-height: 1.4em;
margin-bottom: 20px; margin-bottom: 20px;
color: #f4f4f4;
} }
hr { hr {
border: 1px solid #444; border: 1px solid #ddc;
} }
dt { dt {
white-space: pre; white-space: pre;
background-color: #333;
padding: 5px; padding: 5px;
border: 2px solid green; border: 2px solid #b71;
border-bottom: none; border-bottom: none;
font-weight: bold; font-weight: bold;
} }
dd { dd {
border: 2px solid green; border: 2px solid #b71;
margin: 0px; margin: 0px;
padding: 5px; padding: 5px;
background-color: #282828;
} }
/*** left side bar ***/
#navigation {
position: absolute;
background: HBG;
opacity: 0.9;
top: 80px;
left: 0px;
padding: 0;
}
#navigation h3 {
font-size: 100%;
border-bottom: 2px solid #333;
}
#navigation ul {
list-style: none;
padding: 0;
margin: 0;
}
#navigation li a {
display: block;
height: 25px;
width: 90px;
padding: 5px;
margin: 5px;
border-right: 4px solid #ddc;
text-transform: lowercase;
font-size: 0.9em;
}
#navigation li a:hover {
background: #333;
border-right-color: #b71;
}
/**** special cases ****/ /**** special cases ****/
.wide { .wide {
max-width: inherit; max-width: inherit;
} }
.figure {
margin: 0.5em 1em;
float: right;
font-size: small;
text-align: center;
}
.scoreboard { .scoreboard {
background: #222; background: #112;
} }
.scoreboard td { .scoreboard td {

View File

@ -4,11 +4,15 @@ function dbg(o) {
} }
function torgba(color, alpha) { function torgba(color, alpha) {
if (color.substring(0, 1) == "#") {
var r = parseInt(color.substring(1,3), 16); var r = parseInt(color.substring(1,3), 16);
var g = parseInt(color.substring(3,5), 16); var g = parseInt(color.substring(3,5), 16);
var b = parseInt(color.substring(5,7), 16); var b = parseInt(color.substring(5,7), 16);
return "rgba(" + r + "," + g + "," + b + "," + alpha + ")"; return "rgba(" + r + "," + g + "," + b + "," + alpha + ")";
} else {
return color;
}
} }
function Chart(id, width, height, lines) { function Chart(id, width, height, lines) {
@ -30,7 +34,7 @@ function Chart(id, width, height, lines) {
function draw(color, values) { function draw(color, values) {
var lasty = 0; var lasty = 0;
ctx.strokeStyle = torgba(color, 0.99); ctx.strokeStyle = color;
ctx.lineWidth = 4; ctx.lineWidth = 4;
ctx.beginPath(); ctx.beginPath();
moveTo(values[0][0], 0); moveTo(values[0][0], 0);
@ -81,8 +85,8 @@ function getElementsByClass( searchClass, domNode, tagName) {
} }
function highlight(cls, color) { function highlight(cls, color) {
if (! color) color = "#ffff00"; if (! color) color = "#ffffff";
elements = getElementsByClass("b" + cls); elements = getElementsByClass("t" + cls);
for (i in elements) { for (i in elements) {
e = elements[i]; e = elements[i];
e.style.borderColor = e.style.backgroundColor; e.style.borderColor = e.style.backgroundColor;
@ -92,7 +96,7 @@ function highlight(cls, color) {
} }
function restore(cls) { function restore(cls) {
elements = getElementsByClass("b" + cls); elements = getElementsByClass("t" + cls);
for (i in elements) { for (i in elements) {
e = elements[i]; e = elements[i];
e.style.backgroundColor = e.style.borderColor; e.style.backgroundColor = e.style.borderColor;