Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
path: root/src/modules
diff options
context:
space:
mode:
authorCatalin Mititiuc <webdevcat@proton.me>2024-04-27 11:47:25 -0700
committerCatalin Mititiuc <webdevcat@proton.me>2024-04-27 11:55:25 -0700
commit25a79c4be5b50546147d61184e60bc63292a074c (patch)
treeb4f6d2a5be51f5def80d9b941df7a83ab9ddbc15 /src/modules
parentbbd58ed2a0691987d21b20c3ab7d301727d46d1e (diff)
Remove 'reveal pattern' from game, as it's not necessary
Diffstat (limited to 'src/modules')
-rw-r--r--src/modules/game.js236
-rw-r--r--src/modules/panzoom.js2
2 files changed, 115 insertions, 123 deletions
diff --git a/src/modules/game.js b/src/modules/game.js
index 485362b..6b59659 100644
--- a/src/modules/game.js
+++ b/src/modules/game.js
@@ -64,14 +64,75 @@ function getCellPosition(cell) {
return pt;
}
-export default function (svg) {
- let distanceCallback, proneFlagCallback, selectCallback,
- placing = [];
+function getCell(x, y) {
+ return svg.querySelector(`g[data-y="${y}"] > g[data-x="${x}"]`);
+}
+
+function getCounterAtGridIndex(x, y) {
+ return getCell(x, y).querySelector('.counter');
+}
+
+function getSelected() {
+ return svg.querySelector(`.counter.selected[data-allegiance][data-number]`);
+}
+
+function clearSightLine() {
+ sightLine.hexes = [];
+ sightLine.clear();
+ distanceCallback && distanceCallback();
+}
+
+function updateSightLine(cell) {
+ const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = cell,
+ { dataset: { x: tX }, parentElement: { dataset: { y: tY }}} = sightLine.lockTarget;
+
+ const selector = sightLine.calcIndexes(+sX, +sY, +tX, +tY)
+ .map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
+ .join(', ');
+
+ const hexes = svg.querySelectorAll(selector);
+ sightLine.hexes = hexes;
+ sightLine.update(getCellPosition(cell));
+ distanceCallback && distanceCallback(hexes.length - 1);
+}
+
+function drawSightLine(sourceCell, targetCell) {
+ const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = sourceCell,
+ { dataset: { x: tX }, parentElement: { dataset: { y: tY }}} = targetCell;
+
+ const selector = sightLine.calcIndexes(+sX, +sY, +tX, +tY)
+ .map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
+ .join(', ');
+
+ const hexes = svg.querySelectorAll(selector);
+ sightLine.hexes = hexes;
+ sightLine.drawLine(getCellPosition(sourceCell), getCellPosition(targetCell));
+ distanceCallback && distanceCallback(hexes.length - 1);
+}
- const board = svg.querySelector('.board'),
- firingArc = FiringArc(svg, board),
- sightLine = SightLine(board),
- counterMod = Counter(svg, board);
+let svg, distanceCallback, proneFlagCallback, selectCallback;
+
+let board, firingArc, sightLine, counterMod,
+ placing = [];
+
+export function setDistanceCallback(callback) {
+ distanceCallback = callback;
+}
+
+export function setProneFlagCallback(callback) {
+ proneFlagCallback = callback;
+}
+
+export function setSelectCallback(callback) {
+ selectCallback = callback;
+}
+
+export function start(el) {
+ svg = el;
+ board = svg.querySelector('.board');
+ firingArc = FiringArc(svg, board);
+ sightLine = SightLine(board);
+ counterMod = Counter(svg, board);
getCells(svg).forEach(cell => {
cell.addEventListener('click', e => {
@@ -226,138 +287,69 @@ export default function (svg) {
const c = counterMod.getCounter({ dataset: { allegiance: 'davion', number: '1' }});
counterMod.place(c, getCell(17, 25));
select(c);
+}
- function getCell(x, y) {
- return svg.querySelector(`g[data-y="${y}"] > g[data-x="${x}"]`);
- }
-
- function getCounterAtGridIndex(x, y) {
- return getCell(x, y).querySelector('.counter');
- }
-
- function getSelected() {
- return svg.querySelector(`.counter.selected[data-allegiance][data-number]`);
- }
-
- function clearSightLine() {
- sightLine.hexes = [];
- sightLine.clear();
- distanceCallback && distanceCallback();
- }
-
- function updateSightLine(cell) {
- const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = cell,
- { dataset: { x: tX }, parentElement: { dataset: { y: tY }}} = sightLine.lockTarget;
-
- const selector = sightLine.calcIndexes(+sX, +sY, +tX, +tY)
- .map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
- .join(', ');
-
- const hexes = svg.querySelectorAll(selector);
- sightLine.hexes = hexes;
- sightLine.update(getCellPosition(cell));
- distanceCallback && distanceCallback(hexes.length - 1);
- }
-
- function drawSightLine(sourceCell, targetCell) {
- const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = sourceCell,
- { dataset: { x: tX }, parentElement: { dataset: { y: tY }}} = targetCell;
-
- const selector = sightLine.calcIndexes(+sX, +sY, +tX, +tY)
- .map(([x, y]) => `g[data-y="${y}"] g[data-x="${x}"] use[href="#hex"]`)
- .join(', ');
+export function select(selected) {
+ const counter = counterMod.getCounter(selected);
- const hexes = svg.querySelectorAll(selector);
- sightLine.hexes = hexes;
- sightLine.drawLine(getCellPosition(sourceCell), getCellPosition(targetCell));
- distanceCallback && distanceCallback(hexes.length - 1);
+ if (counter) {
+ unSelect();
+ placing.push(counter);
+ counter.classList.add(counterMod.selectedClass);
+ firingArc.get(counter).forEach(el => el.removeAttribute('clip-path'));
+ selectCallback && selectCallback({ prone: counterMod.hasProne(counter), ...counter.dataset });
}
+}
- function select(selected) {
- const counter = counterMod.getCounter(selected);
+export function unSelect() {
+ const selected = getSelected();
- if (counter) {
- unSelect();
- placing.push(counter);
- counter.classList.add(counterMod.selectedClass);
- firingArc.get(counter).forEach(el => el.removeAttribute('clip-path'));
- selectCallback && selectCallback({ prone: counterMod.hasProne(counter), ...counter.dataset });
- }
+ if (selected) {
+ placing = [];
+ getSelected().classList.remove(counterMod.selectedClass);
+ clearSightLine();
+ firingArc.clipAll();
}
+}
- function unSelect() {
- const selected = getSelected();
+export function endMove() {
+ const selected = getSelected();
- if (selected) {
- placing = [];
- getSelected().classList.remove(counterMod.selectedClass);
- clearSightLine();
- firingArc.clipAll();
- }
- }
-
- function endMove() {
- const selected = getSelected();
-
- if (selected) {
- counterMod.endMove(selected);
- unSelect();
- }
+ if (selected) {
+ counterMod.endMove(selected);
+ unSelect();
}
+}
- function endTurn(allegiance) {
- firingArc.clear(allegiance);
- }
+export function endTurn(allegiance) {
+ firingArc.clear(allegiance);
+}
- function toggleProne() {
- const selected = getSelected(),
- isOnBoard = selected && selected.parentElement.hasAttribute('data-x');
+export function toggleProne() {
+ const selected = getSelected(),
+ isOnBoard = selected && selected.parentElement.hasAttribute('data-x');
- if (selected && isOnBoard) {
- counterMod.toggleProne(selected);
- }
+ if (selected && isOnBoard) {
+ counterMod.toggleProne(selected);
}
+}
- function toggleFiringArcVisibility(allegiance) {
- firingArc.toggleVisibility(allegiance);
- }
+export function toggleFiringArcVisibility(allegiance) {
+ firingArc.toggleVisibility(allegiance);
+}
- function setFiringArc(size) {
- const counter = getSelected(),
- isOnBoard = counter => counter && counter.parentElement.hasAttribute('data-x');
+export function setFiringArc(size) {
+ const counter = getSelected(),
+ isOnBoard = counter => counter && counter.parentElement.hasAttribute('data-x');
- if (isOnBoard(counter)) {
- firingArc.set(size, counter, getCellPosition(counter.parentElement));
- }
+ if (isOnBoard(counter)) {
+ firingArc.set(size, counter, getCellPosition(counter.parentElement));
}
+}
- function setGrenade() {
- let counter = document.createElementNS(svgns, 'use');
- counter.setAttributeNS(null, 'href', '#counter-grenade');
+export function setGrenade() {
+ let counter = document.createElementNS(svgns, 'use');
+ counter.setAttributeNS(null, 'href', '#counter-grenade');
- placing.push(counter);
- }
-
- return {
- set distanceCallback(callback) {
- distanceCallback = callback;
- },
-
- set proneFlagCallback(callback) {
- proneFlagCallback = callback;
- },
-
- set selectCallback(callback) {
- selectCallback = callback;
- },
-
- select,
- unSelect,
- endMove,
- endTurn,
- setFiringArc,
- setGrenade,
- toggleFiringArcVisibility,
- toggleProne
- };
+ placing.push(counter);
}
diff --git a/src/modules/panzoom.js b/src/modules/panzoom.js
index dcc6b34..86f6727 100644
--- a/src/modules/panzoom.js
+++ b/src/modules/panzoom.js
@@ -26,7 +26,7 @@ function observePanZoomChanges(svg) {
observer.observe(svg, { attributeFilter: ['style'] });
}
-export default function (svg) {
+export function start(svg) {
restorePanZoomVal(svg);
addEventListeners(svg);
observePanZoomChanges(svg);