# Work Desktop

A self-hosted internal dashboard for quick access to work apps, documents, and tools.

## File Structure

```
workdesktop/
├── index.html        ← Main page
├── style.css         ← All styles
├── app.js            ← All JavaScript
├── api.php           ← PHP backend (read/write JSON)
├── README.md         ← This file
└── data/             ← Per-section app data (auto-created by api.php)
    ├── main.json
    ├── general.json
    ├── security.json
    ├── parking.json
    ├── admin.json
    ├── personal.json
    └── tools.json
```

## Requirements

- A web server with PHP 7.4+ (Apache, Nginx, Caddy, etc.)
- The `data/` folder must be **writable** by the web server process

## Setup

1. Upload the entire `workdesktop/` folder to your server
2. Make sure `data/` is writable:
   ```bash
   chmod 755 data/
   ```
3. Open `index.html` in a browser via your web server (not file://)

## Usage

### Navigating
- Click any app tile to open it
- Apps set to **Open in overlay** will load inside the page rather than opening a new tab
- The top search bar filters all visible tiles instantly
- Press **E** to toggle edit mode, **Escape** to close overlays

### Edit Mode (press E or click ✎ Edit)
- Hover any tile to see **Edit** and **Remove** buttons
- Drag tiles to reorder within a section, or drop onto another section to move them
- Click **＋** in a section header to add a new app
- Click **⊞** in a section header to change the grid size (rows × columns)
- All changes auto-save back to the JSON files via `api.php`

### App Settings
Each app has:
- **Name** — display label
- **URL** — destination link
- **Icon URL** — image URL for the tile icon (leave blank for letter fallback)
- **Tooltip** — hover hint text
- **Tint colour** — custom background for the icon (e.g. `#334455`)
- **Open in overlay** — loads the URL in an in-page iframe instead of a new tab

### Quick Tools Section
The **Quick Tools** panel works exactly like all other sections.
Add apps to it in edit mode just like any other section.
Use it for bookmarks, internal tools, calculators, or anything else.

### Personal Notes
A freehand canvas that auto-saves to your browser's local storage.
- **Brush** / **Eraser** / **Text** tools
- Undo / Redo up to 40 steps
- Export as PNG

## Adding a New Section

1. Create a new JSON file in `data/` (e.g. `data/reports.json`)
2. Add it to the `$allowed` array in `api.php`
3. Add it to the `SECTION` object in `app.js`
4. Add a matching `.win` panel in `index.html`
5. Add a theme class in `style.css` if desired

## Backup Files

Every time a section is saved, `api.php` creates a timestamped backup:
```
data/main.json.bak-20250412-143022
```
These can be deleted periodically or kept for history.