bookish-press 0.4.46 → 0.4.47

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

@@ -1,59 +1,66 @@
-<script>import Parser from '../../models/chapter/Parser';
-import BookishEditor from '../editor/BookishEditor.svelte';
-import Switch from '../editor/Switch.svelte';
-import { getUser, getEdition, getLeasee, isEditionEditable, lease, } from './Contexts';
-import Format from '../chapter/Format.svelte';
-import Note from '../editor/Note.svelte';
-import Instructions from './Instructions.svelte';
-import Link from '../Link.svelte';
-import { PUBLIC_CONTEXT } from '$env/static/public';
-import Button from '../app/Button.svelte';
-import { publish } from '../../models/CRUD';
-import Feedback from '../app/Feedback.svelte';
-let auth = getUser();
-let edition = getEdition();
-let editable = isEditionEditable();
-let publishing = false;
-let feedback = undefined;
-let error = undefined;
-let url = undefined;
-async function requestPublish() {
-    if ($edition) {
-        publishing = true;
-        error = undefined;
-        feedback = 'Binding the book, this could take a minute...';
-        try {
-            const result = await publish($edition);
-            if (typeof result === 'string') {
-                error = result;
+<script lang="ts">
+    import Parser from '../../models/chapter/Parser';
+    import BookishEditor from '../editor/BookishEditor.svelte';
+    import Switch from '../editor/Switch.svelte';
+    import {
+        getUser,
+        getEdition,
+        getLeasee,
+        isEditionEditable,
+        lease,
+    } from './Contexts';
+    import Format from '../chapter/Format.svelte';
+    import Note from '../editor/Note.svelte';
+    import Instructions from './Instructions.svelte';
+    import Link from '../Link.svelte';
+    import { PUBLIC_CONTEXT } from '$env/static/public';
+    import Button from '../app/Button.svelte';
+    import { publish } from '../../models/CRUD';
+    import Feedback from '../app/Feedback.svelte';
+
+    let auth = getUser();
+    let edition = getEdition();
+    let editable = isEditionEditable();
+
+    let publishing = false;
+    let feedback: string | undefined = undefined;
+    let error: string | undefined = undefined;
+    let url: string | undefined = undefined;
+    async function requestPublish() {
+        if ($edition) {
+            publishing = true;
+            error = undefined;
+            feedback = 'Binding the book, this could take a minute...';
+            try {
+                const result = await publish($edition);
+                if (typeof result === 'string') {
+                    error = result;
+                    feedback = undefined;
+                } else {
+                    url = result.url;
+                }
+            } catch (err) {
+                console.log(err);
                 feedback = undefined;
+                error = 'Unable to bundle the book for download :(';
+            } finally {
+                publishing = false;
             }
-            else {
-                url = result.url;
-            }
-        }
-        catch (err) {
-            console.log(err);
-            feedback = undefined;
-            error = 'Unable to bundle the book for download :(';
-        }
-        finally {
-            publishing = false;
         }
     }
-}
-let publisher = undefined;
-$: {
-    if ($auth && $auth.user)
-        updateUserClaims();
-}
-async function updateUserClaims() {
-    if ($auth === undefined || $auth.user === null)
-        return;
-    const token = await $auth.user.getIdTokenResult();
-    publisher =
-        'publisher' in token.claims && token.claims.publisher === true;
-}
+
+    let publisher: boolean | undefined = undefined;
+
+    $: {
+        if ($auth && $auth.user) updateUserClaims();
+    }
+
+    async function updateUserClaims() {
+        if ($auth === undefined || $auth.user === null) return;
+        const token = await $auth.user.getIdTokenResult();
+        publisher =
+            'publisher' in token.claims && token.claims.publisher === true;
+    }
 </script>
 
 {#if $edition && (publisher === true || PUBLIC_CONTEXT === 'local')}

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

@@ -1,36 +1,45 @@
 <svelte:options immutable={true} />
 
-<script>import Reference from '../../models/book/Reference';
-import Button from '../app/Button.svelte';
-import Table from '../app/Table.svelte';
-import ConfirmButton from '../editor/ConfirmButton.svelte';
-import TextEditor from '../editor/TextEditor.svelte';
-import { getEdition, isEditionEditable } from './Contexts';
-import Link from '../Link.svelte';
-import Note from '../editor/Note.svelte';
-export let reference;
-let editable = isEditionEditable();
-let edition = getEdition();
-let editing = false;
-function startEditing() {
-    editing = true;
-}
-function stopEditing() {
-    editing = false;
-}
-function move(field, direction) {
-    let fields = Array.from(document.querySelectorAll('input[type="text"]'));
-    let index = fields.indexOf(field);
-    if (index >= 0) {
-        const newInput = direction < 0 && index > 0
-            ? fields[index - 1]
-            : direction > 0 && index < fields.length - 1
-                ? fields[index + 1]
-                : undefined;
-        if (newInput)
-            newInput.focus();
+<script lang="ts">
+    import Reference from '$lib/models/book/Reference';
+    import Button from '../app/Button.svelte';
+    import Table from '../app/Table.svelte';
+    import ConfirmButton from '../editor/ConfirmButton.svelte';
+    import TextEditor from '../editor/TextEditor.svelte';
+    import { getEdition, isEditionEditable } from './Contexts';
+    import Link from '../Link.svelte';
+    import Note from '../editor/Note.svelte';
+
+    export let reference: Reference;
+
+    let editable = isEditionEditable();
+    let edition = getEdition();
+
+    let editing = false;
+
+    function startEditing() {
+        editing = true;
+    }
+
+    function stopEditing() {
+        editing = false;
+    }
+
+    function move(field: HTMLElement, direction: 1 | -1) {
+        let fields = Array.from(
+            document.querySelectorAll('input[type="text"]')
+        ) as HTMLElement[];
+        let index = fields.indexOf(field);
+        if (index >= 0) {
+            const newInput =
+                direction < 0 && index > 0
+                    ? fields[index - 1]
+                    : direction > 0 && index < fields.length - 1
+                    ? fields[index + 1]
+                    : undefined;
+            if (newInput) newInput.focus();
+        }
     }
-}
 </script>
 
 {#if editable && !reference.short}

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

@@ -1,17 +1,21 @@
-<script>import Header from './Header.svelte';
-import Outline from './Outline.svelte';
-import Page from './Page.svelte';
-import ChapterIDs from '../../models/book/ChapterID';
-import BulkReferenceEditor from './BulkReferenceEditor.svelte';
-import PossibleReference from './PossibleReference.svelte';
-import { getUser, getEdition, isEditionEditable } from './Contexts';
-let auth = getUser();
-let edition = getEdition();
-let editable = isEditionEditable();
-$: references = $edition?.hasReferences() ? $edition.getReferences() : null;
-// Otherwise, map references to a list with letter headers.
-if (references !== null) {
-}
+<script lang="ts">
+    import Header from './Header.svelte';
+    import Outline from './Outline.svelte';
+    import Page from './Page.svelte';
+    import ChapterIDs from '$lib/models/book/ChapterID';
+    import BulkReferenceEditor from './BulkReferenceEditor.svelte';
+    import PossibleReference from './PossibleReference.svelte';
+    import { getUser, getEdition, isEditionEditable } from './Contexts';
+
+    let auth = getUser();
+    let edition = getEdition();
+    let editable = isEditionEditable();
+
+    $: references = $edition?.hasReferences() ? $edition.getReferences() : null;
+
+    // Otherwise, map references to a list with letter headers.
+    if (references !== null) {
+    }
 </script>
 
 {#if $edition}

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

@@ -0,0 +1,153 @@
+<script lang="ts">
+    import Header from './Header.svelte';
+    import Outline from './Outline.svelte';
+    import Page from './Page.svelte';
+    import Link from '../Link.svelte';
+    import Chapter from '$lib/models/book/Chapter';
+    import type { Match } from '$lib/models/book/Chapter';
+    import ChapterIDs from '$lib/models/book/ChapterID';
+    import { getBase, getEdition, isEditionEditable } from './Contexts';
+    import TextInput from '../app/TextInput.svelte';
+    import ChapterTitle from './ChapterTitle.svelte';
+    import ChapterNumber from './ChapterNumber.svelte';
+    import PageHeader from './PageHeader.svelte';
+
+    let edition = getEdition();
+    let base = getBase();
+
+    let query = '';
+
+    let results: (
+        | Chapter
+        | { link: string; left: string; match: string; right: string }
+    )[] = [];
+    $: {
+        // Reset the results
+        results = [];
+
+        const lowerQuery = query.toLowerCase();
+
+        query = query.trim();
+
+        // Go through all the chapter indexes and find matches.
+        if ($edition && query.length > 2)
+            for (const chapter of $edition?.getChapters() ?? []) {
+                let index = chapter.getIndex($edition);
+                // No index yet? Skip this chapter.
+                if (index) {
+                    // Build a DOM to render matches.
+                    const chapterMatches: Match[] = [];
+
+                    // What are all of the words in the index that match the query?
+                    for (const word of Object.keys(index)) {
+                        if (query.length > 0 && word.indexOf(lowerQuery) >= 0) {
+                            if (index) {
+                                let matches = index[word];
+                                matches.forEach((match: Match) => {
+                                    chapterMatches.push(match);
+                                });
+                            }
+                        }
+                    }
+
+                    if (chapterMatches.length > 0) {
+                        results.push(chapter);
+                        chapterMatches.forEach((match, index) => {
+                            // Only highlight the part of the word that matches.
+                            const start = match.match
+                                .toLowerCase()
+                                .indexOf(lowerQuery);
+                            results.push({
+                                link: `${$base}/${chapter.getID()}?word=${match.match.toLowerCase()}&number=${index}`,
+                                left:
+                                    match.left +
+                                    match.match.substring(0, start),
+                                match: match.match.substring(
+                                    start,
+                                    start + query.length
+                                ),
+                                right:
+                                    match.match.substring(
+                                        start + query.length
+                                    ) + match.right,
+                            });
+                        });
+                    }
+                }
+            }
+    }
+</script>
+
+{#if $edition}
+    <Page title={`${$edition.getTitle()} - Search`}>
+        <Header
+            editable={isEditionEditable()}
+            label="Search title"
+            getImage={() => $edition?.getImage(ChapterIDs.SearchID) ?? null}
+            setImage={(embed) =>
+                $edition
+                    ? edition.set(
+                          $edition.withImage(ChapterIDs.SearchID, embed)
+                      )
+                    : undefined}
+            header="Search"
+            id="search"
+            tags={$edition.getTags()}
+        >
+            <Outline
+                slot="outline"
+                previous={$edition.getPreviousChapterID(ChapterIDs.SearchID)}
+                next={$edition.getNextChapterID(ChapterIDs.SearchID)}
+            />
+        </Header>
+
+        <p>
+            Type a word—just a single word—and we'll show its occurrences in
+            this book:
+        </p>
+
+        <p>
+            <TextInput
+                type="text"
+                placeholder={'search for a word'}
+                disabled={false}
+                bind:text={query}
+            />
+        </p>
+
+        {#if query.trim() !== ''}
+            {#if query.trim().length < 3}
+                <p>Keep typing...</p>
+            {:else if results.length === 0}
+                <p>No occurrence of <em>{query}</em>.</p>
+            {:else}
+                <p
+                    >Found {results.filter(
+                        (result) => !(result instanceof Chapter)
+                    ).length} occurrences of <em>{query}</em>...</p
+                >
+                {#each results as result}
+                    {#if result instanceof Chapter}
+                        <PageHeader id={'header-' + result.getID()}
+                            ><ChapterNumber
+                                >Chapter{#if $edition.getChapterNumber(result.getID()) !== undefined}&nbsp;{$edition.getChapterNumber(
+                                        result.getID()
+                                    )}{/if}</ChapterNumber
+                            > - <ChapterTitle>{result.getTitle()}</ChapterTitle
+                            ></PageHeader
+                        >
+                    {:else}
+                        <p
+                            ><Link to={result.link}
+                                >...{result.left}<span
+                                    class="bookish-content-highlight"
+                                    >{result.match}</span
+                                >{result.right}...</Link
+                            ></p
+                        >
+                    {/if}
+                {/each}
+            {/if}
+        {/if}
+    </Page>
+{/if}

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

@@ -1,6 +1,8 @@
-<script>import BookSaveStatus from '../../models/book/BookSaveStatus';
-import { getStatus } from './Contexts';
-let status = getStatus();
+<script lang="ts">
+    import BookSaveStatus from '../../models/book/BookSaveStatus';
+    import { getStatus } from './Contexts';
+
+    let status = getStatus();
 </script>
 
 <span

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

@@ -1,16 +1,19 @@
-<script>import TextEditor from '../editor/TextEditor.svelte';
-import { isSubdomainAvailable } from '../../models/CRUD';
-import { getBook } from './Contexts';
-import Muted from './Muted.svelte';
-let book = getBook();
-const invalidNames = [
-    'email',
-    'login',
-    'confirm',
-    'about',
-    'read',
-    'write',
-];
+<script lang="ts">
+    import TextEditor from '$lib/components/editor/TextEditor.svelte';
+    import { isSubdomainAvailable } from '$lib/models/CRUD';
+    import { getBook } from './Contexts';
+    import Muted from './Muted.svelte';
+
+    let book = getBook();
+
+    const invalidNames: string[] = [
+        'email',
+        'login',
+        'confirm',
+        'about',
+        'read',
+        'write',
+    ];
 </script>
 
 {#if $book}

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

@@ -1,72 +1,83 @@
-<script>import Instructions from './Instructions.svelte';
-import Parser from '../../models/chapter/Parser';
-import TableOfContentsRow from './TableOfContentsRow.svelte';
-import ChapterIDs from '../../models/book/ChapterID';
-import Page from './Page.svelte';
-import Header from './Header.svelte';
-import Outline from './Outline.svelte';
-import Link from '../Link.svelte';
-import SubdomainEditor from './SubdomainEditor.svelte';
-import Description from './Description.svelte';
-import Acknowledgements from './Acknowledgements.svelte';
-import License from './License.svelte';
-import Authors from './Authors.svelte';
-import TextEditor from '../editor/TextEditor.svelte';
-import Toggle from '../editor/Toggle.svelte';
-import { getUser, getBase, getBook, getEdition, isBookEditable, isEditionEditable, isEditionPartiallyEditable, setChapter, } from './Contexts';
-import Muted from './Muted.svelte';
-import Button from '../app/Button.svelte';
-import PageHeader from './PageHeader.svelte';
-import Rows from './Rows.svelte';
-import PageParagraph from './PageParagraph.svelte';
-import Note from '../editor/Note.svelte';
-import Permissions from '../editor/Permissions.svelte';
-import Publish from './Publish.svelte';
-import { onMount } from 'svelte';
-let auth = getUser();
-let book = getBook();
-let edition = getEdition();
-let base = getBase();
-let editable = isEditionEditable();
-function getProgressDescription(progress) {
-    if (progress === null)
-        return '';
-    else if (progress === 0)
-        return '';
-    else if (progress < 30)
-        return '; just started';
-    else if (progress < 70)
-        return '; halfway';
-    else if (progress < 95)
-        return '; almost done';
-    else
-        return '; done';
-}
-// Get the chapter progress
-let progressStorage = typeof localStorage !== 'undefined'
-    ? localStorage.getItem('chapterProgress')
-    : null;
-let progress = progressStorage === null ? {} : JSON.parse(progressStorage);
-// Is there a colon? Let's make a subtitle
-$: title = $edition?.getTitle() ?? '';
-let subtitle = undefined;
-$: {
-    let colon = title.indexOf(':');
-    if (colon >= 0) {
-        subtitle = title.substring(colon + 1).trim();
-        title = title.substring(0, colon).trim();
+<script lang="ts">
+    import Instructions from '$lib/components/page/Instructions.svelte';
+    import Parser from '$lib/models/chapter/Parser';
+    import TableOfContentsRow from './TableOfContentsRow.svelte';
+    import ChapterIDs from '$lib/models/book/ChapterID';
+    import Page from '$lib/components/page/Page.svelte';
+    import Header from '$lib/components/page/Header.svelte';
+    import Outline from '$lib/components/page/Outline.svelte';
+    import Link from '$lib/components/Link.svelte';
+    import SubdomainEditor from '$lib/components/page/SubdomainEditor.svelte';
+    import Description from './Description.svelte';
+    import Acknowledgements from './Acknowledgements.svelte';
+    import License from '$lib/components/page/License.svelte';
+    import Authors from '$lib/components/page/Authors.svelte';
+    import TextEditor from '$lib/components/editor/TextEditor.svelte';
+    import Toggle from '$lib/components/editor/Toggle.svelte';
+    import {
+        getUser,
+        getBase,
+        getBook,
+        getEdition,
+        isBookEditable,
+        isEditionEditable,
+        isEditionPartiallyEditable,
+        setChapter,
+    } from './Contexts';
+    import Muted from './Muted.svelte';
+    import Button from '../app/Button.svelte';
+    import PageHeader from './PageHeader.svelte';
+    import Rows from './Rows.svelte';
+    import PageParagraph from './PageParagraph.svelte';
+    import Note from '../editor/Note.svelte';
+    import Permissions from '../editor/Permissions.svelte';
+    import Publish from './Publish.svelte';
+    import { onMount } from 'svelte';
+
+    let auth = getUser();
+    let book = getBook();
+    let edition = getEdition();
+    let base = getBase();
+    let editable = isEditionEditable();
+
+    function getProgressDescription(progress: null | number) {
+        if (progress === null) return '';
+        else if (progress === 0) return '';
+        else if (progress < 30) return '; just started';
+        else if (progress < 70) return '; halfway';
+        else if (progress < 95) return '; almost done';
+        else return '; done';
+    }
+
+    // Get the chapter progress
+    let progressStorage =
+        typeof localStorage !== 'undefined'
+            ? localStorage.getItem('chapterProgress')
+            : null;
+    let progress = progressStorage === null ? {} : JSON.parse(progressStorage);
+
+    // Is there a colon? Let's make a subtitle
+    $: title = $edition?.getTitle() ?? '';
+    let subtitle: string | undefined = undefined;
+    $: {
+        let colon = title.indexOf(':');
+        if (colon >= 0) {
+            subtitle = title.substring(colon + 1).trim();
+            title = title.substring(0, colon).trim();
+        }
     }
-}
-let waitingForChapter = false;
-function addChapter() {
-    if ($edition)
-        edition.set($edition.withNewChapter());
-}
-/** Doing this on mount allows for prerendering an an update. */
-let bookURL = '…';
-onMount(() => {
-    bookURL = location.protocol + '//' + location.host + location.pathname;
-});
+
+    let waitingForChapter = false;
+
+    function addChapter() {
+        if ($edition) edition.set($edition.withNewChapter());
+    }
+
+    /** Doing this on mount allows for prerendering an an update. */
+    let bookURL = '…';
+    onMount(() => {
+        bookURL = location.protocol + '//' + location.host + location.pathname;
+    });
 </script>
 
 {#if $edition}

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

@@ -0,0 +1,22 @@
+<script lang="ts">
+    import EmbedNode from '$lib/models/chapter/EmbedNode';
+    import Parser from '$lib/models/chapter/Parser';
+    import { getBase, getEdition } from './Contexts';
+
+    export let embed: string | null;
+
+    let edition = getEdition();
+    let base = getBase();
+
+    $: embedNode = embed === null ? null : Parser.parseEmbed($edition, embed);
+</script>
+
+{#if embedNode instanceof EmbedNode}
+    <img
+        style="width: 5em"
+        src={embedNode.isLocal()
+            ? `${$base}/${embedNode.getSmallURL()}`
+            : embedNode.getSmallURL()}
+        alt={embedNode.getDescription()}
+    />
+{/if}