QR codes for player profiles

[kungfauxn00b]

I've bought a reciept printer and customised the buy-in receipt to show a players QR code. However, as it's not a standard field, the workaround I've used is to take the Internal ID field value, create a QR code, and add it to the players profile image. I then use some Javascript to add it to the reciept.

I have a hand-held scanner which I can use to do player re-buys/add-ons.







It works, however, it's not elegant. It means I have to manually generate the QR each time there's a new player and I must make sure I add the right QR code to the player's profile.

It would be awesome if there was a way to select a field, have the app generate a QR code from the value, and have it as a variable to use on receipts.

[Corey Cooper]

This is a great idea, and quite doable, so I'll be looking into this for the next version.  What suggestions do you have for it?  I can see a token for embedding something in the receipt that generates a QR code from a specified field, like <qrcode field="internalid">, or from whatever value you want like <qrcode value="https://thetournamentdirector.net">.

[Corey Cooper]

By the way you can actually do this today with just a little addition to your receipt file.  I did a very quick search for a QRCode Javascript implementation and used the first one I found.  Add this to your receipts template:

Code: [Select]

<script type="text/javascript" src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
<script>
  window.addEventListener("load", e => {
    let q = new QRCode("qrcode", { height: 128, width: 128 });
    q.makeCode("<internalid>")
  })
</script>
Then add an element wherever you want your QR code to be displayed:

Code: [Select]

<div id="qrcode"></div>
This one makes a QR code from the player's internal ID, but you could make it whatever you want.  <internalid> is great for using the QR code to lookup a player.  <id> is also probably a good choice for look up, if you use the ID field.

There are options for generating the QR code.  The library is found here: https://github.com/davidshimjs/qrcodejs

The only thing that might be an issue is that currently receipts are printed immediately, and sometimes the print action can occur before the page is fully rendered (for example if large images are displayed on the receipt).  So it could be printed before the QR code has time to generate.  I had to rebuild my PC last week and printing is currently not working so I can't test it.  This bug is on my list to have the print action wait for the page to fully render.