QR Check In

Introduction

QR Check In is a mobile phone application to provide electronic ticket check ins using QR codes. It will scan a QR code printed on a ticket and, using a generic REST API, attempt to check in the ticket with the configured server endpoint. The application is designed to be used with a server which you implement that exposes a REST API that conforms to the required QR Check In server API. This allows web sites that need ticketing to implement QR code check ins without having to develop a mobile phone application.

Installation

Please see the instructions on how to install the released version of QR Check In.

About

The application was developed for a community radio station to use for checking in tickets that they sell online for their fund-raising events. It was designed to work with a generic back end so that it could be plugged into other web sites that may have a use for it. With this in mind the API was intended to be as simple and generic as possible to implement.

The code for the application is also being released as open source in the event it may be useful to someone who wants to implement something similar (but different). As this application was developed for a specific use case unfortunately I'm not able to respond to a large number of requests for updates etc. I'd love to hear it's being used, however, and if you have any queries regarding it you can contact me at simonkeary@gmail.com.

License

QR Check In is open source to allow customisation to suit a project's needs. The license for the code is the MIT License (http://www.opensource.org/licenses/mit-license.php) which allows use in free or commercial projects.

Icons

The QR Check in application uses the Entypo pictograms by Daniel Bruce (www.entypo.com).

QR Check In Development

QR Check In is built using PhoneGap™ to support different phone devices without requring multiple code bases. As a Phonegap application the application is developed entirely using HTML5 and JavaScript. The PhoneGap barcode scanner plugin is used for the QR code scanning functionality. To keep a good separation between the logic and presentation the application is developed with the JavaScript MVVM framework knockout.js. To simplify development the application was designed to be built using the online Adobe® PhoneGap Build service http://build.phonegap.com. Simply by creating a new Build project and pointing it at the GitHub repo the application can be built. This removes the need to setup a PhoneGap build environment locally. In addition, PhoneGap Build can be used for free for Github-hosted open source projects.

Modifying the Application

As the application is essentially just a web application to speed up development the application was largely developed using a desktop browser. To do this you should hosting the files for the application on a local web server and navigate to index.html which is the application start page. There are several fairly simple ways to setup a webserver on your working PC to host the application in this manner. I used webfsd on Ubuntu which can be installed using "sudo apt-get install webfsd". Webfsd can be run from the root directory of the application with a command line such as "webfsd -p 8080 ." which will run it on port 8080. Another good option may be a simple Python web server.

When running the application in a desktop browser the PhoneGap API is obviously not available. In this case the JavaScript in the application will just display a form to enter the decoded QR code when you go to "scan" a code. This allows you to test the rest of the application functionality. Another limitation when running the application in a desktop browser is that by default the application will not be able to make cross-domain calls to a back end server so all Ajax calls will fail. Using the Chromium browser you can prevent this security restriction by running it with the command line "chromium-browser --disable-web-security". There may be a similar command line flag for other browsers.

Stub Server

To aid the development or modifications of the application a simple stub server is available which mimics a real back end server. The code for this is stored with the application source code in the sub-directory called "api". Please see the instructions for how to run the stub server.