web: dynamically generate SVG and groups

4 files changed, 49 insertions, 14 deletions

diff --git a/web/static/index.html b/web/static/index.html
index e195e0b..feea2d6 100644
--- a/web/static/index.html
+++ b/web/static/index.html
@@ -65,10 +65,6 @@
 				</div>
 				<div id="keypad-dartboard" class="keypad">
 					<div id="dartboard-container">
-						<svg id="dartboard" viewBox="0 0 451 451">
-							<g class="base" transform="translate(225.5 225.5) scale(1 -1)"></g>
-							<g class="overlay" transform="translate(225.5 225.5) scale(1 -1)"></g>
-						</svg>
 					</div>
 				</div>
 			</div>
diff --git a/web/web_main.c b/web/web_main.c
index f1a692c..d525a94 100644
--- a/web/web_main.c
+++ b/web/web_main.c
@@ -15,7 +15,7 @@ void init()
 {
 	srand(time(NULL));
 	init_board();
-	svg_draw_board();
+	svg_init();
 	opts_init();
 
 	handle_next();
diff --git a/web/web_svg.c b/web/web_svg.c
index b52705f..470b7ec 100644
--- a/web/web_svg.c
+++ b/web/web_svg.c
@@ -26,7 +26,8 @@ static inline struct dom_elem *svg_elem_init(char *name, int size_attrs)
 }
 
 // draws a ring if angles are equal
-struct dom_elem *gen_arc(double a1, double a2, double r1, double r2, char *col)
+static struct dom_elem *gen_arc(double a1, double a2, double r1, double r2,
+	char *col)
 {
 	struct ccoords cc1 = pol_to_cart(
 		(struct pcoords){ .a = (a1 == a2 ? 1 : a2), .r = r1 });
@@ -61,17 +62,17 @@ struct dom_elem *gen_arc(double a1, double a2, double r1, double r2, char *col)
 	return e;
 }
 
-struct dom_elem *gen_segment(double a, double r1, double r2, char *col)
+static struct dom_elem *gen_segment(double a, double r1, double r2, char *col)
 {
 	return gen_arc(a - SECTOR_WIDTH/2, a + SECTOR_WIDTH/2, r1, r2, col);
 }
 
-struct dom_elem *gen_ring(double r, double w, char *col)
+static struct dom_elem *gen_ring(double r, double w, char *col)
 {
 	return gen_arc(0, 0, r - w/2, r + w/2, col);
 }
 
-struct dom_elem *gen_circle(double r, char *col)
+static struct dom_elem *gen_circle(double r, char *col)
 {
 	struct dom_elem *e = svg_elem_init("circle", 2);
 	dom_elem_add_attr(e, "fill", col);
@@ -80,7 +81,8 @@ struct dom_elem *gen_circle(double r, char *col)
 	return e;
 }
 
-struct dom_elem *gen_line(double a, double r1, double r2, double w, char *col)
+static struct dom_elem *gen_line(double a, double r1, double r2, double w,
+	char *col)
 {
 	struct ccoords cc1 = pol_to_cart((struct pcoords){ .a = a, .r = r1 });
 	struct ccoords cc2 = pol_to_cart((struct pcoords){ .a = a, .r = r2 });
@@ -96,7 +98,7 @@ struct dom_elem *gen_line(double a, double r1, double r2, double w, char *col)
 	return e;
 }
 
-int draw_spider(int elemc, struct dom_elem **elemv)
+static int draw_spider(int elemc, struct dom_elem **elemv)
 {
 	for (int i = 5; i > 1; --i) {
 		elemv[elemc++] = gen_ring(OUTER_DISTS[i], WIRE_WIDTH, C_WIRE);
@@ -123,7 +125,7 @@ int draw_spider(int elemc, struct dom_elem **elemv)
 	return elemc;
 }
 
-int draw_numbers(int elemc, struct dom_elem **elemv)
+static int draw_numbers(int elemc, struct dom_elem **elemv)
 {
 	elemv[elemc++] = gen_ring(DIAMETER/2 - WIRE_WIDTH*4, WIRE_WIDTH,
 		"#ddd");
@@ -152,7 +154,7 @@ int draw_numbers(int elemc, struct dom_elem **elemv)
 	return elemc;
 }
 
-void svg_draw_board()
+static void draw_board()
 {
 	struct dom_elem **elemv = malloc(200 * sizeof(*elemv));
 	int elemc = 0;
@@ -183,6 +185,37 @@ void svg_draw_board()
 	free(elemv);
 }
 
+static void create_board()
+{
+	struct dom_elem *e = svg_elem_init("svg", 2);
+	dom_elem_add_attr(e, "id", "dartboard");
+	char *viewbox;
+	asprintf(&viewbox, "0 0 %f %f", DIAMETER, DIAMETER);
+	dom_elem_add_attr(e, "viewBox", viewbox);
+	free(viewbox);
+	dom_append_elemv("#dartboard-container", 1, &e);
+
+	struct dom_elem **elemv = malloc(2 * sizeof(*elemv));
+	int elemc = 0;
+
+	char *transform;
+	asprintf(&transform, "translate(%f %f) scale(1 -1)",
+		DIAMETER/2, DIAMETER/2);
+	for (int i = 0; i < 2; ++i) {
+		struct dom_elem *e = svg_elem_init("g", 2);
+		dom_elem_add_attr(e, "class", i ? "overlay" : "base");
+		dom_elem_add_attr(e, "transform", transform);
+		elemv[elemc++] = e;
+	}
+	free(transform);
+
+	dom_append_elemv("#dartboard", elemc, elemv);
+
+	for (int i = 0; i < elemc; ++i)
+		dom_elem_free(elemv[i]);
+	free(elemv);
+}
+
 void svg_draw_point(double x, double y)
 {
 	struct dom_elem *e = gen_circle(6, "#33f");
@@ -199,3 +232,9 @@ void svg_clear_points()
 {
 	dom_set_content("#dartboard .overlay", NULL);
 }
+
+void svg_init()
+{
+	create_board();
+	draw_board();
+}
diff --git a/web/web_svg.h b/web/web_svg.h
index 5fb80b1..d2b3e0d 100644
--- a/web/web_svg.h
+++ b/web/web_svg.h
@@ -1,7 +1,7 @@
 #ifndef WEB_SVG_H
 #define WEB_SVG_H
 
-void svg_draw_board();
+void svg_init();
 void svg_draw_point(double x, double y);
 void svg_clear_points();