|
|
@ -2,10 +2,13 @@ |
|
|
|
|
|
|
|
## Overview |
|
|
|
|
|
|
|
This document describes how camera functionality is implemented across the TimeSafari application. The application uses cameras for two main purposes: |
|
|
|
This document describes how camera functionality is implemented across the TimeSafari application. The application uses cameras for several purposes: |
|
|
|
|
|
|
|
1. QR Code scanning |
|
|
|
2. Photo capture |
|
|
|
1. QR Code scanning for contact sharing and verification |
|
|
|
2. Photo capture for gift records |
|
|
|
3. Profile photo management |
|
|
|
4. Shared photo handling |
|
|
|
5. Image upload and processing |
|
|
|
|
|
|
|
## Components |
|
|
|
|
|
|
@ -40,6 +43,28 @@ Component for photo capture and selection. |
|
|
|
- File selection fallback |
|
|
|
- Unified interface for different platforms |
|
|
|
|
|
|
|
### ImageMethodDialog.vue |
|
|
|
|
|
|
|
Component for selecting image input method. |
|
|
|
|
|
|
|
**Key Features:** |
|
|
|
- Multiple input methods (camera, file upload, URL) |
|
|
|
- Unified interface for image selection |
|
|
|
- Integration with PhotoDialog for processing |
|
|
|
- Support for image cropping |
|
|
|
- URL-based image handling |
|
|
|
|
|
|
|
### SharedPhotoView.vue |
|
|
|
|
|
|
|
Component for handling shared photos. |
|
|
|
|
|
|
|
**Key Features:** |
|
|
|
- Processes incoming shared photos |
|
|
|
- Options to use photo for gifts or profile |
|
|
|
- Image preview and confirmation |
|
|
|
- Server upload integration |
|
|
|
- Temporary storage management |
|
|
|
|
|
|
|
## Services |
|
|
|
|
|
|
|
### QRScanner Services |
|
|
@ -98,6 +123,72 @@ Desktop implementation (currently unimplemented). |
|
|
|
- Camera functionality not yet implemented |
|
|
|
- Planned to use Electron's media APIs |
|
|
|
|
|
|
|
## Camera Usage Scenarios |
|
|
|
|
|
|
|
### Gift Photo Capture |
|
|
|
|
|
|
|
**Implementation:** |
|
|
|
- Uses PhotoDialog for capture/selection |
|
|
|
- Supports multiple input methods |
|
|
|
- Optional image cropping |
|
|
|
- Server upload with authentication |
|
|
|
- Integration with gift records |
|
|
|
|
|
|
|
**Flow:** |
|
|
|
1. User initiates photo capture from gift details |
|
|
|
2. ImageMethodDialog presents input options |
|
|
|
3. PhotoDialog handles capture/selection |
|
|
|
4. Image is processed and uploaded |
|
|
|
5. URL is attached to gift record |
|
|
|
|
|
|
|
### Profile Photo Management |
|
|
|
|
|
|
|
**Implementation:** |
|
|
|
- Uses same PhotoDialog component |
|
|
|
- Enforces square aspect ratio |
|
|
|
- Requires image cropping |
|
|
|
- Updates user profile settings |
|
|
|
- Handles profile image updates |
|
|
|
|
|
|
|
**Flow:** |
|
|
|
1. User initiates profile photo update |
|
|
|
2. PhotoDialog opens with cropping enabled |
|
|
|
3. Image is captured/selected |
|
|
|
4. User crops to square aspect ratio |
|
|
|
5. Image is uploaded and profile updated |
|
|
|
|
|
|
|
### Shared Photo Processing |
|
|
|
|
|
|
|
**Implementation:** |
|
|
|
- Handles incoming shared photos |
|
|
|
- Temporary storage in IndexedDB |
|
|
|
- Options for photo usage |
|
|
|
- Server upload integration |
|
|
|
- Cleanup after processing |
|
|
|
|
|
|
|
**Flow:** |
|
|
|
1. Photo is shared to application |
|
|
|
2. Stored temporarily in IndexedDB |
|
|
|
3. SharedPhotoView presents options |
|
|
|
4. User chooses usage (gift/profile) |
|
|
|
5. Image is processed accordingly |
|
|
|
|
|
|
|
### Image Upload and Processing |
|
|
|
|
|
|
|
**Implementation:** |
|
|
|
- Secure server upload |
|
|
|
- Authentication handling |
|
|
|
- Image format standardization |
|
|
|
- Error handling and retry |
|
|
|
- Progress feedback |
|
|
|
|
|
|
|
**Flow:** |
|
|
|
1. Image is prepared for upload |
|
|
|
2. Authentication token is obtained |
|
|
|
3. Multipart form data is created |
|
|
|
4. Upload progress is monitored |
|
|
|
5. Server URL is returned |
|
|
|
|
|
|
|
## Platform-Specific Considerations |
|
|
|
|
|
|
|
### iOS |
|
|
|