From d931a71589c6738b4aff9ef9d5868688dfadb2b6 Mon Sep 17 00:00:00 2001 From: alam00000 Date: Sat, 5 Sep 2026 11:43:12 +0530 Subject: [PATCH] feat: add FAQ modal in PDF Multi Tool and Workflow pages --- src/js/faqModal.ts | 25 ++++ src/pages/pdf-multi-tool.html | 270 +++++++++++++++++++--------------- src/pages/pdf-workflow.html | 256 ++++++++++++++++++-------------- 3 files changed, 324 insertions(+), 227 deletions(-) create mode 100644 src/js/faqModal.ts diff --git a/src/js/faqModal.ts b/src/js/faqModal.ts new file mode 100644 index 00000000..939e8f77 --- /dev/null +++ b/src/js/faqModal.ts @@ -0,0 +1,25 @@ +document.addEventListener('DOMContentLoaded', () => { + const modal = document.getElementById('faq-modal'); + const openBtn = document.getElementById('faq-open-btn'); + const closeBtn = document.getElementById('faq-close-btn'); + if (!modal || !openBtn) return; + + const setOpen = (open: boolean) => { + modal.classList.toggle('hidden', !open); + modal.setAttribute('aria-hidden', open ? 'false' : 'true'); + openBtn.setAttribute('aria-expanded', open ? 'true' : 'false'); + if (open) closeBtn?.focus(); + else openBtn.focus(); + }; + + openBtn.addEventListener('click', () => setOpen(true)); + closeBtn?.addEventListener('click', () => setOpen(false)); + modal.addEventListener('click', (event) => { + if (event.target === modal) setOpen(false); + }); + document.addEventListener('keydown', (event) => { + if (event.key === 'Escape' && !modal.classList.contains('hidden')) { + setOpen(false); + } + }); +}); diff --git a/src/pages/pdf-multi-tool.html b/src/pages/pdf-multi-tool.html index 6a8fd785..4a3e3038 100644 --- a/src/pages/pdf-multi-tool.html +++ b/src/pages/pdf-multi-tool.html @@ -142,13 +142,26 @@ >PDF Multi Tool - +
+ + +
@@ -473,120 +486,145 @@ /> - -
-

+

-
-
- - What can I do with the PDF Multi Tool that the single-purpose tools - can't? - - -

- It puts merging, reordering, rotating, duplicating, deleting, - inserting, and splitting in one page grid, so you can do several of - them in a single pass without downloading and re-uploading between - steps. Every action is covered by undo and redo, so you can - experiment before you export. -

-
-
- - How do I combine pages from several PDFs into one document? - - -

- Upload all the source files and their pages appear together in one - grid, in upload order. Drag pages into the order you want, delete - the ones you don't need, and click Export PDF to download the result - as a single file. -

-
-
- - Can I add images as pages? - - -

- Drop JPG, PNG, WebP, HEIC, TIFF, BMP, GIF, or SVG files alongside - your PDFs and each image becomes a page you can move, rotate, or - delete like any other. Blank A4 pages can also be appended with the - Add Blank Page button. -

-
-
- - How do I split one PDF into several files? - - -

- Click the scissors icon on a page to place a split marker after it; - a dashed line shows where the document will be divided. Export then - produces split-documents.zip containing document - 1.pdf, document - - 2.pdf, and so on. -

-
-
- - Does rotating pages here reduce quality? - - -

- No. Rotation is stored as a page attribute in 90-degree steps rather - than re-rendering the content, so text, vectors, and images are - untouched. For angles other than 90, 180, or 270 degrees, use - Rotate by Custom Degrees. -

-
-
- - Can I export only some of the pages? - - -

- Tick the checkboxes on the pages you want and use Download selected - to get just those pages as selected-pages.pdf. The workspace stays - as it is, so you can keep working and export the rest later. -

-
-
- - What happens to bookmarks when I export? - - -

- The export rebuilds the document page by page, so bookmarks from the - source files aren't carried into the new PDF. Page content, - including text and images, is copied as-is. -

-
-
- - Are my PDFs uploaded when I use the Multi Tool? - - -

- No. Page thumbnails are rendered and the final PDF or ZIP is - assembled in your browser, and damaged files are repaired locally - before loading too. Nothing you drop into the grid leaves your - computer. -

-
+ +
+

+ Frequently Asked Questions +

+
+
+ + What can I do with the PDF Multi Tool that the single-purpose + tools can't? + + +

+ It puts merging, reordering, rotating, duplicating, deleting, + inserting, and splitting in one page grid, so you can do several + of them in a single pass without downloading and re-uploading + between steps. Every action is covered by undo and redo, so you + can experiment before you export. +

+
+
+ + How do I combine pages from several PDFs into one document? + + +

+ Upload all the source files and their pages appear together in + one grid, in upload order. Drag pages into the order you want, + delete the ones you don't need, and click Export PDF to download + the result as a single file. +

+
+
+ + Can I add images as pages? + + +

+ Drop JPG, PNG, WebP, HEIC, TIFF, BMP, GIF, or SVG files + alongside your PDFs and each image becomes a page you can move, + rotate, or delete like any other. Blank A4 pages can also be + appended with the Add Blank Page button. +

+
+
+ + How do I split one PDF into several files? + + +

+ Click the scissors icon on a page to place a split marker after + it; a dashed line shows where the document will be divided. + Export then produces split-documents.zip containing document - + 1.pdf, document - 2.pdf, and so on. +

+
+
+ + Does rotating pages here reduce quality? + + +

