aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/dumbymap.mjs
diff options
context:
space:
mode:
Diffstat (limited to 'src/dumbymap.mjs')
-rw-r--r--src/dumbymap.mjs44
1 files changed, 22 insertions, 22 deletions
diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs
index 1da5bb6..b02e783 100644
--- a/src/dumbymap.mjs
+++ b/src/dumbymap.mjs
@@ -17,7 +17,7 @@ const geoLinkSelector = 'a[href^="geo:"]'
17const layouts = [ 17const layouts = [
18 new Layout({ name: 'normal' }), 18 new Layout({ name: 'normal' }),
19 new SideBySide({ name: 'side-by-side' }), 19 new SideBySide({ name: 'side-by-side' }),
20 new Overlay({ name: 'overlay' }) 20 new Overlay({ name: 'overlay' }),
21] 21]
22const mapCache = {} 22const mapCache = {}
23 23
@@ -37,12 +37,12 @@ export const markdown2HTML = (container, mdContent) => {
37 const md = MarkdownIt({ 37 const md = MarkdownIt({
38 html: true, 38 html: true,
39 breaks: true, 39 breaks: true,
40 linkify: true 40 linkify: true,
41 }) 41 })
42 .use(MarkdownItAnchor, { 42 .use(MarkdownItAnchor, {
43 permalink: MarkdownItAnchor.permalink.linkInsideHeader({ 43 permalink: MarkdownItAnchor.permalink.linkInsideHeader({
44 placement: 'before' 44 placement: 'before',
45 }) 45 }),
46 }) 46 })
47 .use(MarkdownItFootnote) 47 .use(MarkdownItFootnote)
48 .use(MarkdownItFrontMatter) 48 .use(MarkdownItFrontMatter)
@@ -58,11 +58,11 @@ export const markdown2HTML = (container, mdContent) => {
58 match.text = `${x}${sep} ${y}` 58 match.text = `${x}${sep} ${y}`
59 match.index += match.text.indexOf(x) + 1 59 match.index += match.text.indexOf(x) + 1
60 return match 60 return match
61 } 61 },
62 } 62 }
63 const patterns = ['[', '(', '📍', '\uFF08', '@', 'geo:', 'twd'] 63 const patterns = ['[', '(', '📍', '\uFF08', '@', 'geo:', 'twd']
64 patterns.forEach(prefix => 64 patterns.forEach(prefix =>
65 md.linkify.add(prefix, coordinateValue) 65 md.linkify.add(prefix, coordinateValue),
66 ) 66 )
67 67
68 // FIXME A better way to generate blocks 68 // FIXME A better way to generate blocks
@@ -133,7 +133,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
133 ...utils, 133 ...utils,
134 renderedMaps: () => 134 renderedMaps: () =>
135 Array.from( 135 Array.from(
136 container.querySelectorAll('.mapclay[data-render=fulfilled]') 136 container.querySelectorAll('.mapclay[data-render=fulfilled]'),
137 ).sort((a, b) => a.style.order > b.style.order), 137 ).sort((a, b) => a.style.order > b.style.order),
138 setContextMenu: (menuCallback) => { 138 setContextMenu: (menuCallback) => {
139 const originalCallback = container.oncontextmenu 139 const originalCallback = container.oncontextmenu
@@ -145,8 +145,8 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
145 } 145 }
146 }, 146 },
147 focusNextMap: throttle(utils.focusNextMap, utils.focusDelay), 147 focusNextMap: throttle(utils.focusNextMap, utils.focusDelay),
148 switchToNextLayout: throttle(utils.switchToNextLayout, 300) 148 switchToNextLayout: throttle(utils.switchToNextLayout, 300),
149 } 149 },
150 } 150 }
151 Object.entries(dumbymap.utils).forEach(([util, func]) => { 151 Object.entries(dumbymap.utils).forEach(([util, func]) => {
152 dumbymap.utils[util] = func.bind(dumbymap) 152 dumbymap.utils[util] = func.bind(dumbymap)
@@ -155,7 +155,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
155 // LeaderLine {{{ 155 // LeaderLine {{{
156 156
157 Array.from(container.querySelectorAll(docLinkSelector)).filter( 157 Array.from(container.querySelectorAll(docLinkSelector)).filter(
158 utils.createDocLink 158 utils.createDocLink,
159 ) 159 )
160 160
161 // Add GeoLinks 161 // Add GeoLinks
@@ -177,7 +177,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
177 showcase.checkVisibility({ 177 showcase.checkVisibility({
178 contentVisibilityAuto: true, 178 contentVisibilityAuto: true,
179 opacityProperty: true, 179 opacityProperty: true,
180 visibilityProperty: true 180 visibilityProperty: true,
181 }) 181 })
182 182
183 if (focus) { 183 if (focus) {
@@ -217,12 +217,12 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
217 // Resume rect from Semantic HTML to Showcase, with animation 217 // Resume rect from Semantic HTML to Showcase, with animation
218 animateRectTransition(target, placeholder.getBoundingClientRect(), { 218 animateRectTransition(target, placeholder.getBoundingClientRect(), {
219 duration: 300, 219 duration: 300,
220 resume: true 220 resume: true,
221 }) 221 })
222 } else if (showcase.contains(target)) { 222 } else if (showcase.contains(target)) {
223 // Check placeholder is inside Semantic HTML 223 // Check placeholder is inside Semantic HTML
224 const placeholder = htmlHolder.querySelector( 224 const placeholder = htmlHolder.querySelector(
225 `[data-placeholder="${target.id}"]` 225 `[data-placeholder="${target.id}"]`,
226 ) 226 )
227 if (!placeholder) { throw Error(`Cannot find placeholder for map "${target.id}"`) } 227 if (!placeholder) { throw Error(`Cannot find placeholder for map "${target.id}"`) }
228 228
@@ -234,7 +234,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
234 234
235 // animation from Showcase to placeholder 235 // animation from Showcase to placeholder
236 animateRectTransition(target, placeholder.getBoundingClientRect(), { 236 animateRectTransition(target, placeholder.getBoundingClientRect(), {
237 duration: 300 237 duration: 300,
238 }).finished.finally(afterAnimation) 238 }).finished.finally(afterAnimation)
239 } 239 }
240 }) 240 })
@@ -277,7 +277,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
277 attributes: true, 277 attributes: true,
278 attributeFilter: ['data-layout'], 278 attributeFilter: ['data-layout'],
279 attributeOldValue: true, 279 attributeOldValue: true,
280 characterDataOldValue: true 280 characterDataOldValue: true,
281 }) 281 })
282 282
283 onRemove(htmlHolder, () => layoutObserver.disconnect()) 283 onRemove(htmlHolder, () => layoutObserver.disconnect())
@@ -303,7 +303,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
303 observer.observe(mapElement, { 303 observer.observe(mapElement, {
304 attributes: true, 304 attributes: true,
305 attributeFilter: ['class'], 305 attributeFilter: ['class'],
306 attributeOldValue: true 306 attributeOldValue: true,
307 }) 307 })
308 onRemove(dumbymap.htmlHolder, () => { 308 onRemove(dumbymap.htmlHolder, () => {
309 observer.disconnect() 309 observer.disconnect()
@@ -329,7 +329,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
329 329
330 // Render each code block with "language-map" class 330 // Render each code block with "language-map" class
331 const elementsWithMapConfig = Array.from( 331 const elementsWithMapConfig = Array.from(
332 container.querySelectorAll(mapBlockSelector) ?? [] 332 container.querySelectorAll(mapBlockSelector) ?? [],
333 ) 333 )
334 /** 334 /**
335 * updateAttributeByStep. 335 * updateAttributeByStep.
@@ -338,7 +338,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
338 */ 338 */
339 const updateAttributeByStep = ({ results, target, steps }) => { 339 const updateAttributeByStep = ({ results, target, steps }) => {
340 let passNum = results.filter( 340 let passNum = results.filter(
341 r => r.type === 'render' && r.state.match(/success|skip/) 341 r => r.type === 'render' && r.state.match(/success|skip/),
342 ).length 342 ).length
343 const total = steps.length 343 const total = steps.length
344 passNum += `/${total}` 344 passNum += `/${total}`
@@ -367,9 +367,9 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
367 ...config, 367 ...config,
368 aliases: { 368 aliases: {
369 ...defaultAliases, 369 ...defaultAliases,
370 ...(config.aliases ?? {}) 370 ...(config.aliases ?? {}),
371 }, 371 },
372 stepCallback: updateAttributeByStep 372 stepCallback: updateAttributeByStep,
373 }) 373 })
374 const render = renderWith(configConverter) 374 const render = renderWith(configConverter)
375 let order = 0 375 let order = 0
@@ -422,7 +422,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
422 } 422 }
423 }) 423 })
424 }, 424 },
425 delay ?? 1000 425 delay ?? 1000,
426 ) 426 )
427 onRemove(htmlHolder, () => { 427 onRemove(htmlHolder, () => {
428 clearTimeout(timer) 428 clearTimeout(timer)
@@ -497,7 +497,7 @@ export const generateMaps = (container, { delay, renderCallback } = {}) => {
497 } 497 }
498 document.addEventListener('click', actionOutsideMenu) 498 document.addEventListener('click', actionOutsideMenu)
499 onRemove(htmlHolder, () => 499 onRemove(htmlHolder, () =>
500 document.removeEventListener('click', actionOutsideMenu) 500 document.removeEventListener('click', actionOutsideMenu),
501 ) 501 )
502 // }}} 502 // }}}
503 return Object.seal(dumbymap) 503 return Object.seal(dumbymap)