diff options
Diffstat (limited to 'src/dumbyUtils.mjs')
-rw-r--r-- | src/dumbyUtils.mjs | 28 |
1 files changed, 14 insertions, 14 deletions
diff --git a/src/dumbyUtils.mjs b/src/dumbyUtils.mjs index d30145c..cfac00b 100644 --- a/src/dumbyUtils.mjs +++ b/src/dumbyUtils.mjs | |||
@@ -1,16 +1,16 @@ | |||
1 | export function focusNextMap(reverse = false) { | 1 | export function focusNextMap(reverse = false) { |
2 | const renderedList = Array.from( | 2 | const renderedList = Array.from( |
3 | this.htmlHolder.querySelectorAll("[data-render=fulfilled]"), | 3 | this.htmlHolder.querySelectorAll('[data-render=fulfilled]'), |
4 | ); | 4 | ); |
5 | const mapNum = renderedList.length; | 5 | const mapNum = renderedList.length; |
6 | if (mapNum === 0) return; | 6 | if (mapNum === 0) return; |
7 | 7 | ||
8 | // Get current focused map element | 8 | // Get current focused map element |
9 | const currentFocus = this.container.querySelector(".mapclay.focus"); | 9 | const currentFocus = this.container.querySelector('.mapclay.focus'); |
10 | 10 | ||
11 | // Remove class name of focus for ALL candidates | 11 | // Remove class name of focus for ALL candidates |
12 | // This may trigger animation | 12 | // This may trigger animation |
13 | renderedList.forEach(ele => ele.classList.remove("focus")); | 13 | renderedList.forEach(ele => ele.classList.remove('focus')); |
14 | 14 | ||
15 | // Get next existing map element | 15 | // Get next existing map element |
16 | const padding = reverse ? -1 : 1; | 16 | const padding = reverse ? -1 : 1; |
@@ -19,18 +19,18 @@ export function focusNextMap(reverse = false) { | |||
19 | : 0; | 19 | : 0; |
20 | nextIndex = (nextIndex + mapNum) % mapNum; | 20 | nextIndex = (nextIndex + mapNum) % mapNum; |
21 | const nextFocus = renderedList[nextIndex]; | 21 | const nextFocus = renderedList[nextIndex]; |
22 | nextFocus.classList.add("focus"); | 22 | nextFocus.classList.add('focus'); |
23 | 23 | ||
24 | return nextFocus; | 24 | return nextFocus; |
25 | } | 25 | } |
26 | 26 | ||
27 | export function focusDelay() { | 27 | export function focusDelay() { |
28 | return window.getComputedStyle(this.showcase).display === "none" ? 50 : 300; | 28 | return window.getComputedStyle(this.showcase).display === 'none' ? 50 : 300; |
29 | } | 29 | } |
30 | 30 | ||
31 | export function switchToNextLayout(reverse = false) { | 31 | export function switchToNextLayout(reverse = false) { |
32 | const layouts = this.layouts; | 32 | const layouts = this.layouts; |
33 | const currentLayoutName = this.container.getAttribute("data-layout"); | 33 | const currentLayoutName = this.container.getAttribute('data-layout'); |
34 | const currentIndex = layouts.map(l => l.name).indexOf(currentLayoutName); | 34 | const currentIndex = layouts.map(l => l.name).indexOf(currentLayoutName); |
35 | const padding = reverse ? -1 : 1; | 35 | const padding = reverse ? -1 : 1; |
36 | const nextIndex = | 36 | const nextIndex = |
@@ -38,7 +38,7 @@ export function switchToNextLayout(reverse = false) { | |||
38 | ? 0 | 38 | ? 0 |
39 | : (currentIndex + padding + layouts.length) % layouts.length; | 39 | : (currentIndex + padding + layouts.length) % layouts.length; |
40 | const nextLayout = layouts[nextIndex]; | 40 | const nextLayout = layouts[nextIndex]; |
41 | this.container.setAttribute("data-layout", nextLayout.name); | 41 | this.container.setAttribute('data-layout', nextLayout.name); |
42 | } | 42 | } |
43 | 43 | ||
44 | export function focusNextBlock(reverse = false) { | 44 | export function focusNextBlock(reverse = false) { |
@@ -49,7 +49,7 @@ export function focusNextBlock(reverse = false) { | |||
49 | visibilityProperty: true, | 49 | visibilityProperty: true, |
50 | }), | 50 | }), |
51 | ); | 51 | ); |
52 | const currentBlock = blocks.find(b => b.classList.contains("focus")); | 52 | const currentBlock = blocks.find(b => b.classList.contains('focus')); |
53 | const currentIndex = blocks.indexOf(currentBlock); | 53 | const currentIndex = blocks.indexOf(currentBlock); |
54 | const padding = reverse ? -1 : 1; | 54 | const padding = reverse ? -1 : 1; |
55 | const nextIndex = | 55 | const nextIndex = |
@@ -57,16 +57,16 @@ export function focusNextBlock(reverse = false) { | |||
57 | ? 0 | 57 | ? 0 |
58 | : (currentIndex + padding + blocks.length) % blocks.length; | 58 | : (currentIndex + padding + blocks.length) % blocks.length; |
59 | const nextBlock = blocks[nextIndex]; | 59 | const nextBlock = blocks[nextIndex]; |
60 | blocks.forEach(b => b.classList.remove("focus")); | 60 | blocks.forEach(b => b.classList.remove('focus')); |
61 | nextBlock?.classList?.add("focus"); | 61 | nextBlock?.classList?.add('focus'); |
62 | const scrollBlock = | 62 | const scrollBlock = |
63 | nextBlock.getBoundingClientRect().height > | 63 | nextBlock.getBoundingClientRect().height > |
64 | nextBlock.parentElement.getBoundingClientRect().height * 0.8 | 64 | nextBlock.parentElement.getBoundingClientRect().height * 0.8 |
65 | ? "nearest" | 65 | ? 'nearest' |
66 | : "center"; | 66 | : 'center'; |
67 | nextBlock.scrollIntoView({ behavior: "smooth", block: scrollBlock }); | 67 | nextBlock.scrollIntoView({ behavior: 'smooth', block: scrollBlock }); |
68 | } | 68 | } |
69 | 69 | ||
70 | export function removeBlockFocus() { | 70 | export function removeBlockFocus() { |
71 | this.blocks.forEach(b => b.classList.remove("focus")); | 71 | this.blocks.forEach(b => b.classList.remove('focus')); |
72 | } | 72 | } |