{"size": 25006, "ext": "js", "max_stars_repo_path": "dist/drawingboard.min.js", "max_stars_repo_name": "EpokK/drawingboard.js", "max_stars_repo_stars_event_min_datetime": "2015-02-27T10:24:55.000Z", "max_stars_repo_stars_event_max_datetime": "2015-02-27T10:24:55.000Z", "max_issues_repo_path": "dist/drawingboard.min.js", "max_issues_repo_name": "EpokK/drawingboard.js", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "dist/drawingboard.min.js", "max_forks_repo_name": "EpokK/drawingboard.js", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 3125.75, "max_line_length": 24751, "alphanum_fraction": 0.7417819723}
/* drawingboard.js v0.4.2 - https://github.com/Leimi/drawingboard.js
* Copyright (c) 2013 Emmanuel Pelletier
* Licensed MIT */
/* drawingboard.js v0.4.2 - https://github.com/Leimi/drawingboard.js
* Copyright (c) 2013 Emmanuel Pelletier
* Licensed MIT */
window.DrawingBoard={};DrawingBoard.Board=function(e,t){this.opts=$.extend({},DrawingBoard.Board.defaultOpts,t);this.ev=new DrawingBoard.Utils.MicroEvent;this.id=e;this.$el=$(document.getElementById(e));if(!this.$el.length)return false;var n='<div class="drawing-board-canvas-wrapper"></canvas><canvas class="drawing-board-canvas"></canvas><div class="drawing-board-cursor drawing-board-utils-hidden"></div></div>';if(this.opts.controlsPosition.indexOf("bottom")>-1)n+='<div class="drawing-board-controls"></div>';else n='<div class="drawing-board-controls"></div>'+n;this.$el.addClass("drawing-board").append(n);this.dom={$canvasWrapper:this.$el.find(".drawing-board-canvas-wrapper"),$canvas:this.$el.find(".drawing-board-canvas"),$cursor:this.$el.find(".drawing-board-cursor"),$controls:this.$el.find(".drawing-board-controls")};$.each(["left","right","center"],$.proxy(function(e,t){if(this.opts.controlsPosition.indexOf(t)>-1){this.dom.$controls.attr("data-align",t);return false}},this));this.canvas=this.dom.$canvas.get(0);this.ctx=this.canvas&&this.canvas.getContext&&this.canvas.getContext("2d")?this.canvas.getContext("2d"):null;this.color=this.opts.color;if(!this.ctx){if(this.opts.errorMessage)this.$el.html(this.opts.errorMessage);return false}this.storage=this._getStorage();this.initHistory();this.reset({webStorage:false,history:false,background:false});this.initControls();this.resize();this.reset({webStorage:false,history:true,background:true});this.restoreWebStorage();this.initDropEvents();this.initDrawEvents()};DrawingBoard.Board.defaultOpts={controls:["Color","DrawingMode","Size","Navigation"],controlsPosition:"top left",color:"#000000",size:1,eraserSize:1,background:"#fff",eraserColor:"background",webStorage:"session",droppable:false,enlargeYourContainer:false,errorMessage:'<p>It seems you use an obsolete browser. <a href="http://browsehappy.com/" target="_blank">Update it</a> to start drawing.</p>'};DrawingBoard.Board.prototype={reset:function(e){e=$.extend({color:this.opts.color,size:this.opts.size,eraserSize:this.opts.eraserSize,webStorage:true,history:true,background:false},e);this.setMode("pencil");if(e.background)this.resetBackground(this.opts.background,false);if(e.color)this.setColor(e.color);if(e.size)this.ctx.lineWidth=e.size;this.ctx.lineCap="round";this.ctx.lineJoin="round";if(e.webStorage)this.saveWebStorage();if(e.history)this.saveHistory();this.blankCanvas=this.getImg();this.ev.trigger("board:reset",e)},resetBackground:function(e,t){e=e||this.opts.background;t=typeof t!=="undefined"?t:true;var n=DrawingBoard.Utils.isColor(e);var r=this.getMode();this.setMode("pencil");this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.width);if(n){this.ctx.fillStyle=e;this.ctx.fillRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height)}else if(e)this.setImg(e);this.setMode(r);if(t)this.saveHistory()},resize:function(){this.dom.$controls.toggleClass("drawing-board-controls-hidden",!this.controls||!this.controls.length);var e,t;var n=[this.$el.width(),DrawingBoard.Utils.boxBorderWidth(this.$el),DrawingBoard.Utils.boxBorderWidth(this.dom.$canvasWrapper,true,true)];var r=[this.$el.height(),DrawingBoard.Utils.boxBorderHeight(this.$el),this.dom.$controls.height(),DrawingBoard.Utils.boxBorderHeight(this.dom.$controls,false,true),DrawingBoard.Utils.boxBorderHeight(this.dom.$canvasWrapper,true,true)];var i=this;var s=function(e,t){t=t||1;var n=e[0];for(var r=1;r<e.length;r++){n=n+e[r]*t}return n};var o=function(e){return s(e,-1)};if(this.opts.enlargeYourContainer){e=this.$el.width();t=this.$el.height();this.$el.width(s(n));this.$el.height(s(r))}else{e=o(n);t=o(r)}this.dom.$canvasWrapper.css("width",e+"px");this.dom.$canvasWrapper.css("height",t+"px");this.dom.$canvas.css("width",e+"px");this.dom.$canvas.css("height",t+"px");this.canvas.width=e;this.canvas.height=t},initControls:function(){this.controls=[];if(!this.opts.controls.length||!DrawingBoard.Control)return false;for(var e=0;e<this.opts.controls.length;e++){var t=null;if(typeof this.opts.controls[e]=="string")t=new window["DrawingBoard"]["Control"][this.opts.controls[e]](this);else if(typeof this.opts.controls[e]=="object"){for(var n in this.opts.controls[e])break;t=new window["DrawingBoard"]["Control"][n](this,this.opts.controls[e][n])}if(t){this.addControl(t)}}},addControl:function(e,t,n){if(typeof e!=="string"&&(typeof e!=="object"||!e instanceof DrawingBoard.Control))return false;var r=typeof t=="object"?t:{};n=n?n*1:typeof t=="number"?t:null;if(typeof e=="string")e=new window["DrawingBoard"]["Control"][e](this,r);if(n)this.dom.$controls.children().eq(n).before(e.$el);else this.dom.$controls.append(e.$el);if(!this.controls)this.controls=[];this.controls.push(e);this.dom.$controls.removeClass("drawing-board-controls-hidden")},initHistory:function(){this.history={values:[],position:0}},saveHistory:function(){while(this.history.values.length>30){this.history.values.shift();this.history.position--}if(this.history.position!==0&&this.history.position<this.history.values.length){this.history.values=this.history.values.slice(0,this.history.position);this.history.position++}else{this.history.position=this.history.values.length+1}this.history.values.push(this.getImg());this.ev.trigger("historyNavigation",this.history.position)},_goThroughHistory:function(e){if(e&&this.history.position==this.history.values.length||!e&&this.history.position==1)return;var t=e?this.history.position+1:this.history.position-1;if(this.history.values.length&&this.history.values[t-1]!==undefined){this.history.position=t;this.setImg(this.history.values[t-1])}this.ev.trigger("historyNavigation",t);this.saveWebStorage()},goBackInHistory:function(){this._goThroughHistory(false)},goForthInHistory:function(){this._goThroughHistory(true)},setImg:function(e){var t=this.ctx;var n=new Image;var r=t.globalCompositeOperation;n.onload=function(){t.globalCompositeOperation="source-over";t.clearRect(0,0,t.canvas.width,t.canvas.width);t.drawImage(n,0,0);t.globalCompositeOperation=r};n.src=e},getImg:function(){return this.canvas.toDataURL("image/png")},downloadImg:function(){var e=this.getImg();e=e.replace("image/png","image/octet-stream");window.location.href=e},saveWebStorage:function(){if(window[this.storage]){window[this.storage].setItem("drawing-board-"+this.id,this.getImg());this.ev.trigger("board:save"+this.storage.charAt(0).toUpperCase()+this.storage.slice(1),this.getImg())}},restoreWebStorage:function(){if(window[this.storage]&&window[this.storage].getItem("drawing-board-"+this.id)!==null){this.setImg(window[this.storage].getItem("drawing-board-"+this.id));this.ev.trigger("board:restore"+this.storage.charAt(0).toUpperCase()+this.storage.slice(1),window[this.storage].getItem("drawing-board-"+this.id))}},clearWebStorage:function(){if(window[this.storage]&&window[this.storage].getItem("drawing-board-"+this.id)!==null){window[this.storage].removeItem("drawing-board-"+this.id);this.ev.trigger("board:clear"+this.storage.charAt(0).toUpperCase()+this.storage.slice(1))}},_getStorage:function(){if(!this.opts.webStorage||!(this.opts.webStorage==="session"||this.opts.webStorage==="local"))return false;return this.opts.webStorage+"Storage"},initDropEvents:function(){if(!this.opts.droppable)return false;this.dom.$canvas.on("dragover dragenter drop",function(e){e.stopPropagation();e.preventDefault()});this.dom.$canvas.on("drop",$.proxy(this._onCanvasDrop,this))},_onCanvasDrop:function(e){e=e.originalEvent?e.originalEvent:e;var t=e.dataTransfer.files;if(!t||!t.length||t[0].type.indexOf("image")==-1||!window.FileReader)return false;var n=new FileReader;n.readAsDataURL(t[0]);n.onload=$.proxy(function(e){this.setImg(e.target.result);this.ev.trigger("board:imageDropped",e.target.result);this.ev.trigger("board:userAction");this.saveHistory()},this)},setMode:function(e,t){t=t||false;e=e||"pencil";this.ev.unbind("board:startDrawing",$.proxy(this.fill,this));if(e==="eraser"&&this.opts.eraserSize){this.ctx.lineWidth=this.opts.eraserSize}else{this.ctx.lineWidth=this.opts.size}if(this.opts.eraserColor==="transparent")this.ctx.globalCompositeOperation=e==="eraser"?"destination-out":"source-over";else{if(e==="eraser"){if(this.opts.eraserColor==="background"&&DrawingBoard.Utils.isColor(this.opts.background))this.ctx.strokeStyle=this.opts.background;else if(DrawingBoard.Utils.isColor(this.opts.eraserColor))this.ctx.strokeStyle=this.opts.eraserColor}else if(!this.mode||this.mode==="eraser"){this.ctx.strokeStyle=this.color}if(e==="filler")this.ev.bind("board:startDrawing",$.proxy(this.fill,this))}this.mode=e;if(!t)this.ev.trigger("board:mode",this.mode)},getMode:function(){return this.mode||"pencil"},setColor:function(e){var t=this;e=e||this.color;if(!DrawingBoard.Utils.isColor(e))return false;this.color=e;if(this.opts.eraserColor!=="transparent"&&this.mode==="eraser"){var n=function(e){if(e!=="eraser")t.strokeStyle=t.color;t.ev.unbind("board:mode",n)};this.ev.bind("board:mode",n)}else this.ctx.strokeStyle=this.color},fill:function(e){if(this.getImg()===this.blankCanvas){this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.width);this.ctx.fillStyle=this.color;this.ctx.fillRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height);return}var t=this.ctx.getImageData(0,0,this.canvas.width,this.canvas.height);var n=0,r=1,i=2,s=3;var o=this.ctx.strokeStyle;var u=parseInt(o.substr(1,2),16);var a=parseInt(o.substr(3,2),16);var f=parseInt(o.substr(5,2),16);var l=DrawingBoard.Utils.pixelAt(t,parseInt(e.coords.x,10),parseInt(e.coords.y,10));if(l[s]===DrawingBoard.Utils.RGBToInt(u,a,f))return;var c=[l];var h,p,d;var v=t.width-1;var m=t.height-1;while(h=c.pop()){if(h[s]===l[s]){t.data[h[n]]=u;t.data[h[n]+1]=a;t.data[h[n]+2]=f;if(h[r]>0)c.push(DrawingBoard.Utils.pixelAt(t,h[r]-1,h[i]));if(h[r]<v)c.push(DrawingBoard.Utils.pixelAt(t,h[r]+1,h[i]));if(h[i]>0)c.push(DrawingBoard.Utils.pixelAt(t,h[r],h[i]-1));if(h[i]<m)c.push(DrawingBoard.Utils.pixelAt(t,h[r],h[i]+1))}}this.ctx.putImageData(t,0,0)},initDrawEvents:function(){this.isDrawing=false;this.isMouseHovering=false;this.coords={};this.coords.old=this.coords.current=this.coords.oldMid={x:0,y:0};this.dom.$canvas.on("mousedown touchstart",$.proxy(function(e){this._onInputStart(e,this._getInputCoords(e))},this));this.dom.$canvas.on("mousemove touchmove",$.proxy(function(e){this._onInputMove(e,this._getInputCoords(e))},this));this.dom.$canvas.on("mousemove",$.proxy(function(e){},this));this.dom.$canvas.on("mouseup touchend",$.proxy(function(e){this._onInputStop(e,this._getInputCoords(e))},this));this.dom.$canvas.on("mouseover",$.proxy(function(e){this._onMouseOver(e,this._getInputCoords(e))},this));this.dom.$canvas.on("mouseout",$.proxy(function(e){this._onMouseOut(e,this._getInputCoords(e))},this));$("body").on("mouseup touchend",$.proxy(function(e){this.isDrawing=false},this));if(window.requestAnimationFrame)requestAnimationFrame($.proxy(this.draw,this))},draw:function(){if(window.requestAnimationFrame&&this.ctx.lineWidth>10&&this.isMouseHovering){this.dom.$cursor.css({width:this.ctx.lineWidth+"px",height:this.ctx.lineWidth+"px"});var e=DrawingBoard.Utils.tpl("translateX({{x}}px) translateY({{y}}px)",{x:this.coords.current.x-this.ctx.lineWidth/2,y:this.coords.current.y-this.ctx.lineWidth/2});this.dom.$cursor.css({transform:e,"-webkit-transform":e,"-ms-transform":e});this.dom.$cursor.removeClass("drawing-board-utils-hidden")}else{this.dom.$cursor.addClass("drawing-board-utils-hidden")}if(this.isDrawing){var t=this._getMidInputCoords(this.coords.current);this.ctx.beginPath();this.ctx.moveTo(t.x,t.y);this.ctx.quadraticCurveTo(this.coords.old.x,this.coords.old.y,this.coords.oldMid.x,this.coords.oldMid.y);this.ctx.stroke();this.coords.old=this.coords.current;this.coords.oldMid=t}if(window.requestAnimationFrame)requestAnimationFrame($.proxy(function(){this.draw()},this))},_onInputStart:function(e,t){this.coords.current=this.coords.old=t;this.coords.oldMid=this._getMidInputCoords(t);this.isDrawing=true;if(!window.requestAnimationFrame)this.draw();this.ev.trigger("board:startDrawing",{e:e,coords:t});e.preventDefault()},_onInputMove:function(e,t){this.coords.current=t;this.ev.trigger("board:drawing",{e:e,coords:t});if(!window.requestAnimationFrame)this.draw();e.preventDefault()},_onInputStop:function(e,t){if(this.isDrawing&&(!e.touches||e.touches.length===0)){this.isDrawing=false;this.saveWebStorage();this.saveHistory();this.ev.trigger("board:stopDrawing",{e:e,coords:t});this.ev.trigger("board:userAction");e.preventDefault()}},_onMouseOver:function(e,t){this.isMouseHovering=true;this.coords.old=this._getInputCoords(e);this.coords.oldMid=this._getMidInputCoords(this.coords.old);this.ev.trigger("board:mouseOver",{e:e,coords:t})},_onMouseOut:function(e,t){this.isMouseHovering=false;this.ev.trigger("board:mouseOut",{e:e,coords:t})},_getInputCoords:function(e){e=e.originalEvent?e.originalEvent:e;var t,n;if(e.touches&&e.touches.length==1){t=e.touches[0].pageX;n=e.touches[0].pageY}else{t=e.pageX;n=e.pageY}return{x:t-this.dom.$canvas.offset().left,y:n-this.dom.$canvas.offset().top}},_getMidInputCoords:function(e){return{x:this.coords.old.x+e.x>>1,y:this.coords.old.y+e.y>>1}}};DrawingBoard.Control=function(e,t){this.board=e;this.opts=$.extend({},this.defaults,t);this.$el=$(document.createElement("div")).addClass("drawing-board-control");if(this.name)this.$el.addClass("drawing-board-control-"+this.name);this.board.ev.bind("board:reset",$.proxy(this.onBoardReset,this));this.initialize.apply(this,arguments);return this};DrawingBoard.Control.prototype={name:"",defaults:{},initialize:function(){},addToBoard:function(){this.board.addControl(this)},onBoardReset:function(e){}};DrawingBoard.Control.extend=function(e,t){var n=this;var r;if(e&&e.hasOwnProperty("constructor")){r=e.constructor}else{r=function(){return n.apply(this,arguments)}}$.extend(r,n,t);var i=function(){this.constructor=r};i.prototype=n.prototype;r.prototype=new i;if(e)$.extend(r.prototype,e);r.__super__=n.prototype;return r};DrawingBoard.Control.Color=DrawingBoard.Control.extend({name:"colors",initialize:function(){this.initTemplate();var e=this;this.$el.on("click",".drawing-board-control-colors-picker",function(t){var n=$(this).attr("data-color");e.board.setColor(n);e.$el.find(".drawing-board-control-colors-current").css("background-color",n).attr("data-color",n);e.board.ev.trigger("color:changed",n);e.$el.find(".drawing-board-control-colors-rainbows").addClass("drawing-board-utils-hidden");t.preventDefault()});this.$el.on("click",".drawing-board-control-colors-current",function(t){e.$el.find(".drawing-board-control-colors-rainbows").toggleClass("drawing-board-utils-hidden");t.preventDefault()});$("body").on("click",function(t){var n=$(t.target);var r=n.hasClass("drawing-board-control-colors-current")?n:n.closest(".drawing-board-control-colors-current");var i=e.$el.find(".drawing-board-control-colors-current");var s=e.$el.find(".drawing-board-control-colors-rainbows");if((!r.length||r.get(0)!==i.get(0))&&!s.hasClass("drawing-board-utils-hidden"))s.addClass("drawing-board-utils-hidden")})},initTemplate:function(){var e='<div class="drawing-board-control-inner">'+'<div class="drawing-board-control-colors-current" style="background-color: {{color}}" data-color="{{color}}"></div>'+'<div class="drawing-board-control-colors-rainbows">{{rainbows}}</div>'+"</div>";var t='<div class="drawing-board-control-colors-picker" data-color="{{color}}" style="background-color: {{color}}"></div>';var n="";$.each([.75,.5,.25],$.proxy(function(e,r){var i=0;var s=null;n+='<div class="drawing-board-control-colors-rainbow">';if(r==.25)s=this._rgba(0,0,0,1);if(r==.5)s=this._rgba(150,150,150,1);if(r==.75)s=this._rgba(255,255,255,1);n+=DrawingBoard.Utils.tpl(t,{color:s.toString()});while(i<=330){n+=DrawingBoard.Utils.tpl(t,{color:this._hsl2Rgba(this._hsl(i-60,1,r)).toString()});i+=30}n+="</div>"},this));this.$el.append($(DrawingBoard.Utils.tpl(e,{color:this.board.color,rainbows:n})));this.$el.find(".drawing-board-control-colors-rainbows").addClass("drawing-board-utils-hidden")},onBoardReset:function(e){this.board.setColor(this.$el.find(".drawing-board-control-colors-current").attr("data-color"))},_rgba:function(e,t,n,r){return{r:e,g:t,b:n,a:r,toString:function(){return"rgba("+e+", "+t+", "+n+", "+r+")"}}},_hsl:function(e,t,n){return{h:e,s:t,l:n,toString:function(){return"hsl("+e+", "+t*100+"%, "+n*100+"%)"}}},_hex2Rgba:function(e){var t=parseInt(e.substring(1),16);return this._rgba(t>>16,t>>8&255,t&255,1)},_hsl2Rgba:function(e){function u(e,t,n){if(n<0)n+=1;if(n>1)n-=1;if(n<1/6)return e+(t-e)*6*n;if(n<1/2)return t;if(n<2/3)return e+(t-e)*(2/3-n)*6;return e}var t=e.h/360,n=e.s,r=e.l,i,s,o;if(n===0){i=s=o=r}else{var a=r<.5?r*(1+n):r+n-r*n;var f=2*r-a;i=Math.floor(u(f,a,t+1/3)*255);s=Math.floor(u(f,a,t)*255);o=Math.floor(u(f,a,t-1/3)*255)}return this._rgba(i,s,o,1)}});DrawingBoard.Control.DrawingMode=DrawingBoard.Control.extend({name:"drawingmode",defaults:{pencil:true,eraser:true,filler:true},initialize:function(){this.prevMode=this.board.getMode();$.each(["pencil","eraser","filler"],$.proxy(function(e,t){if(this.opts[t]){this.$el.append('<button class="drawing-board-control-drawingmode-'+t+'-button" data-mode="'+t+'"></button>')}},this));this.$el.on("click","button[data-mode]",$.proxy(function(e){var t=$(e.currentTarget).attr("data-mode");var n=this.board.getMode();if(n!==t)this.prevMode=n;var r=n===t?this.prevMode:t;this.board.setMode(r);e.preventDefault()},this));this.board.ev.bind("board:mode",$.proxy(function(e){this.toggleButtons(e)},this));this.toggleButtons(this.board.getMode())},toggleButtons:function(e){this.$el.find("button[data-mode]").each(function(t,n){var r=$(n);r.toggleClass("active",e===r.attr("data-mode"))})}});DrawingBoard.Control.Navigation=DrawingBoard.Control.extend({name:"navigation",defaults:{back:true,forward:true,reset:true},initialize:function(){var e="";if(this.opts.back)e+='<button class="drawing-board-control-navigation-back">←</button>';if(this.opts.forward)e+='<button class="drawing-board-control-navigation-forward">→</button>';if(this.opts.reset)e+='<button class="drawing-board-control-navigation-reset">×</button>';this.$el.append(e);if(this.opts.back){var t=this.$el.find(".drawing-board-control-navigation-back");this.board.ev.bind("historyNavigation",$.proxy(function(e){if(e===1)t.attr("disabled","disabled");else t.removeAttr("disabled")},this));this.$el.on("click",".drawing-board-control-navigation-back",$.proxy(function(e){this.board.goBackInHistory();e.preventDefault()},this))}if(this.opts.forward){var n=this.$el.find(".drawing-board-control-navigation-forward");this.board.ev.bind("historyNavigation",$.proxy(function(e){if(e===this.board.history.values.length)n.attr("disabled","disabled");else n.removeAttr("disabled")},this));this.$el.on("click",".drawing-board-control-navigation-forward",$.proxy(function(e){this.board.goForthInHistory();e.preventDefault()},this))}if(this.opts.reset){this.$el.on("click",".drawing-board-control-navigation-reset",$.proxy(function(e){this.board.reset({background:true});e.preventDefault()},this))}}});DrawingBoard.Control.Size=DrawingBoard.Control.extend({name:"size",defaults:{type:"auto",dropdownValues:[1,3,6,10,20,30,40,50]},types:["dropdown","range"],initialize:function(){if(this.opts.type=="auto")this.opts.type=this._iHasRangeInput()?"range":"dropdown";var e=$.inArray(this.opts.type,this.types)>-1?this["_"+this.opts.type+"Template"]():false;if(!e)return false;this.val=this.board.opts.size;this.opts.size=this.board.opts.size;if(this.board.opts.eraserSize)this.opts.eraserSize=this.board.opts.eraserSize;this.$el.append($(e));this.$el.attr("data-drawing-board-type",this.opts.type);this.updateView();var t=this;if(this.opts.type=="range"){this.$el.on("change",".drawing-board-control-size-range-input",function(e){t.val=$(this).val();t.updateView();t.board.ev.trigger("size:changed",t.val);e.preventDefault()})}if(this.opts.type=="dropdown"){this.$el.on("click",".drawing-board-control-size-dropdown-current",$.proxy(function(e){this.$el.find(".drawing-board-control-size-dropdown").toggleClass("drawing-board-utils-hidden")},this));this.$el.on("click","[data-size]",function(e){t.val=parseInt($(this).attr("data-size"),0);t.updateView();t.board.ev.trigger("size:changed",t.val);e.preventDefault()})}},_rangeTemplate:function(){var e='<div class="drawing-board-control-inner" title="{{size}}">'+'<input type="range" min="1" max="50" value="{{size}}" step="1" class="drawing-board-control-size-range-input">'+'<span class="drawing-board-control-size-range-current"></span>'+"</div>";return DrawingBoard.Utils.tpl(e,{size:this.board.opts.size})},_dropdownTemplate:function(){var e='<div class="drawing-board-control-inner" title="{{size}}">'+'<div class="drawing-board-control-size-dropdown-current"><span></span></div>'+'<ul class="drawing-board-control-size-dropdown">';$.each(this.opts.dropdownValues,function(t,n){e+=DrawingBoard.Utils.tpl('<li data-size="{{size}}"><span style="width: {{size}}px; height: {{size}}px; border-radius: {{size}}px;"></span></li>',{size:n})});e+="</ul></div>";return e},onBoardReset:function(e){this.updateView()},updateView:function(){var e=this.val;this.board.ctx.lineWidth=e;this.$el.find(".drawing-board-control-size-range-current, .drawing-board-control-size-dropdown-current span").css({width:e+"px",height:e+"px",borderRadius:e+"px",marginLeft:-1*e/2+"px",marginTop:-1*e/2+"px"});this.$el.find(".drawing-board-control-inner").attr("title",e);if(this.opts.type=="dropdown"){var t=null;$.each(this.opts.dropdownValues,function(n,r){if(t===null||Math.abs(r-e)<Math.abs(t-e))t=r});this.$el.find(".drawing-board-control-size-dropdown").addClass("drawing-board-utils-hidden")}},_iHasRangeInput:function(){var e=document.createElement("input"),t=":)",n=document.documentElement,r="range",i;e.setAttribute("type",r);i=e.type!=="text";e.value=t;e.style.cssText="position:absolute;visibility:hidden;";if(/^range$/.test(r)&&e.style.WebkitAppearance!==undefined){n.appendChild(e);defaultView=document.defaultView;i=defaultView.getComputedStyle&&defaultView.getComputedStyle(e,null).WebkitAppearance!=="textfield"&&e.offsetHeight!==0;n.removeChild(e)}return!!i}});DrawingBoard.Control.Download=DrawingBoard.Control.extend({name:"download",initialize:function(){this.$el.append('<button class="drawing-board-control-download-button"></button>');this.$el.on("click",".drawing-board-control-download-button",$.proxy(function(e){this.board.downloadImg();e.preventDefault()},this))}});DrawingBoard.Utils={};DrawingBoard.Utils.tpl=function(){"use strict";var e="{{",t="}}",n="[a-z0-9_][\\.a-z0-9_]*",r=new RegExp(e+"\\s*("+n+")\\s*"+t,"gi"),i;return function(e,t){return e.replace(r,function(e,n){var r=n.split("."),s=r.length,o=t,u=0;for(;u<s;u++){o=o[r[u]];if(o===i){throw"tim: '"+r[u]+"' not found in "+e}if(u===s-1){return o}}})}}();DrawingBoard.Utils.MicroEvent=function(){};DrawingBoard.Utils.MicroEvent.prototype={bind:function(e,t){this._events=this._events||{};this._events[e]=this._events[e]||[];this._events[e].push(t)},unbind:function(e,t){this._events=this._events||{};if(e in this._events===false)return;this._events[e].splice(this._events[e].indexOf(t),1)},trigger:function(e){this._events=this._events||{};if(e in this._events===false)return;for(var t=0;t<this._events[e].length;t++){this._events[e][t].apply(this,Array.prototype.slice.call(arguments,1))}}};DrawingBoard.Utils._boxBorderSize=function(e,t,n,r){t=!!t||true;n=!!n||false;var i=0,s;if(r=="width"){s=["border-left-width","border-right-width"];if(t)s.push("padding-left","padding-right");if(n)s.push("margin-left","margin-right")}else{s=["border-top-width","border-bottom-width"];if(t)s.push("padding-top","padding-bottom");if(n)s.push("margin-top","margin-bottom")}for(var o=s.length-1;o>=0;o--)i+=parseInt(e.css(s[o]).replace("px",""),10);return i};DrawingBoard.Utils.boxBorderWidth=function(e,t,n){return DrawingBoard.Utils._boxBorderSize(e,t,n,"width")};DrawingBoard.Utils.boxBorderHeight=function(e,t,n){return DrawingBoard.Utils._boxBorderSize(e,t,n,"height")};DrawingBoard.Utils.isColor=function(e){if(!e||!e.length)return false;return/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(e)||$.inArray(e.substring(0,3),["rgb","hsl"])!==-1};DrawingBoard.Utils.RGBToInt=function(e,t,n){var r=0;r|=(e&255)<<16;r|=(t&255)<<8;r|=n&255;return r};DrawingBoard.Utils.pixelAt=function(e,t,n){var r=(n*e.width+t)*4;var i=DrawingBoard.Utils.RGBToInt(e.data[r],e.data[r+1],e.data[r+2]);return[r,t,n,i]};(function(){var e=0;var t=["ms","moz","webkit","o"];for(var n=0;n<t.length&&!window.requestAnimationFrame;++n){window.requestAnimationFrame=window[t[n]+"RequestAnimationFrame"];window.cancelAnimationFrame=window[t[n]+"CancelAnimationFrame"]||window[t[n]+"CancelRequestAnimationFrame"]}})();
