diff options
Diffstat (limited to 'src/dumbyUtils.mjs')
-rw-r--r-- | src/dumbyUtils.mjs | 28 |
1 files changed, 27 insertions, 1 deletions
diff --git a/src/dumbyUtils.mjs b/src/dumbyUtils.mjs index b0845bd..5182a8f 100644 --- a/src/dumbyUtils.mjs +++ b/src/dumbyUtils.mjs | |||
@@ -1,5 +1,10 @@ | |||
1 | import LeaderLine from 'leader-line' | 1 | import LeaderLine from 'leader-line' |
2 | 2 | ||
3 | /** | ||
4 | * focusNextMap. | ||
5 | * | ||
6 | * @param {Boolean} reverse -- focus previous map | ||
7 | */ | ||
3 | export function focusNextMap (reverse = false) { | 8 | export function focusNextMap (reverse = false) { |
4 | const renderedList = this.utils.renderedMaps() | 9 | const renderedList = this.utils.renderedMaps() |
5 | const index = renderedList.findIndex(e => e.classList.contains('focus')) | 10 | const index = renderedList.findIndex(e => e.classList.contains('focus')) |
@@ -10,6 +15,11 @@ export function focusNextMap (reverse = false) { | |||
10 | nextMap.scrollIntoView({ behavior: 'smooth' }) | 15 | nextMap.scrollIntoView({ behavior: 'smooth' }) |
11 | } | 16 | } |
12 | 17 | ||
18 | /** | ||
19 | * focusNextBlock. | ||
20 | * | ||
21 | * @param {Boolean} reverse -- focus previous block | ||
22 | */ | ||
13 | export function focusNextBlock (reverse = false) { | 23 | export function focusNextBlock (reverse = false) { |
14 | const blocks = this.blocks.filter(b => | 24 | const blocks = this.blocks.filter(b => |
15 | b.checkVisibility({ | 25 | b.checkVisibility({ |
@@ -27,7 +37,12 @@ export function focusNextBlock (reverse = false) { | |||
27 | scrollToBlock(nextBlock) | 37 | scrollToBlock(nextBlock) |
28 | } | 38 | } |
29 | 39 | ||
30 | // Consider block is bigger then viewport height | 40 | /** |
41 | * scrollToBlock. Smoothly scroll to target block. | ||
42 | * If block is bigger than viewport, then pick strategy wisely. | ||
43 | * | ||
44 | * @param {HTMLElement} block -- Scroll to this element | ||
45 | */ | ||
31 | export const scrollToBlock = block => { | 46 | export const scrollToBlock = block => { |
32 | const parentRect = block.parentElement.getBoundingClientRect() | 47 | const parentRect = block.parentElement.getBoundingClientRect() |
33 | const scrollBlock = | 48 | const scrollBlock = |
@@ -37,10 +52,18 @@ export const scrollToBlock = block => { | |||
37 | block.scrollIntoView({ behavior: 'smooth', block: scrollBlock }) | 52 | block.scrollIntoView({ behavior: 'smooth', block: scrollBlock }) |
38 | } | 53 | } |
39 | 54 | ||
55 | /** | ||
56 | * focusDelay. Delay of throttle, value changes by cases | ||
57 | */ | ||
40 | export function focusDelay () { | 58 | export function focusDelay () { |
41 | return window.window.getComputedStyle(this.showcase).display === 'none' ? 50 : 300 | 59 | return window.window.getComputedStyle(this.showcase).display === 'none' ? 50 : 300 |
42 | } | 60 | } |
43 | 61 | ||
62 | /** | ||
63 | * switchToNextLayout. | ||
64 | * | ||
65 | * @param {Boolean} reverse -- Switch to previous one | ||
66 | */ | ||
44 | export function switchToNextLayout (reverse = false) { | 67 | export function switchToNextLayout (reverse = false) { |
45 | const layouts = this.layouts | 68 | const layouts = this.layouts |
46 | const currentLayoutName = this.container.getAttribute('data-layout') | 69 | const currentLayoutName = this.container.getAttribute('data-layout') |
@@ -54,6 +77,9 @@ export function switchToNextLayout (reverse = false) { | |||
54 | this.container.setAttribute('data-layout', nextLayout.name) | 77 | this.container.setAttribute('data-layout', nextLayout.name) |
55 | } | 78 | } |
56 | 79 | ||
80 | /** | ||
81 | * removeBlockFocus. | ||
82 | */ | ||
57 | export function removeBlockFocus () { | 83 | export function removeBlockFocus () { |
58 | this.blocks.forEach(b => b.classList.remove('focus')) | 84 | this.blocks.forEach(b => b.classList.remove('focus')) |
59 | } | 85 | } |