npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jquery-scanner-detection

v1.0.0

Published

jQuery Scanner Detection ========================

Downloads

13

Readme

jQuery Scanner Detection

jQuery Scanner Detection is a small plugin to detect when user use a scanner (barcode, QR Code...) instead of a keyboard, and call specific callbacks.

How use it

To initialize the detection, 2 ways:

$(selector).scannerDetection(); // Initialize with default options
$(selector).scannerDetection({...}); // Initialize with an object that contains options
$(selector).scannerDetection(function(){...}); // Initialize with a function that is onComplete callback

To simulate a scanning after initialisation:

$(selector).scannerDetection('scanned string');

To disable the detection (deinitialize):

$(selector).scannerDetection(false);

See a detailed tutorial with presets for different scanner models and first steps to take when starting here.

Options

###onComplete Default: false
Callback after detection of a successful scanning ###onError Default: false
Callback after detection of a unsuccessful scanning (scanned string in parameter) ###onReceive Default: false
Callback after receiving and processing a char (scanned char in parameter) ###onKeyDetect Default: false
Callback after detecting a keyDown (key char in parameter) - in contrast to onReceive, this fires for non-character keys like tab, arrows, etc. too! ###onScanButtonLongPressed Default: false
Callback after detection of a successfull scan while the scan button was pressed and held down. This can only be used if the scan button behaves as a key itself (see scanButtonKeyCode). This long press event can be used to add a secondary action. For example, if the primary action is to count some items with barcodes (e.g. products at goods-in), it is comes very handy if a number pad pops up on the screen when the scan button is held. Large number can then be easily typed it instead of scanning fifty times in a row. Note: this option requires scanButtonKeyCode to be set to a valid key code! ###timeBeforeScanTest Default: 100
Wait duration (ms) after keypress event to check if scanning is finished ###avgTimeByChar Default: 30
Average time (ms) between 2 chars. Used to do difference between keyboard typing and scanning ###minLength Default: 6
Minimum length for a scanning ###endChar Default: [9,13]
Chars to remove and means end of scanning ###startChar Default: []
Chars to remove and means start of scanning ###ignoreIfFocusOn Default: false
Ignore scans if the currently focused element matches this selector. Per example, if you set this option to 'input', scanner detection will be disable if an input is focused, when the scan occurs. ###scanButtonKeyCode Default: false
Key code of the scanner hardware button (if the scanner button a acts as a key itself). Knowing this key code is important, because it is not part of the scanned code and must be ignored. On the other hand, knowing it can be usefull: pressing the button multiple times fast normally results just in one scan, but you still could count the number of times pressed, allowing the user to input quantities this way (typical use case would be counting product at goods-in). ###scanButtonLongPressThreshold Default: 3
You can let the user perform some special action by pressing and holding the scan button. In this case the button will issue multiple keydown events. This parameter sets, how many sequential events should be interpreted as holding the button down.
###stopPropagation Default: false
Stop immediate propagation on keypress event ###preventDefault Default: false
Prevent default action on keypress event

Events

All callbacks are of type function and can also be bound as event listeners.
Like this, you can add multiple callbacks for each event.
Of course, events exist only if plugin is initialized on selector.

$(selector)
    .bind('scannerDetectionComplete',function(e,data){...})
    .bind('scannerDetectionError',function(e,data){...})
    .bind('scannerDetectionReceive',function(e,data){...})

###scannerDetectionComplete Callback after detection of a successful scanning
Event data: {string: "scanned string"} ###scannerDetectionError Callback after detection of a unsuccessful scanning
Event data: {string: "scanned string"}
###scannerDetectionReceive Callback after receive and process a char
Event data: {evt: {original keypress event}} ###scannerDetectionKeyDetect Callback after detecting a keyDown - in contrast to onReceive, this fires for non-character keys like tab, arrows, etc. too! Event data: {evt: {original keypress event}}

Requirements

jQuery > 1.4.4. Note, that some odd side effects may occur before version 1.6, if your event handlers rely on using the event object (for example calling e.which from within the onKeyDetect handler).

Browser compatibility

On old IE browser (IE<9), Date.now() and Array.indexOf() are not implemented.
If you plan to use this plugin on these browsers, please add jquery.scannerdetection.compatibility.js file before the plugin.