v4.1.5: Accordion UI, webcam QR scanning, Pi image fix
Encode/Decode UI: - New accordion layout with 3 steps (encode) / 2 steps (decode) - Gold step numbers with checkmarks on completion - Dynamic right-aligned summaries as fields are filled - Subtle gradient highlight on active accordion step Webcam QR Scanning: - Camera button for RSA key QR codes on encode/decode pages - Camera button for channel key scanning - 3-2-1 countdown capture for dense QR codes - Proper scanner stop/restart on retry - Backend decompression for STEGASOO-Z: compressed keys RSA Key Print: - Removed identifying text from QR print output - Now prints plain QR code for discretion Pi Image Script: - Fixed 16GB resize to detect expand vs shrink - Fresh images now properly EXPAND to 16GB - Already-expanded images properly SHRINK to 16GB UI Polish: - Removed PIN helper text for compactness - Fixed QR drop zone centering - Fixed decode page element IDs for JS 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -95,6 +95,47 @@ src/stegasoo/dct_steganography.py
|
||||
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
## Browser Webcam QR Scanning
|
||||
|
||||
Add webcam-based QR code scanning for all key input fields.
|
||||
|
||||
### Use Cases
|
||||
- Import channel key via QR scan on account page
|
||||
- Scan QR codes instead of typing long keys
|
||||
|
||||
### Implementation
|
||||
|
||||
**1. Add JS QR scanning library**
|
||||
- Use `jsQR` or `html5-qrcode` (client-side, no server needed)
|
||||
- Include via CDN in base template
|
||||
|
||||
**2. Add camera button to channel key inputs**
|
||||
- Account page: "Add Key" field
|
||||
- Encode/decode pages: channel key selector (if manual input)
|
||||
|
||||
**3. Camera modal component**
|
||||
- Request camera permission
|
||||
- Live video preview
|
||||
- Auto-detect QR and populate input field
|
||||
- Close modal on successful scan
|
||||
|
||||
### Files to Modify
|
||||
```
|
||||
frontends/web/templates/base.html - Add QR library CDN
|
||||
frontends/web/templates/account.html - Camera button + modal
|
||||
frontends/web/static/js/stegasoo.js - QR scan methods
|
||||
```
|
||||
|
||||
### Testing Checklist
|
||||
- [ ] Camera permission prompt works
|
||||
- [ ] QR detected and input populated
|
||||
- [ ] Works on mobile browsers
|
||||
- [ ] Graceful fallback if no camera
|
||||
|
||||
---
|
||||
|
||||
## Other 4.1.5 Ideas (if time)
|
||||
|
||||
- [ ] Role-based permissions: admin / mod / user
|
||||
|
||||
Reference in New Issue
Block a user