Web Dev Solutions

Catalin Mititiuc

From f07d120b4bb245a76bdd80712a33ba8b222d966a Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Fri, 26 Apr 2024 16:08:40 -0700 Subject: Refactor sight line module to remove almost all querying for elements --- src/modules/game.js | 50 +++++++++++++++++++++++++++++--------------------- 1 file changed, 29 insertions(+), 21 deletions(-) (limited to 'src/modules/game.js') diff --git a/src/modules/game.js b/src/modules/game.js index 40d0623..b44d605 100644 --- a/src/modules/game.js +++ b/src/modules/game.js @@ -10,13 +10,16 @@ export default class Game { constructor(svg) { this.svg = svg; - this.firingArc = new FiringArc(svg); - this.sightLine = new SightLine(svg); + + const board = this.getBoard(); + this.firingArc = new FiringArc(svg, board); + this.sightLine = new SightLine(svg, board); this.counter = new Counter(svg); this.setUpCells(); - let counter = this.counter.getCounter({ dataset: { allegiance: 'davion', number: '1' }}); + // debug + const counter = this.counter.getCounter({ dataset: { allegiance: 'davion', number: '1' }}); this.counter.place(counter, this.getCell(17, 25)); this.select(counter); } @@ -58,7 +61,7 @@ export default class Game { } getGridIndex({ parentElement: { dataset: { x }, parentElement: { dataset: { y }}}}) { - return { x, y }; + return { x: +x, y: +y }; } getCounterAtGridIndex(x, y) { @@ -177,7 +180,7 @@ export default class Game { if (!lockedSl) { this.sightLine.clear(); } else { - this.sightLine.update(cell, this.getCellPosition(cell)); + this.updateSightLine(cell); } } else if (toPlace && state.occupant) { if (toPlace === state.occupant) { @@ -200,7 +203,7 @@ export default class Game { if (!lockedSl) { this.sightLine.clear(); } else { - this.sightLine.update(toPlace.parentElement, this.getCellPosition(toPlace.parentElement)); + this.updateSightLine(toPlace.parentElement); } } else { this.unSelect(); @@ -221,7 +224,7 @@ export default class Game { if (!lockedSl) { this.sightLine.clear(); } else { - this.sightLine.update(cell, this.getCellPosition(cell)); + this.updateSightLine(cell); } } else { const index = this.getGridIndex(state.occupant), @@ -266,19 +269,8 @@ export default class Game { cell.addEventListener('contextmenu', e => { e.preventDefault(); - let sl = this.getSightLine(); - - if (sl) { - sl.classList.toggle('active'); - - if (sl.classList.contains('active')) { - this.sightLine.clear(); - } else { - this.getHex(cell).classList.add('sight-line-target'); - } - - cell.dispatchEvent(new MouseEvent('pointerover')); - } + this.sightLine.toggleLock(cell); + cell.dispatchEvent(new MouseEvent('pointerover')); }); cell.addEventListener('pointerover', e => { @@ -290,7 +282,7 @@ export default class Game { sourceCell = selected.parentElement; if (isOnBoard && (!sl || sl.classList.contains('active')) && sourceCell != cell) { - this.sightLine.draw(sourceCell, cell); + this.drawSightLine(sourceCell, cell); } } @@ -332,4 +324,20 @@ export default class Game { this.placing.push(counter); } + + updateSightLine(cell) { + const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = cell, + source = { index: { x: sX, y: sY }, position: this.getCellPosition(cell) }; + + this.sightLine.update(source); + } + + drawSightLine(sourceCell, targetCell) { + const { dataset: { x: sX }, parentElement: { dataset: { y: sY }}} = sourceCell, + { dataset: { x: tX }, parentElement: { dataset: { y: tY }}} = targetCell, + source = { index: { x: sX, y: sY }, position: this.getCellPosition(sourceCell) }, + target = { index: { x: tX, y: tY }, position: this.getCellPosition(targetCell) }; + + this.sightLine.draw(source, target); + } } -- cgit v1.2.3