(function( $ ){ $.fn.qrcode = function(options) { var ishtml5 = false; var canvasid = 'qrcanvas_' + parseint(math.random() * 9999999999); $("body").append(""); var qr_canvas = $('#' + canvasid); if (document.getelementbyid(canvasid).getcontext) { ishtml5 = true; } var qr_container = this; // if options is string, if( typeof options === 'string' ){ options = { text: options }; } // set default values // typenumber < 1 for automatic calculation options = $.extend( {}, { render : "canvas", width : 256, height : 256, typenumber : -1, correctlevel: qrerrorcorrectlevel.h, background : "#ffffff", foreground : "#000000", logoborder: 2, logoradius: 5, logopadding: 5, logowidth: 40, logoheight: 40 }, options); var set_logoimg = function(width,height,qrcode){ var imgelement = $("#logoimg").attr("src"); if(!imgelement){ //create the img logo var img = $(document.createelement("img")) .attr("src", options.logo) .attr("id", "logoimg_" + canvasid) .css( { "position" : "absolute", "z-index" : 1000, "width" : options.logowidth +"px", "height" : options.logoheight + "px", "border":options.logoborder + "px solid " + options.foreground, "border-radius": options.logoradius + "px", "padding" : options.logopadding + "px", "background":"#fff" } ).appendto($(qr_container)); $(img).css({"left":($(qr_container).outerwidth() - $(img).outerwidth())/2+"px"}); $(img).css({"top":($(qr_container).outerheight() - $(img).outerheight())/2+"px"}); } } var createcanvas = function(){ // create the qrcode itself var qrcode = new qrcode(options.typenumber, options.correctlevel); qrcode.adddata(options.text); qrcode.make(); // get canvas element var canvas = qr_canvas.get(0); canvas.width = options.width; canvas.height = options.height; var ctx = canvas.getcontext('2d'); // compute tilew/tileh based on options.width/options.height var tilew = options.width / qrcode.getmodulecount(); var tileh = options.height / qrcode.getmodulecount(); // draw in the canvas for( var row = 0; row < qrcode.getmodulecount(); row++ ){ for( var col = 0; col < qrcode.getmodulecount(); col++ ){ ctx.fillstyle = qrcode.isdark(row, col) ? options.foreground : options.background; var w = (math.ceil((col+1)*tilew) - math.floor(col*tilew)); var h = (math.ceil((row+1)*tilew) - math.floor(row*tilew)); ctx.fillrect(math.round(col*tilew),math.round(row*tileh), w, h); } } //set logo if(options.logo) set_logoimg(tilew,tileh,qrcode); // return just built canvas return canvas; } // from jon-carlos rivera (https://github.com/imbcmdth) var createtable = function(){ // create the qrcode itself var qrcode = new qrcode(options.typenumber, options.correctlevel); qrcode.adddata(options.text); qrcode.make(); var $table; var tabletemp = $("#contentinfo").html(); if(!tabletemp){ // create table element $table = $('
') .css("width", options.width+"px") .css("height", options.height+"px") .css("border", "0px") .css("border-collapse", "collapse") .css('background-color', options.background) .attr('id',"contentinfo"); }else{ $("#contentinfo").html(""); $table = $("#contentinfo"); } // compute tiles percentage var tilew = options.width / qrcode.getmodulecount(); var tileh = options.height / qrcode.getmodulecount(); // draw in the table for(var row = 0; row < qrcode.getmodulecount(); row++ ){ var $row = $('').css('height', tileh+"px").appendto($table); for(var col = 0; col < qrcode.getmodulecount(); col++ ){ $('') .css('width', tilew+"px") .css('background-color', qrcode.isdark(row, col) ? options.foreground : options.background) .appendto($row); } } //set logo set_logoimg(tilew,tileh,qrcode); // return just built canvas return $table; } return this.each(function(){ $(this).css({"width":options.width +"px","height":options.height+"px",'-webkit-box-sizing': 'content-box','-moz-box-sizing: border-box':'content-box','box-sizing':'content-box'}); if($(this).css("position") == "static") $(this).css({"position":"relative"}); var element = ishtml5 ? createcanvas() : createtable(); $(element).appendto(this); }); }; })( jquery );