workin' on stuff

sithel · Jan 3, 2025 · 2ebb259 · 2ebb259
1 parent c2e9213
commit 2ebb259
Show file tree

Hide file tree

Showing 4 changed files with 139 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -1,18 +1,71 @@
 # vip
 Villainous Imposer Program
 
+Targeting launch early February 2025
+
+# TODOs
+
+There's a lot of features and a lot of work remaining--
+
+### Functionality
+
+- all of PDF page placement
+  - handling both flip options
+  - rotation/padding/margin logic
+- file downloading (all options)
+- all of mark-up
+  - PDF boundary spine marks
+  - spine order marks
+  - punching guidelines/marks (spine/interior)
+  - cut / fold lines
+  - corner cross-hairs
+- preview
+
+### UI/UX:
+
+- enable/disable sections based on entered values
+- saving settings/URL params
+- correctly re-rendering values when changing Display Units
+- PDF placement preview
+- debug info / error states / progress bars
+- folding information / animations for impositions
+- disable outer/bottom for PDF Placement if `Original` scaling
+- warn in PDF Placement if known exceeding of bounds (and by how much)
+- dynamic button name change for Download from `get that file!` to `get those files!`
+
+### Stretch/Long Term
+
+- creep
+- PDF skew correction
+- page numbers in the margins
+- night mode
+- more impositions
+- improve Imposition options UI/UX to be more compact (in listing options section)
+
 # Helper Functions & Code Structure
 
+## Source PDFs
+
+Processed in `vip.processUploads`, offloads most the work to `pdf.js`'s `processUploadBlocks` (which calls helper functions within that file). Tucks all results in `window.book.upload_blocks`, each entry containing a `_pagesList` array (`-1` means blank!) and `pdfDoc` (`PDFLib.PDFDocument`)
+
+
 ## `unified_source` (steps 1 & 2)
 
 Needs `unified_source_modifier.attach()` to be called first to hook everything up (see `state_modifiers.js`).
 Call `window.book.unified_source.processUpdate()` after base changes to re-calculate things. Things like:
 
+- `window.book.unified_source.hasValidPdf()` : returns a boolean
 - `window.book.unified_source.maxWidth` / `window.book.unified_source.maxHeight` : raw PDF height (post step 1)
 - `window.book.unified_source.isTurned()` : returns true if it's -90 or 90 degree rotation (post step 2)
 - `window.book.unified_source.pdf_w` / `window.book.unified_source.pdf_h` : takes into account PDF margins and rotation. (post step 2)
+- `window.book.unified_source.pageCount` : calculated total pages across multiple PDFs and accounting for blanks
+- `window.book.unified_source.getPdfPageForPageNumber(pageNum)` : given page `N` in the result PDF, looks up in the `window.book.upload_blocks` to fetch the corresponding `PDFLib.PDFPage`
 
 ## Physical (step 3)
 
 - `window.book.physical.display_unit` : either `metric`, `imperial`, or `points`
-- `window.book.physical.paper_size` : a 2 value list of the sheet's `[width, height]` in points
+- `window.book.physical.paper_size` : a 2 value list of the sheet's `[width, height]` in points
+
+## Download (step 9)
+
+Check out `files.js`
diff --git a/index.html b/index.html
@@ -52,6 +52,10 @@
       /*--pico-line-height: 0.5rem;*/
       --pico-form-element-spacing-vertical: 0rem;
     }
+    .disabled {
+      opacity: 0.5;
+      pointer-events: none;
+    }
     details summary::after {
       float: left;
     }
@@ -235,7 +239,12 @@
       #paper_size_options {
         width: 20em;
       }
-      input {
+      #paper_margin_short, #paper_margin_long {
+        width: 4em;
+        padding: 2px;
+        margin-top: 0.75em;
+      }
+      #paper_size { 
         width: 10em;
       }
       fieldset {
@@ -284,8 +293,10 @@
       margin-bottom: 50px;
     }
     #pdf_download {
-      input {
+      div {
         margin-left: 40px;
+      }
+      #file_download_name {
         width:auto;
       }
     }
