Physical barcode scanner attached to client pc

[tiagof]

Hi.

My scenario: the (physical) barcode scanner is attached to the client computer (where a browser with the barcodebuddy screen page is opened). The barcodebuddy app itself is running in a virtualserver somewhere.
I was not able to use the scanner is this scenario...

The solution i found for this required a small change to the screen.php page but I'd like some feedback on it, especially if there is an easier or better way to achieve this.
Also, if it makes sense, happy to make a PR for this.

My solution: I've added an input field that processes the scanned text (the barcode) and sends it to the server:

the current screen.php file contains:

[...]
<div id="content" class="content">
    <p id="scan-result" class="h2">If you see this for more than a couple of seconds, please check if the websocket
        server has been started and is available</p>
    <div id="log">
        <p id="event" class="h3"></p><br>
        <div id="previous-events">
            <p class="h4 p-t10"> previous scans: </p>
            <span id="log-entries" class="h5"></span>
        </div>
    </div>
</div>
[...]

my/the changed version:

<div id="content" class="content">
    <p id="scan-result" class="h2">If you see this for more than a couple of seconds, please check if the websocket
        server has been started and is available</p>
    <div id="log">
        <p id="event" class="h3"></p><br>
        <input type="text" onkeydown="barcode(this)"/>    <!-- <<<<<<< HERE  -->
        <div id="previous-events">
            <p class="h4 p-t10"> previous scans: </p>
            <span id="log-entries" class="h5"></span>
        </div>
    </div>
</div>

finally, in the scripts section of the page, just add a new function:

function barcode(ele) {
    if(event.key === 'Enter') {
        sendBarcode(ele.value);
        ele.value = '';
    }
}

[pipelinedave]

I have the exact same scenario and I will probably try your change shortly and report back

[pipelinedave]

works charmingly on my setup:

• BBUDDY on k3s on a hosted VPS in a datacentre somewhere
• laptop (ubuntu) set up as a "kiosk" on my kitchen counter with a 30 EUR tethered USB barcode scanner attached to it

next for me would be to find a way to make the browser focus on the input field when the barcode scanner fires to make the attached usb mouse obsolete entirely

[tiagof]

just add focus() the js function:

function barcode(ele) {
    if(event.key === 'Enter') {
        sendBarcode(ele.value);
        ele.value = '';
        ele.focus();
    }
}

[pipelinedave]

just add focus() the js function:

function barcode(ele) {
    if(event.key === 'Enter') {
        sendBarcode(ele.value);
        ele.value = '';
        ele.focus();
    }
}

this does not seem to work for me.
trying on a recent version of chromium browser.

[tiagof]

strange...but what exactly do you mean with "focus on the input field when the scanner fires"? If the input is focused and you scan, it sends to code, clears the input but the focus stays....at least it does to me.