From cb76c9c68a185f840aa03fd0a38260bba6f21302 Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Wed, 1 May 2024 22:53:18 -0700
Subject: WIP: recreate object element when loading maps to avoid node warnings
about dangling file handles
---
src/index.js | 77 +++++++++++++++++++++++++++++++++++++++++++++++++++---------
1 file changed, 66 insertions(+), 11 deletions(-)
(limited to 'src')
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;
+}
--
cgit v1.2.3