Format js files
This commit is contained in:
+19
-15
@@ -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;
|
||||||
|
|
||||||
|
|||||||
@@ -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);
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user