Code 39 – Barcode Biscuits

Teething BiscuitsCode 39 takes me way back to sinking my teeth into my first real barcode programming experience. Code 39 is a very simple and straightforward code set consisting of 43 unique representable characters and one start and stop character: the asterisk “*”. If you’ve never done any work with barcodes before, this is a no-brainer selection for an introductory symbology. As such, we can make this lesson a very simple one. I will explain how you can, using the code from the September 19th, 2013 post, generate real, scannable codes in minutes.

There are two setup arrays, and only one line of the four lines of JavaScript code is non-trivial. Here we go…

The Code 39 Setup

// Symbology-specific arrays
var arrayCode39Bin = new Array (
'1010001110111010', '1110100010101110', '1011100010101110', '1110111000101010', // 0, 1, 2, 3
'1010001110101110', '1110100011101010', '1011100011101010', '1010001011101110', // 4, 5, 6, 7
'1110100010111010', '1011100010111010', '1110101000101110', '1011101000101110', // 8, 9, A, B
'1110111010001010', '1010111000101110', '1110101110001010', '1011101110001010', // C, D, E, F
'1010100011101110', '1110101000111010', '1011101000111010', '1010111000111010', // G, H, I, J
'1110101010001110', '1011101010001110', '1110111010100010', '1010111010001110', // K, L, M, N
'1110101110100010', '1011101110100010', '1010101110001110', '1110101011100010', // O, P, Q, R
'1011101011100010', '1010111011100010', '1110001010101110', '1000111010101110', // S, T, U, V
'1110001110101010', '1000101110101110', '1110001011101010', '1000111011101010', // W, X, Y, Z
'1000101011101110', '1110001010111010', '1000111010111010', '1000100010001010', // -, ., (space), $
'1000100010100010', '1000101000100010', '1010001000100010', '1000101110111010'); // /, +, %, *

var strCode39 = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ-. $/+%*";

Take these lines of code and add them to the bottom of the Setup portion of the file given out in the September 19th article.

The first array (arrayCode39Bin) is the set of raw sequences of ones and zeroes that will direct our rendering engine to generate the proper sequence of bars, lines and spaces corresponding to each of the 44 characters that the Code 39 symbology can represent. The second array (strCode39) is really that string of 44 characters in the numerical order which ties them to the previous array.

The JavaScript

<body>
<div id="result"></div>
<script type="text/javascript">
 var strText = "*123TEST890*";
 var strRaw = "";
 for (var i = 0; i < strText.length; i++)
  strRaw += arrayCode39Bin[strCode39.indexOf(strText.charAt(i))];
 document.getElementById("result").innerHTML = genBarcode(strRaw,6,40);
</script>
</body>

The JavaScript for actually rendering the Code 39 bars consists of the initialization of the two string variables (strText, strRaw) and a single step for loop that starts at the beginning of the string given and loops until the end of it, placing in the raw string the ones and zeroes from the Code 39 binary array. Finally, genBarcode() is called and the resulting HTML <img> entities are placed into the <div> we’ve identified as the result.

Replace the <body> element in the sample code from the previous article with the element provided in this article.

Here is the essence of what gets output to the browser document:

Blog Bar for Barcode Biscuits

This generates a scannable barcode in the browser. If you print this page and scan it, the scanner will dump 123TEST890 as output. The code string has an asterisk embedded before and after the data, but those are required and necessary for scanning a Code 39 code. The asterisk (“*”) is not a valid data character.

We will run some more complex symbologies in future installments, including Code 128, Interleaved 2 of 5 and ultimately QR Code before we finally reach the application area and we get to shipping label and shop floor routing software. Until next time, thanks for tuning in.