bookish-press 0.4.46 → 0.4.47

package/{components → src/lib/components}/page/Acknowledgements.svelte

@@ -1,13 +1,22 @@
-<script>import Parser from '../../models/chapter/Parser';
-import ChapterBody from '../chapter/ChapterBody.svelte';
-import BookishEditor from '../editor/BookishEditor.svelte';
-import Instructions from './Instructions.svelte';
-import { getUser, getEdition, getLeasee, isEditionEditable, lease, } from './Contexts';
-import PageHeader from './PageHeader.svelte';
-let auth = getUser();
-let edition = getEdition();
-let editable = isEditionEditable();
-$: acknowledgements = $edition?.getAcknowledgements();
+<script lang="ts">
+    import Parser from '$lib/models/chapter/Parser';
+    import ChapterBody from '$lib/components/chapter/ChapterBody.svelte';
+    import BookishEditor from '$lib/components/editor/BookishEditor.svelte';
+    import Instructions from '$lib/components/page/Instructions.svelte';
+    import {
+        getUser,
+        getEdition,
+        getLeasee,
+        isEditionEditable,
+        lease,
+    } from './Contexts';
+    import PageHeader from './PageHeader.svelte';
+
+    let auth = getUser();
+    let edition = getEdition();
+    let editable = isEditionEditable();
+
+    $: acknowledgements = $edition?.getAcknowledgements();
 </script>
 
 <Instructions {editable}>

package/src/lib/components/page/Authors.svelte

