diff --git a/src/lib/components/notes/NoteEditor.svelte b/src/lib/components/notes/NoteEditor.svelte index 61d7256ddb..ff6a1faef9 100644 --- a/src/lib/components/notes/NoteEditor.svelte +++ b/src/lib/components/notes/NoteEditor.svelte @@ -98,7 +98,7 @@ let recording = false; let displayMediaRecord = false; - let showSettings = false; + let showPanel = false; let showDeleteConfirm = false; let dragged = false; @@ -672,6 +672,11 @@ Provide the enhanced notes in markdown format. Use markdown syntax for headings, dropzoneElement?.removeEventListener('dragleave', onDragLeave); } }); + + import NotePanel from '$lib/components/notes/NotePanel.svelte'; + import { PaneGroup, Pane, PaneResizer } from 'paneforge'; + import XMark from '../icons/XMark.svelte'; + import MenuLines from '../icons/MenuLines.svelte'; @@ -689,293 +694,272 @@ Provide the enhanced notes in markdown format. Use markdown syntax for headings, -
- -
-
-
Settings
- -
- -
-
- -
-
-
Model
- -
- + + +
+ {#if loading} +
+
+
-
-
- + {:else} +
+
+
+
+ +
- {#if loading} -
-
- -
-
- {:else} -
-
-
- + -
- {#if note.data?.versions?.length > 0} -
-
- +
+ {#if note.data?.versions?.length > 0} +
+
+ - -
+ +
+
+ {/if} + + { + downloadHandler(type); + }} + onCopyToClipboard={async () => { + const res = await copyToClipboard(note.data.content.md).catch((error) => { + toast.error(`${error}`); + return null; + }); + + if (res) { + toast.success($i18n.t('Copied to clipboard')); + } + }} + onDelete={() => { + showDeleteConfirm = true; + }} + > + + + + +
+
+
+ +
+
+ + + +
+
+ +
+ {#if enhancing} +
+ {/if} + + {#if files && files.length > 0} +
+ {#each files as file, fileIdx} +
+ {#if file.type === 'image'} + { + files = files.filter((item, idx) => idx !== fileIdx); + note.data.files = files.length > 0 ? files : null; + }} + /> + {:else} + { + files = files.filter((item) => item?.id !== file.id); + note.data.files = files.length > 0 ? files : null; + }} + /> + {/if} +
+ {/each}
{/if} - { - downloadHandler(type); + { + note.data.content.html = content.html; + note.data.content.md = content.md; }} - onCopyToClipboard={async () => { - const res = await copyToClipboard(note.data.content.md).catch((error) => { - toast.error(`${error}`); - return null; - }); - - if (res) { - toast.success($i18n.t('Copied to clipboard')); - } - }} - onDelete={() => { - showDeleteConfirm = true; - }} - > - - - - + />
-
- -
-
- - - -
-
- -
- {#if enhancing} -
- {/if} - - {#if files && files.length > 0} -
- {#each files as file, fileIdx} -
- {#if file.type === 'image'} - { - files = files.filter((item, idx) => idx !== fileIdx); - note.data.files = files.length > 0 ? files : null; - }} - /> - {:else} - { - files = files.filter((item) => item?.id !== file.id); - note.data.files = files.length > 0 ? files : null; - }} - /> - {/if} -
- {/each} -
- {/if} - - { - note.data.content.html = content.html; - note.data.content.md = content.md; - }} - /> -
+ {/if}
- {/if} -
+
+
+ {#if recording} +
+ { + recording = false; + displayMediaRecord = false; + }} + onConfirm={(data) => { + if (data?.file) { + uploadFileHandler(data?.file); + } -
-
- {#if recording} -
- { - recording = false; - displayMediaRecord = false; - }} - onConfirm={(data) => { - if (data?.file) { - uploadFileHandler(data?.file); - } + recording = false; + displayMediaRecord = false; + }} + /> +
+ {:else} + { + displayMediaRecord = false; - recording = false; - displayMediaRecord = false; - }} - /> -
- {:else} - { - displayMediaRecord = false; + try { + let stream = await navigator.mediaDevices + .getUserMedia({ audio: true }) + .catch(function (err) { + toast.error( + $i18n.t(`Permission denied when accessing microphone: {{error}}`, { + error: err + }) + ); + return null; + }); - try { - let stream = await navigator.mediaDevices - .getUserMedia({ audio: true }) - .catch(function (err) { - toast.error( - $i18n.t(`Permission denied when accessing microphone: {{error}}`, { - error: err - }) - ); - return null; - }); + if (stream) { + recording = true; + const tracks = stream.getTracks(); + tracks.forEach((track) => track.stop()); + } + stream = null; + } catch { + toast.error($i18n.t('Permission denied when accessing microphone')); + } + }} + onCaptureAudio={async () => { + displayMediaRecord = true; - if (stream) { recording = true; - const tracks = stream.getTracks(); - tracks.forEach((track) => track.stop()); - } - stream = null; - } catch { - toast.error($i18n.t('Permission denied when accessing microphone')); - } - }} - onCaptureAudio={async () => { - displayMediaRecord = true; + }} + onUpload={async () => { + const input = document.createElement('input'); + input.type = 'file'; + input.accept = 'audio/*'; + input.multiple = false; + input.click(); - recording = true; - }} - onUpload={async () => { - const input = document.createElement('input'); - input.type = 'file'; - input.accept = 'audio/*'; - input.multiple = false; - input.click(); + input.onchange = async (e) => { + const files = e.target.files; - input.onchange = async (e) => { - const files = e.target.files; - - if (files && files.length > 0) { - await uploadFileHandler(files[0]); - } - }; - }} - > - - - - + + + + -
- - - - + + + +
+ {/if}
- {/if} -
-
+
+ + +
+
+ +
+ +
Settings
+
+ +
+
+
Model
+ +
+ +
+
+
+
+ diff --git a/src/lib/components/notes/NotePanel.svelte b/src/lib/components/notes/NotePanel.svelte new file mode 100644 index 0000000000..8663bd3f4d --- /dev/null +++ b/src/lib/components/notes/NotePanel.svelte @@ -0,0 +1,82 @@ + + +{#if !largeScreen} + {#if show} + { + show = false; + }} + > +
+ +
+
+ {/if} +{:else if show} + +
+ +
+
+ + { + show = false; + }} + collapsible={true} + class=" z-10 " + > + {#if show} +
+
+ +
+
+ {/if} +
+{/if} diff --git a/src/routes/(app)/notes/+layout.svelte b/src/routes/(app)/notes/+layout.svelte index ed121d3d26..b29234021d 100644 --- a/src/routes/(app)/notes/+layout.svelte +++ b/src/routes/(app)/notes/+layout.svelte @@ -32,73 +32,5 @@ {#if loaded} -
- - -
- -
-
+ {/if} diff --git a/src/routes/(app)/notes/+page.svelte b/src/routes/(app)/notes/+page.svelte index c5c91d14a4..dcad78464c 100644 --- a/src/routes/(app)/notes/+page.svelte +++ b/src/routes/(app)/notes/+page.svelte @@ -1,5 +1,80 @@ - +
+ + +
+ +
+