PageRenderTime 43ms CodeModel.GetById 14ms RepoModel.GetById 1ms app.codeStats 0ms

/plugins/c9.ide.imgeditor/lib_pixastic.js

https://gitlab.com/unofficial-mirrors/c9-core
JavaScript | 72 lines | 63 code | 4 blank | 5 comment | 21 complexity | e7191639f87b538c459b573949701b2a MD5 | raw file
  1. /*
  2. * Pixastic - JavaScript Image Processing Library
  3. * Copyright (c) 2008 Jacob Seidelin, jseidelin@nihilogic.dk, http://blog.nihilogic.dk/
  4. * MIT License [http://www.pixastic.com/lib/license.txt]
  5. */
  6. define(function(require, exports, module) {
  7. var Pixastic=(function(){function addEvent(el,event,handler){if(el.addEventListener)
  8. el.addEventListener(event,handler,false);else if(el.attachEvent)
  9. el.attachEvent("on"+event,handler);}
  10. function onready(handler){var handlerDone=false;var execHandler=function(){if(!handlerDone){handlerDone=true;handler();}}
  11. document.write("<"+"script defer src=\"//:\" id=\"__onload_ie_pixastic__\"></"+"script>");var script=document.getElementById("__onload_ie_pixastic__");script.onreadystatechange=function(){if(script.readyState=="complete"){script.parentNode.removeChild(script);execHandler();}}
  12. if(document.addEventListener)
  13. document.addEventListener("DOMContentLoaded",execHandler,false);addEvent(window,"load",execHandler);}
  14. function init(){var imgEls=getElementsByClass("pixastic",null,"img");var canvasEls=getElementsByClass("pixastic",null,"canvas");var elements=imgEls.concat(canvasEls);for(var i=0;i<elements.length;i++){(function(){var el=elements[i];var actions=[];var classes=el.className.split(" ");for(var c=0;c<classes.length;c++){var cls=classes[c];if(cls.substring(0,9)=="pixastic-"){var actionName=cls.substring(9);if(actionName!="")
  15. actions.push(actionName);}}
  16. if(actions.length){if(el.tagName.toLowerCase()=="img"){var dataImg=new Image();dataImg.src=el.src;if(dataImg.complete){for(var a=0;a<actions.length;a++){var res=Pixastic.applyAction(el,el,actions[a],null);if(res)
  17. el=res;}}else{dataImg.onload=function(){for(var a=0;a<actions.length;a++){var res=Pixastic.applyAction(el,el,actions[a],null)
  18. if(res)
  19. el=res;}}}}else{setTimeout(function(){for(var a=0;a<actions.length;a++){var res=Pixastic.applyAction(el,el,actions[a],null);if(res)
  20. el=res;}},1);}}})();}}
  21. if(typeof pixastic_parseonload!="undefined"&&pixastic_parseonload)
  22. onready(init);function getElementsByClass(searchClass,node,tag){var classElements=new Array();if(node==null)
  23. node=document;if(tag==null)
  24. tag='*';var els=node.getElementsByTagName(tag);var elsLen=els.length;var pattern=new RegExp("(^|\\s)"+searchClass+"(\\s|$)");for(i=0,j=0;i<elsLen;i++){if(pattern.test(els[i].className)){classElements[j]=els[i];j++;}}
  25. return classElements;}
  26. var debugElement;function writeDebug(text,level){if(!Pixastic.debug)return;try{switch(level){case"warn":console.warn("Pixastic:",text);break;case"error":console.error("Pixastic:",text);break;default:console.log("Pixastic:",text);}}catch(e) {}
  27. if(!debugElement){}}
  28. var hasCanvas=(function(){var c=document.createElement("canvas");var val=false;try{val=!!((typeof c.getContext=="function")&&c.getContext("2d"));}catch(e) {}
  29. return function(){return val;}})();var hasCanvasImageData=(function(){var c=document.createElement("canvas");var val=false;var ctx;try{if(typeof c.getContext=="function"&&(ctx=c.getContext("2d"))){val=(typeof ctx.getImageData=="function");}}catch(e) {}
  30. return function(){return val;}})();var hasGlobalAlpha=(function(){var hasAlpha=false;var red=document.createElement("canvas");if(hasCanvas()&&hasCanvasImageData()){red.width=red.height=1;var redctx=red.getContext("2d");redctx.fillStyle="rgb(255,0,0)";redctx.fillRect(0,0,1,1);var blue=document.createElement("canvas");blue.width=blue.height=1;var bluectx=blue.getContext("2d");bluectx.fillStyle="rgb(0,0,255)";bluectx.fillRect(0,0,1,1);redctx.globalAlpha=0.5;redctx.drawImage(blue,0,0);var reddata=redctx.getImageData(0,0,1,1).data;hasAlpha=(reddata[2]!=255);}
  31. return function(){return hasAlpha;}})();return{parseOnLoad:false,debug:false,applyAction:function(img,dataImg,actionName,options){options=options||{};var imageIsCanvas=(img.tagName.toLowerCase()=="canvas");if(imageIsCanvas&&Pixastic.Client.isIE()){if(Pixastic.debug)writeDebug("Tried to process a canvas element but browser is IE.");return false;}
  32. var canvas,ctx;var hasOutputCanvas=false;if(Pixastic.Client.hasCanvas()){hasOutputCanvas=!!options.resultCanvas;canvas=options.resultCanvas||document.createElement("canvas");ctx=canvas.getContext("2d");}
  33. var w=img.offsetWidth;var h=img.offsetHeight;if(imageIsCanvas){w=img.width;h=img.height;}
  34. if(w==0||h==0){if(img.parentNode==null){var oldpos=img.style.position;var oldleft=img.style.left;img.style.position="absolute";img.style.left="-9999px";document.body.appendChild(img);w=img.offsetWidth;h=img.offsetHeight;document.body.removeChild(img);img.style.position=oldpos;img.style.left=oldleft;}else{if(Pixastic.debug)writeDebug("Image has 0 width and/or height.");return;}}
  35. if(actionName.indexOf("(")>-1){var tmp=actionName;actionName=tmp.substr(0,tmp.indexOf("("));var arg=tmp.match(/\((.*?)\)/);if(arg[1]){arg=arg[1].split(";");for(var a=0;a<arg.length;a++){thisArg=arg[a].split("=");if(thisArg.length==2){if(thisArg[0]=="rect"){var rectVal=thisArg[1].split(",");options[thisArg[0]]={left:parseInt(rectVal[0],10)||0,top:parseInt(rectVal[1],10)||0,width:parseInt(rectVal[2],10)||0,height:parseInt(rectVal[3],10)||0}}else{options[thisArg[0]]=thisArg[1];}}}}}
  36. if(!options.rect){options.rect={left:0,top:0,width:w,height:h};}else{options.rect.left=Math.round(options.rect.left);options.rect.top=Math.round(options.rect.top);options.rect.width=Math.round(options.rect.width);options.rect.height=Math.round(options.rect.height);}
  37. var validAction=false;if(Pixastic.Actions[actionName]&&typeof Pixastic.Actions[actionName].process=="function"){validAction=true;}
  38. if(!validAction){if(Pixastic.debug)writeDebug("Invalid action \""+actionName+"\". Maybe file not included?");return false;}
  39. if(!Pixastic.Actions[actionName].checkSupport()){if(Pixastic.debug)writeDebug("Action \""+actionName+"\" not supported by this browser.");return false;}
  40. if(Pixastic.Client.hasCanvas()){if(canvas!==img){canvas.width=w;canvas.height=h;}
  41. if(!hasOutputCanvas){canvas.style.width=w+"px";canvas.style.height=h+"px";}
  42. ctx.drawImage(dataImg,0,0,w,h);if(!img.__pixastic_org_image){canvas.__pixastic_org_image=img;canvas.__pixastic_org_width=w;canvas.__pixastic_org_height=h;}else{canvas.__pixastic_org_image=img.__pixastic_org_image;canvas.__pixastic_org_width=img.__pixastic_org_width;canvas.__pixastic_org_height=img.__pixastic_org_height;}}else if(Pixastic.Client.isIE()&&typeof img.__pixastic_org_style=="undefined"){img.__pixastic_org_style=img.style.cssText;}
  43. var params={image:img,canvas:canvas,width:w,height:h,useData:true,options:options}
  44. var res=Pixastic.Actions[actionName].process(params);if(!res){return false;}
  45. if(Pixastic.Client.hasCanvas()){if(params.useData){if(Pixastic.Client.hasCanvasImageData()){canvas.getContext("2d").putImageData(params.canvasData,options.rect.left,options.rect.top);canvas.getContext("2d").fillRect(0,0,0,0);}}
  46. if(!options.leaveDOM){canvas.title=img.title;canvas.imgsrc=img.imgsrc;if(!imageIsCanvas)canvas.alt=img.alt;if(!imageIsCanvas)canvas.imgsrc=img.src;canvas.className=img.className;canvas.style.cssText=img.style.cssText;canvas.name=img.name;canvas.tabIndex=img.tabIndex;canvas.id=img.id;if(img.parentNode&&img.parentNode.replaceChild){img.parentNode.replaceChild(canvas,img);}}
  47. options.resultCanvas=canvas;return canvas;}
  48. return img;},prepareData:function(params,getCopy){var ctx=params.canvas.getContext("2d");var rect=params.options.rect;var dataDesc=ctx.getImageData(rect.left,rect.top,rect.width,rect.height);var data=dataDesc.data;if(!getCopy)params.canvasData=dataDesc;return data;},process:function(img,actionName,options,callback){if(img.tagName.toLowerCase()=="img"){var dataImg=new Image();dataImg.src=img.src;if(dataImg.complete){var res=Pixastic.applyAction(img,dataImg,actionName,options);if(callback)callback(res);return res;}else{dataImg.onload=function(){var res=Pixastic.applyAction(img,dataImg,actionName,options)
  49. if(callback)callback(res);}}}
  50. if(img.tagName.toLowerCase()=="canvas"){var res=Pixastic.applyAction(img,img,actionName,options);if(callback)callback(res);return res;}},revert:function(img){if(Pixastic.Client.hasCanvas()){if(img.tagName.toLowerCase()=="canvas"&&img.__pixastic_org_image){img.width=img.__pixastic_org_width;img.height=img.__pixastic_org_height;img.getContext("2d").drawImage(img.__pixastic_org_image,0,0);if(img.parentNode&&img.parentNode.replaceChild){img.parentNode.replaceChild(img.__pixastic_org_image,img);}
  51. return img;}}else if(Pixastic.Client.isIE()){if(typeof img.__pixastic_org_style!="undefined")
  52. img.style.cssText=img.__pixastic_org_style;}},Client:{hasCanvas:hasCanvas,hasCanvasImageData:hasCanvasImageData,hasGlobalAlpha:hasGlobalAlpha,isIE:function(){return!!document.all&&!!window.attachEvent&&!window.opera;}},Actions:{}}})();Pixastic.Actions.crop={process:function(params){if(Pixastic.Client.hasCanvas()){var rect=params.options.rect;var width=rect.width;var height=rect.height;var top=rect.top;var left=rect.left;if(typeof params.options.left!="undefined")
  53. left=parseInt(params.options.left,10);if(typeof params.options.top!="undefined")
  54. top=parseInt(params.options.top,10);if(typeof params.options.height!="undefined")
  55. width=parseInt(params.options.width,10);if(typeof params.options.height!="undefined")
  56. height=parseInt(params.options.height,10);if(left<0)left=0;if(left>params.width-1)left=params.width-1;if(top<0)top=0;if(top>params.height-1)top=params.height-1;if(width<1)width=1;if(left+width>params.width)
  57. width=params.width-left;if(height<1)height=1;if(top+height>params.height)
  58. height=params.height-top;var copy=document.createElement("canvas");copy.width=params.width;copy.height=params.height;copy.getContext("2d").drawImage(params.canvas,0,0);params.canvas.width=width;params.canvas.height=height;params.canvas.getContext("2d").clearRect(0,0,width,height);params.canvas.getContext("2d").drawImage(copy,left,top,width,height,0,0,width,height);params.useData=false;return true;}},checkSupport:function(){return Pixastic.Client.hasCanvas();}}
  59. Pixastic.Actions.fliph={process:function(params){if(Pixastic.Client.hasCanvas()){var rect=params.options.rect;var copyCanvas=document.createElement("canvas");copyCanvas.width=rect.width;copyCanvas.height=rect.height;copyCanvas.getContext("2d").drawImage(params.image,rect.left,rect.top,rect.width,rect.height,0,0,rect.width,rect.height);var ctx=params.canvas.getContext("2d");ctx.clearRect(rect.left,rect.top,rect.width,rect.height);ctx.scale(-1,1);ctx.drawImage(copyCanvas,-rect.left-rect.width,rect.top,rect.width,rect.height)
  60. params.useData=false;return true;}else if(Pixastic.Client.isIE()){params.image.style.filter+=" fliph";return true;}},checkSupport:function(){return(Pixastic.Client.hasCanvas()||Pixastic.Client.isIE());}}
  61. Pixastic.Actions.flipv={process:function(params){if(Pixastic.Client.hasCanvas()){var rect=params.options.rect;var copyCanvas=document.createElement("canvas");copyCanvas.width=rect.width;copyCanvas.height=rect.height;copyCanvas.getContext("2d").drawImage(params.image,rect.left,rect.top,rect.width,rect.height,0,0,rect.width,rect.height);var ctx=params.canvas.getContext("2d");ctx.clearRect(rect.left,rect.top,rect.width,rect.height);ctx.scale(1,-1);ctx.drawImage(copyCanvas,rect.left,-rect.top-rect.height,rect.width,rect.height)
  62. params.useData=false;return true;}else if(Pixastic.Client.isIE()){params.image.style.filter+=" flipv";return true;}},checkSupport:function(){return(Pixastic.Client.hasCanvas()||Pixastic.Client.isIE());}}
  63. Pixastic.Actions.resize={process:function(params){if(Pixastic.Client.hasCanvas()){var width=parseInt(params.options.width,10);var height=parseInt(params.options.height,10);var canvas=params.canvas;if(width<1)width=1;if(width<2)width=2;var copy=document.createElement("canvas");copy.width=width;copy.height=height;copy.getContext("2d").drawImage(canvas,0,0,width,height);canvas.width=width;canvas.height=height;canvas.getContext("2d").drawImage(copy,0,0);params.useData=false;return true;}},checkSupport:function(){return Pixastic.Client.hasCanvas();}}
  64. Pixastic.Actions.rotate={process:function(params){if(Pixastic.Client.hasCanvas()){var canvas=params.canvas;var width=params.width;var height=params.height;var copy=document.createElement("canvas");copy.width=width;copy.height=height;copy.getContext("2d").drawImage(canvas,0,0,width,height);var angle=-parseFloat(params.options.angle)*Math.PI/180;var dimAngle=angle;if(dimAngle>Math.PI*0.5)
  65. dimAngle=Math.PI-dimAngle;if(dimAngle<-Math.PI*0.5)
  66. dimAngle=-Math.PI-dimAngle;var diag=Math.sqrt(width*width+height*height);var diagAngle1=Math.abs(dimAngle)-Math.abs(Math.atan2(height,width));var diagAngle2=Math.abs(dimAngle)+Math.abs(Math.atan2(height,width));var newWidth=Math.abs(Math.cos(diagAngle1)*diag);var newHeight=Math.abs(Math.sin(diagAngle2)*diag);canvas.width=newWidth;canvas.height=newHeight;var ctx=canvas.getContext("2d");ctx.translate(newWidth/2,newHeight/2);ctx.rotate(angle);ctx.drawImage(copy,-width/2,-height/2);params.useData=false;return true;}},checkSupport:function(){return Pixastic.Client.hasCanvas();}}
  67. module.exports = Pixastic;
  68. });