feat: add folder picker for automatic project file loading

- Add "Load Project Folder" button with folder selection (webkitdirectory)
- Automatically load all project files (JSON, CSV, SVG, CSS) from selected folder
- Eliminate need to manually upload each file individually
- Show clear errors if referenced files are missing from folder
- Update all documentation to explain folder picker usage

This solves the browser security limitation where uploading a single
project.json doesn't allow automatic access to other files in the same
directory. Users can now select an entire project folder and all files
load automatically in one click.

Changes:
- index.html: Add folder input with webkitdirectory attribute and UI
- engine.js: Add folderInput event handler to process all files from folder
- README.md: Document folder picker as primary loading method
- WINDOWS_USAGE.md: Add folder picker as recommended Option 1
- TROUBLESHOOTING.md: Add section explaining project files not auto-loading
- CLAUDE.md: Document folder picker architecture for future instances
- Makefile: Update DIST_README.md template to mention folder picker

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-23 16:34:35 +01:00
parent 39037587ba
commit cefbf96a82
7 changed files with 180 additions and 6 deletions

View File

@@ -243,6 +243,33 @@ See `TEMPLATE_V2_GUIDE.md` for comprehensive template documentation.
---
## Project Files Not Auto-Loading
### Problem Description
**Symptoms:**
- Uploaded project.json but CSV/SVG/CSS files don't load
- Have to manually select each file individually
- Timeline doesn't render after selecting project.json
### Solution
This is expected behavior due to browser security restrictions. When you upload a single project.json file, the browser doesn't allow automatic access to other files in the same directory.
**Use the Folder Picker (Recommended):**
1. Click **"📂 Load Project Folder"** (blue button at top of file manager)
2. Select the entire project folder
3. All files will be loaded automatically
This works because you're explicitly granting permission to access all files in the folder.
**Alternative:** Load files individually using the separate upload buttons for CSV, SVG, and CSS.
**For developers running from local server:** Files auto-load when served via HTTP (no manual upload needed).
---
## CSV Data Not Loading
### Problem Description