@@ -369,7 +380,7 @@ <h2>1. Source PDF(s)</h2>
         </details>
       </section>
 
-      <section id="page_manipulation">
+      <section id="page_manipulation" class="disabled">
         <h2>2. PDF Manipulation</h2>
           <details>
           <summary>Explanation</summary>
@@ -435,7 +446,9 @@ <h2>3. Printer Paper</h2>
         <details>
           <summary>Instructions/Details</summary>
           <p>
-            Omg as if I knew...
+            This has to do with <i>your</i> machine and the paper you're feeding into it. <BR><br>
+
+            The paper margins are to add white space on the edges of the printed page in case you do not have a full-bleed printer. They are mirrored on either side - so a <code>10 pt</code> margin on the Long Sides will put a <code>10 pt</code> on both sides for a total of <code>20 pt</code>
           </p>
         </details>
         <label for="unit_selector">Display Units</label>
@@ -455,11 +468,21 @@ <h2>3. Printer Paper</h2>
         </fieldset>
         <small class="units">cm</small>
         <BR>
-        Margin Short Sides
+        Flip Paper
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+        <label for="flip_paper_short">
+          short side&nbsp;&nbsp;<input type="radio" id="flip_paper_short" name="flip_paper" value="short" checked>
+        </label>
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+        <label for="flip_paper_short">
+          long side&nbsp;&nbsp;<input type="radio" id="flip_paper_long" name="flip_paper" value="long">
+        </label>
+        <BR>
+        Paper Margins 
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;short sides
         <input type="number" id="paper_margin_short" name="paper_margin_short" placeholder="0" />
         <small class="units">cm</small>
-        <br>
-        Margin Long Sides
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; long sides
         <input type="number" id="paper_margin_long" name="paper_margin_long" placeholder="0" />
         <small class="units">cm</small>
       </section>
@@ -511,7 +534,7 @@ <h2>3. Printer Paper</h2>
         </table>
       </section>
 
-      <section id="pdf_placement">
+      <section id="pdf_placement" class="disabled">
         <h2>5. PDF Placement</h2>
         <details>
           <summary>Instructions/Details</summary>
@@ -521,10 +544,10 @@ <h2>5. PDF Placement</h2>
             Only the <code>top</code> and <code>inner</code> margins are considered. Positive values shift it down/away from the spine. Negative values shift it up/towards the spine.<BR>
             <b>Fit - Proportional</b><br>
             Maintains the original PDF aspect ratio, scaled down to fit into the space provided<br>
-            Positive padding numbers push the PDF inward, makes it smaller. Negative padding pulls it out, making it larger. A padding of <code>N</code> on one side and <code>-N</code> on the other side of the PDf is the same as translating/shifting it. The PDF will scale such that it's small enough to honor the tightest constraints (ex: inner/outer margins that squeeze the PDF will override top/bottom margins that expand the PDF)<BR>
+            Positive padding numbers push the PDF inward, makes it smaller. Negative padding pulls it out, making it larger. A padding of <code>N</code> on one side and <code>-N</code> on the other side of the PDF is the same as translating/shifting it. The PDF will scale such that it's small enough to honor the tightest constraints (ex: inner/outer margins that squeeze the PDF will override top/bottom margins that expand the PDF)<BR>
             <b>Fill - Stretch</b><br>
             Distors the PDF's aspect ratio, stretching it in both directions to fill the entire space allowed<BR>
-            Positive padding numbers push the PDF inward, makes it smaller. Negative padding pulls it out, making it larger. A padding of <code>N</code> on one side and <code>-N</code> on the other side of the PDf is the same as translating/shifting it.
+            Positive padding numbers push the PDF inward, makes it smaller. Negative padding pulls it out, making it larger. A padding of <code>N</code> on one side and <code>-N</code> on the other side of the PDF is the same as translating/shifting it.
           </p>
         </details>
         <div>
@@ -582,7 +605,7 @@ <h2>7. Post-Processing</h2>
         <kbd>Not Yet Implemented</kbd>
       </section>
 