@@ -0,0 +1,92 @@
+<script lang="ts">
+    import Parser from '$lib/models/chapter/Parser';
+    import TextEditor from '$lib/components/editor/TextEditor.svelte';
+    import Format from '$lib/components/chapter/Format.svelte';
+    import { afterUpdate } from 'svelte';
+    import { getEdition, isBookEditable, isEditionEditable } from './Contexts';
+    import Note from '../editor/Note.svelte';
+    import Button from '../app/Button.svelte';
+
+    export let editable: boolean;
+    export let authors: string[];
+    export let inheritedAuthors: string[] | undefined = undefined;
+    export let add: () => Promise<void> | void;
+    export let edit: (index: number, text: string) => Promise<void> | void;
+    export let remove: (index: number) => Promise<void> | void;
+
+    let edition = getEdition();
+
+    let authorList: HTMLDivElement | null = null;
+    let newAuthor = false;
+
+    $: authorsToShow =
+        authors.length > 0
+            ? authors
+            : inheritedAuthors !== undefined && inheritedAuthors.length > 0
+            ? inheritedAuthors
+            : undefined;
+
+    function addAuthor() {
+        add();
+        newAuthor = true;
+    }
+
+    // When there's a new author, focus on it.
+    afterUpdate(() => {
+        if (authors.length > 0 && authorList && newAuthor) {
+            const editors = authorList.querySelectorAll('input');
+            if (editors.length > 0) {
+                const lastAuthor = editors[editors.length - 1];
+                if (lastAuthor instanceof HTMLElement) {
+                    lastAuthor.focus();
+                }
+            }
+            newAuthor = false;
+        }
+    });
+</script>
+
+<p class="bookish-authors" bind:this={authorList}>
+    <!-- Editing and inherited authors? Say they're  -->
+    {#if authorsToShow === undefined}
+        No authors
+    {:else}
+        <em>by </em>
+        {#each authorsToShow as author, index}
+            {#if editable}
+                <TextEditor
+                    text={author}
+                    label={'Author name editor'}
+                    placeholder="author"
+                    valid={() => undefined}
+                    save={(text) =>
+                        /* If text is already empty, remove */ author.length >
+                            0 && text === ''
+                            ? remove(index)
+                            : edit(index, text)}
+                />
+            {:else}
+                <span
+                    ><Format
+                        node={Parser.parseFormat($edition, author)}
+                    /></span
+                >
+            {/if}
+            {#if index < authors.length - 1},&nbsp{/if}
+        {/each}
+    {/if}
+    {#if editable}
+        <Note>(edition authors)&nbsp;</Note>
+    {/if}
+    {#if editable}
+        &nbsp;<Button tooltip="add author" command={addAuthor}>+ author</Button>
+    {/if}
+</p>
+
+<style>
+    .bookish-authors {
+        font-family: var(--bookish-header-font-family);
+        font-style: italic;
+        margin: 0;
+    }
+</style>

package/src/lib/components/page/BookLoader.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+    import Loading from '$lib/components/page/Loading.svelte';
+    import Feedback from '$lib/components/app/Feedback.svelte';
+    import { onDestroy } from 'svelte';
+    import { page } from '$app/stores';
+    import type Book from '$lib/models/book/Book';
+    import { getBook, getUser } from '$lib/components/page/Contexts';
+    import {
+        listenToBookWithID as listenToBooksWithID,
+        listenToBooksByName as listenToBooksWithName,
+    } from '$lib/models/CRUD';
+    import type { Unsubscribe } from 'firebase/auth';
+
+    let auth = getUser();
+    let book = getBook();
+
+    // Keep track of the query updates
+    let booksByName: Book[] | undefined = undefined;
+    let bookByID: Book | null | undefined = undefined;
+
+    // Mege them together here
+    $: currentBook =
+        // Neither loaded? Current book isn't loaded.
+        booksByName === undefined && bookByID === undefined
+            ? undefined
+            : booksByName !== undefined && booksByName.length > 0
+            ? booksByName[0]
+            : bookByID ?? null;
+
+    // Whenever the merge changes, update the book store (updating the whole UI)
+    $: book.set(currentBook ?? undefined);
+
+    // Keep track of listeners to unsubscribe to on page changes.
+    let nameUnsub: Unsubscribe | undefined = undefined;
+    let idUnsub: Unsubscribe | undefined = undefined;
+
+    function unsub() {
+        if (nameUnsub) nameUnsub();
+        if (idUnsub) idUnsub();
+    }
+
+    // Keep track of any errors.
+    let error: string | undefined;
+
+    function listen() {
+        unsub();
+        try {
+            nameUnsub = listenToBooksWithName(
+                $page.params.bookid,
+                (books) => (booksByName = books)
+            );
+            idUnsub = listenToBooksWithID(
+                $page.params.bookid,
+                (book) => (bookByID = book)
+            );
+        } catch (err) {
+            error = '' + err;
+        }
+    }
+
+    // When page or auth changes and there's a user, update the listener.
+    $: if ($page && $auth && $auth.user !== null) listen();
+
+    // When this is unmounted, unset them.
+    onDestroy(() => {
+        book.set(undefined);
+        unsub();
+    });
+</script>
+
+{#if error || currentBook === null}
+    <Feedback error>Unable to load book.</Feedback>
+{:else if currentBook === undefined}
+    <Loading />
+{:else}
+    <slot />
+{/if}

package/src/lib/components/page/BulkReferenceEditor.svelte

@@ -0,0 +1,86 @@
+<script lang="ts">
+    import Instructions from './Instructions.svelte';
+    import {
+        getUniqueReferenceID,
+        mineReference,
+    } from '$lib/util/mineReference';
+    import Reference from '$lib/models/book/Reference';
+    import {
+        getEdition,
+        isEditionEditable,
+        isEditionPartiallyEditable,
+    } from './Contexts';
+    import Button from '../app/Button.svelte';
+
+    let edition = getEdition();
+    let text = '';
+    let editable = isEditionEditable() || isEditionPartiallyEditable();
+
+    function handleBulkAdd() {
+        // Split by lines, skipping empty lines.
+        const references = text
+            .split(/\n+/)
+            .map((line) =>
+                mineReference(
+                    Object.keys($edition?.getReferences() ?? []),
+                    line
+                )
+            );
+
+        if ($edition) {
+            edition.set($edition.withNewReferences(references));
+            text = '';
+        }
+    }
+
+    function handleEmptyAdd() {
+        if ($edition) {
+            edition.set(
+                $edition.withNewReferences([
+                    new Reference(
+                        getUniqueReferenceID(
+                            Object.keys($edition.getReferences())
+                        )
+                    ),
+                ])
+            );
+        }
+    }
+</script>
+
+<Instructions {editable}>
+    To add references to a chapter, add them here first. You can add one at a
+    time, or try pasting them in bulk, and this page will try to pull out author
+    lists, years, sources, and URLs. Be sure to verify it though &mdash; it's
+    likely to get some things wrong.
+</Instructions>
+
+<textarea rows={5} bind:value={text} style="width: 100%" />
+<Button
+    tooltip="convert to references"
+    disabled={text.length === 0}
+    command={handleBulkAdd}>+ bulk references</Button
+>
+<Button tooltip="add empty reference" command={handleEmptyAdd}
+    >+ reference</Button
+>
+
+<style>
+    textarea {
+        width: 100%;
+        padding: var(--app-chrome-padding);
+        font-family: var(--app-font);
+        font-size: var(--app-font-size);
+        border: none;
+        border-top: var(--app-chrome-border-size) solid var(--app-border-color);
+        border-bottom: var(--app-chrome-border-size) solid
+            var(--app-border-color);
+        margin-bottom: var(--app-chrome-padding);
+    }
+
+    textarea:focus {
+        border-bottom-color: var(--app-interactive-color);
+        border-top-color: var(--app-interactive-color);
+        outline: none;
+    }
+</style>