aboutsummaryrefslogtreecommitdiffhomepage
path: root/src
diff options
context:
space:
mode:
authorHsieh Chin Fan <pham@topo.tw>2024-09-07 22:26:14 +0800
committerHsieh Chin Fan <pham@topo.tw>2024-09-07 22:26:14 +0800
commit5eff775a76b3a78e1801aa6f9d85e525fb3e2a5a (patch)
tree1cc1187d6941e16c576c12874cba62a381bbea21 /src
parentebe17265ab1f026f547c9f3ea6557c0cd0ed8991 (diff)
chore: Improve comments
Diffstat (limited to 'src')
-rw-r--r--src/editor.mjs18
1 files changed, 10 insertions, 8 deletions
diff --git a/src/editor.mjs b/src/editor.mjs
index 8b0a6ac..c011c6b 100644
--- a/src/editor.mjs
+++ b/src/editor.mjs
@@ -8,7 +8,7 @@ const HtmlContainer = document.querySelector(".result-html")
8const mdeElement = document.querySelector("#tinymde") 8const mdeElement = document.querySelector("#tinymde")
9 9
10// Add Editor 10// Add Editor
11const defaultContent = '## Links\n\n- [Go to marker](geo:24,121?id=foo,leaflet&text=normal "Link Test")\n\n```map\nid: foo\nuse: maplibre\n```\n' 11const defaultContent = '## Links\n\n- [Go to marker](geo:24,121?id=foo,leaflet&text=normal "Link Test")\n\n```map\nid: foo\nuse: Maplibre\n```\n'
12const lastContent = localStorage.getItem('editorContent') 12const lastContent = localStorage.getItem('editorContent')
13const tinyEditor = new TinyMDE.Editor({ 13const tinyEditor = new TinyMDE.Editor({
14 element: 'tinymde', 14 element: 'tinymde',
@@ -158,7 +158,7 @@ const getLineWithRenderer = (element) => {
158 return null 158 return null
159} 159}
160// }}} 160// }}}
161// FUNCTION: Add suggestions for current selection {{{ 161// FUNCTION: Return suggestions for valid options {{{
162const getSuggestionsForOptions = (optionTyped, validOptions) => { 162const getSuggestionsForOptions = (optionTyped, validOptions) => {
163 let suggestOptions = [] 163 let suggestOptions = []
164 164
@@ -177,7 +177,8 @@ const getSuggestionsForOptions = (optionTyped, validOptions) => {
177 replace: `${o.valueOf()}: `, 177 replace: `${o.valueOf()}: `,
178 })) 178 }))
179} 179}
180 180// }}}
181// FUNCTION: Return suggestion for example of option value {{{
181const getSuggestionFromMapOption = (option) => { 182const getSuggestionFromMapOption = (option) => {
182 if (!option.example) return null 183 if (!option.example) return null
183 184
@@ -190,7 +191,8 @@ const getSuggestionFromMapOption = (option) => {
190 replace: `${option.valueOf()}: ${option.example ?? ""}`, 191 replace: `${option.valueOf()}: ${option.example ?? ""}`,
191 }) 192 })
192} 193}
193 194// }}}
195// FUNCTION: Return suggestions from aliases {{{
194const getSuggestionsFromAliases = (option) => Object.entries(aliasesForMapOptions[option.valueOf()] ?? {}) 196const getSuggestionsFromAliases = (option) => Object.entries(aliasesForMapOptions[option.valueOf()] ?? {})
195 ?.map(record => { 197 ?.map(record => {
196 const [alias, value] = record 198 const [alias, value] = record
@@ -201,8 +203,8 @@ const getSuggestionsFromAliases = (option) => Object.entries(aliasesForMapOption
201 }) 203 })
202 }) 204 })
203 ?? [] 205 ?? []
204 206// }}}
205// Add HTML element for List of suggestions 207// FUNCTION: Add HTML element for List of suggestions {{{
206const addSuggestions = (currentLine, selection) => { 208const addSuggestions = (currentLine, selection) => {
207 const text = currentLine.textContent 209 const text = currentLine.textContent
208 const markInputIsInvalid = (ele) => (ele ?? currentLine).classList.add('invalid-input') 210 const markInputIsInvalid = (ele) => (ele ?? currentLine).classList.add('invalid-input')
@@ -327,7 +329,7 @@ const addSuggestions = (currentLine, selection) => {
327 suggestionsEle.style.maxWidth = `calc(${window.innerWidth}px - ${rect.right}px - 2rem)`; 329 suggestionsEle.style.maxWidth = `calc(${window.innerWidth}px - ${rect.right}px - 2rem)`;
328} 330}
329// }}} 331// }}}
330// Event: suggests for current selection {{{ 332// EVENT: suggests for current selection {{{
331tinyEditor.addEventListener('selection', selection => { 333tinyEditor.addEventListener('selection', selection => {
332 // To trigger click event on suggestions list, don't set suggestion list invisible 334 // To trigger click event on suggestions list, don't set suggestion list invisible
333 if (suggestionsEle.querySelector('.container__suggestion.focus:hover') !== null) { 335 if (suggestionsEle.querySelector('.container__suggestion.focus:hover') !== null) {
@@ -356,7 +358,7 @@ tinyEditor.addEventListener('selection', selection => {
356 if (insideCodeblockForMap(element)) addSuggestions(element, selection) 358 if (insideCodeblockForMap(element)) addSuggestions(element, selection)
357}); 359});
358// }}} 360// }}}
359// Key events for suggestions {{{ 361// EVENT: keydown for suggestions {{{
360mdeElement.addEventListener('keydown', (e) => { 362mdeElement.addEventListener('keydown', (e) => {
361 // Only the following keys are used 363 // Only the following keys are used
362 const keyForSuggestions = ['Tab', 'Enter', 'Escape'].includes(e.key) 364 const keyForSuggestions = ['Tab', 'Enter', 'Escape'].includes(e.key)