diff options
author | Hsieh Chin Fan <pham@topo.tw> | 2024-09-07 22:26:14 +0800 |
---|---|---|
committer | Hsieh Chin Fan <pham@topo.tw> | 2024-09-07 22:26:14 +0800 |
commit | 5eff775a76b3a78e1801aa6f9d85e525fb3e2a5a (patch) | |
tree | 1cc1187d6941e16c576c12874cba62a381bbea21 /src | |
parent | ebe17265ab1f026f547c9f3ea6557c0cd0ed8991 (diff) |
chore: Improve comments
Diffstat (limited to 'src')
-rw-r--r-- | src/editor.mjs | 18 |
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") | |||
8 | const mdeElement = document.querySelector("#tinymde") | 8 | const mdeElement = document.querySelector("#tinymde") |
9 | 9 | ||
10 | // Add Editor | 10 | // Add Editor |
11 | const 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' | 11 | const 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' |
12 | const lastContent = localStorage.getItem('editorContent') | 12 | const lastContent = localStorage.getItem('editorContent') |
13 | const tinyEditor = new TinyMDE.Editor({ | 13 | const 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 {{{ |
162 | const getSuggestionsForOptions = (optionTyped, validOptions) => { | 162 | const 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 {{{ | ||
181 | const getSuggestionFromMapOption = (option) => { | 182 | const 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 {{{ | ||
194 | const getSuggestionsFromAliases = (option) => Object.entries(aliasesForMapOptions[option.valueOf()] ?? {}) | 196 | const 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 {{{ |
206 | const addSuggestions = (currentLine, selection) => { | 208 | const 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 {{{ |
331 | tinyEditor.addEventListener('selection', selection => { | 333 | tinyEditor.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 {{{ |
360 | mdeElement.addEventListener('keydown', (e) => { | 362 | mdeElement.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) |