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

Import mapsheets.svg

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc
2025-06-16 22:41:31 -07:00
parent 16fb0dab2e
commit 488ebb384b
12 changed files with 138 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/import_mapsheets.js Normal file
View File

@@ -0,0 +1,8 @@
import mapsheets from './assets/images/mapsheets.svg';
const useEls = document.querySelectorAll('svg use[data-href*="mapsheets.svg"');
useEls.forEach(el => {
const href = el.dataset.href.replace('mapsheets.svg', mapsheets.split('/').pop());
el.setAttributeNS(null, 'href', href);
});

45
src/index.js
View File

@@ -45,9 +45,9 @@ function loadScenario(data) {
next.setAttribute('type', 'image/svg+xml');
next.style.opacity = 0;
next.addEventListener('load', load);
mapPlaceholder.after(next);
mapPlaceholder.style.opacity = 1;
next.data = data;
mapPlaceholder.after(next);
current.remove();
}
@@ -93,28 +93,39 @@ function roll(die) {
function load() {
const svg = this.contentDocument.querySelector('svg'),
startLocs = svg.querySelector('.start-locations')
, scriptEl = this.contentDocument.querySelector('script')
// , scriptEl = this.contentDocument.querySelector('script')
;
const linkEl = document.createElement('link');
linkEl.setAttribute('xmlns', 'http://www.w3.org/1999/xhtml');
linkEl.setAttribute('rel', 'stylesheet');
linkEl.setAttribute('href', '../../assets/css/map.css');
linkEl.setAttribute('type', 'text/css');
linkEl.onload = function (e) {
console.log('map.css loaded');
// const useEls = svg.querySelectorAll('use[href*=".svg"]');
if (scriptEl) {
scriptEl.onload = function () {
console.log('map.js loaded');
// console.log(useEls);
};
scriptEl.setAttribute('href', '../../map.js');
}
};
// [...new Set([...useEls].map(el => el.getAttributeNS(null, 'href').match(/^(.*?)\.svg/g).at(0)))].forEach(f => {
// const name = `../assets/images/${f}`;
// import(name);
// console.log(f);
// });
svg.prepend(linkEl);
// const linkEl = document.createElement('link');
// linkEl.setAttribute('xmlns', 'http://www.w3.org/1999/xhtml');
// linkEl.setAttribute('rel', 'stylesheet');
// linkEl.setAttribute('href', '../../assets/css/map.css');
// linkEl.setAttribute('type', 'text/css');
// linkEl.onload = function (e) {
// console.log('map.css loaded');
// if (scriptEl) {
// scriptEl.onload = function () {
// console.log('map.js loaded');
// };
// scriptEl.setAttribute('href', '../../map.js');
// }
// };
// svg.prepend(linkEl);
this.style.opacity = 1;
mapPlaceholder.style.opacity = 0;

9
src/modules/record_sheet.js
View File

@@ -1,5 +1,7 @@
import { Observable } from "./observable";
// import counters from '../../public/assets/images/counters.svg';
// console.log('counters', counters);
// import svg from '../../public/assets/images/counters.svg';
// const doc = new DOMParser().parseFromString(svg, 'image/svg+xml');
@@ -40,7 +42,9 @@ function createIcon(number) {
icon.setAttributeNS(null, 'viewBox', '-6 -6 12 12');
icon.setAttribute('xmlns', svgns);
use.setAttributeNS(null, 'href', `assets/images/counters.svg?v=${cacheBuster}#counter-base`);
// use.setAttributeNS(null, 'href', `assets/images/counters.svg?v=${cacheBuster}#counter-base`);
use.setAttributeNS(null, 'href', `assets/images/counters.svg#counter-base`);
// use.setAttributeNS(null, 'href', `${counters}#counter-base`);
text.textContent = number;
@@ -64,8 +68,9 @@ function createWeaponIcon(type) {
icon.setAttribute('xmlns', svgns);
icon.classList.add('weapon-icon');
use.setAttributeNS(null, 'href', `assets/images/counters.svg?v=${cacheBuster}#${type}`);
// use.setAttributeNS(null, 'href', `assets/images/counters.svg?v=${cacheBuster}#${type}`);
// use.setAttributeNS(null, 'href', `${counters}#${type}`);
use.setAttributeNS(null, 'href', `assets/images/counters.svg#${type}`);
icon.appendChild(use);
// icon.appendChild(document.importNode(doc.querySelector(`#${type}`), true));