+ No. Rotation is stored as a page attribute in 90-degree steps + rather than re-rendering the content, so text, vectors, and + images are untouched. For angles other than 90, 180, or 270 + degrees, use + Rotate by Custom Degrees. +

+
+
+ + Can I export only some of the pages? + + +

+ Tick the checkboxes on the pages you want and use Download + selected to get just those pages as selected-pages.pdf. The + workspace stays as it is, so you can keep working and export the + rest later. +

+
+
+ + What happens to bookmarks when I export? + + +

+ The export rebuilds the document page by page, so bookmarks from + the source files aren't carried into the new PDF. Page content, + including text and images, is copied as-is. +

+
+
+ + Are my PDFs uploaded when I use the Multi Tool? + + +

+ No. Page thumbnails are rendered and the final PDF or ZIP is + assembled in your browser, and damaged files are repaired + locally before loading too. Nothing you drop into the grid + leaves your computer. +

+
+
+
-
+ + - -
-

+

-
-
- - What is the PDF Workflow Builder for? - - -

- It chains several PDF operations into one run. Instead of opening a - tool, downloading, and feeding the result into the next tool for - each step, you connect nodes on a canvas, such as PDF Input, - Compress, Watermark, and Download, set each node's options, and - click Run to process everything in sequence. -

-
-
- - Can I run the same workflow on many PDFs at once? - - -

- Yes. The PDF Input node accepts multiple files; a Merge node - combines them into one document, while other nodes process each PDF - separately. When more than one file comes out the end, the Download - node bundles them into a ZIP automatically. -

-
-
- - Why won't it let me connect two nodes? - - -

- Sockets are typed: PDF (a single document), MultiPDF (several - documents), and Image. A node that expects a single PDF won't accept - a MultiPDF output, so put a Merge node in between, and image outputs - only feed nodes that take images. Connections always run from the - bottom of one node to the top of the next. -

-
-
- - Why does it complain that Encrypt must be the last step? - - -

- Once a PDF is encrypted, later nodes can't read it, so the engine - rejects a workflow where anything other than the output sits after - Encrypt. Move Encrypt to just before Download. Password-protected - inputs are the opposite case: the run pauses and asks for the - password. -

-
-
- - What happens if one step fails? - - -

- The run stops at that node, which turns red with an error message, - and nothing downstream is produced. Fix the setting or the input and - run again; it's easiest to build a two-node version first and add - steps once that works. -

-
-
- - Can I save a workflow and reuse it later? - - -

- Yes. Save stores it as a named template in your browser's local - storage, and Load brings it back in a later session on the same - browser. Export writes the layout to a workflow.json file you can - back up or send to a colleague, and Import restores nodes, - positions, connections, and settings from that file. -

-
-
- - Does a saved workflow contain my documents? - - -

- No. Templates and exported JSON files hold only the node types, - their settings, positions, and connections; the PDFs are chosen - fresh each time you run. Settings are saved as typed, so avoid - exporting a workflow with a password entered in an Encrypt node if - you plan to share it. -

-
-
- - Are the files processed on a server? - - -

- No. Every node runs in your browser with the same engines as the - individual tools, and the only network activity is fetching a - processing module such as Ghostscript the first time a node needs - one. Your PDFs never leave the machine, even in a long multi-step - run. -

-
+ +
+

+ Frequently Asked Questions +

+
+
+ + What is the PDF Workflow Builder for? + + +

+ It chains several PDF operations into one run. Instead of + opening a tool, downloading, and feeding the result into the + next tool for each step, you connect nodes on a canvas, such as + PDF Input, Compress, Watermark, and Download, set each node's + options, and click Run to process everything in sequence. +

+
+
+ + Can I run the same workflow on many PDFs at once? + + +

+ Yes. The PDF Input node accepts multiple files; a Merge node + combines them into one document, while other nodes process each + PDF separately. When more than one file comes out the end, the + Download node bundles them into a ZIP automatically. +

+
+
+ + Why won't it let me connect two nodes? + + +

+ Sockets are typed: PDF (a single document), MultiPDF (several + documents), and Image. A node that expects a single PDF won't + accept a MultiPDF output, so put a Merge node in between, and + image outputs only feed nodes that take images. Connections + always run from the bottom of one node to the top of the next. +

+
+
+ + Why does it complain that Encrypt must be the last step? + + +

+ Once a PDF is encrypted, later nodes can't read it, so the + engine rejects a workflow where anything other than the output + sits after Encrypt. Move Encrypt to just before Download. + Password-protected inputs are the opposite case: the run pauses + and asks for the password. +

+
+
+ + What happens if one step fails? + + +

+ The run stops at that node, which turns red with an error + message, and nothing downstream is produced. Fix the setting or + the input and run again; it's easiest to build a two-node + version first and add steps once that works. +

+
+
+ + Can I save a workflow and reuse it later? + + +

+ Yes. Save stores it as a named template in your browser's local + storage, and Load brings it back in a later session on the same + browser. Export writes the layout to a workflow.json file you + can back up or send to a colleague, and Import restores nodes, + positions, connections, and settings from that file. +

+
+
+ + Does a saved workflow contain my documents? + + +

+ No. Templates and exported JSON files hold only the node types, + their settings, positions, and connections; the PDFs are chosen + fresh each time you run. Settings are saved as typed, so avoid + exporting a workflow with a password entered in an Encrypt node + if you plan to share it. +

+
+
+ + Are the files processed on a server? + + +

+ No. Every node runs in your browser with the same engines as the + individual tools, and the only network activity is fetching a + processing module such as Ghostscript the first time a node + needs one. Your PDFs never leave the machine, even in a long + multi-step run. +

+
+
+
-
+ +