@jaak.ai/stamps 2.0.0-dev.53 → 2.0.0-dev.55

package/dist/esm/jaak-stamps.entry.js

@@ -199,6 +199,7 @@ class CameraService {
     deviceType = 'desktop';
     preferredCameraFacing = null;
     preferredCamera = 'auto';
+    isManuallySelected = false;
     constructor(logger, eventBus, preferredCamera = 'auto') {
         this.logger = logger;
         this.eventBus = eventBus;
@@ -245,6 +246,11 @@ class CameraService {
                 }))
             });
             this.setInitialCameraPreference();
+            this.logger.state('PREFERENCIA_INICIAL_APLICADA', {
+                selectedCameraId: this.selectedCameraId,
+                preferredCameraFacing: this.preferredCameraFacing,
+                preferredCamera: this.preferredCamera
+            });
             this.eventBus.emit('camera-changed', this.selectedCameraId);
             return this.availableCameras;
         }
@@ -270,6 +276,7 @@ class CameraService {
         }
         this.selectedCameraId = cameraId;
         this.updatePreferredFacing(camera);
+        this.isManuallySelected = true; // Mark as manually selected
         this.savePreference();
         this.eventBus.emit('camera-changed', cameraId);
     }
@@ -277,12 +284,31 @@ class CameraService {
         return this.preferredCameraFacing;
     }
     async setupCamera(constraints) {
-        const finalConstraints = constraints || await this.getMaxResolution();
-        const stream = await navigator.mediaDevices.getUserMedia({
-            video: finalConstraints,
-            audio: false
-        });
-        return stream;
+        try {
+            const finalConstraints = constraints || await this.getMaxResolution();
+            const stream = await navigator.mediaDevices.getUserMedia({
+                video: finalConstraints,
+                audio: false
+            });
+            return stream;
+        }
+        catch (error) {
+            this.logger.error('Error en setupCamera, intentando con restricciones básicas:', error);
+            // Fallback to basic constraints if getMaxResolution fails
+            const basicConstraints = {
+                width: { ideal: 1280 },
+                height: { ideal: 720 }
+            };
+            // Only add facingMode if not on desktop to avoid OverconstrainedError
+            if (this.deviceType !== 'desktop' && this.preferredCameraFacing) {
+                basicConstraints.facingMode = this.preferredCameraFacing;
+            }
+            this.logger.state('USANDO_RESTRICCIONES_BASICAS', { constraints: basicConstraints });
+            return await navigator.mediaDevices.getUserMedia({
+                video: basicConstraints,
+                audio: false
+            });
+        }
     }
     async switchCamera(cameraId) {
         const selectedCamera = this.availableCameras.find(cam => cam.deviceId === cameraId);
@@ -294,7 +320,8 @@ class CameraService {
         await this.setSelectedCamera(cameraId);
         this.logger.state('CAMARA_CAMBIADA', {
             label: selectedCamera.label,
-            deviceId: selectedCamera.deviceId
+            deviceId: selectedCamera.deviceId,
+            isManuallySelected: this.isManuallySelected
         });
     }
     async flipToNextCamera() {
@@ -376,6 +403,13 @@ class CameraService {
     setInitialCameraPreference() {
         if (this.availableCameras.length === 0)
             return;
+        // Clear any existing localStorage preferences to ensure fresh start
+        localStorage.removeItem('jaak-stamps-camera-preference');
+        this.logger.state('APLICANDO_PREFERENCIA_INICIAL', {
+            preferredCamera: this.preferredCamera,
+            availableCamerasCount: this.availableCameras.length
+        });
+        this.isManuallySelected = false; // Reset manual selection flag
         if (this.preferredCamera === 'front') {
             this.selectFrontCamera();
         }
@@ -388,23 +422,56 @@ class CameraService {
     }
     selectFrontCamera() {
         this.preferredCameraFacing = 'user';
-        const frontCamera = this.availableCameras.find(camera => camera.label.toLowerCase().includes('front') ||
-            camera.label.toLowerCase().includes('user') ||
-            camera.label.toLowerCase().includes('selfie') ||
-            !camera.label.toLowerCase().includes('back') && !camera.label.toLowerCase().includes('rear'));
+        this.logger.state('BUSCANDO_CAMARA_FRONTAL', {
+            availableCameras: this.availableCameras.map(cam => ({
+                id: cam.deviceId,
+                label: cam.label
+            }))
+        });
+        const frontCamera = this.availableCameras.find(camera => {
+            const label = camera.label.toLowerCase();
+            return label.includes('front') ||
+                label.includes('user') ||
+                label.includes('selfie') ||
+                label.includes('frontal') ||
+                (!label.includes('back') && !label.includes('rear') && !label.includes('environment'));
+        });
+        // If not found, use the first camera (usually front on mobile)
         this.selectedCameraId = frontCamera ? frontCamera.deviceId : this.availableCameras[0].deviceId;
         this.logger.state('CAMARA_FRONTAL_SELECCIONADA', {
+            found: !!frontCamera,
             label: frontCamera?.label || this.availableCameras[0].label,
             deviceId: this.selectedCameraId
         });
     }
     selectBackCamera() {
         this.preferredCameraFacing = 'environment';
-        const backCamera = this.availableCameras.find(camera => camera.label.toLowerCase().includes('back') ||
-            camera.label.toLowerCase().includes('rear') ||
-            camera.label.toLowerCase().includes('environment'));
+        this.logger.state('BUSCANDO_CAMARA_TRASERA', {
+            availableCameras: this.availableCameras.map(cam => ({
+                id: cam.deviceId,
+                label: cam.label
+            }))
+        });
+        // Try to find rear camera with multiple detection methods
+        let backCamera = this.availableCameras.find(camera => {
+            const label = camera.label.toLowerCase();
+            return label.includes('back') ||
+                label.includes('rear') ||
+                label.includes('environment') ||
+                label.includes('trasera') ||
+                label.includes('posterior');
+        });
+        // If not found by label, try to use the last camera (usually rear on mobile)
+        if (!backCamera && this.availableCameras.length > 1) {
+            backCamera = this.availableCameras[this.availableCameras.length - 1];
+            this.logger.state('USANDO_ULTIMA_CAMARA_COMO_TRASERA', {
+                label: backCamera.label,
+                deviceId: backCamera.deviceId
+            });
+        }
         this.selectedCameraId = backCamera ? backCamera.deviceId : this.availableCameras[0].deviceId;
         this.logger.state('CAMARA_TRASERA_SELECCIONADA', {
+            found: !!backCamera,
             label: backCamera?.label || this.availableCameras[0].label,
             deviceId: this.selectedCameraId
         });
@@ -415,8 +482,10 @@ class CameraService {
             this.logger.state('CAMARA_AUTO_SELECCIONADA_MOBILE', { type: 'rear' });
         }
         else {
-            this.selectedCameraId = this.availableCameras[0].deviceId;
+            // For desktop, prefer front camera (usually built-in webcam)
+            this.selectFrontCamera();
             this.logger.state('CAMARA_AUTO_SELECCIONADA_DESKTOP', {
+                type: 'front',
                 label: this.availableCameras[0].label,
                 deviceId: this.selectedCameraId
             });
@@ -430,15 +499,60 @@ class CameraService {
     }
     async getMaxResolution() {
         try {
+            // Ensure device type is detected before determining constraints
+            if (!this.deviceType || this.deviceType === 'desktop') {
+                await this.detectDeviceType();
+            }
             const videoConstraints = {};
-            if (this.selectedCameraId) {
+            this.logger.state('CONFIGURANDO_CONSTRAINS_CAMARA', {
+                selectedCameraId: this.selectedCameraId,
+                preferredCameraFacing: this.preferredCameraFacing,
+                preferredCamera: this.preferredCamera,
+                deviceType: this.deviceType,
+                isManuallySelected: this.isManuallySelected
+            });
+            if (this.isManuallySelected && this.selectedCameraId) {
+                // When manually selected, use deviceId for exact camera selection
                 videoConstraints.deviceId = { exact: this.selectedCameraId };
+                this.logger.state('USANDO_CAMARA_MANUAL', {
+                    deviceId: this.selectedCameraId
+                });
             }
             else if (this.preferredCameraFacing) {
-                videoConstraints.facingMode = this.preferredCameraFacing;
+                // Use facingMode for initial preference-based selection
+                // Use 'ideal' instead of 'exact' to avoid OverconstrainedError on desktop
+                const facingConstraint = this.deviceType === 'desktop'
+                    ? { ideal: this.preferredCameraFacing }
+                    : { exact: this.preferredCameraFacing };
+                videoConstraints.facingMode = facingConstraint;
+                this.logger.state('USANDO_FACING_CONSTRAINT', {
+                    facingMode: this.preferredCameraFacing,
+                    constraintType: this.deviceType === 'desktop' ? 'ideal' : 'exact'
+                });
+            }
+            else if (this.selectedCameraId) {
+                videoConstraints.deviceId = { exact: this.selectedCameraId };
+                this.logger.state('USANDO_CAMARA_SELECCIONADA', {
+                    deviceId: this.selectedCameraId
+                });
             }
             else {
-                videoConstraints.facingMode = "environment";
+                // Use preferredCamera setting to determine default facing mode
+                if (this.preferredCamera === 'front') {
+                    videoConstraints.facingMode = "user";
+                }
+                else if (this.preferredCamera === 'back') {
+                    videoConstraints.facingMode = "environment";
+                }
+                else {
+                    // Auto mode: use environment for mobile/tablet, user for desktop
+                    videoConstraints.facingMode = (this.deviceType === 'mobile' || this.deviceType === 'tablet') ? "environment" : "user";
+                }
+                this.logger.state('USANDO_PREFERENCIA_CONFIGURADA', {
+                    facingMode: videoConstraints.facingMode,
+                    preferredCamera: this.preferredCamera,
+                    deviceType: this.deviceType
+                });
             }
             const tempStream = await navigator.mediaDevices.getUserMedia({
                 video: videoConstraints
@@ -470,6 +584,10 @@ class CameraService {
         }
         catch (err) {
             this.logger.warn('No se pudieron obtener capacidades de cámara, usando configuración de respaldo');
+            // Ensure device type is detected before determining constraints
+            if (!this.deviceType || this.deviceType === 'desktop') {
+                await this.detectDeviceType();
+            }
             const isTablet = /iPad|Android/i.test(navigator.userAgent) && window.innerWidth >= 768;
             const fallbackConstraints = {
                 width: { ideal: isTablet ? 1280 : 1920 },
@@ -477,14 +595,33 @@ class CameraService {
             };
             // Apply basic focus settings even for fallback
             this.applyBasicFocusSettings(fallbackConstraints);
-            if (this.selectedCameraId) {
+            if (this.isManuallySelected && this.selectedCameraId) {
+                // When manually selected, use deviceId for exact camera selection
                 fallbackConstraints.deviceId = { exact: this.selectedCameraId };
             }
             else if (this.preferredCameraFacing) {
-                fallbackConstraints.facingMode = this.preferredCameraFacing;
+                // Use facingMode for initial preference-based selection
+                // Use 'ideal' instead of 'exact' to avoid OverconstrainedError on desktop
+                const facingConstraint = this.deviceType === 'desktop'
+                    ? { ideal: this.preferredCameraFacing }
+                    : { exact: this.preferredCameraFacing };
+                fallbackConstraints.facingMode = facingConstraint;
+            }
+            else if (this.selectedCameraId) {
+                fallbackConstraints.deviceId = { exact: this.selectedCameraId };
             }
             else {
-                fallbackConstraints.facingMode = "environment";
+                // Use preferredCamera setting to determine default facing mode
+                if (this.preferredCamera === 'front') {
+                    fallbackConstraints.facingMode = "user";
+                }
+                else if (this.preferredCamera === 'back') {
+                    fallbackConstraints.facingMode = "environment";
+                }
+                else {
+                    // Auto mode: use environment for mobile/tablet, user for desktop
+                    fallbackConstraints.facingMode = (this.deviceType === 'mobile' || this.deviceType === 'tablet') ? "environment" : "user";
+                }
             }
             return fallbackConstraints;
         }