Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
path: root/src/modules/gameboard.js
diff options
context:
space:
mode:
authorCatalin Mititiuc <webdevcat@proton.me>2024-07-29 10:29:54 -0700
committerCatalin Mititiuc <webdevcat@proton.me>2024-07-29 10:29:54 -0700
commit63fb4139d5ac5207b057bce46c4288df982bbeb1 (patch)
tree80b2b0c839d94e3af04cc9f2df6c45c169f600d2 /src/modules/gameboard.js
parente746cfb216836e26a6c060558278d724bd3ed5d5 (diff)
Add ability to deactivate/reactivate soldier records; make hex clearing work with right-click and add a confirmation modal dialog
Diffstat (limited to 'src/modules/gameboard.js')
-rw-r--r--src/modules/gameboard.js103
1 files changed, 21 insertions, 82 deletions
diff --git a/src/modules/gameboard.js b/src/modules/gameboard.js
index 7c22dce..02b9c0f 100644
--- a/src/modules/gameboard.js
+++ b/src/modules/gameboard.js
@@ -205,6 +205,14 @@ function endMove() {
}
}
+// Work around webkit bug https://bugs.webkit.org/show_bug.cgi?id=233432
+function workaroundForWebKitBug233432(listener) {
+ return e => {
+ const elUnderCursor = svg.parentNode.elementFromPoint(e.clientX, e.clientY);
+ if (!e.target.contains(elUnderCursor)) listener(e);
+ };
+}
+
export function start(el) {
svg = el;
const gridTop = svg.querySelector('.grid-top');
@@ -221,20 +229,20 @@ export function start(el) {
}
});
- gridTop.addEventListener('pointerleave', e => {
- // Work around webkit bug https://bugs.webkit.org/show_bug.cgi?id=233432
- const elUnderCursor = svg.parentNode.elementFromPoint(e.clientX, e.clientY);
- if (!e.target.contains(elUnderCursor)) {
- console.log(['pointerleave', gridTop]);
- [...top.container.children].forEach(child => {
- top.collection.get(child).parent.append(child);
- top.collection.delete(child);
- });
-
- top.cell = null;
- }
+ clearHexDialog.querySelector('button[value="confirm"]').addEventListener('click', function(e) {
+ e.preventDefault();
+ clearHexDialog.close(this.value);
});
+ gridTop.addEventListener('pointerleave', workaroundForWebKitBug233432(e => {
+ [...top.container.children].forEach(child => {
+ top.collection.get(child).parent.append(child);
+ top.collection.delete(child);
+ });
+
+ top.cell = null;
+ }));
+
topHex.addEventListener('click', clickHandler);
topHex.addEventListener('contextmenu', e => {
@@ -246,8 +254,6 @@ export function start(el) {
startingLocations && getUnits(startingLocations).forEach(unit => unit.addEventListener('click', selectOffBoard));
function clickHandler(e) {
- console.log('top hex click event');
- //const occupant = getCellOccupant(this);
const occupant = svg.querySelector('.grid-top .container .counter')
let toPlace = placing.pop();
@@ -257,10 +263,8 @@ export function start(el) {
if (isCounter(toPlace)) arrangeCounters(top.container);
removeEventListener("keydown", handleMechTemplateRotation);
} else if (toPlace && !occupant) {
- //soldier.place(svg, toPlace, this);
top.collection.set(toPlace, { parent: top.cell });
top.container.prepend(toPlace);
- //toPlace.removeEventListener('click', selectOffBoard);
placing.push(toPlace);
getLockedSightLine(svg) ? updateSightLine(top.cell) : clearSightLine();
} else if (toPlace && occupant) {
@@ -271,79 +275,14 @@ export function start(el) {
}
} else if (!toPlace && occupant) {
Observable.notify('select', occupant);
- } else {
- console.log(['removing this contents', this]);
- getCellContents(this).forEach(el => el.remove());
}
const selected = getSelected();
}
getCells(svg).forEach(cell => {
- cell.addEventListener('click', e => {
- console.log('cell clickevent');
- const occupant = getCellOccupant(cell);
- let toPlace = placing.pop();
-
- if (isCounter(toPlace) || isMechTemplate(toPlace)) {
- //getHex(cell).after(toPlace);
- top.collection.set(toPlace, { parent: cell });
- top.container.append(toPlace);
- //if (isCounter(toPlace)) arrangeCounters(cell);
- if (isCounter(toPlace)) arrangeCounters(top.container);
- removeEventListener("keydown", handleMechTemplateRotation);
- } else if (toPlace && !occupant) {
- soldier.place(svg, toPlace, cell);
- toPlace.removeEventListener('click', selectOffBoard);
- placing.push(toPlace);
- getLockedSightLine(svg) ? updateSightLine(cell) : clearSightLine();
- } else if (toPlace && occupant) {
- if (toPlace === occupant) {
- if (hasPreviousMoveInHistory(toPlace)) {
- toPlace = moveBackOneStepInHistory(toPlace);
- placing.push(toPlace);
- getLockedSightLine(svg) ? updateSightLine(toPlace.parentElement) : drawSightLine(toPlace.parentElement, cell);
- } else {
- Observable.notify('select');
- }
- } else if (!occupant.classList.contains('clone')) {
- Observable.notify('select', occupant);
- } else {
- if (isClone(occupant).of(toPlace)) {
- if (hasPreviousMoveInHistory(occupant)) {
- deleteClone(occupant, toPlace, cell);
- } else {
- toPlace = clearMoveHistory(occupant, toPlace);
- getLockedSightLine(svg) ? updateSightLine(cell) : clearSightLine();
- }
- }
- placing.push(toPlace);
- }
- } else if (!toPlace && occupant) {
- Observable.notify('select', occupant);
- } else {
- console.log('removing cell contents', cell);
- getCellContents(cell).forEach(el => el.remove());
- }
-
- const selected = getSelected();
- });
-
- //cell.addEventListener('dblclick', e => {
- // const toPlace = placing.pop(),
- // occupant = getCellOccupant(cell);
- //
- // if (toPlace && occupant && toPlace === occupant) {
- // const { number, allegiance } = toPlace.dataset,
- // selector = `[data-allegiance="${allegiance}"][data-number="${number}"]`;
- //
- // svg.querySelectorAll(selector).forEach(el => el.remove());
- // Observable.notify('select');
- // }
- //});
-
cell.addEventListener('pointerover', () => {
- console.log(['pointerenter', cell]);
+ //console.log(['pointerenter', cell]);
top.cell = cell;