Improve layout for some camera types

This commit is contained in:
Vivianne Langdon 2022-02-26 23:22:44 -08:00
parent 464050deaa
commit cdddf73e29
3 changed files with 17 additions and 5 deletions

View file

@ -2,14 +2,22 @@
/* Barcode scanner CSS */ /* Barcode scanner CSS */
#barcode-scanner { #barcode-scanner {
position: relative; position: relative;
min-height: 450px; max-width: 100%;
text-align: center;
video {
height: calc(70vh - 200px);
max-width: 100%;
}
.drawingBuffer { .drawingBuffer {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
height: auto; right: 0;
width: 100%; margin: auto;
height: calc(70vh - 200px);
max-width: 100%;
} }
} }

View file

@ -751,11 +751,15 @@ let BookWyrm = new (class {
}); });
let lastDetection = null; let lastDetection = null;
let numDetected = 0;
Quagga.onDetected((result) => { Quagga.onDetected((result) => {
// Detect the same code twice as an extra check to avoid bogus scans. // Detect the same code 3 times as an extra check to avoid bogus scans.
if (lastDetection === null || lastDetection !== result.codeResult.code) { if (lastDetection === null || lastDetection !== result.codeResult.code) {
numDetected = 1;
lastDetection = result.codeResult.code; lastDetection = result.codeResult.code;
return; return;
} else if (numDetected++ < 3) {
return;
} }
const code = result.codeResult.code; const code = result.codeResult.code;

View file

@ -8,7 +8,7 @@
{% endblock %} {% endblock %}
{% block modal-body %} {% block modal-body %}
<div id="barcode-scanner"></div> <div id="barcode-scanner" class="block"></div>
<div id="barcode-status" class="block"> <div id="barcode-status" class="block">
<div class="grant-access is-hidden"> <div class="grant-access is-hidden">