first
This commit is contained in:
@@ -0,0 +1,86 @@
|
||||
if(!window.CanvasRenderingContext2D){(function(){var xamlId;var G_vmlCanvasManager_={init:function(opt_doc){var doc=opt_doc||document;doc.createElement('canvas');if(/MSIE/.test(navigator.userAgent)&&!window.opera){var self=this;createXamlScriptTag();doc.attachEvent('onreadystatechange',function(){self.init_(doc);});}},init_:function(doc){var ss=doc.createStyleSheet();ss.cssText='canvas{display:inline-block;overflow:hidden;'+
|
||||
'text-align:left;width:300px;height:150px}'+
|
||||
'canvas *{width:100%;height:100%;border:0;'+
|
||||
'background:transparen;margin:0}'+
|
||||
'canvas div {position:relative}'+
|
||||
'canvas div div{position:absolute;top:0;'+
|
||||
'filter:alpha(opacity=0);background:red}';var els=doc.getElementsByTagName('canvas');for(var i=0;i<els.length;i++){if(!els[i].getContext){this.initElement(els[i]);}}},initElement:function(el){el.getContext=function(){if(this.context_){return this.context_;}
|
||||
return this.context_=new CanvasRenderingContext2D_(this);};var attrs=el.attributes;if(attrs.width&&attrs.width.specified){el.style.width=attrs.width.nodeValue+'px';}else{el.width=el.clientWidth;}
|
||||
if(attrs.height&&attrs.height.specified){el.style.height=attrs.height.nodeValue+'px';}else{el.height=el.clientHeight;}
|
||||
el.innerHTML=getObjectHtml();el.attachEvent('onpropertychange',onPropertyChange);return el;}};function onPropertyChange(e){var el=e.srcElement;switch(e.propertyName){case 'width':el.style.width=el.attributes.width.nodeValue+'px';el.getContext().clearRect();break;case 'height':el.style.height=el.attributes.height.nodeValue+'px';el.getContext().clearRect();break;}}
|
||||
G_vmlCanvasManager_.init();function createXamlScriptTag(){document.write('<script type=text/xaml>'+
|
||||
'<Canvas x:Name="root" '+
|
||||
'xmlns="http://schemas.microsoft.com/client/2007" '+
|
||||
'xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" '+
|
||||
'Width="300" '+
|
||||
'Height="150" '+
|
||||
'Background="Transparent"> '+
|
||||
'</Canvas>'+
|
||||
'</script>');var scripts=document.scripts;var script=scripts[scripts.length-1];xamlId=script.uniqueID;script.id=xamlId;}
|
||||
function getObjectHtml(fn){return '<div><object type="application/x-silverlight" >'+
|
||||
'<param name="windowless" value="true">'+
|
||||
'<param name="background" value="transparent">'+
|
||||
'<param name="source" value="#'+xamlId+'">'+
|
||||
'</object><div></div></div>';}
|
||||
function hasSilverlight(){try{new ActiveXObject('AgControl.AgControl');return true;}catch(_){return false;}}
|
||||
var dec2hex=[];for(var i=0;i<16;i++){for(var j=0;j<16;j++){dec2hex[i*16+j]=i.toString(16)+j.toString(16);}}
|
||||
function createMatrixIdentity(){return[[1,0,0],[0,1,0],[0,0,1]];}
|
||||
function matrixMultiply(m1,m2){var result=createMatrixIdentity();for(var x=0;x<3;x++){for(var y=0;y<3;y++){var sum=0;for(var z=0;z<3;z++){sum+=m1[x][z]*m2[z][y];}
|
||||
result[x][y]=sum;}}
|
||||
return result;}
|
||||
function doTransform(ctx){transformObject(ctx,getRoot(ctx),ctx.m_);}
|
||||
function transformObject(ctx,obj,m){var transform=obj.renderTransform;var matrix;if(!transform){transform=create(ctx,'<MatrixTransform/>');matrix=create(ctx,'<Matrix/>');transform.matrix=matrix;obj.renderTransform=transform;}else{matrix=transform.matrix;}
|
||||
matrix.m11=m[0][0];matrix.m12=m[0][1];matrix.m21=m[1][0];matrix.m22=m[1][1];matrix.offsetX=m[2][0];matrix.offsetY=m[2][1];}
|
||||
function copyState(o1,o2){o2.fillStyle=o1.fillStyle;o2.lineCap=o1.lineCap;o2.lineJoin=o1.lineJoin;o2.lineWidth=o1.lineWidth;o2.miterLimit=o1.miterLimit;o2.shadowBlur=o1.shadowBlur;o2.shadowColor=o1.shadowColor;o2.shadowOffsetX=o1.shadowOffsetX;o2.shadowOffsetY=o1.shadowOffsetY;o2.strokeStyle=o1.strokeStyle;o2.globalAlpha=o1.globalAlpha;o2.arcScaleX_=o1.arcScaleX_;o2.arcScaleY_=o1.arcScaleY_;}
|
||||
var decToHex=[];for(var i=0;i<16;i++){for(var j=0;j<16;j++){decToHex[i*16+j]=i.toString(16)+j.toString(16);}}
|
||||
var colorData={darkgrey:'#A9A9A9',darkslategrey:'#2F4F4F',dimgrey:'#696969',grey:'#808080',lightgrey:'#D3D3D3',lightslategrey:'#778899',slategrey:'#708090'};function getRgbHslContent(styleString){var start=styleString.indexOf('(',3);var end=styleString.indexOf(')',start+1);var parts=styleString.substring(start+1,end).split(',');if(parts.length==4&&styleString.substr(3,1)=='a'){alpha=+parts[3];}else{parts[3]=1;}
|
||||
return parts;}
|
||||
function percent(s){return parseFloat(s)/100;}
|
||||
function clamp(v,min,max){return Math.min(max,Math.max(min,v));}
|
||||
function hslToRgb(parts){var r,g,b;h=parseFloat(parts[0])/360%360;if(h<0)
|
||||
h++;s=clamp(percent(parts[1]),0,1);l=clamp(percent(parts[2]),0,1);if(s==0){r=g=b=l;}else{var q=l<0.5?l*(1+s):l+s-l*s;var p=2*l-q;r=hueToRgb(p,q,h+1/3);g=hueToRgb(p,q,h);b=hueToRgb(p,q,h-1/3);}
|
||||
return decToHex[Math.floor(r*255)]+
|
||||
decToHex[Math.floor(g*255)]+
|
||||
decToHex[Math.floor(b*255)];}
|
||||
function hueToRgb(m1,m2,h){if(h<0)
|
||||
h++;if(h>1)
|
||||
h--;if(6*h<1)
|
||||
return m1+(m2-m1)*6*h;else if(2*h<1)
|
||||
return m2;else if(3*h<2)
|
||||
return m1+(m2-m1)*(2/3-h)*6;else
|
||||
return m1;}
|
||||
function translateColor(styleString){var str,alpha=1;styleString=String(styleString);if(styleString.charAt(0)=='#'){return styleString;}else if(/^rgb/.test(styleString)){var parts=getRgbHslContent(styleString);var str='',n;for(var i=0;i<3;i++){if(parts[i].indexOf('%')!=-1){n=Math.floor(percent(parts[i])*255);}else{n=+parts[i];}
|
||||
str+=decToHex[clamp(n,0,255)];}
|
||||
alpha=parts[3];}else if(/^hsl/.test(styleString)){var parts=getRgbHslContent(styleString);str=hslToRgb(parts);alpha=parts[3];}else if(styleString in colorData){return colorData[styleString];}else{return styleString;}
|
||||
return '#'+dec2hex[Math.floor(alpha*255)]+str;}
|
||||
function processLineCap(lineCap){switch(lineCap){case 'butt':return 'flat';case 'round':return 'round';case 'square':default:return 'square';}}
|
||||
function getRoot(ctx){return ctx.canvas.firstChild.firstChild.content.findName('root');}
|
||||
function create(ctx,s,opt_args){if(opt_args){s=s.replace(/\%(\d+)/g,function(match,index){return opt_args[+index-1];});}
|
||||
try{return ctx.canvas.firstChild.firstChild.content.createFromXaml(s);}catch(ex){throw Error('Could not create XAML from: '+s);}}
|
||||
function drawShape(ctx,s,opt_args){var canvas=ctx.lastCanvas_||create(ctx,'<Canvas/>');var shape=create(ctx,s,opt_args);canvas.children.add(shape);transformObject(ctx,canvas,ctx.m_);if(!ctx.lastCanvas_){getRoot(ctx).children.add(canvas);ctx.lastCanvas_=canvas;}
|
||||
return shape;}
|
||||
function createBrushObject(ctx,value){if(value instanceof CanvasGradient_){return value.createBrush_(ctx);}else if(value instanceof CanvasPattern_){throw Error('Not implemented');}else{return create(ctx,'<SolidColorBrush Color="%1"/>',[translateColor(value)]);}}
|
||||
function CanvasRenderingContext2D_(surfaceElement){this.m_=createMatrixIdentity();this.lastCanvas_=null;this.mStack_=[];this.aStack_=[];this.currentPath_=[];this.strokeStyle='#000';this.fillStyle='#000';this.lineWidth=1;this.lineJoin='miter';this.lineCap='butt';this.miterLimit=10;this.globalAlpha=1;this.canvas=surfaceElement;};var contextPrototype=CanvasRenderingContext2D_.prototype;contextPrototype.clearRect=function(){var root=getRoot(this);root.children.clear();this.currentPath_=[];this.lastCanvas_=null;};contextPrototype.beginPath=function(){this.currentPath_=[];};contextPrototype.moveTo=function(aX,aY){this.currentPath_.push('M'+aX+','+aY);};contextPrototype.lineTo=function(aX,aY){if(this.currentPath_.length==0)return;this.currentPath_.push('L'+aX+','+aY);};contextPrototype.bezierCurveTo=function(aCP1x,aCP1y,aCP2x,aCP2y,aX,aY){if(this.currentPath_.length==0)return;this.currentPath_.push('C'+aCP1x+','+aCP1y+' '+
|
||||
aCP2x+','+aCP2y+' '+
|
||||
aX+' '+aY);};contextPrototype.quadraticCurveTo=function(aCPx,aCPy,aX,aY){if(this.currentPath_.length==0)return;this.currentPath_.push('Q'+aCPx+','+aCPy+' '+
|
||||
aX+','+aY);};contextPrototype.arcTo=function(x1,y1,x2,y2,radius){if(this.currentPath_.length==0)return;};contextPrototype.arc=function(aX,aY,aRadius,aStartAngle,aEndAngle,aClockwise){var deltaAngle=Math.abs(aStartAngle-aEndAngle);if(aStartAngle==aEndAngle){return;}
|
||||
var endX=aX+aRadius*Math.cos(aEndAngle);var endY=aY+aRadius*Math.sin(aEndAngle);if(deltaAngle>=2*Math.PI){this.arc(aX,aY,aRadius,aStartAngle,aStartAngle+Math.PI,aClockwise);this.arc(aX,aY,aRadius,aStartAngle+Math.PI,aStartAngle+2*Math.PI,aClockwise);this.moveTo(endX,endY);return;}
|
||||
var startX=aX+aRadius*Math.cos(aStartAngle);var startY=aY+aRadius*Math.sin(aStartAngle);var rotationAngle=deltaAngle*180/Math.PI;var sweepDirection=aClockwise?0:1;var isLargeArc=rotationAngle>=180==Boolean(aClockwise)?0:1;if(this.currentPath_.length!=0){this.lineTo(startX,startY);}else{this.moveTo(startX,startY);}
|
||||
this.currentPath_.push('A'+aRadius+','+aRadius+' '+
|
||||
rotationAngle+' '+
|
||||
isLargeArc+' '+
|
||||
sweepDirection+' '+
|
||||
endX+','+endY);};contextPrototype.rect=function(aX,aY,aWidth,aHeight){this.moveTo(aX,aY);this.lineTo(aX+aWidth,aY);this.lineTo(aX+aWidth,aY+aHeight);this.lineTo(aX,aY+aHeight);this.closePath();};contextPrototype.strokeRect=function(aX,aY,aWidth,aHeight){this.beginPath();this.moveTo(aX,aY);this.lineTo(aX+aWidth,aY);this.lineTo(aX+aWidth,aY+aHeight);this.lineTo(aX,aY+aHeight);this.closePath();this.stroke();this.currentPath_=[];};contextPrototype.fillRect=function(aX,aY,aWidth,aHeight){this.beginPath();this.moveTo(aX,aY);this.lineTo(aX+aWidth,aY);this.lineTo(aX+aWidth,aY+aHeight);this.lineTo(aX,aY+aHeight);this.closePath();this.fill();this.currentPath_=[];};contextPrototype.createLinearGradient=function(aX0,aY0,aX1,aY1){return new LinearCanvasGradient_(aX0,aY0,aX1,aY1);};contextPrototype.createRadialGradient=function(x0,y0,r0,x1,y1,r1){return new RadialCanvasGradient_(x0,y0,r0,x1,y1,r1);};contextPrototype.drawImage=function(image,var_args){var dx,dy,dw,dh,sx,sy,sw,sh;if(arguments.length==3){dx=arguments[1];dy=arguments[2];}else if(arguments.length==5){dx=arguments[1];dy=arguments[2];dw=arguments[3];dh=arguments[4];}else if(arguments.length==9){sx=arguments[1];sy=arguments[2];sw=arguments[3];sh=arguments[4];dx=arguments[5];dy=arguments[6];dw=arguments[7];dh=arguments[8];}else{throw Error('Invalid number of arguments');}
|
||||
var slImage;if(arguments.length==9){slImage=drawShape(this,'<Image Source="%1"/>',[image.src]);var clipRect=create(this,'<RectangleGeometry Rect="%1,%2,%3,%4"/>',[sx,sy,sw,sh]);slImage.clip=clipRect;var m=createMatrixIdentity();m[2][0]=-sx;m[2][1]=-sy;var m2=createMatrixIdentity();m2[0][0]=dw/sw;m2[1][1]=dh/sh;m=matrixMultiply(m,m2);m[2][0]+=dx;m[2][1]+=dy;transformObject(this,slImage,m);}else{slImage=drawShape(this,'<Image Source="%1" Canvas.Left="%2" Canvas.Top="%3"/>',[image.src,dx,dy]);if(dw!=undefined||dh!=undefined){slImage.width=dw;slImage.height=dh;slImage.stretch='fill';}}};contextPrototype.stroke=function(){if(this.currentPath_.length==0)return;var path=drawShape(this,'<Path Data="%1"/>',[this.currentPath_.join(' ')]);path.stroke=createBrushObject(this,this.strokeStyle);path.opacity=this.globalAlpha;path.strokeThickness=this.lineWidth;path.strokeMiterLimit=this.miterLimit;path.strokeLineJoin=this.lineJoin;path.strokeEndLineCap=path.strokeStartLineCap=processLineCap(this.lineCap);};contextPrototype.fill=function(){if(this.currentPath_.length==0)return;var path=drawShape(this,'<Path Data="%1"/>',[this.currentPath_.join(' ')]);path.data.fillRule='NonZero';path.fill=createBrushObject(this,this.fillStyle);path.fill.opacity=this.globalAlpha;};contextPrototype.closePath=function(){this.currentPath_.push('z');};function setM(self,m){self.m_=m;self.lastCanvas_=null;};contextPrototype.save=function(){var o={};copyState(this,o);this.aStack_.push(o);this.mStack_.push(this.m_);setM(this,matrixMultiply(createMatrixIdentity(),this.m_));};contextPrototype.restore=function(){if(this.aStack_.length){copyState(this.aStack_.pop(),this);this.m_=this.mStack_.pop();}};contextPrototype.translate=function(aX,aY){var m1=[[1,0,0],[0,1,0],[aX,aY,1]];setM(this,matrixMultiply(m1,this.m_));};contextPrototype.rotate=function(aRot){var c=Math.cos(aRot);var s=Math.sin(aRot);var m1=[[c,s,0],[-s,c,0],[0,0,1]];setM(this,matrixMultiply(m1,this.m_));};contextPrototype.scale=function(aX,aY){var m1=[[aX,0,0],[0,aY,0],[0,0,1]];setM(this,matrixMultiply(m1,this.m_));};contextPrototype.transform=function(m11,m12,m21,m22,dx,dy){var m1=[[m11,m12,0],[m21,m22,0],[dx,dy,1]];setM(this,matrixMultiply(m1,this.m_));};contextPrototype.setTransform=function(m11,m12,m21,m22,dx,dy){setM(this,[[m11,m12,0],[m21,m22,0],[dx,dy,1],]);};contextPrototype.clip=function(){if(this.currentPath_.length){var clip=this.currentPath_.join(' ');var canvas=create(this,'<Canvas Width="%1" Height="%2" Clip="%3"/>',[getRoot(this).width,getRoot(this).height,clip]);var parent=this.lastCanvas_||getRoot(this);parent.children.add(canvas);this.lastCanvas_=canvas;}};contextPrototype.createPattern=function(){return new CanvasPattern_;};function CanvasGradient_(){this.colors_=[];}
|
||||
CanvasGradient_.prototype.addColorStop=function(aOffset,aColor){aColor=translateColor(aColor);this.colors_.push({offset:aOffset,color:aColor});};CanvasGradient_.prototype.createStops_=function(ctx,brushObj,colors){var gradientStopCollection=brushObj.gradientStops;for(var i=0,c;c=colors[i];i++){var color=translateColor(c.color);gradientStopCollection.add(create(ctx,'<GradientStop Color="%1" Offset="%2"/>',[color,c.offset]));}};function LinearCanvasGradient_(x0,y0,x1,y1){CanvasGradient_.call(this);this.x0_=x0;this.y0_=y0;this.x1_=x1;this.y1_=y1;}
|
||||
LinearCanvasGradient_.prototype=new CanvasGradient_;LinearCanvasGradient_.prototype.createBrush_=function(ctx){var brushObj=create(ctx,'<LinearGradientBrush MappingMode="Absolute" '+
|
||||
'StartPoint="%1,%2" EndPoint="%3,%4"/>',[this.x0_,this.y0_,this.x1_,this.y1_]);this.createStops_(ctx,brushObj,this.colors_);return brushObj;};function isNanOrInfinite(v){return isNaN(v)||!isFinite(v);}
|
||||
function RadialCanvasGradient_(x0,y0,r0,x1,y1,r1){if(r0<0||r1<0||isNanOrInfinite(x0)||isNanOrInfinite(y0)||isNanOrInfinite(x1)||isNanOrInfinite(y1)){var error=Error('DOMException.INDEX_SIZE_ERR');error.code=1;throw error;}
|
||||
CanvasGradient_.call(this);this.x0_=x0;this.y0_=y0;this.r0_=r0;this.x1_=x1;this.y1_=y1;this.r1_=r1;}
|
||||
RadialCanvasGradient_.prototype=new CanvasGradient_;CanvasGradient_.prototype.createBrush_=function(ctx){if(this.x0_==this.x1_&&this.y0_==this.y1_&&this.r0_==this.r1_){return null;}
|
||||
var radius=Math.max(this.r0_,this.r1_);var minRadius=Math.min(this.r0_,this.r1_);var brushObj=create(ctx,'<RadialGradientBrush MappingMode="Absolute" '+
|
||||
'GradientOrigin="%1,%2" Center="%3,%4" '+
|
||||
'RadiusX="%5" RadiusY="%5"/>',[this.x0_,this.y0_,this.x1_,this.y1_,radius]);var colors=this.colors_.concat();if(this.r1_<this.r0_){colors.reverse();for(var i=0,c;c=colors[i];i++){c.offset=1-c.offset;}}
|
||||
colors.sort(function(c1,c2){return c1.offset-c2.offset;});if(minRadius>0){for(var i=0,c;c=colors[i];i++){c.offset=minRadius/radius+(radius-minRadius)/radius*c.offset;}}
|
||||
this.createStops_(ctx,brushObj,colors);return brushObj;};function CanvasPattern_(){}
|
||||
G_vmlCanvasManager=G_vmlCanvasManager_;CanvasRenderingContext2D=CanvasRenderingContext2D_;CanvasGradient=CanvasGradient_;CanvasPattern=CanvasPattern_;})();}
|
||||
Reference in New Issue
Block a user