102 lines
3.7 KiB
Markdown
102 lines
3.7 KiB
Markdown
# ATM Incident Browser - Implementation Plan
|
|
|
|
## Overview
|
|
Create a restricted Electron-based browser application that only allows access to a configurable URL (atm-incident site). The app will have a standard window with minimize/close buttons and work on both Windows and Linux.
|
|
|
|
## Project Structure
|
|
```
|
|
hiveops-browser/
|
|
├── package.json
|
|
├── electron-builder.yml # Build configuration for Windows/Linux
|
|
├── src/
|
|
│ ├── main/
|
|
│ │ ├── main.js # Electron main process
|
|
│ │ ├── config.js # Configuration management
|
|
│ │ └── preload.js # Security bridge
|
|
│ └── renderer/
|
|
│ ├── index.html # Simple loading/error UI
|
|
│ └── styles.css # Basic styles
|
|
├── config/
|
|
│ └── default-config.json # Default configuration template
|
|
└── assets/
|
|
└── icon.png # Application icon
|
|
```
|
|
|
|
## Key Components
|
|
|
|
### 1. Configuration System (`src/main/config.js`)
|
|
- Store settings in user's app data directory
|
|
- Configurable options:
|
|
- `allowedUrl`: Base URL to allow (e.g., `https://atm-incident.example.com`)
|
|
- `windowWidth`, `windowHeight`: Window dimensions
|
|
- `allowSubdomains`: Whether to allow subdomains of the base URL
|
|
- Settings accessible via system tray or menu
|
|
|
|
### 2. Main Process (`src/main/main.js`)
|
|
- Create BrowserWindow with standard frame
|
|
- Load the configured URL on startup
|
|
- Intercept all navigation requests
|
|
- Block navigation to URLs outside the allowed domain
|
|
- Handle new window requests (open in same window or block)
|
|
- Provide settings menu via application menu
|
|
|
|
### 3. URL Restriction Logic
|
|
- Parse the allowed URL to extract the domain
|
|
- On every navigation event (`will-navigate`, `new-window`):
|
|
- Compare target URL domain against allowed domain
|
|
- Block if not matching, show notification
|
|
- Handle redirects appropriately
|
|
|
|
### 4. Preload Script (`src/main/preload.js`)
|
|
- Minimal context bridge for any needed IPC
|
|
- Expose config reading capability to renderer
|
|
|
|
### 5. Build Configuration (`electron-builder.yml`)
|
|
- **Windows**: Create `.exe` installer and portable version
|
|
- **Linux**: Create `.AppImage` and `.deb` packages
|
|
- Include desktop shortcuts automatically
|
|
|
|
## Implementation Steps
|
|
|
|
1. **Initialize project**
|
|
- Create `package.json` with Electron and electron-builder dependencies
|
|
- Set up npm scripts for dev and build
|
|
|
|
2. **Create main process**
|
|
- Implement `main.js` with BrowserWindow creation
|
|
- Add URL restriction logic with domain validation
|
|
- Create application menu with Settings option
|
|
|
|
3. **Create configuration system**
|
|
- Implement config loading/saving using `electron-store` or custom JSON
|
|
- Create settings window for URL configuration
|
|
- Store in OS-appropriate location (AppData/config)
|
|
|
|
4. **Create renderer files**
|
|
- Simple `index.html` for loading states and errors
|
|
- Minimal CSS for professional appearance
|
|
|
|
5. **Set up build configuration**
|
|
- Configure `electron-builder.yml` for Windows and Linux
|
|
- Set up icons and metadata
|
|
- Configure shortcuts to be created during install
|
|
|
|
6. **Testing**
|
|
- Test URL blocking on various navigation attempts
|
|
- Test settings persistence
|
|
- Test builds on both platforms
|
|
|
|
## Verification
|
|
1. Run `npm start` to launch in development mode
|
|
2. Verify only the configured URL loads
|
|
3. Attempt to navigate away (should be blocked)
|
|
4. Change settings and verify persistence
|
|
5. Build for Windows: `npm run build:win`
|
|
6. Build for Linux: `npm run build:linux`
|
|
7. Test installers create proper desktop shortcuts
|
|
|
|
## Dependencies
|
|
- `electron`: ^28.0.0
|
|
- `electron-builder`: ^24.0.0 (dev)
|
|
- `electron-store`: ^8.0.0 (for config persistence)
|