Get text input without textbox

Viewed 152

I want to create a in/out dashboard at the front door with a computer & wall-mounted TV running full screen with no keyboard/mouse, just a barcode scanner for input. Asp.net mvc dashboard app will display list of all currently present employees for receptionist. To display user list, if I had a textbox & 'Submit' button this would be easy. For design & COVID reasons, I want computer to be alway waiting for input from barcode scanner without any prompts/textboxes. I just want employee to walk up to terminal and scan themselves upon entry/exit. Does this make sense? I am at the design stage of this project and can't figure out how to get text input without traditional texbox/submit method. Thanks.

2 Answers

Sure it makes sense.

Just:

  1. Find a library that supports your Barcode scanner
  2. Write the code that reads the scanner, and looks up the corresponding name (e.g. from a database)
  3. Write the code that updates the list with the new name.
  4. You'll probably also want to give the receptionist the ability to delete names from the list - or manually enter names that can't be scanned.

ADDENDUM:

no keyboard/mouse, just a barcode scanner for input ... I just want employee to walk up to terminal and scan themselves upon entry/exit...

This part might be challenging, for a couple reasons:

  • It would be nice if there was enough of a UI that the employee could click "start scanning" (e.g. with a button)

  • It's unclear if simply reading what's encoded in the bar code is sufficient. Often, a bar code contains minimal information (e.g. "User ID"), and you need to do additional processing (e.g. "Look up username from ID in a database).

HOWEVER ...

Look here:

Barcode scanner sample

This article discusses how to use DeviceWatcher, ClaimScannerAsync() and friends to receive scanner data asynchronously.

See also Obtain and understand barcode data.

Much of this seems to be UWP-specific - I'm not sure it'll necessarily all work for you.

You might also want to consider having a keyboard or mouse ... but "locking down" the PC into "kiosk mode". For example:

https://docs.microsoft.com/en-us/windows/configuration/lock-down-windows-10-applocker

Here's what I managed:

https://jsfiddle.net/s2ryogxt/

$(document).ready(() => {
    const input = document.getElementById("myInput");

    input.style.position = "absolute";
    input.style.top = "-100px";
    input.focus(); // on DOM ready

    let timeout = null;
    input.addEventListener('keyup', () => {
        if (timeout) {
            clearTimeout(timeout);
        }
        timeout = setTimeout(() => {
            if(input.value) {
                alert(`I got ${input.value}`);
                input.value = "";
            }
            input.focus();
        }, 100);
    });
});

This is all JavaScript, you can replace the alert with your own call to the endpoint. Just make sure the field is always in focus, and you should be alright.

Related