Format js files

This commit is contained in:
Claudio Ortolina
2025-03-06 15:49:54 +00:00
parent 4e609465c3
commit 13add71066
2 changed files with 36 additions and 29 deletions
+19 -15
View File
@@ -16,27 +16,32 @@
// //
// Include phoenix_html to handle method=PUT/DELETE in forms and buttons. // Include phoenix_html to handle method=PUT/DELETE in forms and buttons.
import "phoenix_html" import "phoenix_html";
// Establish Phoenix Socket and LiveView configuration. // Establish Phoenix Socket and LiveView configuration.
import { Socket } from "phoenix" import { Socket } from "phoenix";
import { LiveSocket } from "phoenix_live_view" import { LiveSocket } from "phoenix_live_view";
import topbar from "../vendor/topbar" import topbar from "../vendor/topbar";
import BarcodeScannerHook from "./barcode-scanner" import BarcodeScannerHook from "./barcode-scanner";
let Hooks = {} let Hooks = {};
Hooks.BarcodeScanner = BarcodeScannerHook; Hooks.BarcodeScanner = BarcodeScannerHook;
let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") let csrfToken = document
.querySelector("meta[name='csrf-token']")
.getAttribute("content");
let liveSocket = new LiveSocket("/live", Socket, { let liveSocket = new LiveSocket("/live", Socket, {
longPollFallbackMs: 2500, longPollFallbackMs: 2500,
params: { _csrf_token: csrfToken }, params: { _csrf_token: csrfToken },
hooks: Hooks hooks: Hooks,
}) });
// Show progress bar on live navigation and form submits // Show progress bar on live navigation and form submits
topbar.config({ barColors: { 0: "#FD4F00" }, shadowColor: "rgba(0, 0, 0, .3)" }) topbar.config({
window.addEventListener("phx:page-loading-start", _info => topbar.show(300)) barColors: { 0: "#FD4F00" },
window.addEventListener("phx:page-loading-stop", _info => topbar.hide()) shadowColor: "rgba(0, 0, 0, .3)",
});
window.addEventListener("phx:page-loading-start", (_info) => topbar.show(300));
window.addEventListener("phx:page-loading-stop", (_info) => topbar.hide());
window.addEventListener("music_library:clipcopy", (event) => { window.addEventListener("music_library:clipcopy", (event) => {
if ("clipboard" in navigator) { if ("clipboard" in navigator) {
const text = event.target.textContent; const text = event.target.textContent;
@@ -50,11 +55,10 @@ window.addEventListener("music_library:scroll_top", (_event) => {
}); });
// connect if there are any LiveViews on the page // connect if there are any LiveViews on the page
liveSocket.connect() liveSocket.connect();
// expose liveSocket on window for web console debug logs and latency simulation: // expose liveSocket on window for web console debug logs and latency simulation:
// >> liveSocket.enableDebug() // >> liveSocket.enableDebug()
// >> liveSocket.enableLatencySim(1000) // enabled for duration of browser session // >> liveSocket.enableLatencySim(1000) // enabled for duration of browser session
// >> liveSocket.disableLatencySim() // >> liveSocket.disableLatencySim()
window.liveSocket = liveSocket window.liveSocket = liveSocket;
+17 -14
View File
@@ -7,7 +7,7 @@ const barcodeReaderSetup = async function () {
// make sure the formats are supported // make sure the formats are supported
formats: supportedFormats, formats: supportedFormats,
}); });
} };
export default { export default {
async mounted() { async mounted() {
@@ -17,16 +17,18 @@ export default {
const constraints = { const constraints = {
audio: false, audio: false,
video: { video: {
width: 800, height: 600, facingMode: { width: 800,
ideal: "environment" height: 600,
} facingMode: {
ideal: "environment",
},
}, },
}; };
this.el.addEventListener("camera_request", () => { this.el.addEventListener("camera_request", () => {
navigator.mediaDevices navigator.mediaDevices
.getUserMedia(constraints) .getUserMedia(constraints)
.then((mediaStream) => { .then((mediaStream) => {
console.debug("Camera access allowed") console.debug("Camera access allowed");
this.pushEventTo(this.el, "camera_allowed", {}); this.pushEventTo(this.el, "camera_allowed", {});
this.cameraPreview.srcObject = mediaStream; this.cameraPreview.srcObject = mediaStream;
this.cameraPreview.onloadedmetadata = () => { this.cameraPreview.onloadedmetadata = () => {
@@ -35,26 +37,27 @@ export default {
const barcodes = await barcodeDetector.detect(this.cameraPreview); const barcodes = await barcodeDetector.detect(this.cameraPreview);
if (barcodes.length <= 0) return; if (barcodes.length <= 0) return;
barcodes.forEach(barcode => { barcodes.forEach((barcode) => {
if (!detectedBarcodes.has(barcode.rawValue)) { if (!detectedBarcodes.has(barcode.rawValue)) {
this.pushEventTo(this.el, "barcode_scanned", { number: barcode.rawValue }); this.pushEventTo(this.el, "barcode_scanned", {
number: barcode.rawValue,
});
detectedBarcodes.add(barcode.rawValue); detectedBarcodes.add(barcode.rawValue);
}; }
}); });
}, 500) }, 500);
}; };
}) })
.catch((err) => { .catch((err) => {
console.error(`${err.name}: ${err.message}`); console.error(`${err.name}: ${err.message}`);
this.pushEventTo(this.el, "camera_denied", {}); this.pushEventTo(this.el, "camera_denied", {});
}); });
}) });
}, },
destroyed() { destroyed() {
if (this.cameraPreview.srcObject) { if (this.cameraPreview.srcObject) {
this.cameraPreview.srcObject.getTracks().forEach(track => track.stop()); this.cameraPreview.srcObject.getTracks().forEach((track) => track.stop());
window.clearInterval(this.scanInterval); window.clearInterval(this.scanInterval);
} }
} },
} };