Remove deprecated on determining camera on browser chrome/firefox implementations

.env.example

@@ -300,12 +300,11 @@ PUSHER_APP_CLUSTER=mt1
 MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
 MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
 
-MARHUN_CAMERAS_CHROME = "Doccamera"
-MARHUN_CAMERAS_FIREFOX = "jSsq68fCLg2guCV2FaFzvXXiKBqbPA25DaQAWWotfqY="
+MARHUN_CAMERAS = "Doccamera"
 
 WABOT_API=https://md.wabot.my/api/send.php
 WABOT_INSTANCES_ID=63C26B7AAD21A
 WABOT_TOKEN_KEYS=cbee7e95cf3ffbfa0531d5fddfd44f87
 
 # for config STORAGE_DIRECTORY, set value without slash at the end
-# STORAGE_DIRECTORY=/Users/UTM/Sites/lelong/storage
+# STORAGE_DIRECTORY=/Users/UTM/Sites/lelong/storage

config/marhun_camera.php

@@ -1,6 +1,5 @@
 <?php
 
 return [
-    'marhun_cameras_chrome' => array_map(fn ($camera_label) => trim($camera_label), explode(',', env('MARHUN_CAMERAS_CHROME'))) ?? 'Doccamera',
-    'marhun_cameras_firefox' => array_map(fn ($camera_label) => trim($camera_label), explode(',', env('MARHUN_CAMERAS_FIREFOX'))) ?? "jSsq68fCLg2guCV2FaFzvXXiKBqbPA25DaQAWWotfqY="
+    'cameras' => array_map(fn ($camera_label) => trim($camera_label), explode(',', env('MARHUN_CAMERAS'))) ?? 'Doccamera',
 ];

public/js/marhun-photo-capture.js

@@ -27,8 +27,8 @@ function marhunPhotoCapturerFactory(modal_selector) {
 
                         let isfirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
                         if (isfirefox) {
-                            canvas.width = 1280;
-                            canvas.height = 720;
+                            canvas.width = 1920;
+                            canvas.height = 1080;
                         }
 
 
@@ -99,7 +99,6 @@ function marhunPhotoCapturerFactory(modal_selector) {
         getCamera: function () {
             function getCameraList() {
                 let getUserMedia = () => navigator.mediaDevices.getUserMedia({ video: { width: 3256, height: 2440 } });
-
                 let enumerateDevices = () => navigator.mediaDevices.enumerateDevices()
                     .then(devices => devices.filter(x => x.kind === 'videoinput'))
                 getUserMedia();
@@ -128,12 +127,17 @@ function marhunPhotoCapturerFactory(modal_selector) {
 
                 });
 
-                const filteredCameraChrome = available_cameras.filter(camera => {
-                    return marhun_camera_config_chrome.includes(camera.label);
+                let isfirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
+                if (isfirefox) {
+                    return available_cameras.slice(-1);
+                }
+
+                const filteredCamera = available_cameras.filter(camera => {
+                    return marhun_camera_config.includes(camera.label);
                 })
 
                 // Get the first available priority referencing to env
-                return filteredCameraChrome.at(-1);
+                return filteredCamera.at(-1);
             }
 
             function selectCamera(listOfCameras) {
@@ -150,17 +154,11 @@ function marhunPhotoCapturerFactory(modal_selector) {
                 let constraints = null;
 
                 constraints = {
-                    width: { exact: 3200 },
-                    height: { exact: 1800 },
+                    width: { min: 1280, ideal:  3200, max: 3200},
+                    height: { min: 720, ideal: 1800, max: 1800 },
+                    frameRate: 30,
                 };
 
-                let isfirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
-                if (isfirefox) {
-                    constraints = {
-                        width: { exact: 1280 },
-                        height: { exact: 720 },
-                    };
-                }
 
                 if (camera.deviceId !== '') {
                     constraints.deviceId = { exact: camera.deviceId };
@@ -168,10 +166,17 @@ function marhunPhotoCapturerFactory(modal_selector) {
 
                 }
 
+                if (camera.groupId !== '') {
+                    constraints.groupId = { exact: camera.groupId };
+                    return navigator.mediaDevices.getUserMedia({ video: constraints });
+
+                }
+
             }
 
             return getCameraList()
                 .then(selectCamera)
+                .then(x => { console.log(x); return x; })
                 .then(composeConstraint);
 
         },

resources/views/marhun/marhun.blade.php

@@ -7,8 +7,7 @@
     <script src="{{ asset('js/marhun-photo-capture-debugger.js') }}"></script>
     <script src="{{ asset('js/marhun-photo-viewer.js') }}"></script>
     <script>
-        var marhun_camera_config_chrome = @json(config('marhun_camera.marhun_cameras_chrome'));
-        var marhun_camera_config_firefox= @json(config('marhun_camera.marhun_cameras_firefox'));
+        var marhun_camera_config = @json(config('marhun_camera.cameras'));
         let modalOverallPhotoCapture = new marhunPhotoCapturerFactory('#modaloverallphoto-capture');
         let modalOverallPhotoCaptureUpdate = new marhunPhotoCapturerFactory('#modaloverallphoto-capture-update');
         let modalOverallPhotoCapturePerMarhun = new marhunPhotoCapturerFactory('#modalpermarhunphoto-capture');