Client-side Canvas-based Identicon Released

Suggestion from Wes Felter and a good cup of coffee prompted me to write an implementation of Identicon using the canvas tag. If you are using a browser with canvas tag support (i.e. Firefox), take a look at the Identicon Canvas Test page. If not, the screenshot below will have to do because the example falls back to server-side identicon. I am going to hold off on deploying on my blog until I figure out how to get around a Safari canvas-related bug.

 <p align="center"><img src="//www.docuverse.com/blog/donpark/files/identicon_canvas_test%5B5%5D.gif" alt="" width="407" height="224"> </p>
 FYI, updated <a href="//www.docuverse.com/blog/donpark/files/identicon_0_3_src.zip">Identicon source package</a> (version 0.3) includes the canvas implementation code. You can take a look at the javascript <a href="//www.docuverse.com/blog/donpark/files/identicon_canvas.js">here</a>. As you can see from the example and javascript file, identicon code is stored in canvas title attribute. Kinda funky but *shrug* it works.

Feel free to use this at your own website. 

Advertisements