Merge pull request #356 from mgreminger/md-left-justify

feat: document export improvements

Author: mgreminger

package-lock.json

@@ -59,7 +59,7 @@
     "plotly.js-basic-dist": "github:mgreminger/plotly.js#dist-basic-for-ep",
     "quick-lru": "^6.1.1",
     "quill": "^2.0.3",
-    "quill-delta-to-markdown": "github:mgreminger/quill-delta-to-markdown#4c5f3a166ba85c90dc8378fccf4bf36b0a053e20",
+    "quill-delta-to-markdown": "github:mgreminger/quill-delta-to-markdown#d35d6966b30873ff33ee1a2732b34d382bceead2",
     "workbox-window": "^6.5.4",
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
   }

package.json

@@ -135,7 +135,7 @@
       title: "Data Tables" 
     },
     {
-      path: "/EEosVXz7hywFwYimddQdu5",
+      path: "/uEeEXzYZLWyfXxyTzaWpAN",
       title: "Python Extensions" 
     },
     {
@@ -1938,7 +1938,7 @@ Please include a link to this sheet in the email to assist in debugging the prob
     }
   }
 
-  async function getMarkdown(getShareableLink = false) {
+  async function getMarkdown(getShareableLink = false, centerEquations = false) {
     let markdown = `# ${appState.title}\n`;
 
     if (getShareableLink) {
@@ -1958,17 +1958,21 @@ Please include a link to this sheet in the email to assist in debugging the prob
       modalInfo.modalOpen = false;
     }
 
-    markdown += await cellList.getMarkdown();
+    markdown += await cellList.getMarkdown(centerEquations);
 
     return markdown;
   }
 
-  async function getDocument(docType: "docx" | "pdf" | "md" | "tex", getShareableLink = false) {
-    const markDown = "<!-- Created with EngineeringPaper.xyz -->\n" + await getMarkdown(getShareableLink);
+  async function getDocument(settings: {docType: "docx" | "pdf" | "md" | "tex", 
+                              getShareableLink: boolean,
+                              centerEquations: boolean,
+                              paperSize: "a4" | "letter"}) {
+    const markDown = "<!-- Created with EngineeringPaper.xyz -->\n" + 
+                     await getMarkdown(settings.getShareableLink, settings.centerEquations);
     const upload_blob = new Blob([markDown], {type: "text/markdown"});
 
-    if (docType === "md") {
-      saveFileBlob(upload_blob, `${appState.title}.${docType}`);
+    if (settings.docType === "md") {
+      saveFileBlob(upload_blob, `${appState.title}.${settings.docType}`);
       return
     }
 
@@ -1979,15 +1983,21 @@ Please include a link to this sheet in the email to assist in debugging the prob
     modalInfo = {state: "generatingDocument", modalOpen: true, heading: "Generating Document"};
 
     try {
-      const response = await fetch(`${apiUrl}/docgen/${docType}`, {
+      let size_modifier: string;
+      if (settings.paperSize.toLowerCase() === "a4") {
+        size_modifier = "_a4";
+      } else {
+        size_modifier = "";
+      }
+      const response = await fetch(`${apiUrl}/docgen/${settings.docType}${size_modifier}`, {
         method: "POST",
         body: formData
       });
 
       if (response.ok) {
         const fileBlob = await response.blob();
 
-        saveFileBlob(fileBlob, `${appState.title}.${docType}`);
+        saveFileBlob(fileBlob, `${appState.title}.${settings.docType}`);
 
         modalInfo.modalOpen = false;
       } else {
@@ -2001,7 +2011,7 @@ Please include a link to this sheet in the email to assist in debugging the prob
         throw new Error(`${response.status} ${errorMessage}`);
       }
     } catch (error) {
-      console.log(`Error creating ${docType} document: ${error}`);
+      console.log(`Error creating ${settings.docType} document: ${error}`);
       modalInfo = {
         state: "error",
         error: error,
@@ -2917,7 +2927,7 @@ Please include a link to this sheet in the email to assist in debugging the prob
       <DownloadDocumentModal
         bind:open={modalInfo.modalOpen}
         downloadSheet={(e) => saveSheetToFile(e.detail.saveAs)}
-        downloadDocument={(e) => getDocument(e.detail.docType, e.detail.getShareableLink)}
+        downloadDocument={(e) => getDocument(e.detail)}
       />
     {:else if modalInfo.state === "insertSheet"}
       <InsertSheetModal

src/App.svelte

@@ -81,9 +81,9 @@
     } 
   });
 
-  export async function getMarkdown(): Promise<string> {
+  export async function getMarkdown(centerEquations: boolean): Promise<string> {
     if (cellElement) {
-      return await cellElement.getMarkdown?.() ?? "";
+      return await cellElement.getMarkdown?.(centerEquations) ?? "";
     } else {
       return "";
     }

src/Cell.svelte

@@ -37,12 +37,12 @@
   let scrollingContainer: HTMLElement;
   let sheetBody: HTMLUListElement;
 
-  export async function getMarkdown(): Promise<string> {
+  export async function getMarkdown(centerEquations= false): Promise<string> {
     let markdown = "";
 
     for (const cell of cellElements) {
       if (cell) {
-        markdown += await cell.getMarkdown();
+        markdown += await cell.getMarkdown(centerEquations);
       }
     }
 

src/CellList.svelte

@@ -59,7 +59,7 @@
     }
   });
 
-  export function getMarkdown() {
+  export function getMarkdown(centerEquations: boolean) {
     return "```python\n" + codeCell.code + "\n```\n\n";
   }
 

src/CodeCell.svelte

@@ -58,7 +58,7 @@
   let containerDiv: HTMLDivElement;
   let copyButtonText = $state("Copy Data");
 
-  export async function getMarkdown() {
+  export async function getMarkdown(centerEquations: boolean) {
     const rows = (await dataTableCell
                   .getSheetRows())
                   .map(row => row.map(value => value.replaceAll('|', '\\|').replaceAll(':', '\\:')));

src/DataTableCell.svelte

@@ -18,7 +18,7 @@
   let intervalId = null;
   let buttonElement: HTMLElement;
 
-  export function getMarkdown() {
+  export function getMarkdown(centerEquations: boolean) {
     return "";
   }
 

src/DeletedCell.svelte

@@ -24,7 +24,7 @@
 
   let hideToolbar = $derived(!(appState.activeCell === index));
 
-  export function getMarkdown(): string {
+  export function getMarkdown(centerEquations: boolean): string {
     return deltaToMarkdown(documentationCell.documentationField.delta?.ops ?? "").replaceAll("\n", "\n\n").trimEnd() + "\n\n";
   }
 

src/DocumentationCell.svelte

@@ -1,9 +1,15 @@
 <script lang="ts">
-  import { Modal, RadioButtonGroup, RadioButton, Checkbox } from "carbon-components-svelte";
+  import { Modal, RadioButtonGroup, RadioButton, Checkbox, Select,
+           SelectItem } from "carbon-components-svelte";
+  import appState from "./stores.svelte";
 
   interface Props {
     open: boolean;
-    downloadDocument: (arg: {detail: {docType: "docx" | "pdf" | "md" | "tex", getShareableLink: boolean}}) => void;
+    downloadDocument: (arg: {detail: {docType: "docx" | "pdf" | "md" | "tex", 
+                                      getShareableLink: boolean,
+                                      centerEquations: boolean,
+                                      paperSize: "a4" | "letter"
+                                    }}) => void;
     downloadSheet: (arg: {detail: {saveAs: boolean}}) => void;
   }
 
@@ -22,7 +28,11 @@
     if (docType === "epxyz") {
       downloadSheet({detail: {saveAs: saveAs}});
     } else {
-      downloadDocument({detail: {docType: docType, getShareableLink: getShareableLink}});
+      downloadDocument({detail: {docType: docType, 
+                                 getShareableLink: getShareableLink,
+                                 centerEquations: appState.exportCenteredEquations,
+                                 paperSize: appState.paperSize
+                                }});
     }
   }
 </script>
@@ -33,7 +43,6 @@
     flex-direction: column;
     gap: 20px;
   }
-
 </style>
 
 <Modal
@@ -74,12 +83,25 @@
       </div>
     {/if}
     <div>
-      <div class="bx--label">Shareable Link</div>
+      <Select
+        labelText="Paper Size"
+        bind:selected={appState.paperSize}
+        disabled={docType === "epxyz" || docType === "md"}
+      >
+        <SelectItem value="letter" text="Letter" />
+        <SelectItem value="a4" text="A4" />
+      </Select>
+      <div class="bx--label">Markdown Options</div>
       <Checkbox 
         labelText="Create a shareable link and add it to the generated document (only applies to md, docx, pdf, and tex files, anyone with this private link will be able to view your original sheet)"
         bind:checked={getShareableLink}
         disabled={docType === "epxyz"}
       />
+      <Checkbox 
+        labelText="Center equations"
+        bind:checked={appState.exportCenteredEquations}
+        disabled={docType === "epxyz"}
+      />
     </div>
   </div>
 </Modal>