ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify loading scenarios

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-05-19 21:32:42 -07:00
parent ff7e88457c
commit c692bc9020
2 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/index.js
View File

@ -24,24 +24,21 @@ const mapPlaceholder = document.querySelector('.map-placeholder'),
}); });
localStorage.setItem('content-visibility', this.checked); localStorage.setItem('content-visibility', this.checked);
}).bind(contentVisToggleEl), }).bind(contentVisToggleEl);
mapResourceObserver = new MutationObserver(function () { let mapResourceEl = document.querySelector('object');
function loadScenario(data) {
const current = document.querySelector('object'); const current = document.querySelector('object');
const resource = current.getAttribute('data');
const next = document.createElement('object'); const next = document.createElement('object');
next.setAttribute('type', 'image/svg+xml'); next.setAttribute('type', 'image/svg+xml');
next.style.opacity = 0; next.style.opacity = 0;
next.addEventListener('load', load); next.addEventListener('load', load);
mapPlaceholder.after(next); mapPlaceholder.after(next);
mapPlaceholder.style.opacity = 1; mapPlaceholder.style.opacity = 1;
next.data = resource; next.data = data;
this.disconnect();
current.remove(); current.remove();
this.observe(next, { attributeFilter: ['data'] }); }
});
let mapResourceEl = document.querySelector('object');
function updateTurnCounter() { function updateTurnCounter() {
const turnCounter = document.getElementById('turn-count'); const turnCounter = document.getElementById('turn-count');
@ -161,11 +158,10 @@ mapSelectDialog
.selectCurrentOptionOnPageLoad() .selectCurrentOptionOnPageLoad()
.showOnClick() .showOnClick()
.updateValueOnSelection() .updateValueOnSelection()
.changeMapOnConfirm(); .changeMapOnConfirm(loadScenario);
mapResourceEl.addEventListener('load', load); mapResourceEl.addEventListener('load', load);
mapResourceEl.data = map; mapResourceEl.data = map;
mapResourceObserver.observe(mapResourceEl, { attributeFilter: ['data'] });
mapResourceEl = null; mapResourceEl = null;
document.querySelector('#download-save').addEventListener('click', e => { document.querySelector('#download-save').addEventListener('click', e => {
@ -187,5 +183,5 @@ document.querySelector('#upload-save').addEventListener('click', () => {
document.querySelector('input[type="file"]').addEventListener('change', e => { document.querySelector('input[type="file"]').addEventListener('change', e => {
const [file] = fileInputEl.files; const [file] = fileInputEl.files;
document.querySelector('object').data = URL.createObjectURL(file); loadScenario(URL.createObjectURL(file))
}); });

4
src/modules/map_select_dialog.js
View File

@ -29,12 +29,12 @@ export function init() {
return this; return this;
}, },
changeMapOnConfirm() { changeMapOnConfirm(loadFn) {
confirmBtn.addEventListener('click', e => { confirmBtn.addEventListener('click', e => {
e.preventDefault(); e.preventDefault();
localStorage.removeItem('pan-zoom'); localStorage.removeItem('pan-zoom');
localStorage.setItem('map', selectEl.value); localStorage.setItem('map', selectEl.value);
document.querySelector('object').data = `assets/images/${selectEl.value}.svg`; loadFn(`assets/images/${selectEl.value}.svg`);
mapDialog.close(); mapDialog.close();
}); });
} }