@fiduswriter/editor 0.2.6 → 0.2.7

package/src/dialogs/template_export.ts

@@ -0,0 +1,66 @@
+import {Dialog} from "fwtoolkit"
+import {
+    exportTrackChangesTemplate,
+    getExportTrackChangesValue
+} from "./templates.js"
+
+export interface TemplateExportDialogResult {
+    /** Resolve all tracked changes (accept all) before exporting. When false,
+        the tracked changes are kept and rendered in the exported file. */
+    resolveTrackChanges: boolean
+}
+
+/** Ask how tracked changes should be handled before a DOCX/ODT template export. */
+export class TemplateExportDialog {
+    dialog: Dialog | false
+
+    constructor() {
+        this.dialog = false
+    }
+
+    init(fileType: "docx" | "odt"): Promise<TemplateExportDialogResult | false> {
+        const title =
+            fileType === "docx"
+                ? gettext("DOCX export options")
+                : gettext("ODT export options")
+        const buttons: Array<Record<string, unknown>> = []
+        const dialogDonePromise = new Promise<TemplateExportDialogResult | false>(
+            resolve => {
+                buttons.push({
+                    text: gettext("Export"),
+                    classes: "fw-dark",
+                    click: () => {
+                        const dialogEl = (this.dialog as Dialog).dialogEl
+                        const resolveTrackChanges =
+                            getExportTrackChangesValue(
+                                dialogEl,
+                                "template-track-changes"
+                            ) !== "include"
+                        ;(this.dialog as Dialog).close()
+                        return resolve({resolveTrackChanges})
+                    }
+                })
+
+                buttons.push({
+                    type: "cancel" as const,
+                    click: () => {
+                        ;(this.dialog as Dialog).close()
+                        resolve(false)
+                    }
+                })
+            }
+        )
+
+        this.dialog = new Dialog({
+            title,
+            body: exportTrackChangesTemplate("template-track-changes"),
+            height: 220,
+            width: 420,
+            buttons,
+            restoreActiveElement: false
+        })
+        this.dialog.open()
+
+        return dialogDonePromise
+    }
+}

package/src/dialogs/templates.ts

@@ -1,5 +1,5 @@
 import {CATS} from "@fiduswriter/document/schema/i18n"