-      <section id="pdf_preview">
+      <section id="pdf_preview" class="disabled">
         <h2>8. Preview</h2>
         <details>
           <summary>Instructions/Details</summary>
@@ -595,8 +618,24 @@ <h2>8. Preview</h2>
 
       <section id="pdf_download">
         <h2>9 Download</h2>
-        <input type=text id="file_download_name" placeholder="your_file_name">.pdf &nbsp;&nbsp;&nbsp;&nbsp;
-        <button onclick="vip.downloadFile(document.getElementById('file_download_name').value, document.getElementById('file_download_name').getAttribute('placeholder'))">get that file!</button>
+        <div>
+          Download: 
+          <label for="download-aggregate">
+            <input type="checkbox" id="download-aggregate" name="download-aggregate" checked="">
+            aggregate file (all signatures)
+          </label>
+          <label for="download-signatures">
+            <input type="checkbox" id="download-signatures" name="download-signatures" >
+            each signature as separate file
+          </label>
+          <label for="download-front-back">
+            <input type="checkbox" id="download-front-back" name="download-front-back" >
+            front / back of sheets as separate files
+          </label>
+          <BR>
+          <input type=text id="file_download_name" placeholder="your_file_name">.pdf &nbsp;&nbsp;&nbsp;&nbsp;
+          <button onclick="vip.downloadFile(document.getElementById('file_download_name').value, document.getElementById('file_download_name').getAttribute('placeholder'))">get that file!</button>
+        </div>
       </section>
     </main>
 

diff --git a/js/main.js b/js/main.js
@@ -30,6 +30,9 @@ export const vip = {
       detailsEl.removeAttribute("style")
       detailsEl.setAttribute("open", "")
       console.log("=== Processing Uploads Complete ")
+      if (window.book.unified_source.hasValidPdf()) {
+        document.getElementById("page_manipulation").setAttribute("class","")
+      }
       window.book.unified_source.processUpdate()
     }
     utils.processUploadBlocks(callback);

diff --git a/js/state_modifiers.js b/js/state_modifiers.js
@@ -34,11 +34,41 @@ export const unified_source_modifier = {
   _hookUpMinorHelpers: function() {
     window.book.unified_source.pdfHeight = function() { return }
   },
+  _hasValidPdf: function() {
+    return this.pdf != undefined && this.pdf.getPageCount() > 0
+  },
+  _getPdfPageForPageNumber: function shark(pageNum) {
+    const isNumber = function(value) {
+      return typeof value === "number" && isFinite(value);
+    }
+    const lookForPage = function(acc, curBlock) {
+      if (!isNumber(acc)) {
+        return acc
+      }
+      const targetPageNum = pageNum - acc
+      if (targetPageNum < curBlock._pagesList.length) {
+        const pageListEntry = curBlock._pagesList[targetPageNum][0]
+        if (pageListEntry == -1) {
+          const page = curBlock.pdfDoc.getPage(targetPageNum)
+          return "b"
+        }
+        const page = curBlock.pdfDoc.getPage(pageListEntry)
+        return page
+      } else {
+        return acc + curBlock._pagesList.length
+      }
+    }
+    return window.book.upload_blocks
+      .filter(x => x.pdfDoc != null)
+      .reduce(lookForPage, 0)
+  },
   attach : function() {
     window.book.unified_source.isTurned = this._isTurned
     window.book.unified_source.updatePdfPlacementInfo = this._updatePdfPlacementInfo
     window.book.unified_source.calcPdfPlacementRenderInfo = this._calcPdfPlacementRenderInfo
     window.book.unified_source.calcRotationPreviewRenderInfo = this._calcRotationPreviewRenderInfo
+    window.book.unified_source.hasValidPdf = this._hasValidPdf
+    window.book.unified_source.getPdfPageForPageNumber = this._getPdfPageForPageNumber
     this._hookUpMinorHelpers()
     window.book.unified_source.processUpdate = function() {
       if (window.book.unified_source.maxHeight == undefined || window.book.unified_source.maxHeight == undefined) {