bookish-press 0.4.232 → 0.5.0

package/package/components/page/EditionLoader.svelte

@@ -0,0 +1,99 @@
+<script>import Loading from './Loading.svelte';
+import Edition from './Edition.svelte';
+import Feedback from '../app/Feedback.svelte';
+import { getBook, getEdition, getUser, getChapterText, } from './Contexts';
+import { onDestroy } from 'svelte';
+import { page } from '$app/stores';
+import { listenToChapters, listenToEdition } from '../../models/CRUD';
+export let write;
+let auth = getUser();
+let book = getBook();
+let edition = getEdition();
+let chapterText = getChapterText();
+let editionUnsub = undefined;
+let chaptersUnsub = undefined;
+let error = undefined;
+function unsub() {
+    // Unsubscribe to the old edition document if we were listening to one.
+    if (editionUnsub)
+        editionUnsub();
+    if (chaptersUnsub)
+        chaptersUnsub();
+}
+function listen() {
+    unsub();
+    error = undefined;
+    // If we no longer have a book, we can't get an edition.
+    if ($book === undefined) {
+        edition.set(undefined);
+        error = 'Unknown book.';
+        return;
+    }
+    else {
+        const editionNumber = $page.params.editionid;
+        const latestPublished = !write;
+        // Figure out which edition to load.
+        let editionID;
+        if (editionNumber === undefined) {
+            if (latestPublished) {
+                editionID = $book.getLatestPublishedEditionID();
+                if (editionID === undefined)
+                    error = 'There is no published edition of this book.';
+            }
+            else {
+                editionID = $book.getLatestEditionID();
+            }
+        }
+        else {
+            editionID = $book.getEditionNumberID(parseFloat(editionNumber));
+            if (editionID === undefined)
+                error = `There is no ${editionNumber} edition of this book`;
+        }
+        // Listen to the doc for changes and listen to all of its chapters.
+        if (editionID !== undefined) {
+            editionUnsub = listenToEdition($book.getID(), editionID, (ed) => {
+                if (ed) {
+                    // Before setting the new edition, augmented it with the chapter text.
+                    edition.set($chapterText
+                        ? ed.withChapterText($chapterText)
+                        : ed);
+                }
+                else {
+                    edition.set(undefined);
+                    error = 'Unable to load edition';
+                }
+            });
+            chaptersUnsub = listenToChapters($book.getID(), editionID, (chapters) => {
+                // Update the chapter text store.
+                chapterText.set(chapters);
+                // Update the chapter text in the current edition.
+                if ($edition)
+                    edition.set($edition.withChapterText(chapters));
+            });
+        }
+    }
+}
+// Whenever the book or page changes, change the listener.
+$: if ($page && $auth && $auth.user !== null)
+    listen();
+// When unmounted, unset the stores — no longer viewing a book.
+onDestroy(() => {
+    edition.set(undefined);
+    unsub();
+});
+</script>
+
+{#if $book === undefined || error}
+    <Feedback error>Unable to load edition.</Feedback>
+{:else if $edition === undefined}
+    <Loading />
+{:else}
+    <Edition
+        edition={$edition}
+        base={write
+            ? `/write/${$book.getID()}/${$edition.getEditionNumber()}`
+            : `/${$book.getSubdomain() ?? $book.getID()}`}
+    >
+        <slot />
+    </Edition>
+{/if}

package/package/components/page/EditionLoader.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        write: boolean;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type EditionLoaderProps = typeof __propDef.props;
+export type EditionLoaderEvents = typeof __propDef.events;
+export type EditionLoaderSlots = typeof __propDef.slots;
+export default class EditionLoader extends SvelteComponentTyped<EditionLoaderProps, EditionLoaderEvents, EditionLoaderSlots> {
+}
+export {};

package/package/components/page/Editions.svelte

@@ -0,0 +1,109 @@
+<script>import { createNewEdition } from '../../models/CRUD';
+import Instructions from './Instructions.svelte';
+import Note from '../editor/Note.svelte';
+import { getBook, isBookEditable } from './Contexts';
+import Button from '../app/Button.svelte';
+import Link from '../app/Link.svelte';
+import Format from '../chapter/Format.svelte';
+import Parser from '../../models/chapter/Parser';
+import Permissions from '../editor/Permissions.svelte';
+export let editors = true;
+let book = getBook();
+let editable = isBookEditable();
+$: editions = $book?.getEditions();
+$: latestPublishedID = $book?.getLatestPublishedEditionID();
+async function handleDraftEdition() {
+    if ($book === undefined)
+        return;
+    book.set(await createNewEdition($book));
+}
+</script>
+
+{#if $book && editions}
+    {#if editable}
+        <p>
+            <Button tooltip="create new edition" command={handleDraftEdition}
+                >+ edition</Button
+            >
+        </p>
+    {/if}
+    <Instructions {editable}>
+        Each book has one or more editions, allowing you to track revisions and
+        ensure previous versions remain available. When you're ready to revise,
+        add a new edition here; it will copy the latest edition, which you can
+        then edit. When you're ready to publish an edition, write a summary here
+        and then publish. By default, readers will see the latest published
+        edition, but they can access older editions here.
+    </Instructions>
+    {#each editions as edition, index (edition.ref)}
+        {@const editionNumber =
+            editions === undefined ? -1 : editions.length - index}
+        {@const editionLabel =
+            editionNumber +
+            (editionNumber === 1
+                ? 'st'
+                : editionNumber === 2
+                ? 'nd'
+                : editionNumber === 3
+                ? 'rd'
+                : 'th')}
+
+        {#if $book && (editable || edition.published)}
+            <section class="edition">
+                <h3
+                    >{editionLabel}
+                    <Note
+                        >{#if edition.published}{new Date(
+                                edition.published
+                            ).toLocaleDateString(
+                                'en-us'
+                            )}{:else}unpublished{/if}
+                        {#if edition.published}&nbsp;
+                            <Link
+                                to={latestPublishedID === edition.ref.id &&
+                                $book.getSubdomain() !== undefined
+                                    ? `/${$book.getSubdomain()}`
+                                    : `/${$book.getID()}/${
+                                          editions.length - index
+                                      }`}
+                                external>read</Link
+                            >{/if}
+                        {#if editable}
+                            &nbsp;
+                            <Link
+                                to={`/write/${$book.getID()}/${
+                                    editions.length - index
+                                }`}>edit</Link
+                            >
+                        {/if}
+                    </Note>
+                </h3>
+                <p
+                    >{#if edition.summary !== ''}<Format
+                            node={Parser.parseFormat(
+                                undefined,
+                                edition.summary
+                            )}
+                        />{:else}&mdash{/if}</p
+                >
+            </section>
+        {/if}
+    {/each}
+
+    {#if editable && editors}
+        <h2>Editors</h2>
+        <Instructions {editable}>
+            These authors can edit any aspect of the book and any of its
+            editions.
+        </Instructions>
+
+        <Permissions
+            uids={$book.uids}
+            inheriteduids={[]}
+            atleastone={true}
+            writable={editable}
+            change={(uids) =>
+                $book ? book.set($book.withEditors(uids)) : undefined}
+        />
+    {/if}
+{/if}

package/{components → package/components}/page/Editions.svelte.d.ts

@@ -1,6 +1,8 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: Record<string, never>;
+    props: {
+        editors?: boolean | undefined;
+    };
     events: {
         [evt: string]: CustomEvent<any>;
     };

package/{components → package/components}/page/Glossary.svelte

@@ -3,12 +3,12 @@ import Outline from './Outline.svelte';
 import Page from './Page.svelte';
 import ChapterIDs from '../../models/book/ChapterID';
 import DefinitionView from './DefinitionView.svelte';
-import { getEdition, isEditable } from './Contexts';
+import { getUser, getEdition, isEditionEditable } from './Contexts';
 import Instructions from './Instructions.svelte';
 import Button from '../app/Button.svelte';
-import Rows from './Rows.svelte';
+let auth = getUser();
 let edition = getEdition();
-let editable = isEditable();
+let editable = isEditionEditable();
 $: glossary = $edition?.getGlossary() ?? {};
 // Sort by canonical phrases
 $: keys =
@@ -32,7 +32,12 @@ function addEmptyDefinition() {
 {#if $edition}
     <Page title={`${$edition.getTitle()} - Glossary`}>
         <Header
+            editable={isEditionEditable() ||
+                ($auth !== undefined &&
+                    $auth.user !== null &&
+                    $edition.isChapterEditor($auth.user.uid))}
             label="Glossary title"
+            id="glossary"
             getImage={() => $edition?.getImage(ChapterIDs.GlossaryID) ?? null}
             setImage={(embed) =>
                 $edition
@@ -50,10 +55,12 @@ function addEmptyDefinition() {
             />
         </Header>
         {#if editable}
-            <Instructions>
-                Add definitions and then link to them in a chapter's text.
+            <Instructions {editable}>
+                Build a glossary here, adding terms, phrases, definitions, and
+                synonyms. Then, in a chapter, you can select any text and link
+                it to a definition.
             </Instructions>
-            <Button tooltip="Add a glossary entry" command={addEmptyDefinition}
+            <Button tooltip="add glossary entry" command={addEmptyDefinition}
                 >+ definition</Button
             >
         {/if}

package/{components → package/components}/page/Header.svelte

@@ -1,15 +1,17 @@
-<script>import EmbedNode from '../../models/chapter/EmbedNode';
-import Parser from '../../models/chapter/Parser';
+<script>import Parser from '../../models/chapter/Parser';
 import Embed from '../chapter/Embed.svelte';
-import ErrorMessage from '../chapter/ErrorMessage.svelte';
 import BookishEditor from '../editor/BookishEditor.svelte';
 import Title from './Title.svelte';
 import { onMount } from 'svelte';
 import TextEditor from '../editor/TextEditor.svelte';
-import { getEdition, isEditable } from './Contexts';
+import { getUser, getEdition, getLeasee, lease } from './Contexts';
 import Button from '../app/Button.svelte';
+import ConfirmButton from '../editor/ConfirmButton.svelte';
+/** True if an author should be able to edit this header. */
+export let editable;
 export let label;
 export let header;
+export let id;
 export let subtitle = undefined;
 export let print = false;
 export let tags = undefined;
@@ -18,8 +20,8 @@ export let setImage;
 export let save = null;
 let title = null;
 let showReminder = true;
+let auth = getUser();
 let edition = getEdition();
-let editable = isEditable();
 function updateScrollReminder() {
     // If the bottom of the window is below the top of the title, hide the reminder.
     if (title)
@@ -48,29 +50,30 @@ onMount(() => {
     };
 });
 // Get the embed, update when getImage function prop changes.
-let embedNode = undefined;
-$: {
-    let embed = getImage();
-    embedNode = embed ? Parser.parseEmbed($edition, embed) : undefined;
-}
+let embed;
+$: embed = getImage();
 </script>
 
 <header class="bookish-chapter-header">
-    {#if embedNode}
+    {#if embed}
         <div class="bookish-figure-full">
-            {#if edition && editable && embedNode instanceof EmbedNode}
+            {#if $edition && editable}
                 <BookishEditor
-                    ast={embedNode}
+                    text={embed}
+                    parser={(text) => Parser.parseEmbed($edition, text)}
                     save={(node) =>
                         setImage ? setImage(node.toBookdown()) : undefined}
                     chapter={false}
                     component={Embed}
                     placeholder=""
+                    leasee={getLeasee(auth, edition, `embed-${id}`)}
+                    lease={(lock) => lease(auth, edition, `embed-${id}`, lock)}
                 />
-            {:else if embedNode instanceof EmbedNode}
-                <Embed node={embedNode} />
             {:else}
-                <ErrorMessage node={embedNode} />
+                <Embed
+                    node={Parser.parseEmbed($edition, embed)}
+                    editable={false}
+                />
             {/if}
             {#if !print && showReminder}
                 <div class="bookish-scroll-reminder" />
@@ -84,13 +87,15 @@ $: {
         <slot name="outline" />
     {/if}
     {#if editable}
-        {#if embedNode === undefined}
-            <Button tooltip="add cover image to page" command={addCover}
+        {#if embed === null}
+            <Button tooltip="add cover image" command={addCover}
                 >+ cover image</Button
             >
         {:else}
-            <Button tooltip="remove cover image from page" command={removeCover}
-                >- cover image</Button
+            <ConfirmButton
+                confirm="remove image?"
+                tooltip="remove cover image"
+                command={removeCover}>- cover image</ConfirmButton
             >
         {/if}
     {/if}
@@ -101,7 +106,7 @@ $: {
                 <TextEditor
                     {label}
                     text={header + (subtitle ? ': ' + subtitle : '')}
-                    placeholder="Title"
+                    placeholder="title"
                     valid={(text) =>
                         text.length === 0
                             ? 'Titles have to be at least one character long.'

package/{components → package/components}/page/Header.svelte.d.ts

@@ -1,8 +1,10 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
+        /** True if an author should be able to edit this header. */ editable: boolean;
         label: string;
         header: string;
+        id: string;
         subtitle?: string | undefined;
         print?: boolean | undefined;
         tags?: string[] | undefined;

package/{components → package/components}/page/Index.svelte

@@ -4,13 +4,14 @@ import Page from './Page.svelte';
 import Instructions from './Instructions.svelte';
 import ChapterIDs from '../../models/book/ChapterID';
 import Link from '../Link.svelte';
-import { getBase, getEdition } from './Contexts';
+import { getBase, getEdition, isEditionEditable } from './Contexts';
 import { page } from '$app/stores';
 import Muted from './Muted.svelte';
 import ChapterTitle from './ChapterTitle.svelte';
 import ChapterNumber from './ChapterNumber.svelte';
 import PageHeader from './PageHeader.svelte';
 import Rows from './Rows.svelte';
+let editable = isEditionEditable();
 let edition = getEdition();
 let base = getBase();
 // What letter are we matching?
@@ -43,7 +44,9 @@ $: {
 {#if $edition}
     <Page title={`${$edition.getTitle()} - Index`}>
         <Header
+            editable={isEditionEditable()}
             label="Index title"
+            id="index"
             getImage={() => $edition?.getImage(ChapterIDs.IndexID) ?? null}
             setImage={(embed) =>
                 $edition
@@ -59,9 +62,8 @@ $: {
             />
         </Header>
 
-        <Instructions>
-            This index is created automatically. It's not perfect; we may add
-            more control over it in the future.
+        <Instructions {editable}>
+            This index is created automatically using the words in the chapters.
         </Instructions>
 
         <p
@@ -79,7 +81,7 @@ $: {
             <nav class="letters">
                 {#each 'abcdefghijklmnopqrstuvwxyz'.split('') as symbol, index}
                     {#if symbol in letters && letter !== symbol}
-                        <Link to={$base + 'index/' + symbol}>{symbol}</Link>
+                        <Link to="{$base}/index/{symbol}">{symbol}</Link>
                     {:else if letter === symbol}
                         <strong
                             ><span style="font-size: 200%">{symbol}</span
@@ -95,13 +97,13 @@ $: {
                 {#each words as word, index}
                     {#if word === true}
                         <tr
-                            ><td colspan={2}
+                            ><td class="term" colspan={2}
                                 ><PageHeader>{words[index + 1]}</PageHeader></td
                             ></tr
                         >
                     {:else}
                         <tr>
-                            <td>{word}</td>
+                            <td class="term">{word}</td>
                             <td>
                                 <!-- Sort the chapters by chapter number -->
                                 {#each Array.from(bookIndex[word]).sort( (a, b) => {
@@ -120,7 +122,7 @@ $: {
                                             {/if}</ChapterNumber
                                         >
                                         <ChapterTitle
-                                            link={`${$base}${chapterID}?word=${word}`}
+                                            link={`${$base}/${chapterID}?word=${word}`}
                                             >{$edition.getChapterName(
                                                 chapterID
                                             )}</ChapterTitle
@@ -141,6 +143,10 @@ $: {
         margin-top: 0;
     }
 
+    .term {
+        vertical-align: baseline;
+    }
+
     .letters {
         display: flex;
         flex-direction: row;

package/{components → package/components}/page/Instructions.svelte

@@ -1,5 +1,4 @@
-<script>import { isEditable } from './Contexts';
-let editable = isEditable();
+<script>export let editable;
 </script>
 
 {#if editable}

package/{components → package/components}/page/Instructions.svelte.d.ts

@@ -1,6 +1,8 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
-    props: Record<string, never>;
+    props: {
+        editable: boolean;
+    };
     events: {
         [evt: string]: CustomEvent<any>;
     };

package/package/components/page/License.svelte

@@ -0,0 +1,45 @@
+<script>import Parser from '../../models/chapter/Parser';
+import BookishEditor from '../editor/BookishEditor.svelte';
+import Instructions from './Instructions.svelte';
+import Format from '../chapter/Format.svelte';
+import { getUser, getEdition, getLeasee, isEditionEditable, lease, } from './Contexts';
+import PageHeader from './PageHeader.svelte';
+let auth = getUser();
+let edition = getEdition();
+let editable = isEditionEditable();
+</script>
+
+<PageHeader id="license">License</PageHeader>
+
+<Instructions {editable}>
+    Do you want to specify rights other than your region's default copyrights?
+    Edit them here.
+</Instructions>
+
+{#if $edition}
+    <!-- If editable, show acknowledgements even if they're empty, otherwise hide -->
+    {#if editable}
+        <!-- svelte-ignore missing-declaration -->
+        <BookishEditor
+            text={$edition.getLicense()}
+            parser={(text) =>
+                Parser.parseFormat($edition, text).withTextIfEmpty()}
+            save={(node) =>
+                $edition
+                    ? edition.set($edition.setLicense(node.toBookdown()))
+                    : undefined}
+            chapter={false}
+            component={Format}
+            placeholder="license"
+            leasee={getLeasee(auth, edition, `license`)}
+            lease={(lock) => lease(auth, edition, `license`, lock)}
+        />
+    {:else}
+        <Format
+            node={Parser.parseFormat(
+                $edition,
+                $edition.getLicense()
+            ).withTextIfEmpty()}
+        />
+    {/if}
+{/if}