-import {escapeText} from "fwtoolkit"
+import {escapeText, infoTooltip} from "fwtoolkit"
 
 interface InternalTarget {
     id: string
@@ -96,40 +96,143 @@ export const revisionDialogTemplate = ({dir}: {dir: string}): string =>
 export const pdfExportDialogTemplate = (): string => `
     <h4>${gettext("Tracked changes")}</h4>
     <div class="fw-radio">
-        <input type="radio" name="pdf-track-changes" value="resolve" class="pdf-track-resolve" checked="">
+        <input type="radio" name="pdf-track-changes" value="resolve" class="pdf-track-resolve" checked="" aria-describedby="pdf-track-resolve-help">
         <label class="pdf-track-resolve-label">${gettext("Resolve tracked changes (accept all)")}</label>
+        ${infoTooltip(
+            gettext(
+                "Applies all tracked changes so the PDF shows the document as if every change had already been accepted."
+            ),
+            "pdf-track-resolve-help"
+        )}
     </div>
     <div class="fw-radio">
-        <input type="radio" name="pdf-track-changes" value="include" class="pdf-track-include">
+        <input type="radio" name="pdf-track-changes" value="include" class="pdf-track-include" aria-describedby="pdf-track-include-help">
         <label class="pdf-track-include-label">${gettext("Include tracked changes in the PDF")}</label>
+        ${infoTooltip(
+            gettext(
+                "Prints the tracked changes so reviewers can see what was added, removed or altered."
+            ),
+            "pdf-track-include-help"
+        )}
     </div>
     <p>
         <label>
-            <input type="checkbox" class="pdf-embed-fidus">
+            <input type="checkbox" class="pdf-embed-fidus" aria-describedby="pdf-embed-fidus-help">
             ${gettext("Embed a Fidus Writer file of this document in the PDF")}
         </label>
+        ${infoTooltip(
+            gettext(
+                "Embeds the editable Fidus Writer document inside the PDF so it can be reopened for editing."
+            ),
+            "pdf-embed-fidus-help"
+        )}
     </p>
     <h4>${gettext("Print production")}</h4>
     <p>
-        <label><input type="checkbox" class="pdf-crop-marks"> ${gettext("Crop marks")}</label><br>
-        <label><input type="checkbox" class="pdf-trim-box"> ${gettext("Trim box")}</label><br>
-        <label><input type="checkbox" class="pdf-bleed-box"> ${gettext("Bleed box")}</label><br>
-        <label>${gettext("Bleed")}: <input type="number" class="pdf-bleed-mm" value="3" min="0" step="0.5"> ${gettext("mm")}</label><br>
-        <label><input type="checkbox" class="pdf-link-borders"> ${gettext("Show link annotation borders")}</label><br>
-        <label><input type="checkbox" class="pdf-rasterize-svgs"> ${gettext("Rasterize SVG images")}</label>
+        <label><input type="checkbox" class="pdf-crop-marks" aria-describedby="pdf-crop-marks-help"> ${gettext("Crop marks")}</label>
+        ${infoTooltip(
+            gettext("Small lines at the corners of the page that show printers where to cut the paper."),
+            "pdf-crop-marks-help"
+        )}<br>
+        <label><input type="checkbox" class="pdf-trim-box" aria-describedby="pdf-trim-box-help"> ${gettext("Trim box")}</label>
+        ${infoTooltip(
+            gettext("Marks the final size of the page after it has been cut."),
+            "pdf-trim-box-help"
+        )}<br>
+        <label><input type="checkbox" class="pdf-bleed-box" aria-describedby="pdf-bleed-box-help"> ${gettext("Bleed box")}</label>
+        ${infoTooltip(
+            gettext("Marks the area beyond the final page size where images and colors must extend so no white edges appear after cutting."),
+            "pdf-bleed-box-help"
+        )}<br>
+        <label>${gettext("Bleed")}: <input type="number" class="pdf-bleed-mm" value="3" min="0" step="0.5" aria-describedby="pdf-bleed-mm-help"> ${gettext("mm")}</label>
+        ${infoTooltip(
+            gettext("How far, in millimeters, images and colors extend beyond the edge of the page."),
+            "pdf-bleed-mm-help"
+        )}<br>
+        <label><input type="checkbox" class="pdf-link-borders" aria-describedby="pdf-link-borders-help"> ${gettext("Show link annotation borders")}</label>
+        ${infoTooltip(
+            gettext("Draws a visible border around hyperlinks in the PDF so they are easier to find."),
+            "pdf-link-borders-help"
+        )}<br>
+        <label><input type="checkbox" class="pdf-rasterize-svgs" aria-describedby="pdf-rasterize-svgs-help"> ${gettext("Rasterize SVG images")}</label>
+        ${infoTooltip(
+            gettext("Converts SVG images to bitmap images in the PDF, which can help when PDF viewers or printers do not render SVG images correctly."),
+            "pdf-rasterize-svgs-help"
+        )}
     </p>
 `
 
+/**
+ * Radio group for choosing whether tracked changes are resolved (accepted) or
+ * kept in the exported file. `name` must be unique per dialog; the chosen value
+ * is read back with {@link getExportTrackChangesValue}.
+ */
+export const exportTrackChangesTemplate = (name: string): string => `
+    <h4>${gettext("Tracked changes")}</h4>
+    <div class="fw-radio">
+        <input type="radio" name="${name}" value="resolve" class="export-track-resolve" checked="" aria-describedby="${name}-resolve-help">
+        <label class="export-track-resolve-label">${gettext("Resolve tracked changes (accept all)")}</label>
+        ${infoTooltip(
+            gettext(
+                "Applies all tracked changes so the exported file shows the document as if every change had already been accepted."
+            ),
+            `${name}-resolve-help`
+        )}
+    </div>
+    <div class="fw-radio">
+        <input type="radio" name="${name}" value="include" class="export-track-include" aria-describedby="${name}-include-help">
+        <label class="export-track-include-label">${gettext("Include tracked changes in the export")}</label>
+        ${infoTooltip(
+            gettext(
+                "Keeps the tracked changes so reviewers can see what was added, removed or altered."
+            ),
+            `${name}-include-help`
+        )}
+    </div>
+`
+
+/** Read the tracked-changes radio group value ("resolve" or "include"). */
+export const getExportTrackChangesValue = (
+    dialogEl: Element,
+    name: string
+): string => {
+    return (
+        dialogEl.querySelector(
+            `input[name="${name}"]:checked`
+        ) as HTMLInputElement | null
+    )?.value || "resolve"
+}
+
 export const htmlExportDialogTemplate = (): string => `
+    ${exportTrackChangesTemplate("html-track-changes")}
+    <p>
+        <label>
+            <input type="checkbox" class="html-svg-math" aria-describedby="html-svg-math-help">
+            ${gettext("Render formulas as SVG images instead of MathML")}
+        </label>
+        ${infoTooltip(
+            gettext(
+                "SVG renders consistently across browsers; MathML keeps formulas as text that can be searched and copied, but only newer browsers support it."
+            ),
+            "html-svg-math-help"
+        )}
+    </p>
+`
+
+export const epubExportDialogTemplate = (): string => `
+    ${exportTrackChangesTemplate("epub-track-changes")}
     <p>
         <label>
-            <input type="checkbox" class="html-svg-math">
+            <input type="checkbox" class="epub-svg-math" aria-describedby="epub-svg-math-help">
             ${gettext("Render formulas as SVG images instead of MathML")}
         </label>
+        ${infoTooltip(
+            gettext(
+                "SVG renders consistently across browsers; MathML keeps formulas as text that can be searched and copied, but only newer browsers support it."
+            ),
+            "epub-svg-math-help"
+        )}
     </p>
-    <p class="formula-note">${gettext(
-        "SVG renders consistently across browsers and is used in PDF export; MathML keeps formulas as text that can be searched and copied, but only newer browsers support it."
-    )}</p>
 `
 
 export const tableInsertTemplate = (): string => `

package/src/document_template/index.ts

@@ -14,6 +14,7 @@ import {
 
 import type {Editor} from "../types.js"
 import {SaveCopy} from "../exporter/native/index.js"
+import {TemplateExportDialog} from "../dialogs/index.js"
 
 export {serializeHelp} from "./schema.js"
 
@@ -388,8 +389,17 @@ export class ModDocumentTemplate {
                     action: (editor: Editor) => {
                         import(
                             "@fiduswriter/document/exporter/docx/index"
-                        ).then(({DOCXExporter}: any) => {
-                            const doc = editor.getDoc() as any
+                        ).then(async ({DOCXExporter}: any) => {
+                            const dialog = new TemplateExportDialog()
+                            const options = await dialog.init("docx")
+                            if (!options) {
+                                return
+                            }
+                            const doc = editor.getDoc({
+                                changes: options.resolveTrackChanges
+                                    ? "acceptAllNoInsertions"
+                                    : undefined
+                            }) as any
                             const title = shortFileTitle(
                                 doc.title,
                                 doc.path || ""
@@ -426,8 +436,17 @@ export class ModDocumentTemplate {
                     ),
                     action: (editor: Editor) => {
                         import("@fiduswriter/document/exporter/odt/index").then(
-                            ({ODTExporter}: any) => {
-                                const doc = editor.getDoc() as any
+                            async ({ODTExporter}: any) => {
+                                const dialog = new TemplateExportDialog()
+                                const options = await dialog.init("odt")
+                                if (!options) {
+                                    return
+                                }
+                                const doc = editor.getDoc({
+                                    changes: options.resolveTrackChanges
+                                        ? "acceptAllNoInsertions"
+                                        : undefined
+                                }) as any
                                 const title = shortFileTitle(
                                     doc.title,
                                     doc.path || ""

package/src/menus/headerbar/model.ts

@@ -14,7 +14,8 @@ import {
     LanguageDialog,
     PdfExportDialog,
     RevisionDialog,
-    HtmlExportDialog
+    HtmlExportDialog,
+    EpubExportDialog
 } from "../../dialogs/index.js"
 import {E2EEKeyManager} from "fwtoolkit/e2ee/key-manager"
 import {PassphraseManager} from "fwtoolkit/e2ee/passphrase-manager"
@@ -639,9 +640,20 @@ export const headerbarModel = () => ({
                             if (!options) {
                                 return
                             }
-                            const doc = getExportDoc(editor, {
-                                changes: "acceptAllNoInsertions"
-                            })
+                            const doc = getExportDoc(
+                                editor,
+                                options.resolveTrackChanges
+                                    ? {changes: "acceptAllNoInsertions"}
+                                    : undefined
+                            )
+                            const converterOptions: Record<string, unknown> = {}
+                            if (options.svgMath) {
+                                converterOptions.mathOutput = "svg"
+                            }
+                            if (!options.resolveTrackChanges) {
+                                // Keep the marks and render them in the output.
+                                converterOptions.trackChanges = true
+                            }
                             const exporter = new HTMLExporter(
                                 doc,
                                 db.bibDB,
@@ -649,7 +661,7 @@ export const headerbarModel = () => ({
                                 editor.app.csl,
                                 editor.docInfo.updated as Date,
                                 getDocumentTemplate(editor).documentStyles,
-                                options.svgMath ? {mathOutput: "svg"} : {}
+                                converterOptions
                             )
                             exporter.progressCallback = exportProgress(doc)
                             exporter.init()
@@ -732,18 +744,35 @@ export const headerbarModel = () => ({
                     action: (editor: Editor) => {
                         import(
                             "@fiduswriter/document/exporter/epub/index"
-                        ).then(({EpubExporter}) => {
+                        ).then(async ({EpubExporter}) => {
                             const db = getDB(editor)
-                            const doc = getExportDoc(editor, {
-                                changes: "acceptAllNoInsertions"
-                            })
+                            const dialog = new EpubExportDialog()
+                            const options = await dialog.init()
+                            if (!options) {
+                                return
+                            }
+                            const doc = getExportDoc(
+                                editor,
+                                options.resolveTrackChanges
+                                    ? {changes: "acceptAllNoInsertions"}
+                                    : undefined
+                            )
+                            const converterOptions: Record<string, unknown> = {}
+                            if (options.svgMath) {
+                                converterOptions.mathOutput = "svg"
+                            }
+                            if (!options.resolveTrackChanges) {
+                                // Keep the marks and render them in the output.
+                                converterOptions.trackChanges = true
+                            }
                             const exporter = new EpubExporter(
                                 doc,
                                 db.bibDB,
                                 db.imageDB,
                                 editor.app.csl,
                                 editor.docInfo.updated as Date,
-                                getDocumentTemplate(editor).documentStyles
+                                getDocumentTemplate(editor).documentStyles,
+                                converterOptions
                             )
                             exporter.progressCallback = exportProgress(doc)
                             exporter.init()