From 4d35a08f18f1271745d6672d32b854f1fe2e115e Mon Sep 17 00:00:00 2001 From: yashrajbharti Date: Wed, 12 Jun 2024 16:51:08 +0530 Subject: [PATCH] fix --- js/stream.mjs | 7 +++++-- style.css | 3 ++- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/js/stream.mjs b/js/stream.mjs index 9357bce..cd63cea 100644 --- a/js/stream.mjs +++ b/js/stream.mjs @@ -19,6 +19,7 @@ export const streamWebCamVideo = (isFrontCamera = true) => { const capabilities = track.getCapabilities(); const settings = track.getSettings(); + const input = document.querySelector('input[type="range"]'); // Check whether zoom is supported or not. @@ -32,13 +33,15 @@ export const streamWebCamVideo = (isFrontCamera = true) => { input.step = capabilities.zoom.step; input.value = settings.zoom; - document.querySelector(".zoom-multiplier").textContent = "0x 0.25x 0.75x 10x" + document.querySelector(".zoom-multiplier").textContent = `${capabilities.zoom.min + } ${(capabilities.zoom.max + 3 * capabilities.zoom.min) / 4} ${(3 * capabilities.zoom.max + capabilities.zoom.min) / 4} ${capabilities.zoom.max}` + console.log("min:", capabilities.zoom.min) console.log("max:", capabilities.zoom.max) console.log("step:", capabilities.zoom.step) console.log("value:", settings.zoom) - + input.oninput = function (event) { track.applyConstraints({ advanced: [{ zoom: event.target.value }] }); diff --git a/style.css b/style.css index 4bbaf85..2ca2ad3 100644 --- a/style.css +++ b/style.css @@ -209,6 +209,7 @@ video.flip { inset-block-start: 75vh; display: flex; justify-content: center; + word-spacing: 15px; visibility: hidden; } .zoom-multiplier{ @@ -216,7 +217,7 @@ video.flip { inline-size: max-content; color: #fff; font-size: 10px; - translate: 0 20px; + translate: 0 18px; } .range-container img{ position: absolute;