From a69623b0ab6baff9f968e126c25d7e961e9dde53 Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Thu, 2 May 2024 11:02:10 -0700
Subject: Organize public directory contents into assets folders
---
src/index.js | 4 +--
src/modules/map_select_dialog.js | 2 +-
src/soldier_record_block.js | 56 ++++++++++++++++++++++++++++++++++++++++
3 files changed, 59 insertions(+), 3 deletions(-)
create mode 100644 src/soldier_record_block.js
(limited to 'src')
diff --git a/src/index.js b/src/index.js
index 4c7db30..800eea7 100644
--- a/src/index.js
+++ b/src/index.js
@@ -10,7 +10,7 @@ const mapPlaceholder = document.querySelector('.map-placeholder'),
proneToggle = document.getElementById('toggle-prone-counter'),
contentVisToggleEl = document.querySelector('#content input[type="checkbox"].visible'),
object = document.querySelector('object'),
- fileName = `${localStorage.getItem('map') || 'map1'}.svg`,
+ fileName = `assets/images/${localStorage.getItem('map') || 'map1'}.svg`,
toggleContentVis = (function () {
document.querySelectorAll('#content div').forEach(div => {
@@ -132,5 +132,5 @@ object.addEventListener('load', load);
objectDataObserver.observe(object, { attributeFilter: ['data'] });
if (object.getAttribute('data') !== fileName) {
- object.data = fileName;
+ object.data = `assets/images/${fileName}`;
}
diff --git a/src/modules/map_select_dialog.js b/src/modules/map_select_dialog.js
index a9f8bc8..fc8eecc 100644
--- a/src/modules/map_select_dialog.js
+++ b/src/modules/map_select_dialog.js
@@ -34,7 +34,7 @@ export function init() {
e.preventDefault();
localStorage.removeItem('pan-zoom');
localStorage.setItem('map', selectEl.value);
- document.querySelector('object').data = `${selectEl.value}.svg`;
+ document.querySelector('object').data = `assets/images/${selectEl.value}.svg`;
mapDialog.close();
});
}
diff --git a/src/soldier_record_block.js b/src/soldier_record_block.js
new file mode 100644
index 0000000..3931649
--- /dev/null
+++ b/src/soldier_record_block.js
@@ -0,0 +1,56 @@
+customElements.define(
+ 'damage-block',
+ class extends HTMLSpanElement {
+ constructor() {
+ super();
+
+ const template = document.querySelector('#damage-block'),
+ templateContent = template.content,
+ shadowRoot = this.attachShadow({ mode: "open" });
+
+ shadowRoot.appendChild(templateContent.cloneNode(true));
+ }
+
+ connectedCallback() {
+ const el = this.shadowRoot.querySelector('.damage-effect-indicator');
+
+ el.addEventListener('click', e => {
+ e.stopPropagation()
+
+ this.#cycleThroughDamageStates(el);
+ });
+ }
+
+ #cycleThroughDamageStates(el) {
+ if (el.classList.contains('bruise')) {
+ el.classList.remove('bruise');
+ el.classList.add('lethal');
+ } else if (el.classList.contains('lethal')) {
+ el.classList.remove('lethal');
+ } else {
+ el.classList.add('bruise');
+ }
+ }
+ },
+ { extends: 'span' }
+);
+
+customElements.define(
+ 'soldier-record-block',
+ class extends HTMLDivElement {
+ constructor() {
+ super();
+
+ const template = document.querySelector('#soldier-record-block'),
+ templateContent = template.content,
+ shadowRoot = this.attachShadow({ mode: "open" });
+
+ shadowRoot.appendChild(templateContent.cloneNode(true));
+ }
+
+ connectedCallback() {
+ this.shadowRoot.querySelector('.grenades').addEventListener('click', e => e.stopPropagation());
+ }
+ },
+ { extends: 'div' }
+);
--
cgit v1.2.3