web: clean up svg generation code

3 files changed, 36 insertions, 67 deletions

diff --git a/web/dartboat_wasm.c b/web/dartboat_wasm.c
index 48c16b1..e7f0415 100644
--- a/web/dartboat_wasm.c
+++ b/web/dartboat_wasm.c
@@ -177,7 +177,7 @@ EMSCRIPTEN_KEEPALIVE void draw_boat_throwing(int pts, char *str, double x, doubl
 void handle_next();
 EMSCRIPTEN_KEEPALIVE void end_boat_visit(int rem, double avg)
 {
-	EM_ASM(clearPoints());
+	EM_ASM(svgClearPoints());
 	update_player_rem(2, rem);
 	EM_ASM({updatePlayerAvg($0, $1)}, 2, avg);
 	EM_ASM({setPromptInput($0)}, "");
diff --git a/web/static/dartboat.js b/web/static/dartboat.js
index c17e29d..8716185 100644
--- a/web/static/dartboat.js
+++ b/web/static/dartboat.js
@@ -136,7 +136,7 @@ function drawVisit(visit_no, p1_pts, p1_rem, p2_pts, p2_rem, p2_darts) {
 	e.scrollTop = e.scrollHeight;
 }
 
-function drawElemv(elemc, elemv, off_name, off_n_attrs, off_attr_names,
+function svgDrawElemv(layer, elemc, elemv, off_name, off_n_attrs, off_attr_names,
 	off_attr_vals, off_content) {
 	for (let ptr = elemv; ptr < elemv + 4*elemc; ptr += 4) {
 		const struct = HEAP32[ptr>>2];
@@ -156,31 +156,11 @@ function drawElemv(elemc, elemv, off_name, off_n_attrs, off_attr_names,
 		const content = HEAP32[(struct + off_content)>>2];
 		if (content) e.textContent = UTF8ToString(content);
 
-		$('#dartboard').appendChild(e);
+		$(`#dartboard${layer ? '-points' : ''}`).appendChild(e);
 	}
 }
 
-function drawElem(target, name, n_attrs, attr_names, attr_vals, content) {
-	const e = document.createElementNS('http://www.w3.org/2000/svg',
-		UTF8ToString(name));
-	if (content) e.textContent = UTF8ToString(content);
-
-	for (let i = 0; i < n_attrs; ++i)
-		e.setAttribute(UTF8ToString(HEAP32[(attr_names + i*4)>>2]),
-			UTF8ToString(HEAP32[(attr_vals + i*4)>>2]));
-
-	target.appendChild(e);
-}
-
-function drawElemBoard(...args) {
-	drawElem($('#dartboard'), ...args);
-}
-
-function drawElemPoint(...args) {
-	drawElem($('#dartboard-points'), ...args);
-}
-
-function clearPoints() {
+function svgClearPoints() {
 	$('#dartboard-points').textContent = '';
 }
 
diff --git a/web/svg_dartboard.c b/web/svg_dartboard.c
index 6209e65..1125ef0 100644
--- a/web/svg_dartboard.c
+++ b/web/svg_dartboard.c
@@ -36,7 +36,6 @@ struct elem *elem_init(char *name, int size_attrs)
 
 	e->n_attrs = 0;
 	e->size_attrs = size_attrs;
-
 	e->attr_names = malloc(size_attrs * sizeof(*(e->attr_names)));
 	e->attr_vals = malloc(size_attrs * sizeof(*(e->attr_vals)));
 	e->content = NULL;
@@ -69,14 +68,22 @@ void elem_add_attr(struct elem *e, char *name, char *val)
 	}
 
 	size_t size = strlen(name) + 1;
-	e->attr_names[e->n_attrs] = malloc(size * sizeof(**(e->attr_names)));
+	e->attr_names[e->n_attrs] = malloc(size);
 	memcpy(e->attr_names[e->n_attrs], name, size);
 
 	size = strlen(val) + 1;
-	e->attr_vals[e->n_attrs] = malloc(size * sizeof(**(e->attr_vals)));
+	e->attr_vals[e->n_attrs] = malloc(size);
 	memcpy(e->attr_vals[e->n_attrs++], val, size);
 }
 
+void elem_add_attr_double(struct elem *e, char *name, double val)
+{
+	char str[512];
+	sprintf(str, "%f", val);
+	elem_add_attr(e, name, str);
+}
+
+// draws a ring if angles are equal
 struct elem *gen_arc(double a1, double a2, double r1, double r2, char *col)
 {
 	struct ccoords cc1 = pol_to_cart((struct pcoords){
@@ -126,10 +133,7 @@ struct elem *gen_circle(double r, char *col)
 {
 	struct elem *e = elem_init("circle", 2);
 	elem_add_attr(e, "fill", col);
-
-	char buf[512];
-	sprintf(buf, "%f", r);
-	elem_add_attr(e, "r", buf);
+	elem_add_attr_double(e, "r", r);
 
 	return e;
 }
@@ -141,28 +145,15 @@ struct elem *gen_line(double a, double r1, double r2, double w, char *col)
 
 	struct elem *e = elem_init("line", 6);
 	elem_add_attr(e, "stroke", col);
-
-	char buf[512];
-	sprintf(buf, "%f", cc1.x);
-	elem_add_attr(e, "x1", buf);
-	sprintf(buf, "%f", cc1.y);
-	elem_add_attr(e, "y1", buf);
-	sprintf(buf, "%f", cc2.x);
-	elem_add_attr(e, "x2", buf);
-	sprintf(buf, "%f", cc2.y);
-	elem_add_attr(e, "y2", buf);
-	sprintf(buf, "%f", w);
-	elem_add_attr(e, "stroke-width", buf);
+	elem_add_attr_double(e, "x1", cc1.x);
+	elem_add_attr_double(e, "y1", cc1.y);
+	elem_add_attr_double(e, "x2", cc2.x);
+	elem_add_attr_double(e, "y2", cc2.y);
+	elem_add_attr_double(e, "stroke-width", w);
 
 	return e;
 }
 
-void draw_elem(struct elem *e)
-{
-	EM_ASM({drawElemBoard($0, $1, $2, $3, $4)},
-		e->name, e->n_attrs, e->attr_names, e->attr_vals, e->content);
-}
-
 int draw_spider(int elemc, struct elem **elemv)
 {
 	for (int i = 5; i > 1; --i) {
@@ -194,10 +185,6 @@ int draw_numbers(int elemc, struct elem **elemv)
 
 	int r = DIAMETER/2 - 33/2;
 	for (int i = 0; i < 20; ++i) {
-		double a = 90 - i*SECTOR_WIDTH;
-		if (a < 0) a += 360;
-		struct ccoords cc = pol_to_cart((struct pcoords){ .a = a, .r = r });
-
 		struct elem *e = elemv[elemc++] = elem_init("text", 5);
 		elem_add_attr(e, "font-size", "33");
 		elem_add_attr(e, "fill", "#fff");
@@ -205,6 +192,9 @@ int draw_numbers(int elemc, struct elem **elemv)
 		elem_add_attr(e, "dominant-baseline", "central");
 
 		char buf[512];
+		double a = 90 - i*SECTOR_WIDTH;
+		if (a < 0) a += 360;
+		struct ccoords cc = pol_to_cart((struct pcoords){ .a = a, .r = r });
 		sprintf(buf, "scale(1 -1) translate(%f %f) rotate(%f)",
 			cc.x, -cc.y, a <= 180 ? 90 -a : 270 -a);
 		elem_add_attr(e, "transform", buf);
@@ -216,6 +206,15 @@ int draw_numbers(int elemc, struct elem **elemv)
 	return elemc;
 }
 
+void draw_elemv(int layer, int elemc, struct elem **elemv)
+{
+	EM_ASM({svgDrawElemv($0, $1, $2, $3, $4, $5, $6, $7)},
+		layer, elemc, elemv,
+		offsetof(struct elem, name), offsetof(struct elem, n_attrs),
+		offsetof(struct elem, attr_names), offsetof(struct elem, attr_vals),
+		offsetof(struct elem, content));
+}
+
 void draw_board()
 {
 	struct elem **elemv = malloc(500 * sizeof(*elemv));
@@ -227,7 +226,6 @@ void draw_board()
 		for (int j = 0; j < NUM_SECTORS; ++j) {
 			double a = 90 - j*SECTOR_WIDTH;
 			if (a < 0) a += 360;
-
 			elemv[elemc++] = gen_segment(a, OUTER_DISTS[i-1], OUTER_DISTS[i],
 				i%2 ? (j%2 ? C_GREEN : C_RED) : (j%2 ? C_WHITE : C_BLACK));
 		}
@@ -239,11 +237,7 @@ void draw_board()
 	elemc = draw_spider(elemc, elemv);
 	elemc = draw_numbers(elemc, elemv);
 
-	EM_ASM({drawElemv($0, $1, $2, $3, $4, $5, $6)},
-		elemc, elemv,
-		offsetof(struct elem, name), offsetof(struct elem, n_attrs),
-		offsetof(struct elem, attr_names), offsetof(struct elem, attr_vals),
-		offsetof(struct elem, content));
+	draw_elemv(0, elemc, elemv);
 
 	for (int i = 0; i < elemc; ++i)
 		free(elemv[i]);
@@ -254,14 +248,9 @@ void draw_point(double x, double y) {
 	struct elem *e = gen_circle(8, "#33f");
 	elem_add_attr(e, "stroke", "#ff0");
 	elem_add_attr(e, "stroke-width", "2");
+	elem_add_attr_double(e, "cx", x);
+	elem_add_attr_double(e, "cy", y);
 
-	char buf[512];
-	sprintf(buf, "%f", x);
-	elem_add_attr(e, "cx", buf);
-	sprintf(buf, "%f", y);
-	elem_add_attr(e, "cy", buf);
-
-	EM_ASM({drawElemPoint($0, $1, $2, $3, $4)},
-		e->name, e->n_attrs, e->attr_names, e->attr_vals);
+	draw_elemv(1, 1, &e);
 	elem_free(e);
 }