Barcode input to the Qt Webkit browser

In our previous post we described how you could hook up a magnetic stripe reader to the Qt Webkit browser using the Qt Webkit Bridge and a relatively simple set of C++ code.

This approach of using C++ to write extensions for Webkit isn't specific to magnetic stripe readers, though. Once in C++, the entire native API is available to you, from monitoring the status of your network through a netlink socket, configuring a WLAN device using a wrapper around wpa_cli or, as we'll show in this example, reading data from a barcode scanner. For use as the front-end for embedded applications, this combination is hard to beat.

The source code bundle referred to in the earlier post actually contains code to support a Motorola SE-995 scan engine through a serial port.

The interface to it from Javascript is very similar to the mag-stripe interface, consisting of a barcode handler which will receive each barcode in its' entirety:

scanner.scanned.connect(function(barcode){
     console.log("rx barcode<"+escape(barcode)+">");
});

In addition, it provides a clear() method and a barcode property for use in keeping the previous barcode state around between web pages.

The sources are located in bcInput.h and bcInput.cpp.

Because the scanner doesn't have a distinct device name, support requires an environment variable BCDEV to be set prior to launching the qtbrowser sample application. The environment variable must include at least the device name (typically /dev/ttymxc2 and a baud rate like so:

All this comes in around 200 lines of C++ code, and most of that is just dealing with the quirky Linux terminal control interface (tcgetattr, tcgetattr and friends).

And now, for the obligatory screen-shot: