streamflow/desktop-app/FEATURES_v1.1.0.md

364 lines
9.9 KiB
Markdown
Raw Normal View History

# StreamFlow Desktop v1.1.0 - New Features Implementation
## Overview
This document describes the five major features added in version 1.1.0 of StreamFlow Desktop.
## Implemented Features
### 1. Auto-Update Functionality
**Implementation**: Uses `electron-updater` package for automatic update detection and installation.
**Features**:
- Automatic update checks on app startup (5-second delay)
- Manual update check via **Help****Check for Updates**
- Download progress tracking with percentage display
- User prompts for update availability and installation
- Configurable update server via `package.json` publish settings
**Configuration** (`main.js`):
```javascript
autoUpdater.autoDownload = false; // Manual download approval required
autoUpdater.autoInstallOnAppQuit = true; // Install on next quit
```
**Events Handled**:
- `update-available`: Notify user, prompt for download
- `download-progress`: Show progress dialog with percentage
- `update-downloaded`: Prompt for restart
**User Experience**:
- Non-intrusive: Updates don't interrupt work
- User control: Download approval required
- Progress feedback: Real-time download percentage
- Easy restart: One-click restart after download
---
### 2. System Tray Integration
**Implementation**: Native system tray with context menu and minimize-to-tray behavior.
**Features**:
- Tray icon displays app logo (512x512 PNG)
- Context menu with quick actions
- Minimize to tray instead of quitting
- Show/hide window toggle
- Tray persists when window closed
**Tray Menu Options**:
- **Show StreamFlow** / **Hide StreamFlow**: Toggle window visibility
- **Picture-in-Picture**: Open floating PiP window
- **Check for Updates**: Manual update check
- **Quit**: Completely exit application
**User Experience**:
- Familiar Linux behavior: Minimize to tray
- Quick access: Launch from tray icon
- Workspace efficiency: Hide window without closing app
- Always accessible: Tray icon always visible
---
### 3. Offline Mode with Content Caching
**Implementation**: Local cache storage with TTL-based expiration using separate `electron-store` instance.
**Features**:
- Cache any content with custom key
- Configurable TTL (default: 24 hours)
- Automatic expiration check on retrieval
- Clear cache option
- Persistent storage across sessions
**Storage Location**: `~/.config/streamflow-desktop/offline-cache.json`
**API Methods** (exposed via preload.js):
```javascript
cacheContent(key, data) // Store content
getCachedContent(key, maxAge) // Retrieve if not expired
clearCache() // Clear all cached data
getOfflineMode() // Check if offline mode enabled
```
**Menu Options**:
- **Toggle Offline Mode**: Enable/disable caching (**File** menu)
- **Clear Offline Cache**: Remove all cached content (**File** menu)
**User Experience**:
- Seamless caching: Automatic background storage
- Smart expiration: Only valid content returned
- User control: Manual cache clearing
- Privacy: All data stored locally, encrypted
---
### 4. Picture-in-Picture Mode
**Implementation**: Floating always-on-top window for multitasking.
**Features**:
- 480x270 resolution (16:9 aspect ratio)
- Always on top of other windows
- Frameless design (minimal UI)
- Skip taskbar (doesn't clutter taskbar)
- Independent of main window
**Window Properties**:
```javascript
width: 480, height: 270
alwaysOnTop: true
frame: false
skipTaskbar: true
```
**Access Methods**:
- **View** → **Picture-in-Picture** (main menu)
- Tray menu → **Picture-in-Picture**
- Keyboard shortcut support (customizable)
**User Experience**:
- Multitasking: Watch while working
- Minimal distraction: Small, unobtrusive window
- Easy positioning: Drag to preferred screen location
- One-click close: Close button on PiP window
---
### 5. Chromecast Support
**Implementation**: Chromecast device discovery and media casting using `chromecast-api` package.
**Features**:
- Network-wide device discovery (5-second scan)
- Multiple device support
- Media URL casting
- Device list notification
**Discovery Process**:
1. User triggers scan via **Playback****Discover Chromecast Devices**
2. 5-second network scan for Chromecast devices
3. Notification shows number of devices found
4. Device list available for casting operations
**API Methods** (exposed via preload.js):
```javascript
discoverChromecast() // Scan for devices
castToDevice(deviceInfo, mediaUrl) // Cast media to device
onChromecastDevices(callback) // Listen for device list updates
```
**User Experience**:
- Quick discovery: 5-second scan
- Simple interface: One menu option to scan
- Transparent: Notification confirms device count
- Web app integration: Casting available in web interface
---
## Technical Implementation
### IPC Communication
All features use secure IPC (Inter-Process Communication) between main and renderer processes:
**Main Process** (`main.js`):
- Implements feature logic
- Handles IPC requests via `ipcMain.handle()`
- Sends events to renderer via `mainWindow.webContents.send()`
**Preload Script** (`preload.js`):
- Exposes IPC methods via `contextBridge.exposeInMainWorld()`
- Provides type-safe API to renderer process
- No direct Node.js access from renderer (security)
**Renderer Process**:
- Calls methods via `window.electronAPI.*`
- Receives events via registered callbacks
- Fully sandboxed (no Node.js access)
### Security
All features maintain security standards:
- ✅ Context isolation enabled
- ✅ Sandbox mode active
- ✅ No eval() or unsafe code execution
- ✅ Encrypted local storage
- ✅ HTTPS-only external connections
- ✅ Content Security Policy enforced
### Dependencies Added
```json
{
"electron-updater": "^6.1.7",
"chromecast-api": "^0.3.2"
}
```
### Files Modified
1. **src/main/main.js** (+400 lines):
- Added Tray and nativeImage imports
- Created `createTray()`, `createPipWindow()`, `toggleOfflineMode()`, `checkForUpdates()`, `discoverChromecastDevices()`
- Added offline cache functions: `cacheContent()`, `getCachedContent()`, `clearCache()`
- Added 10 new IPC handlers
- Updated application menu with new options
- Modified app lifecycle for tray persistence
2. **src/preload/preload.js** (+10 lines):
- Added 10 new methods to `electronAPI` object
- Added 3 event listener registrations
3. **package.json** (+2 dependencies):
- Added electron-updater
- Added chromecast-api
4. **CHANGELOG.md**: Moved features from "Planned" to "Added" in v1.1.0
5. **README.md**: Added documentation for all five features
---
## Testing Checklist
### System Tray
- [ ] Tray icon appears on app launch
- [ ] Tray icon displays app logo correctly
- [ ] "Show/Hide" toggles window visibility
- [ ] "Picture-in-Picture" opens PiP window
- [ ] "Check for Updates" triggers update check
- [ ] "Quit" exits application completely
- [ ] Window close minimizes to tray (doesn't quit)
- [ ] Clicking tray icon shows/hides window
### Auto-Update
- [ ] Update check runs 5 seconds after startup
- [ ] Manual check works from Help menu
- [ ] "Update available" dialog appears correctly
- [ ] Download progress shows percentage
- [ ] "Update downloaded" dialog prompts restart
- [ ] App restarts and installs update
- [ ] "No updates" message when up to date
### Picture-in-Picture
- [ ] PiP window opens from View menu
- [ ] PiP window opens from tray menu
- [ ] PiP window stays on top
- [ ] PiP window can be dragged
- [ ] PiP window close button works
- [ ] Close from View menu works
- [ ] PiP loads web content correctly
- [ ] Only one PiP window allowed at a time
### Offline Mode
- [ ] Toggle offline mode from File menu
- [ ] Notification shows "enabled/disabled" message
- [ ] Cached content persists across restarts
- [ ] Expired cache returns null
- [ ] Clear cache removes all data
- [ ] Cache storage file created correctly
- [ ] getCachedContent respects maxAge parameter
### Chromecast
- [ ] Device discovery starts from Playback menu
- [ ] 5-second scan completes successfully
- [ ] Notification shows device count
- [ ] Device list accurate (if devices present)
- [ ] No errors if no devices found
- [ ] Scan can be repeated multiple times
- [ ] Casting works (requires Chromecast device for full test)
---
## Build & Deployment
### Development Testing
```bash
cd /home/iulian/projects/tv/desktop-app
npm install
npm run dev
```
### Production Build
```bash
npm run build:appimage
```
Output: `dist/StreamFlow-1.1.0-x86_64.AppImage`
### Update Server Setup
For auto-updates to work, configure update server in `package.json`:
```json
{
"build": {
"publish": {
"provider": "github",
"owner": "your-username",
"repo": "streamflow-desktop"
}
}
}
```
Or use generic server:
```json
{
"build": {
"publish": {
"provider": "generic",
"url": "https://your-server.com/updates/"
}
}
}
```
---
## Future Enhancements
### Potential Improvements
- Keyboard shortcuts for all features
- Chromecast volume control
- Offline mode automatic sync
- PiP window resizing
- Multiple PiP windows
- Update rollback option
- Tray notification badges
- Download speed display in updates
- Scheduled update checks
### Additional Language Support
- French (fr)
- German (de)
- Spanish (es)
- Italian (it)
- Portuguese (pt)
---
## Conclusion
Version 1.1.0 significantly enhances StreamFlow Desktop with five major features that improve user experience, add modern conveniences, and maintain feature parity with contemporary desktop applications. All features are implemented with security best practices, proper error handling, and comprehensive user notifications.
**Total Lines Added**: ~500 lines of code
**Total Dependencies Added**: 2 packages
**Total Files Modified**: 5 files
**Testing Status**: Ready for QA testing
**Documentation**: Complete
---
**Next Steps**:
1. Install dependencies: `npm install`
2. Test all features in development mode: `npm run dev`
3. Build AppImage: `npm run build:appimage`
4. Distribute to users for beta testing
5. Collect feedback and iterate