summaryrefslogtreecommitdiff
path: root/web/static/dartboard.js
diff options
context:
space:
mode:
authorDavid Vazgenovich Shakaryan <dvshakaryan@gmail.com>2022-04-28 18:27:47 -0700
committerDavid Vazgenovich Shakaryan <dvshakaryan@gmail.com>2022-04-28 18:27:47 -0700
commit0fdc050919f0a7a2dce53baf348ab1f9b328d6da (patch)
tree5fa41806e0eb8140b815a4dd901de31a12fabe24 /web/static/dartboard.js
parentfcc02efbff337c05bf448231cd8bfbe016939f8a (diff)
downloaddartboat-0fdc050919f0a7a2dce53baf348ab1f9b328d6da.tar.gz
dartboat-0fdc050919f0a7a2dce53baf348ab1f9b328d6da.tar.xz
web: less javascript, more c
Diffstat (limited to 'web/static/dartboard.js')
-rw-r--r--web/static/dartboard.js151
1 files changed, 0 insertions, 151 deletions
diff --git a/web/static/dartboard.js b/web/static/dartboard.js
deleted file mode 100644
index 46e5c4c..0000000
--- a/web/static/dartboard.js
+++ /dev/null
@@ -1,151 +0,0 @@
-const diameter = 451.0;
-const dists = [7.13, 16.68, 97.06, 106.62, 159.66, 169.22];
-const wire_width = 1.56;
-const sectors = ['20', '1', '18', '4', '13', '6', '10', '15', '2', '17',
- '3', '19', '7', '16', '8', '11', '14', '9', '12', '5'];
-
-const c_black = '#272b2c';
-const c_white = '#fbe3ba';
-const c_red = '#f6302f';
-const c_green = '#22912d';
-const c_wire = '#909ca0';
-const c_wire_inner = '#d8e6ec';
-
-const svgns = 'http://www.w3.org/2000/svg';
-
-function p2c(a, r) {
- const t = a * Math.PI / 180;
- return [r * Math.cos(t), r * Math.sin(t)];
-}
-
-function gen_arc(a1, a2, r1, r2, c) {
- const [x1, y1] = p2c(a1 === a2 ? 1 : a2, r1);
- const [x2, y2] = p2c(a1 === a2 ? 0 : a1, r1);
- const [x3, y3] = p2c(a1 === a2 ? 0 : a1, r2);
- const [x4, y4] = p2c(a1 === a2 ? 1 : a2, r2);
-
- const elem = document.createElementNS(svgns, 'path');
- elem.setAttribute('d',
- `M${x1} ${y1}` +
- `A${r1} ${r1} 0 0 0 ${x2} ${y2}` +
- (a1 === a2 ? `A${r1} ${r1} 0 1 0 ${x1} ${y1}` : '') +
- `L${x3} ${y3}` +
- `A${r2} ${r2} 0 0 1 ${x4} ${y4}` +
- (a1 === a2 ? `A${r2} ${r2} 0 1 1 ${x3} ${y3}` : '') +
- 'Z');
- elem.setAttribute('fill', c)
- return elem;
-}
-
-function gen_segment(a, r1, r2, c) {
- return gen_arc(a - 9, a + 9, r1, r2, c);
-}
-
-function gen_ring(r, w, c) {
- return gen_arc(0, 0, r - w/2, r + w/2, c);
-}
-
-function gen_circle(r, c) {
- const elem = document.createElementNS(svgns, 'circle');
- elem.setAttribute('r', r);
- elem.setAttribute('fill', c)
- return elem;
-}
-
-function gen_line(a, r1, r2, w, c) {
- const [x1, y1] = p2c(a, r1);
- const [x2, y2] = p2c(a, r2);
-
- const elem = document.createElementNS(svgns, 'line');
- elem.setAttribute('x1', x1);
- elem.setAttribute('y1', y1);
- elem.setAttribute('x2', x2);
- elem.setAttribute('y2', y2);
- elem.setAttribute('stroke', c);
- elem.setAttribute('stroke-width', w);
- return elem;
-}
-
-function draw_spider(board) {
- for (let i = 5; i > 1; --i) {
- board.appendChild(gen_ring(dists[i], wire_width, c_wire));
- board.appendChild(gen_ring(dists[i], wire_width/2, c_wire_inner));
- }
-
- for (let i = 20; i > 0; --i) {
- let a = 90 - (i * 18) - 9;
- if (a < 0) a += 360;
- board.appendChild(gen_line(a, dists[1], dists[5] + 10,
- wire_width, c_wire));
- board.appendChild(gen_line(a, dists[1], dists[5] + 10 - wire_width/4,
- wire_width/2, c_wire_inner));
- }
-
- for (let i = 1; i >= 0; --i) {
- board.appendChild(gen_ring(dists[i], wire_width, c_wire));
- board.appendChild(gen_ring(dists[i], wire_width/2, c_wire_inner));
- }
-}
-
-function draw_numbers(board) {
- board.appendChild(gen_ring(diameter/2 - wire_width*4, wire_width, '#ddd'));
-
- const r = diameter/2 - 33/2;
- for (let i = 0; i < 20; ++i) {
- let a = 90 - (i * 18);
- if (a < 0) a += 360;
- const [x, y] = p2c(a, r);
-
- const elem = document.createElementNS(svgns, 'text');
- elem.textContent = sectors[i];
- elem.setAttribute('font-size', '33');
- elem.setAttribute('fill', '#fff');
- elem.setAttribute('transform', `scale(1 -1) translate(${x} ${-y}) ` +
- `rotate(${a <= 180 ? 90 - a : 270 - a})`);
- elem.setAttribute('text-anchor', 'middle');
- elem.setAttribute('dominant-baseline', 'central');
- board.appendChild(elem);
- }
-}
-
-function draw_board() {
- const board = document.getElementById('dartboard');
- const points = document.getElementById('dartboard-points');
-
- const r = diameter/2;
- board.setAttribute('transform', `translate(${r} ${r}) scale(1 -1)`);
- points.setAttribute('transform', `translate(${r} ${r}) scale(1 -1)`);
- board.appendChild(gen_circle(r, c_black));
-
- for (let i = 5; i > 1; --i) {
- for (let j = 0; j < 20; ++j) {
- let a = 90 - (j * 18);
- if (a < 0) a += 360;
-
- const elem = gen_segment(a, dists[i-1], dists[i],
- i%2 ? (j%2 ? c_green : c_red) : (j%2 ? c_white : c_black));
- board.appendChild(elem);
- }
- }
-
- board.appendChild(gen_circle(dists[1], c_green));
- board.appendChild(gen_circle(dists[0], c_red));
- draw_spider(board);
- draw_numbers(board);
-}
-
-function draw_point(x, y) {
- const points = document.getElementById('dartboard-points');
- elem = gen_circle(8, '#33f');
- elem.setAttribute('cx', x);
- elem.setAttribute('cy', y);
- elem.setAttribute('stroke', '#ff0');
- elem.setAttribute('stroke-width', '2');
- points.appendChild(elem);
-}
-
-function clear_points() {
- document.getElementById('dartboard-points').textContent = '';
-}
-
-document.addEventListener('DOMContentLoaded', () => draw_board());