You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
163 lines
3.7 KiB
163 lines
3.7 KiB
# Camera Implementation Documentation
|
|
|
|
## Overview
|
|
|
|
This document describes how camera functionality is implemented across the
|
|
TimeSafari application. The application uses cameras for two main purposes:
|
|
|
|
1. QR Code scanning
|
|
|
|
2. Photo capture
|
|
|
|
## Components
|
|
|
|
### QRScannerDialog.vue
|
|
|
|
Primary component for QR code scanning in web browsers.
|
|
|
|
**Key Features:**
|
|
|
|
- Uses `qrcode-stream` for web-based QR scanning
|
|
|
|
- Supports both front and back cameras
|
|
|
|
- Provides real-time camera status feedback
|
|
|
|
- Implements error handling with user-friendly messages
|
|
|
|
- Includes camera switching functionality
|
|
|
|
**Camera Access Flow:**
|
|
|
|
1. Checks for camera API availability
|
|
|
|
2. Enumerates available video devices
|
|
|
|
3. Requests camera permissions
|
|
|
|
4. Initializes camera stream with preferred settings
|
|
|
|
5. Handles various error conditions with specific messages
|
|
|
|
### PhotoDialog.vue
|
|
|
|
Component for photo capture and selection.
|
|
|
|
**Key Features:**
|
|
|
|
- Cross-platform photo capture interface
|
|
|
|
- Image cropping capabilities
|
|
|
|
- File selection fallback
|
|
|
|
- Unified interface for different platforms
|
|
|
|
## Services
|
|
|
|
### QRScanner Services
|
|
|
|
#### WebDialogQRScanner
|
|
|
|
Web-based implementation of QR scanning.
|
|
|
|
**Key Methods:**
|
|
|
|
- `checkPermissions()`: Verifies camera permission status
|
|
|
|
- `requestPermissions()`: Requests camera access
|
|
|
|
- `isSupported()`: Checks for camera API support
|
|
|
|
- Handles various error conditions with specific messages
|
|
|
|
#### CapacitorQRScanner
|
|
|
|
Native implementation using Capacitor's MLKit.
|
|
|
|
**Key Features:**
|
|
|
|
- Uses `@capacitor-mlkit/barcode-scanning`
|
|
|
|
- Supports both front and back cameras
|
|
|
|
- Implements permission management
|
|
|
|
- Provides continuous scanning capability
|
|
|
|
### Platform Services
|
|
|
|
#### WebPlatformService
|
|
|
|
Web-specific implementation of platform features.
|
|
|
|
**Camera Capabilities:**
|
|
|
|
- Uses HTML5 file input with capture attribute
|
|
|
|
- Falls back to file selection if camera unavailable
|
|
|
|
- Processes captured images for consistent format
|
|
|
|
#### CapacitorPlatformService
|
|
|
|
Native implementation using Capacitor.
|
|
|
|
**Camera Features:**
|
|
|
|
- Uses `Camera.getPhoto()` for native camera access
|
|
|
|
- Supports image editing
|
|
|
|
- Configures high-quality image capture
|
|
|
|
- Handles base64 image processing
|
|
|
|
#### ElectronPlatformService
|
|
|
|
Desktop implementation (currently unimplemented).
|
|
|
|
---
|
|
|
|
**See also**:
|
|
|
|
- `.cursor/rules/features/camera_technical.mdc` for
|
|
|
|
detailed technical implementation
|
|
|
|
- `.cursor/rules/features/camera_platforms.mdc` for platform-specific details
|
|
|
|
**Status**: Active camera implementation overview
|
|
**Priority**: Medium
|
|
**Estimated Effort**: Ongoing reference
|
|
**Dependencies**: None
|
|
**Stakeholders**: Development team, Camera feature team
|
|
|
|
- iOS and Android devices
|
|
|
|
- Desktop platforms
|
|
|
|
- Various network conditions
|
|
|
|
## Model Implementation Checklist
|
|
|
|
### Before Camera Implementation
|
|
|
|
- [ ] **Platform Analysis**: Understand camera requirements across all platforms
|
|
- [ ] **Feature Planning**: Plan QR scanning and photo capture features
|
|
- [ ] **Service Planning**: Plan camera service architecture
|
|
- [ ] **Testing Strategy**: Plan testing across web, mobile, and desktop
|
|
|
|
### During Camera Implementation
|
|
|
|
- [ ] **Component Development**: Implement QRScannerDialog and PhotoDialog
|
|
- [ ] **Service Implementation**: Implement platform-specific camera services
|
|
- [ ] **Permission Handling**: Implement proper camera permission management
|
|
- [ ] **Error Handling**: Implement graceful error handling for camera failures
|
|
|
|
### After Camera Implementation
|
|
|
|
- [ ] **Cross-Platform Testing**: Test camera functionality across all platforms
|
|
- [ ] **Feature Validation**: Verify QR scanning and photo capture work correctly
|
|
- [ ] **Performance Testing**: Ensure camera performance meets requirements
|
|
- [ ] **Documentation Update**: Update camera implementation documentation
|
|
|