| 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-05-01 22:53:18 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-05-01 22:53:18 -0700 |
| commit | cb76c9c68a185f840aa03fd0a38260bba6f21302 (patch) | |
| tree | c1d32ea5c81da9d582397d686efde01e263f862c /src | |
| parent | b008407808b4c10a94737f50c3fbde429a026454 (diff) | |
WIP: recreate object element when loading maps to avoid node warnings about dangling file handles
Diffstat (limited to 'src')
| -rw-r--r-- | src/index.js | 77 |
1 files changed, 66 insertions, 11 deletions
diff --git a/src/index.js b/src/index.js index 5c20a8e..d4c74e9 100644 --- a/src/index.js +++ b/src/index.js @@ -8,7 +8,6 @@ globalThis.svgns = "http://www.w3.org/2000/svg"; const mapPlaceholder = document.querySelector('.map-placeholder'), distanceOutput = document.getElementById('status'), proneToggle = document.getElementById('toggle-prone-counter'), - object = document.querySelector('object'), contentVisToggleEl = document.querySelector('#content input[type="checkbox"].visible'), toggleContentVis = (function () { @@ -90,17 +89,17 @@ document.querySelectorAll('.end-move').forEach(el => el.addEventListener('click' gameboard.endMove(); })); -object.addEventListener('load', function () { - mapPlaceholder.remove(); - this.style.opacity = 1; +// object.addEventListener('load', function () { +// mapPlaceholder.remove(); +// this.style.opacity = 1; - const svg = this.contentDocument.querySelector('svg'), - startLocs = svg.querySelector('.start-locations'); +// const svg = this.contentDocument.querySelector('svg'), +// startLocs = svg.querySelector('.start-locations'); - panzoom.start(svg); - gameboard.start(svg); - recordSheet.start(startLocs, gameboard.getUnits(), gameboard.unSelect, gameboard.select); -}); +// panzoom.start(svg); +// gameboard.start(svg); +// recordSheet.start(startLocs, gameboard.getUnits(), gameboard.unSelect, gameboard.select); +// }); contentVisToggleEl.checked = (localStorage.getItem('content-visibility') !== 'false'); toggleContentVis(); @@ -112,4 +111,60 @@ mapSelectDialog .updateValueOnSelection() .changeMapOnConfirm(); -object.data = `${localStorage.getItem('map') || 'map1'}.svg`; +// const xhr = new XMLHttpRequest(); + +// xhr.onload = () => { +// console.log(xhr); +// const oldObj = document.querySelector('object'); +// const object = document.createElement('object'); +// object.setAttribute('type', 'image/svg+xml'); +// object.style.opacity = 0; +// mapPlaceholder.after(object); + +// object.addEventListener('load', function () { +// oldObj.remove(); +// mapPlaceholder.remove(); +// this.style.opacity = 1; + +// const svg = this.contentDocument.querySelector('svg'), +// startLocs = svg.querySelector('.start-locations'); + +// panzoom.start(svg); +// gameboard.start(svg); +// recordSheet.start(startLocs, gameboard.getUnits(), gameboard.unSelect, gameboard.select); +// }); + +// object.data = fileName; +// }; + +// xhr.open('GET', fileName); +// xhr.responseType = 'document'; +// xhr.send(); + +const fileName = `${localStorage.getItem('map') || 'map1'}.svg`; +const oldObj = document.querySelector('object'); + +console.log('old data', oldObj.getAttribute('data'), 'new data', fileName); + +const object = document.createElement('object'); +object.setAttribute('type', 'image/svg+xml'); +object.style.opacity = 0; +mapPlaceholder.after(object); + +object.addEventListener('load', function () { + oldObj.remove(); + mapPlaceholder.remove(); + this.style.opacity = 1; + + const svg = this.contentDocument.querySelector('svg'), + startLocs = svg.querySelector('.start-locations'); + + panzoom.start(svg); + gameboard.start(svg); + recordSheet.start(startLocs, gameboard.getUnits(), gameboard.unSelect, gameboard.select); +}); + +if (oldObj.getAttribute('data') !== fileName) { + console.log('object data changed'); + object.data = fileName; +} |