1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
# Just Redact
## Project Overview
**Just Redact** is a secure, client-side web application designed for permanently redacting sensitive information from PDF documents.
Unlike many online PDF tools, Just Redact processes files entirely within the user's browser using WebAssembly (via PDF.js). **No files are uploaded to any server.** This ensures complete privacy for financial, legal, and medical documents.
**Key Features:**
* **Local-Only Processing:** Zero server uploads.
* **True Flattening:** To ensure redactions are permanent and non-reversible, the application converts each PDF page into a high-resolution image (rasterization) during export. This physically destroys the text data underneath the redaction boxes, preventing recovery via copy-paste or text search.
* **Dual Redaction Modes:**
* **Draw:** Manually draw boxes over sensitive areas (images, tables, headers).
* **Select Text:** Highlight text to automatically create redaction boxes over the selection.
## Tech Stack
The project is built with standard web technologies and relies on CDNs for libraries. No complex build chain is required.
* **Frontend:** HTML5, CSS3, Vanilla JavaScript.
* **Styling:**
* `index.html`: Tailwind CSS (via CDN).
* `redact.html`: Custom internal CSS.
* **Libraries (CDNs):**
* **PDF.js:** For parsing and rendering PDF documents in the browser.
* **jsPDF:** For generating the final "flattened" PDF document from canvas images.
## Project Structure
* **`index.html`**: The landing page. Contains marketing copy, "How it Works", FAQ, and SEO metadata. Styled with Tailwind CSS.
* **`redact.html`**: The core application. Contains the logic for file loading, PDF rendering, redaction interaction (drawing/selecting), and the flattening/export process.
* **`just-redact.png`**: Application screenshot/logo asset.
* **`statement_sample.pdf`**: A sample PDF file provided for testing the redaction workflow.
## Development & Usage
### Running the Project
Since this is a static site with no build step, you can run it directly.
1. **Simple Open:** You can open `index.html` or `redact.html` directly in your web browser.
* *Note:* The application requires an internet connection to load the libraries from CDNs (Tailwind, PDF.js, jsPDF).
2. **Local Server (Recommended):** For a more robust development experience (and to avoid potential local file security restrictions in some browsers), serve the directory via a local web server.
```bash
# Python 3
python3 -m http.server
# PHP
php -S localhost:8000
# Node.js (http-server)
npx http-server
```
Then navigate to `http://localhost:8000`.
### Key Implementation Details
* **Rendering:** PDF pages are rendered onto HTML `<canvas>` elements using PDF.js.
* **Redaction Layer:** An HTML overlay (`div.page-overlay`) is placed on top of the canvas. Redaction boxes are simple `<div>` elements with absolute positioning.
* **Export Process:**
1. The application iterates through each page.
2. It re-renders the PDF page to a canvas (often at a higher scale for quality).
3. It draws black rectangles on the canvas corresponding to the user's redaction boxes.
4. It converts the canvas to a JPEG image (`canvas.toDataURL`).
5. It adds this image to a new PDF using jsPDF.
* *This "Canvas -> Image -> PDF" pipeline is critical for the security guarantee of the app.*
|
