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-02 11:02:10 -0700 |
---|---|---|
committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-05-02 11:04:09 -0700 |
commit | a69623b0ab6baff9f968e126c25d7e961e9dde53 (patch) | |
tree | d1f84b493cb3cbf1f2ba8df61f9ff8bd6099277f /src/soldier_record_block.js | |
parent | 9ac571cc244ef02a32679f3fb47ffee5f7e0fd7c (diff) |
Organize public directory contents into assets folders
Diffstat (limited to 'src/soldier_record_block.js')
-rw-r--r-- | src/soldier_record_block.js | 56 |
1 files changed, 56 insertions, 0 deletions
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' } +); |