Merge branch 'Dev2' of https://git.pstw.com.my/catalyx/PSTW_CentralizeSystem into Dev2
This commit is contained in:
commit
291d4dabdb
@ -41,12 +41,13 @@
|
|||||||
|
|
||||||
<div id="registerItem" v-if="displayStatus == null" data-aos="fade-right">
|
<div id="registerItem" v-if="displayStatus == null" data-aos="fade-right">
|
||||||
<p style="text-align:center; padding:10px;">Scan QR Code Here:</p>
|
<p style="text-align:center; padding:10px;">Scan QR Code Here:</p>
|
||||||
|
|
||||||
<qrcode-stream :constraints="selectedConstraints"
|
<qrcode-stream :constraints="selectedConstraints"
|
||||||
:formats="['qr_code']"
|
:formats="['qr_code']"
|
||||||
:track="trackFunctionSelected.value"
|
:track="trackFunctionSelected.value"
|
||||||
v-on:camera-on="onCameraReady"
|
v-on:camera-on="onCameraReady"
|
||||||
v-on:detect="onDecode"
|
v-on:detect="onDecode"
|
||||||
v-on:error="onError">
|
v-on:error="onError">
|
||||||
</qrcode-stream>
|
</qrcode-stream>
|
||||||
|
|
||||||
<p class="error">{{ error }}</p>
|
<p class="error">{{ error }}</p>
|
||||||
@ -399,17 +400,7 @@
|
|||||||
qrCodeResult: null,
|
qrCodeResult: null,
|
||||||
debounceTimeout: null,
|
debounceTimeout: null,
|
||||||
error: "",
|
error: "",
|
||||||
selectedConstraints: {
|
selectedConstraints: { facingMode: "user" },
|
||||||
video: {
|
|
||||||
facingMode: 'user', // Kamera belakang
|
|
||||||
focusDistance: { min: 0.05, ideal: 0.12, max: 0.3 },
|
|
||||||
width: { min: 1920, ideal: 1920 },
|
|
||||||
height: { min: 1080, ideal: 1080 },
|
|
||||||
sharpness: 100,
|
|
||||||
framerate: 60,
|
|
||||||
focusMode: "continuous", // Auto-focus
|
|
||||||
}
|
|
||||||
},
|
|
||||||
trackFunctionSelected: { text: 'outline', value: null },
|
trackFunctionSelected: { text: 'outline', value: null },
|
||||||
barcodeFormats: {
|
barcodeFormats: {
|
||||||
qr_code: true, // Hanya mendukung QR Code
|
qr_code: true, // Hanya mendukung QR Code
|
||||||
@ -422,6 +413,8 @@
|
|||||||
],
|
],
|
||||||
videoInputDevices: [],
|
videoInputDevices: [],
|
||||||
selectedCameraId: null,
|
selectedCameraId: null,
|
||||||
|
scanStartTime: null,
|
||||||
|
scanTime: null
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
@ -735,30 +728,51 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
//Setting Camera to know that camera are turn on or not
|
//Setting Camera to know that camera are turn on or not
|
||||||
async onCameraReady() {
|
async onCameraReady(videoElement) {
|
||||||
this.enableAutoFocus();
|
|
||||||
},
|
|
||||||
|
|
||||||
async enableAutoFocus() {
|
const video = document.querySelector("video");
|
||||||
const devices = await navigator.mediaDevices.enumerateDevices();
|
|
||||||
this.videoInputDevices = devices.filter(device => device.kind === 'videoinput');
|
|
||||||
|
|
||||||
if (this.videoInputDevices.length > 0) {
|
const track = video.srcObject.getVideoTracks()[0];
|
||||||
// Keep the selected camera if already chosen
|
|
||||||
if (!this.selectedCameraId) {
|
if (track && track.getCapabilities) {
|
||||||
this.selectedCameraId = this.videoInputDevices[0].deviceId;
|
const capabilities = track.getCapabilities(); // Get camera capabilities
|
||||||
|
|
||||||
|
if (capabilities.sharpness) {
|
||||||
|
track.applyConstraints({
|
||||||
|
advanced: [{ width: 1280, height: 720 }]
|
||||||
|
}).then(() => {
|
||||||
|
|
||||||
|
// Step 2: Apply sharpness separately
|
||||||
|
return track.applyConstraints({ advanced: [{ sharpness: 10 }] });
|
||||||
|
}).then(() => {
|
||||||
|
|
||||||
|
return track.applyConstraints({ advanced: [{ exposureMode: 'continuous' }] });
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
}).catch(err => console.error("Failed to apply constraints:", err));
|
||||||
|
|
||||||
|
} else {
|
||||||
|
console.warn("⚠️ Sharpness not supported on this camera");
|
||||||
}
|
}
|
||||||
|
|
||||||
this.selectedConstraints = { deviceId: { exact: this.selectedCameraId } };
|
|
||||||
} else {
|
|
||||||
this.error = "No camera detected.";
|
|
||||||
}
|
}
|
||||||
const stream = await navigator.mediaDevices.getUserMedia({ video: true });
|
|
||||||
const track = stream.getVideoTracks()[0];
|
|
||||||
const capabilities = track.getCapabilities();
|
try {
|
||||||
console.log(capabilities);
|
const devices = await navigator.mediaDevices.enumerateDevices();
|
||||||
if (capabilities.focusMode) {
|
this.videoInputDevices = devices.filter(device => device.kind === 'videoinput');
|
||||||
await track.applyConstraints({ focusMode: "continuous" }); // Auto-focus
|
|
||||||
|
if (this.videoInputDevices.length > 0) {
|
||||||
|
// Keep the selected camera if already chosen
|
||||||
|
if (!this.selectedCameraId) {
|
||||||
|
this.selectedCameraId = this.videoInputDevices[0].deviceId;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.selectedConstraints = { deviceId: { exact: this.selectedCameraId } };
|
||||||
|
} else {
|
||||||
|
this.error = "No camera detected.";
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
this.error = "Error accessing camera: " + err.message;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user