From e746cfb216836e26a6c060558278d724bd3ed5d5 Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Sun, 28 Jul 2024 14:36:56 -0700
Subject: Add clear hex contents dialog
---
src/modules/gameboard.js | 79 ++++++++++++++++++++----------------------------
1 file changed, 32 insertions(+), 47 deletions(-)
(limited to 'src/modules/gameboard.js')
diff --git a/src/modules/gameboard.js b/src/modules/gameboard.js
index 44146f2..7c22dce 100644
--- a/src/modules/gameboard.js
+++ b/src/modules/gameboard.js
@@ -211,6 +211,16 @@ export function start(el) {
top.container = svg.querySelector('.grid-top > .container');
const topHex = svg.querySelector('.grid-top > use[href="#hex"]');
+ const clearHexDialog = document.querySelector('#clear-hex');
+ clearHexDialog.addEventListener('close', e => {
+ if (clearHexDialog.returnValue === 'confirm') {
+ [...top.container.children].forEach(child => {
+ top.collection.delete(child);
+ child.remove();
+ });
+ }
+ });
+
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);
@@ -227,6 +237,11 @@ export function start(el) {
topHex.addEventListener('click', clickHandler);
+ topHex.addEventListener('contextmenu', e => {
+ e.preventDefault();
+ getSelected() ? sightLine.toggleLock(top.cell) : clearHexDialog.showModal();
+ });
+
const startingLocations = svg.querySelector('.start-locations');
startingLocations && getUnits(startingLocations).forEach(unit => unit.addEventListener('click', selectOffBoard));
@@ -237,10 +252,8 @@ export function start(el) {
let toPlace = placing.pop();
if (isCounter(toPlace) || isMechTemplate(toPlace)) {
- //getHex(this).after(toPlace);
top.collection.set(toPlace, { parent: top.cell });
top.container.append(toPlace);
- //if (isCounter(toPlace)) arrangeCounters(this);
if (isCounter(toPlace)) arrangeCounters(top.container);
removeEventListener("keydown", handleMechTemplateRotation);
} else if (toPlace && !occupant) {
@@ -249,7 +262,7 @@ export function start(el) {
top.container.prepend(toPlace);
//toPlace.removeEventListener('click', selectOffBoard);
placing.push(toPlace);
- //getLockedSightLine(svg) ? updateSightLine(this) : clearSightLine();
+ getLockedSightLine(svg) ? updateSightLine(top.cell) : clearSightLine();
} else if (toPlace && occupant) {
if (toPlace === occupant) {
Observable.notify('select');
@@ -316,25 +329,18 @@ export function start(el) {
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('contextmenu', e => {
- e.preventDefault();
-
- sightLine.toggleLock(cell);
- cell.dispatchEvent(new MouseEvent('pointerover'));
- });
+ //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]);
@@ -371,27 +377,6 @@ export function start(el) {
firingArc.toggleCounterVisibility(svg, occupant, true);
}
});
-
- //cell.addEventListener('pointerout', e => {
- // console.log('pointerout');
- // If pointerout was not triggered by hovering over an element on that
- // game hex
- //if (!e.relatedTarget || top.collection.get(e.relatedTarget)?.parent !== cell) {
- // [...top.container.children].forEach(child => {
- // top.collection.get(child).parent.append(child);
- // top.collection.delete(child);
- // });
- //
- // cell.classList.remove('hover');
- // getActiveSightLine(svg) && clearSightLine();
- //
- // const occupant = getCellOccupant(cell);
- //
- // if (occupant) {
- // firingArc.toggleCounterVisibility(svg, occupant, false);
- // }
- //}
- //});
});
//const cell = document.querySelector('[data-q="0"][data-r="0"][data-s="0"][data-t="0"]');
@@ -402,14 +387,14 @@ export function start(el) {
// debug //
// Add a trooper counter
- const attacker = { dataset: { allegiance: 'attacker', number: 1, squad: 1 }};
+ //const attacker = { dataset: { allegiance: 'attacker', number: 1, squad: 1 }};
// const defender = { dataset: { allegiance: 'defender', number: 1, squad: 2 }};
- const cell = getCell(0, 0, 0, 0);
- const trooper = soldier.createCounter(attacker, 'blazer');
+ //const cell = getCell(0, 0, 0, 0);
+ //const trooper = soldier.createCounter(attacker, 'blazer');
//const trooperSack = document.createElementNS(svgns, 'g');
//trooperSack.classList.add('cell-contents');
//trooperSack.append(trooper);
- soldier.place(svg, trooper, cell);
+ //soldier.place(svg, trooper, cell);
// Add some counters in an unoccupied cell
//const countersCell = getCell(-1, 1, 0, 0);
--
cgit v1.2.3