Links from Physical to Electronic

Introduction

Web pages are designed to have a fairly complex set of characters to access them. There is thus an increasing need for methods which allows us to get access to Web-based material in a more ubiquitous method. Short links have been tried, and are used in many situations, such as:

http://www.asecuritysite.com/Encryption/md5?word=The%20quick%20brown%20fox%20jumps%20over%20the%20lazy%20dog.

becomes:

http://alturl.com/qubqm

which basically involves a looking on the remote site for a unique code, which then resolves to the actual site. The downside of this method, is that it can still be fairly complex to enter, and also will depend on the remote site which hosts the look-up being up. The major problem is that we are increasingly using mobile devices, where entering characters, especially with colons and slashes, can be difficult. It becomes an even greater challenge when the user is on the move, especially if they are outdoors.

With the requirement to link move objects to electronic material, the need for methods which support this increase.  major objective is to use methods which are standardized on a range of devices, and ones which users feel comfortable with. For 2-D barcodes, we have seen large-scale adoption by businesses, and these have been shown to be robust, but suffer from requiring a line-of-sight connection, and also cannot store any additional information on the code. The key solutions which are seeing some large-scale adoption are NFC (Near Field Communications) and QR Codes.

RFID

RFID technology provides a good method of providing information over a radio connection. With this there are two main types of RFID tags:

• Passive RFID. This requires an RF transmitter to power-up a passive tag, which then couples enough energy to send back its information. There is no battery contained with a passive RFID tags, thus the transmitter must be close to the tag in order to power it up. This is often known as NFC (Near Field Communications).
• Active RFID. This type of tag has a battery, and thus can power a radio wave which is transmitted to a receiver.

Active RFID has the advantage of not requiring a line-of-sight, as it can power a radio wave to reach the receiver, but it requires power from the battery to power the wave. With the increase of mobile phones providing NFC transmitters, their has thus been an increase in the usage of passive RFID. These tags will typically contain some information, such as a related Web link.

QR Codes

2D bar codes are fairly simple, and require a laser to scan the printed code. While this is acceptable for storing simple information, such as for the manufacturer and product code, it is not acceptable for more complex information, such as for a Web link. QR codes were thus defined to have a complex pattern which is shown in a 2D array, rather than the linear manner for 2D bar codes.

Query is an amazing little plug-in, and allow you to directly access objects within an HTML page. An example of a QR code generator is:

http://www.asecuritysite.com/information/qr

For example, the QR code for the above link is:

This shows a table format. Within HTML we can support canvas version, which provide a smoother graphic.
In the code example I have used a Window to show the code, which contains a link to the Query code for displaying the QR Code:

@(Html.Kendo().Window()
.Name("window")
.Title("QR Code")
.Content(@<text>
<script>
jQuery('#qrcodeCanvas2').qrcode({
width: 250,
height: 250,
text:  "@ViewData["tbsite"]"
});


</script>

<div id="qrcodeCanvas2"></div>
<input name="b_print" type="button"   onClick="window.print()" value=" Print "/>
</text>)
.Draggable()
.Resizable()
.Width(300)
.Height(300)
.Events(ev => ev.Close("onClose"))
.Visible(false)
.Actions(actions => actions.Close())
)
<h2>Rendering</h2>
<p>We can render as a table or as a canvas:</p>
<table>
<tr><td>Table</td><td>Canvas</td></tr>
<tr><td><div id="qrcodeTable"></div></td><td><div id="qrcodeCanvas"></div></td></tr>

</table>

The creation of the QR Codes are defined with:

<script>

jQuery('#qrcodeTable').qrcode({
render: "table",
width: 100,
height: 100,
text: "@ViewData["tbsite"]"
});


jQuery('#qrcodeCanvas').qrcode({
width: 100,
height: 100,
text:  "@ViewData["tbsite"]"
});

and we can open up a Window for the QR code with:

</script>

<span id="undo" >Click here to open the window.</span>

and provide the code to create the Window and hide the link:

<script>


function onClose() {
$("#undo").show();
}


$(document).ready(function () {
$("#undo").bind("click", function () {
$("#window").data("kendoWindow").open();
$("#undo").hide();
});
});
</script>