| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
| author | Catalin Mititiuc <webdevcat@proton.me> | 2024-06-08 11:17:40 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-06-08 11:17:40 -0700 |
| commit | 1b1a809178ecb4e4ae0f2204c441f4c2921b7785 (patch) | |
| tree | 122c25474775fbaa55ddca3120eba5759167703c /src | |
| parent | 71f972142b37e4bbe6062ae84272ba1790b415ad (diff) | |
WIP: Fix pan-zoom for webkit
Diffstat (limited to 'src')
| -rw-r--r-- | src/index.js | 8 | ||||
| -rw-r--r-- | src/modules/pan-zoom.js | 9 | ||||
| -rw-r--r-- | src/modules/record_sheet.js | 2 |
3 files changed, 16 insertions, 3 deletions
diff --git a/src/index.js b/src/index.js index 87c9bfb..c7e040a 100644 --- a/src/index.js +++ b/src/index.js @@ -131,7 +131,7 @@ async function buildScenario(req) { }); }); - scenario.querySelectorAll('use.mapsheet').forEach(el => gb.prepend(svg.ownerDocument.importNode(el, true))); + scenario.querySelectorAll('use.mapsheet').forEach(el => gb.querySelector('#background').after(svg.ownerDocument.importNode(el, true))); if (startLocs) grid.before(svg.ownerDocument.importNode(startLocs, true)); const scenarioGrid = scenario.querySelector('.grid'); @@ -174,6 +174,12 @@ async function buildScenario(req) { panzoom.start(svg); gameboard.start(svg); recordSheet.start(startLocs, gameboard.getUnits()); + + const mapContainer = document.querySelector('#map-container'); + const mapContainerRect = mapContainer.getBoundingClientRect(); + + console.log('mapContainer', mapContainer); + console.log('mapContainerRect', mapContainerRect); } function updateTurnCounter() { diff --git a/src/modules/pan-zoom.js b/src/modules/pan-zoom.js index 86f6727..3818444 100644 --- a/src/modules/pan-zoom.js +++ b/src/modules/pan-zoom.js @@ -12,8 +12,13 @@ function restorePanZoomVal(svg) { } function addEventListeners(svg) { - svg.addEventListener('wheel', e => zoom(svg, e, zoomFactor), { passive: false }); - svg.addEventListener('pointerdown', e => pan(svg, e), { passive: false }); + // svg.addEventListener('wheel', e => zoom(svg, e, zoomFactor), { passive: false }); + // svg.addEventListener('pointerdown', e => pan(svg, e), { passive: false }); + + const group = svg.querySelector('.gameboard'); + + svg.addEventListener('wheel', e => zoom(group, e, zoomFactor), { passive: false }); + svg.addEventListener('pointerdown', e => pan(svg, group, e), { passive: false }); } function storePanZoomVal(transformMatrix) { diff --git a/src/modules/record_sheet.js b/src/modules/record_sheet.js index f786112..132a7dd 100644 --- a/src/modules/record_sheet.js +++ b/src/modules/record_sheet.js @@ -194,6 +194,8 @@ export function start(startLoc, units) { Observable.subscribe('select', select); Observable.subscribe('endmove', endMove); + + console.log('records created'); } export function stop() { |