diff options
| author | Hsieh Chin Fan <pham@topo.tw> | 2024-09-16 21:39:25 +0800 |
|---|---|---|
| committer | Hsieh Chin Fan <pham@topo.tw> | 2024-09-16 21:57:50 +0800 |
| commit | 649dd25e2d7185739780f06c2cd65d089d22ddc1 (patch) | |
| tree | 0302dc602366c901e5613e0197463d36f6b39220 /src | |
| parent | 3aa432dd33a1f38df17616c1d5e35a223642d6ca (diff) | |
fix: prevent autosave overrides content from hash
Diffstat (limited to 'src')
| -rw-r--r-- | src/editor.mjs | 50 |
1 files changed, 29 insertions, 21 deletions
diff --git a/src/editor.mjs b/src/editor.mjs index 8ab2389..d7c26cf 100644 --- a/src/editor.mjs +++ b/src/editor.mjs | |||
| @@ -21,35 +21,19 @@ const toggleEditing = () => { | |||
| 21 | // Set up EasyMDE {{{ | 21 | // Set up EasyMDE {{{ |
| 22 | 22 | ||
| 23 | // Content values for editor | 23 | // Content values for editor |
| 24 | const getStateFromHash = (hash) => { | ||
| 25 | const hashValue = hash.substring(1); | ||
| 26 | const stateString = decodeURIComponent(hashValue) | ||
| 27 | try { return JSON.parse(stateString) ?? {} } | ||
| 28 | catch (_) { return {} } | ||
| 29 | } | ||
| 30 | |||
| 31 | const getContentFromHash = (hash) => { | ||
| 32 | const state = getStateFromHash(hash) | ||
| 33 | return state.content | ||
| 34 | } | ||
| 35 | 24 | ||
| 36 | const initialState = getStateFromHash(window.location.hash) | ||
| 37 | window.location.hash = '' | ||
| 38 | const contentFromHash = initialState.content | ||
| 39 | const lastContent = localStorage.getItem('editorContent') | ||
| 40 | 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' | 25 | 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' |
| 41 | |||
| 42 | const editor = new EasyMDE({ | 26 | const editor = new EasyMDE({ |
| 43 | element: textArea, | 27 | element: textArea, |
| 44 | indentWithTabs: false, | 28 | initialValue: defaultContent, |
| 45 | initialValue: contentFromHash ?? lastContent ?? defaultContent, | ||
| 46 | lineNumbers: true, | ||
| 47 | promptURLs: true, | ||
| 48 | uploadImage: true, | ||
| 49 | autosave: { | 29 | autosave: { |
| 50 | enabled: true, | 30 | enabled: true, |
| 51 | uniqueId: 'dumbymap', | 31 | uniqueId: 'dumbymap', |
| 52 | }, | 32 | }, |
| 33 | indentWithTabs: false, | ||
| 34 | lineNumbers: true, | ||
| 35 | promptURLs: true, | ||
| 36 | uploadImage: true, | ||
| 53 | spellChecker: false, | 37 | spellChecker: false, |
| 54 | toolbarButtonClassPrefix: 'mde', | 38 | toolbarButtonClassPrefix: 'mde', |
| 55 | status: false, | 39 | status: false, |
| @@ -80,6 +64,29 @@ const editor = new EasyMDE({ | |||
| 80 | }); | 64 | }); |
| 81 | 65 | ||
| 82 | const cm = editor.codemirror | 66 | const cm = editor.codemirror |
| 67 | |||
| 68 | const getStateFromHash = (hash) => { | ||
| 69 | const hashValue = hash.substring(1); | ||
| 70 | const stateString = decodeURIComponent(hashValue) | ||
| 71 | try { return JSON.parse(stateString) ?? {} } | ||
| 72 | catch (_) { return {} } | ||
| 73 | } | ||
| 74 | |||
| 75 | const getContentFromHash = (hash) => { | ||
| 76 | const state = getStateFromHash(hash) | ||
| 77 | return state.content | ||
| 78 | } | ||
| 79 | |||
| 80 | const initialState = getStateFromHash(window.location.hash) | ||
| 81 | window.location.hash = '' | ||
| 82 | const contentFromHash = initialState.content | ||
| 83 | |||
| 84 | // Seems like autosave would overwrite initialValue, set content from hash here | ||
| 85 | if (contentFromHash) { | ||
| 86 | editor.cleanup() | ||
| 87 | editor.value(contentFromHash) | ||
| 88 | } | ||
| 89 | |||
| 83 | // }}} | 90 | // }}} |
| 84 | // Set up logic about editor content {{{ | 91 | // Set up logic about editor content {{{ |
| 85 | markdown2HTML(HtmlContainer, editor.value()) | 92 | markdown2HTML(HtmlContainer, editor.value()) |
| @@ -167,6 +174,7 @@ updateDumbyMap() | |||
| 167 | 174 | ||
| 168 | // Re-render HTML by editor content | 175 | // Re-render HTML by editor content |
| 169 | cm.on("change", (_, change) => { | 176 | cm.on("change", (_, change) => { |
| 177 | console.log('change', change.text) | ||
| 170 | updateDumbyMap() | 178 | updateDumbyMap() |
| 171 | addClassToCodeLines() | 179 | addClassToCodeLines() |
| 172 | completeForCodeBlock(change) | 180 | completeForCodeBlock(change) |