From 1c8ae0028c2625673740aa6e21d179f2d4745909 Mon Sep 17 00:00:00 2001 From: Allan Lasser Date: Fri, 13 Dec 2024 16:55:57 -0500 Subject: [PATCH 1/3] Render new note component into note embeds Fixes #923 --- src/lib/components/viewer/Note.svelte | 72 +++--- .../[id]/annotations/[note_id]/+page.svelte | 205 ++---------------- 2 files changed, 59 insertions(+), 218 deletions(-) diff --git a/src/lib/components/viewer/Note.svelte b/src/lib/components/viewer/Note.svelte index 274f1fd3b..cdca8702c 100644 --- a/src/lib/components/viewer/Note.svelte +++ b/src/lib/components/viewer/Note.svelte @@ -13,7 +13,7 @@ import type { Document, Note, Sizes } from "$lib/api/types"; import DOMPurify from "isomorphic-dompurify"; - import { createEventDispatcher, onMount } from "svelte"; + import { createEventDispatcher } from "svelte"; import { _ } from "svelte-i18n"; import { Globe16, @@ -25,7 +25,7 @@ } from "svelte-octicons"; import { ALLOWED_ATTR, ALLOWED_TAGS } from "@/config/config.js"; - import { width, height, isPageLevel, noteHashUrl } from "$lib/api/notes"; + import { width, height, isPageLevel } from "$lib/api/notes"; import { pageImageUrl } from "$lib/api/documents"; import Portal from "../layouts/Portal.svelte"; import Modal from "../layouts/Modal.svelte"; @@ -40,13 +40,13 @@ import { getViewerHref } from "$lib/utils/viewer"; import Button from "../common/Button.svelte"; - const documentStore = getDocument(); const pdf = getPDF(); const embed = isEmbedded(); const mode = getCurrentMode(); const dispatch = createEventDispatcher(); + export let document = getDocument(); export let note: Note; export let scale = 2; @@ -77,12 +77,12 @@ let shareNoteOpen = false; - $: document = $documentStore; + $: doc = $document; $: page_level = isPageLevel(note); $: page_number = note.page_number + 1; // note pages are 0-indexed $: user = typeof note.user === "object" ? (note.user as User) : null; - $: rendering = render(canvas, document, $pdf); // avoid re-using the same canvas - $: edit_link = getViewerHref({ document, note, mode: "annotating" }); + $: rendering = render(canvas, doc, $pdf); // avoid re-using the same canvas + $: edit_link = getViewerHref({ document: doc, note, mode: "annotating" }); $: canEdit = note.edit_access && !embed; async function render( @@ -207,7 +207,7 @@ style:--note-height={height(note)} >
- {#if !page_level && $mode === "document"} + {#if !embed && !page_level && $mode === "document"} @@ -231,36 +231,44 @@

{@html clean(note.content)}

{/if} -
- - - {$_(`access.${access[note.access].value}.title`)} - -
- {#if canEdit} - + {/if} + - {/if} - -
-
+ + + {/if} -{#if shareNoteOpen} +{#if !embed && shareNoteOpen} (shareNoteOpen = false)}>

{$_("dialog.share")}

- +
{/if} diff --git a/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte b/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte index cbf46cd75..ab8a4ec7b 100644 --- a/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte +++ b/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte @@ -1,42 +1,36 @@ @@ -61,180 +55,19 @@ -
- - -
-
- - - +
+ +
+
-
- -
- {@html clean(note.content ?? "")} -
- - - -
+
From ae70642224b6dcd4604bc8de08330b0989ba0aa3 Mon Sep 17 00:00:00 2001 From: Chris Amico Date: Mon, 16 Dec 2024 11:09:10 -0500 Subject: [PATCH 2/3] Link note and add page number in title --- src/lib/components/viewer/Note.svelte | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/lib/components/viewer/Note.svelte b/src/lib/components/viewer/Note.svelte index cdca8702c..7ef3236ec 100644 --- a/src/lib/components/viewer/Note.svelte +++ b/src/lib/components/viewer/Note.svelte @@ -84,6 +84,7 @@ $: rendering = render(canvas, doc, $pdf); // avoid re-using the same canvas $: edit_link = getViewerHref({ document: doc, note, mode: "annotating" }); $: canEdit = note.edit_access && !embed; + $: note_url = getViewerHref({ document: doc, note }); async function render( canvas: HTMLCanvasElement, @@ -213,7 +214,12 @@ {/if}
-

{note.title}

+

+ + {note.title} + {#if embed}({$_("documents.pageAbbrev")} {page_number}){/if} + +

{#if user}

{$_("annotation.by", { values: { name: getUserName(user) } })} From 57ac5c2894b7a241b67b2672e9bd64efd02d37e0 Mon Sep 17 00:00:00 2001 From: Chris Amico Date: Mon, 16 Dec 2024 11:15:27 -0500 Subject: [PATCH 3/3] formatting --- src/lib/components/viewer/Note.svelte | 13 +++++++------ src/lib/components/viewer/ViewerContext.svelte | 2 -- .../[id]/annotations/[note_id]/+page.svelte | 5 +++-- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/lib/components/viewer/Note.svelte b/src/lib/components/viewer/Note.svelte index 7ef3236ec..899b2a1cc 100644 --- a/src/lib/components/viewer/Note.svelte +++ b/src/lib/components/viewer/Note.svelte @@ -24,21 +24,22 @@ XCircle16, } from "svelte-octicons"; - import { ALLOWED_ATTR, ALLOWED_TAGS } from "@/config/config.js"; - import { width, height, isPageLevel } from "$lib/api/notes"; - import { pageImageUrl } from "$lib/api/documents"; + import Button from "../common/Button.svelte"; import Portal from "../layouts/Portal.svelte"; import Modal from "../layouts/Modal.svelte"; import Share from "../documents/Share.svelte"; - import { getUserName } from "@/lib/api/accounts"; + + import { ALLOWED_ATTR, ALLOWED_TAGS } from "@/config/config.js"; + import { width, height, isPageLevel } from "$lib/api/notes"; + import { pageImageUrl } from "$lib/api/documents"; + import { getUserName } from "$lib/api/accounts"; + import { getViewerHref } from "$lib/utils/viewer"; import { getCurrentMode, getDocument, getPDF, isEmbedded, } from "$lib/components/viewer/ViewerContext.svelte"; - import { getViewerHref } from "$lib/utils/viewer"; - import Button from "../common/Button.svelte"; const pdf = getPDF(); const embed = isEmbedded(); diff --git a/src/lib/components/viewer/ViewerContext.svelte b/src/lib/components/viewer/ViewerContext.svelte index 15ad6f48e..50e69c5dd 100644 --- a/src/lib/components/viewer/ViewerContext.svelte +++ b/src/lib/components/viewer/ViewerContext.svelte @@ -12,8 +12,6 @@ layouts, stories, and tests. ViewerMode, Zoom, BBox, - APIResponse, - Highlights, } from "$lib/api/types"; import { afterNavigate } from "$app/navigation"; diff --git a/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte b/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte index ab8a4ec7b..ffdbacc03 100644 --- a/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte +++ b/src/routes/embed/documents/[id]/annotations/[note_id]/+page.svelte @@ -3,12 +3,13 @@ import { writable } from "svelte/store"; import { _ } from "svelte-i18n"; + import EmbedLayout from "$lib/components/layouts/EmbedLayout.svelte"; + import Note from "$lib/components/viewer/Note.svelte"; + import { informSize } from "$lib/utils/embed"; import { pageImageUrl } from "$lib/api/documents"; import { embedUrl } from "$lib/api/embed"; import { canonicalNoteUrl, noteUrl } from "$lib/api/notes"; - import Note from "$lib/components/viewer/Note.svelte"; - import EmbedLayout from "@/lib/components/layouts/EmbedLayout.svelte"; export let data;