| 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-08-09 20:23:09 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <webdevcat@proton.me> | 2024-08-09 20:23:09 -0700 |
| commit | 402e76ee6e27296b69a603d0d755bba27ce69943 (patch) | |
| tree | ed075800c23e5c8836a362ed5f3dadc7d8efe63c | |
| parent | a7925db494ab7db102a7acb6408ca5efcbf2cb08 (diff) | |
Refactor record_sheet.js
| -rw-r--r-- | src/modules/record_sheet.js | 40 |
1 files changed, 15 insertions, 25 deletions
diff --git a/src/modules/record_sheet.js b/src/modules/record_sheet.js index 81add27..5abb108 100644 --- a/src/modules/record_sheet.js +++ b/src/modules/record_sheet.js @@ -305,38 +305,27 @@ function clear() { } function reveal(record) { - const currentSquadView = document.querySelector(`#record-sheet #${record.dataset.allegiance}-record .records-header .squad-number text`); + const currentSquadIndicator = document.querySelector(`#record-sheet #${record.dataset.allegiance}-record .records-header .squad-number text`); const records = document.querySelector(`#record-sheet #${record.dataset.allegiance}-record .records`); - const target = records.querySelector(`.squad-${record.dataset.squad}`); - const currentSquad = records.querySelector(`.squad-${currentSquadView.textContent}`); + const currentSquad = records.querySelector(`.squad-${currentSquadIndicator.textContent}`); - let direction; - let next = prev = currentSquad; - - while (!direction && (next || prev)) { - next = next?.nextElementSibling; - prev = prev?.previousElementSibling; - if (next === target) direction = 'next'; - else if (prev === target) direction = 'previous'; - } - - function showSquad(current, target, direction) { + function revealSquad(current, squad, direction) { current.addEventListener('transitionend', e => { - const toSquad = current[`${direction}ElementSibling`]; - currentSquadView.textContent = +toSquad.className.match(/\d+/); + const next = current[`${direction}ElementSibling`]; + currentSquadIndicator.textContent = +next.className.match(/\d+/); current.style.display = 'none'; // There needs to be a delay between making it visible and the // transformation. ScrollTo seems to create enough delay. - toSquad.style.display = 'block'; + next.style.display = 'block'; records.scrollTo(0, 0); - if (toSquad[`${direction}ElementSibling`] && toSquad !== target) { - showSquad(toSquad, target, direction); - } else { - toSquad.style.transform = 'translateX(0)'; + if (next !== squad && next[`${direction}ElementSibling`]) + revealSquad(next, squad, direction); + else { + next.style.transform = 'translateX(0)'; - toSquad.addEventListener('transitionend', e => { + next.addEventListener('transitionend', e => { record.scrollIntoView({ behavior: 'smooth' }); }, { once: true }); } @@ -345,9 +334,10 @@ function reveal(record) { current.style.transform = `translateX(${direction === 'next' ? '-' : ''}100%)`; } - if (currentSquad !== target) - showSquad(currentSquad, target, direction); - else + if (!currentSquad.contains(record)) { + const [squad] = closestSibling(currentSquad, `.squad-${record.dataset.squad}`); + revealSquad(currentSquad, squad.el, squad.direction); + } else record.scrollIntoView({ behavior: 'smooth' }); } |