aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/dumbymap.mjs
diff options
context:
space:
mode:
Diffstat (limited to 'src/dumbymap.mjs')
-rw-r--r--src/dumbymap.mjs88
1 files changed, 46 insertions, 42 deletions
diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs
index 47c629c..72e864e 100644
--- a/src/dumbymap.mjs
+++ b/src/dumbymap.mjs
@@ -138,7 +138,7 @@ export const markdown2HTML = (container, mdContent) => {
138 //}}} 138 //}}}
139} 139}
140// FIXME Don't use hard-coded CSS selector 140// FIXME Don't use hard-coded CSS selector
141export const generateMaps = async (container) => { 141export const generateMaps = async (container, callback) => {
142 // LeaderLine {{{ 142 // LeaderLine {{{
143 143
144 // Get anchors with "geo:" scheme 144 // Get anchors with "geo:" scheme
@@ -250,51 +250,55 @@ export const generateMaps = async (container) => {
250 // Render each code block with "language-map" class 250 // Render each code block with "language-map" class
251 const render = renderWith(config => ({ width: "100%", ...config })) 251 const render = renderWith(config => ({ width: "100%", ...config }))
252 const renderTargets = Array.from(container.querySelectorAll('pre:has(.language-map)')) 252 const renderTargets = Array.from(container.querySelectorAll('pre:has(.language-map)'))
253 const renderAllTargets = renderTargets.map(async (target) => { 253 .map(async (target) => {
254 // Get text in code block starts with '```map' 254 // Get text in code block starts with '```map'
255 const configText = target.querySelector('.language-map') 255 const configText = target.querySelector('.language-map')
256 .textContent 256 .textContent
257 // BE CAREFUL!!! 0xa0 char is "non-breaking spaces" in HTML text content 257 // BE CAREFUL!!! 0xa0 char is "non-breaking spaces" in HTML text content
258 // replace it by normal space 258 // replace it by normal space
259 .replace(/\u00A0/g, '\u0020') 259 .replace(/\u00A0/g, '\u0020')
260 260
261 let configList = [] 261 let configList = []
262 try { 262 try {
263 configList = parseConfigsFromYaml(configText).map(assignMapId) 263 configList = parseConfigsFromYaml(configText).map(assignMapId)
264 } catch (_) { 264 } catch (_) {
265 console.warn('Fail to parse yaml config for element', target) 265 console.warn('Fail to parse yaml config for element', target)
266 } 266 }
267 267
268 // Render maps 268 // Render maps
269 return render(target, configList) 269 return render(target, configList)
270 .then(results => { 270 .then(results => {
271 results.forEach((mapByConfig) => { 271 results.forEach((mapByConfig) => {
272 if (mapByConfig.status === 'fulfilled') { 272 if (mapByConfig.status === 'fulfilled') {
273 afterEachMapLoaded(mapByConfig.value) 273 afterEachMapLoaded(mapByConfig.value)
274 return mapByConfig.value 274 return mapByConfig.value
275 } else { 275 } else {
276 console.error('Fail to render target element', mapByConfig.reason) 276 console.error('Fail to render target element', mapByConfig.reason)
277 } 277 }
278 })
278 }) 279 })
279 })
280 })
281 const renderInfo = await Promise.all(renderAllTargets).then(() => 'Finish Rendering')
282 const maps = htmlHolder.querySelectorAll('.map-container') ?? []
283 Array.from(maps)
284 .forEach(ele => {
285 const markers = geoLinks
286 .filter(link => !link.targets || link.targets.include(ele.id))
287 .map(link => ({
288 xy: link.xy,
289 title: link.url.pathname
290 }))
291 ele?.renderer?.addMarkers(markers)
292 }) 280 })
293 281
294 htmlHolder.querySelectorAll('.marker') 282 const renderAllTargets = Promise.all(renderTargets)
295 .forEach(marker => htmlHolder.anchors.push(marker)) 283 renderAllTargets.then(() => {
284 console.info('Finish Rendering')
285
286 const maps = htmlHolder.querySelectorAll('.map-container') ?? []
287 Array.from(maps)
288 .forEach(ele => {
289 callback(ele)
290 const markers = geoLinks
291 .filter(link => !link.targets || link.targets.include(ele.id))
292 .map(link => ({
293 xy: link.xy,
294 title: link.url.pathname
295 }))
296 ele?.renderer?.addMarkers(markers)
297 })
296 298
297 console.info(renderInfo) 299 htmlHolder.querySelectorAll('.marker')
300 .forEach(marker => htmlHolder.anchors.push(marker))
301 })
298 302
299 //}}} 303 //}}}
300 // Draggable Blocks{{{ 304 // Draggable Blocks{{{
@@ -407,5 +411,5 @@ export const generateMaps = async (container) => {
407 onRemove(htmlHolder, () => layoutObserver.disconnect()) 411 onRemove(htmlHolder, () => layoutObserver.disconnect())
408 //}}} 412 //}}}
409 //}}} 413 //}}}
410 return container 414 return renderAllTargets
411} 415}