forked from JarenChow/JanvasExamples
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathjanvasexamples.min.js
2 lines (2 loc) · 64.2 KB
/
janvasexamples.min.js
1
2
// https://github.com/JarenChow/Janvas Created by JarenChow in 2020 janvas.js v1.3.8
!function(global,factory){"object"==typeof exports&&"undefined"!=typeof module?module.exports=factory(require("janvas")):"function"==typeof define&&define.amd?define(["janvas"],factory):(global=global||self).janvasexamples=factory(global.janvas)}(this,function(janvas){"use strict";function antv(container){return new janvas.Canvas({container:container,components:{factory:(Node.prototype={setXY:function(x,y){this.arc.getMatrix().setOffset(this.x=x,this.y=y),this.text.init(x+this._defaultRadius*this._scale*2,y,x+this._defaultRadius*this._scale*2,y)},getX:function(){return this.x},getY:function(){return this.y},getLabel:function(){return this.text.getText()},setScale:function(scale){this._scale=scale,this.arc.getMatrix().setScale(scale,scale),this.text.getMatrix().setScale(scale,scale)},fillStroke:function(){this.arc.fillStroke(),this._showText&&this.text.fill()},onlyFill:function(){this._arc.fill()},in:function(rect){return janvas.Collision.rect(this.x-this._defaultRadius*this._scale,this.y-this._defaultRadius*this._scale,this.x+this._defaultRadius*this._scale,this.y+this._defaultRadius*this._scale,rect.getLeft(),rect.getTop(),rect.getRight(),rect.getBottom())},isPointInPath:function(x,y){return this._arc.isPointInPath(x,y)},highlight:function(flag){flag?this.arc.getStyle().setFillStyle("#FF0000").setStrokeStyle("#000000").setLineWidth(1):this.arc.getStyle().setFillStyle("#C6E5FF").setStrokeStyle("#5B8FF9").setLineWidth(.3)},showText:function(flag){this._showText=flag},mark:function(){this.lastX=this.x,this.lastY=this.y},drag:function(moveX,moveY){this.setXY(this.lastX+moveX,this.lastY+moveY)},wheel:function(x,y,scaling,scale){this.setScale(scale),this.setXY(x+(this.x-x)*scaling,y+(this.y-y)*scaling),this.draw=scale*this._defaultRadius<1?this.onlyFill:this.fillStroke}},Edge.prototype={draw:function(){this._show&&this.line.stroke()},refresh:function(){this.line.setStart(this.source.getX(),this.source.getY()).setEndX(this.target.getX()).setEndY(this.target.getY())},setLineWidth:function(scale){this.line.getStyle().setLineWidth(scale/10)},show:function(flag){this._show=flag}},Hint.prototype={draw:function(){this._show&&(this.roundRect.fillStroke(),this.text.fill())},setXY:function(x,y){x+=this._of,y-=this._of,this.text.setStart(x+this._pdl,y-this._pdt),this.roundRect.setStart(x,y)},setLabel:function(label){this.label!==label&&(this.label=label,this.text.setText(label),this.roundRect.setWidth(this.text.getActualBoundingBoxWidth()+2*this._pdl).setHeight(-(this.text.getActualBoundingBoxHeight()+2*this._pdt)))},show:function(flag){this._show=flag}},{nodesMap:new Map,newNode:function($ctx,id,x,y,node){node=new Node($ctx,id,x,y,node);return this.nodesMap.set(id,node),node},newEdge:function($ctx,source,target){return source=this.nodesMap.get(source),target=this.nodesMap.get(target),source&&target?new Edge($ctx,source,target):null},Hint:Hint})},methods:{init:function(){this.nodes=[],this.edges=[],this.hint=new this.factory.Hint(this.$ctx),this.background=new janvas.Rect(this.$ctx,0,0,this.$width,this.$height)},draw:function(){this.$clear(),this.edges.forEach(function(edge){edge.draw()}),this.nodes.forEach(function(node){node.in(this.background)&&node.draw()},this),this.hint.draw()},data:function(res){this.nodes.length=this.edges.length=0,res.nodes.forEach(function(node){this.nodes.push(this.factory.newNode(this.$ctx,node.id,node.x,node.y,node.olabel))},this),res.edges.forEach(function(edge){(edge=this.factory.newEdge(this.$ctx,edge.source,edge.target))&&this.edges.push(edge)},this),this.draw()}},events:{mousedown:function(){this._mousedown=!0,this.nodes.forEach(function(node){node.mark()}),void 0===this._current&&this.edges.forEach(function(edge){edge.show(!1)}),this.draw()},mousemove:function(ev){var mousein;this._mousedown?void 0===this._current?this.nodes.forEach(function(node){node.drag(ev.$moveX,ev.$moveY)},this):(this._current.drag(ev.$moveX,ev.$moveY),this.hint.setXY(ev.$x,ev.$y),this.edges.forEach(function(edge){edge.refresh()})):(mousein=!0,this.nodes.forEach(function(node){node.isPointInPath(ev.$x,ev.$y)&&(this._current=node,mousein=!1),node.highlight(!1)},this),mousein?(this._current=void 0,this.hint.show(!1)):(this._current.highlight(!0),this.hint.setLabel(this._current.getLabel()),this.hint.setXY(ev.$x,ev.$y),this.hint.show(!0))),this.draw()},mouseup:function(){this._mousedown=!1,this.edges.forEach(function(edge){edge.show(!0),edge.refresh()}),this.draw()},wheel:function(ev){ev.preventDefault(),this.nodes.forEach(function(node){node.wheel(ev.$x,ev.$y,ev.$scaling,ev.$scale)},this),this.edges.forEach(function(edge){edge.refresh(),edge.setLineWidth(ev.$scale)},this),this.draw()},resize:function(){this.background.setWidth(this.$width).setHeight(this.$height)}}});function Node($ctx,id,x,y,label){this._defaultRadius=1,this._scale=1,this._showText=!1,this.arc=new janvas.FixedArc($ctx,0,0,this._defaultRadius),this._arc=new janvas.FixedRect($ctx,-this._defaultRadius,-this._defaultRadius,2*this._defaultRadius,2*this._defaultRadius),this._arc.setMatrix(this.arc.getMatrix()),this._arc.setStyle(this.arc.getStyle()),this.text=new janvas.Text($ctx,0,0,label||id),this.text.getStyle().setFont("1.5px sans-serif").setTextBaseline("middle"),this.setXY(x,y),this.highlight(!1),this.draw=this.fillStroke}function Edge($ctx,source,target){this._show=!0,this.source=source,this.target=target,this.line=new janvas.Line($ctx,0,0,0,0),this.line.getStyle().setStrokeStyle("#333333").setLineWidth(.1),this.refresh()}function Hint($ctx){this._show=!1,this._of=this._pdt=3,this._pdl=5,this.roundRect=new janvas.RoundRect($ctx,0,0,0,0,this._pdl),this.roundRect.getStyle().setFillStyle("white").setStrokeStyle("white").setShadowBlur(20).setShadowColor("grey"),this.text=new janvas.Text($ctx,0,0,""),this.text.getStyle().setFont("12px sans-serif").setTextBaseline("bottom")}}function tiger(container){return new janvas.Canvas({container:container,methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0,this.$width,this.$height),this.shapes=[]},data:function(svgXML){for(var shape,fill,stroke,lineWidth,style,paths=(new DOMParser).parseFromString(svgXML,"text/xml").getElementsByTagName("path"),i=0;i<paths.length;i++)style=paths[i],shape=new janvas.FixedShape(this.$ctx,0,0,style.getAttribute("d")),fill=style.getAttribute("fill"),stroke=style.getAttribute("stroke"),lineWidth=parseFloat(style.getAttribute("stroke-width")),style=shape.getStyle(),this.svgStyle2shape(style,"fillStyle",fill),this.svgStyle2shape(style,"strokeStyle",stroke),null===fill&&null===stroke&&style.setFillStyle("#000000").setStrokeStyle("#000000"),style.setLineWidth(isNaN(lineWidth)?1:lineWidth),style.lineWidthCache=style.getLineWidth(),this.shapes.push(shape);this.draw()},draw:function(){this.$clear(),this.shapes.forEach(function(shape){shape.fillStroke()})}},events:{mousedown:function(){this._mousedown=!0,this.shapes.forEach(function(shape){shape.lastX=shape.getStartX(),shape.lastY=shape.getStartY()})},mousemove:function(ev){this._mousedown?this.shapes.forEach(function(shape){var mx=shape.lastX+ev.$moveX,my=shape.lastY+ev.$moveY;shape.init(mx,my,mx,my)}):this.shapes.forEach(function(shape){shape.getStyle().setLineWidth(shape.isPointInPath(ev.$x,ev.$y)?10:shape.getStyle().lineWidthCache)}),this.draw()},mouseup:function(){this._mousedown=!1},wheel:function(ev){ev.preventDefault(),this.shapes.forEach(function(shape){var targetSx=ev.$x+(shape.getOriginX()-ev.$x)*ev.$scaling,targetSy=ev.$y+(shape.getOriginY()-ev.$y)*ev.$scaling;shape.init(targetSx,targetSy,targetSx,targetSy).getMatrix().setScale(ev.$scale,ev.$scale)}),this.draw()}},functions:{svgStyle2shape:function(style,type,color){style[type]=null!==color&&"none"!==color?color:"#00000000"}}})}function clock(container){return new janvas.Canvas({container:container,duration:1/0,methods:{init:function(){var bezier=new janvas.Bezier(this.$ctx,0,0,[0,0,100,1457,200,-460,300,989,400,405,500,500]);bezier.getMatrix().setScale(.002,.002),this.animation=bezier.getTransformedPoints().filter(function(){return arguments[1]%2==1}),this.background=new janvas.Rect(this.$ctx),this.bottom=new janvas.RoundRect(this.$ctx),this.bottom.border=new janvas.RoundRect(this.$ctx),this.outer=new janvas.Arc(this.$ctx),this.outer.border=new janvas.Arc(this.$ctx),this.second=new janvas.RoundRect(this.$ctx),this.minute=new janvas.RoundRect(this.$ctx),this.hour=new janvas.RoundRect(this.$ctx),this.dot=new janvas.Arc(this.$ctx),this.initStyles()},initStyles:function(){this._setShadow("Color","hsla(0, 0%, 0%, 0.8)"),this.shadowBasis=new janvas.Point(0,0),this.shadowCursor=new janvas.Point(0,0),this.background.getStyle().setFillStyle("hsl(0, 0%, 63%)"),this.bottom.border.getStyle().setShadowColor("hsla(0, 0%, 0%, 0.5)"),this.outer.border.getStyle().setShadowColor("hsla(0, 0%, 0%, 0.5)"),this.dot.getStyle().setStrokeStyle("hsl(0, 0%, 63%)")},_setShadow:function(type,value){this.bottom.getStyle()["setShadow"+type](value),this.hour.getStyle()["setShadow"+type](value),this.minute.getStyle()["setShadow"+type](value),this.second.getStyle()["setShadow"+type](value),this.dot.getStyle()["setShadow"+type](value)},resizeStyles:function(){var min=Math.min(this.$width,this.$height);this._setShadow("Blur",min/140),this.shadowBasis.init(min/35,0),this.gradient("hsl(0, 0%, 100%)","hsl(0, 0%, 90%)",this.bottom,this.hour,this.minute,this.dot),this.bottom.border.getStyle().setLineWidth(min/35).setShadowBlur(min/140*3).setShadowOffsetX(-this.$width),this.gradient("hsl(0, 0%, 40%)","hsl(0, 0%, 23%)",this.outer),this.outer.border.getStyle().setLineWidth(min/35).setShadowBlur(min/70).setShadowOffsetX(-this.$width),this.gradient("hsl(0, 80%, 70%)","hsl(0, 80%, 50%)",this.second),this.dot.getStyle().setLineWidth(1/this.$dpr)},update:function(ts){(ts+=this.milliseconds)>1e3*this._secondIncrement?(this._secondIncrement++,++this.seconds%60==0&&(this.seconds=0,++this.minutes%60==0&&(this.minutes=0,++this.hours%24==0&&(this.hours=0))),this._allSeconds++,this.setAngle(),this.onEvent(this.hours,this.minutes,this.seconds)):600<ts%1e3&&this.second.getMatrix().setAngle(this._secondLastAngle+Math.PI/30*this.animation[Math.floor((ts%1e3-600)/400*this.animation.length)])},draw:function(){this.background.fill(),this.bottom.fill(),this.bottom.clip().border.stroke().restore(),this.outer.fill().border.stroke(),this.hour.fill(),this.minute.fill(),this.second.fill(),this.dot.strokeFill()}},events:{resize:function(){var offset=.809*Math.min(this.$width,this.$height),cx=this.$width/2,cy=this.$height/2;this._sizeBy2=offset/2,this.background.setStart(0,0).setWidth(this.$width).setHeight(this.$height),this.bottom.init(cx-this._sizeBy2,cy-this._sizeBy2,cx,cy).setWidth(offset).setHeight(offset).setRadius(offset/4),this.bottom.border.setStart(this.bottom.getStartX()+this.$width,this.bottom.getStartY()).setWidth(offset).setHeight(offset).setRadius(offset/4),this.outer.setStart(cx,cy).setRadius(.809*offset/2),this.outer.border.setStart(cx+this.$width,cy).setRadius(this.outer.getRadius());offset=this.outer.getRadius()*Math.pow(.809,18);this.second.init(cx-8*offset,cy-offset,cx,cy).setWidth(.809*this.outer.getRadius()+8*offset).setHeight(2*offset).setRadius(offset),offset/=Math.pow(.809,2),this.minute.init(cx-offset,cy-offset,cx,cy).setWidth(this.outer.getRadius()*Math.pow(.809,2)+offset).setHeight(2*offset).setRadius(offset),offset/=Math.pow(.809,2),this.hour.init(cx-offset,cy-offset,cx,cy).setWidth(this.outer.getRadius()*Math.pow(.809,4)+offset).setHeight(2*offset).setRadius(offset),this.dot.setStart(cx,cy).setRadius(offset/Math.pow(.809,2)),this.resizeStyles()},visibilitychange:function(visible){visible?(this.resetTime(),this.$raf.start()):this.$raf.stop()},onEvent:janvas.Utils.noop},functions:{gradient:function(start,stop){var grd=janvas.Utils.createLinearGradient(-this._sizeBy2,-this._sizeBy2,this._sizeBy2,this._sizeBy2,arguments[2]);grd.addColorStop(0,start),grd.addColorStop(1,stop);for(var i=2;i<arguments.length;i++)arguments[i].getStyle().setFillStyle(grd)},resetTime:function(){var date=new Date;this.hours=date.getHours(),this.minutes=date.getMinutes(),this.seconds=date.getSeconds(),this.milliseconds=date.getMilliseconds(),this._allSeconds=3600*this.hours+60*this.minutes+this.seconds,this._secondIncrement=1,this.setAngle()},setAngle:function(){this.hour.getMatrix().setAngle(this._allSeconds/3600/12*Math.PI*2-Math.PI/2),this.minute.getMatrix().setAngle(this._allSeconds/60/60*Math.PI*2-Math.PI/2),this.second.getMatrix().setAngle(this._allSeconds/60*Math.PI*2-Math.PI/2),this._secondLastAngle=this.second.getMatrix().getAngle(),this.shadowCursor.copy(this.shadowBasis).rotate((this._allSeconds-21600)%43200/43200*Math.PI),this._setShadow("OffsetX",this.shadowCursor.getX()),this._setShadow("OffsetY",this.shadowCursor.getY())}}})}function sudoku(container){return new janvas.Canvas({container:container,components:{Grid:(Grid.prototype={setStart:function(sx,sy){for(var s=this._size/3,o=s/2,i=0;i<3;i++)for(var j=0;j<3;j++){var x=sx+j*s,y=sy+i*s;this.rects[i][j].setStart(x,y),this.texts[i][j].setStart(x+o,y+o)}this.border.setStart(sx,sy)},resize:function(sx,sy,size){for(var s=(this._size=size)/3,o=s/2,ff="sans-serif",font=janvas.Utils.measureTextFontSize("M",.7*s,ff)+"px "+ff,i=0;i<3;i++)for(var j=0;j<3;j++){var x=sx+j*s,y=sy+i*s;this.rects[i][j].setStart(x,y).setWidth(s).setHeight(s).getStyle().setLineWidth(Math.round(size/120)),this.texts[i][j].setStart(x+o,y+o).getStyle().setFont(font)}this.border.setStart(sx,sy).setWidth(size).setHeight(size).getStyle().setLineWidth(Math.round(size/60))},draw:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.rects[i][j].fillStroke(),this.texts[i][j].fill();this.border.stroke()},setNumber:function(i,j,value,input){this.numbers[i][j]=value,this.texts[i][j].setText(value?value+"":""),this._setFillStyle(this.texts[i][j].getStyle(),input?"#325aaf":"#292a2f")},getNumber:function(i,j){return this.numbers[i][j]},getText:function(i,j){return this.texts[i][j]},setNumbers:function(numbers,input){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.setNumber(i,j,numbers[i][j],input)},clear:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.setNumber(i,j,0)},isPointInPath:function(x,y){for(var i=0;i<3;i++)for(var j=0;j<3;j++)if(this.rects[i][j].isPointInPath(x,y)&&this._isInput(i,j))return this.rects[i][j]},eventmove:function(x,y){this._lastRect&&this._restoreLastRect();outer:for(var i=0;i<3;i++)for(var j=0;j<3;j++){var rect=this.rects[i][j];if(rect.isPointInPath(x,y)&&this._isInput(i,j)){rect.getStyle().setFillStyle("#bddbfe"),this._lastRect=rect;break outer}}},getEventNumber:function(){if(this._lastRect){var number=this.getNumber(this._lastRect.i,this._lastRect.j);return this._restoreLastRect(),number}},check:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.texts[i][j].error(this._check(i,j,this.numbers[i][j]))},_check:function(i,j,number){for(var k=0;k<3;k++)for(var l=0;l<3;l++)if((k!==i||l!==j)&&this.numbers[k][l]===number)return!0;return!1},isComplete:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)if(this.texts[i][j]._error||0===this.numbers[i][j])return!1;return!0},_restoreLastRect:function(){this._lastRect.getStyle().setFillStyle("#fefefe"),this._lastRect=null},_setFillStyle:function(style,fillStyle){style.setFillStyle(fillStyle)._lastFillStyle=fillStyle},_isInput:function(i,j){return 0===this.numbers[i][j]||"#325aaf"===this.texts[i][j].getStyle()._lastFillStyle}},Grid)},methods:{init:function(){this.grids=[];for(var i=0;i<3;i++){for(var t=[],j=0;j<3;j++)t.push(new this.Grid(this.$ctx));this.grids.push(t)}for(this.selector=new this.Grid(this.$ctx),this.selectorNumbers=[[1,2,3],[4,5,6],[7,8,9]],this.selector.setNumbers(this.selectorNumbers,!0),this.background=new janvas.Rect(this.$ctx,0,0),this.background.getStyle().setFillStyle("#ffffff"),this.mainground=new janvas.Rect(this.$ctx),this._cache=new Array(9),i=0;i<9;i++)this._cache[i]={}},resize:function(){var t,size,w=this.$width,h=this.$height,sy=.191*Math.min(w,h)/2,sx=Math.abs(w-h)/2+sy;w<h&&(t=sy,sy=sx,sx=t),size=w-2*sx,this.mainground.setStart(sx,sy).setWidth(size).setHeight(size),this._offset=(size/=3)/2;for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].resize(sx+j*size,sy+i*size,size);this.selector.resize(0,0,size),this.background.setWidth(w).setHeight(h)},draw:function(){this.background.fill();for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].draw();this.selector.activate&&this.selector.draw()},setNumber:function(row,column,value){this.getGrid(row,column).setNumber(this.mod(row),this.mod(column),value),this.check(),this.draw()},getNumber:function(row,column){return this.getGrid(row,column).getNumber(this.mod(row),this.mod(column))},setNumbers:function(numbers){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].setNumbers(numbers[i][j]);this.check(),this.draw()},clear:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].clear();this.draw()},inverseSelector:function(){var numbers=this.selectorNumbers,nums=numbers[0];numbers[0]=numbers[2],numbers[2]=nums,this.selector.setNumbers(numbers,!0)},getNumberArray:function(){for(var numbers=new Array(81),r=1;r<10;r++)for(var c=1;c<10;c++)numbers[9*(r-1)+c-1]=this.getNumber(r,c);return numbers},setNumberArray:function(numberArray){for(var i=0;i<81;i++)this.setNumber(Math.floor(i/9)+1,i%9+1,numberArray[i])},check:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].check();for(i=0;i<3;i++)this._checkRow(this.grids[i][0],this.grids[i][1],this.grids[i][2]);for(j=0;j<3;j++)this._checkColumn(this.grids[0][j],this.grids[1][j],this.grids[2][j])},solve:function(){for(var numberArray=this.getNumberArray(),startTime=performance.now(),numbers=[],numbersBackup=[],possibleValue=[],possibleValueBackup=[],length=81,width=9,height=9,subGridWidth=3,subGridHeight=3,standard=[1,2,3,4,5,6,7,8,9],loopCount=0,maxCount=62,maxCountStep=maxCount,operations=["original","asc","desc","random"],depth=-1,stopLoop=!1,message=[],index=0;index<length;index++)numbers[index]=0,possibleValue[index]=standard.slice(0,width);function updateState(index,subGridColumn,subGridRow){numbers[index]=subGridColumn,possibleValue[index]=0,subGridRow&&message.push(subGridRow+" R"+(Math.floor(index/width)+1)+"C"+(index%width+1)+"="+subGridColumn);for(var subGridRow=Math.floor(index/width),subGridColumn=subGridRow*width,rowEndIndex=subGridColumn+width,i=subGridColumn;i<rowEndIndex;i++)update(i);for(var subGridColumn=index%width,columnEndIndex=width*height,j=subGridColumn;j<columnEndIndex;j+=width)update(j);for(var subGridRow=Math.floor(subGridRow/subGridHeight),subGridColumn=Math.floor(subGridColumn/subGridWidth),subGridIndex=subGridRow*subGridHeight*width+subGridColumn*subGridWidth,i=0;i<subGridHeight;i++)for(j=0;j<subGridWidth;j++)update(subGridIndex+i*width+j);function update(cursor){var hasValue;0!==numbers[cursor]||-1<(hasValue=possibleValue[cursor].indexOf(numbers[index]))&&possibleValue[cursor].splice(hasValue,1)}}for(index=0;index<length;index++){var value=parseInt(numberArray[index]);0!==value&&updateState(index,value)}function nakedSingle(){for(var index=0;index<length;index++)1===possibleValue[index].length&&updateState(index,possibleValue[index][0],"唯余解法")}function hiddenSingle(){for(var isUniqueNumber,index=0;index<length;index++)if(0===numbers[index]){var row=Math.floor(index/width),column=index%width;if(rowOrColumn(index,row*width,(row+1)*width,1),!isUniqueNumber&&(rowOrColumn(index,column,column+width*height,width),!isUniqueNumber))for(var subGridIndex=Math.floor(row/subGridHeight)*subGridHeight*width+Math.floor(column/subGridWidth)*subGridWidth,i=0;i<possibleValue[index].length;i++){isUniqueNumber=!0;UniqueFlag:for(var j=0;j<subGridHeight;j++)for(var k=0;k<subGridWidth;k++){var c=subGridIndex+j*width+k;if(0===numbers[c]&&c!==index&&-1<possibleValue[c].indexOf(possibleValue[index][i])){isUniqueNumber=!1;break UniqueFlag}}isUniqueNumber&&updateState(index,possibleValue[index][i],"宫摒除法")}}function rowOrColumn(index,startIndex,endIndex,step){for(var i=0;i<possibleValue[index].length;i++){isUniqueNumber=!0;for(var j=startIndex;j<endIndex;j+=step)if(0===numbers[j]&&j!==index&&-1<possibleValue[j].indexOf(possibleValue[index][i])){isUniqueNumber=!1;break}if(isUniqueNumber){updateState(index,possibleValue[index][i],(1===step?"行":"列")+"摒除法");break}}}}function loopSolveSudoku(){for(;;){var temp=numbers.slice();if(loopSolve(nakedSingle),loopSolve(hiddenSingle),unchanged(numbers,temp))break}function loopSolve(code){var temp;stopLoop||(temp=numbers.slice(),code(),unchanged(numbers,temp)||(++loopCount===maxCount&&(stopLoop=!0),loopSolve(code)))}function unchanged(arr1,arr2){return arr1.every(function(value,index){return value===arr2[index]})}}loopSolveSudoku();var complete=sudokuComplete();if(!complete){maxCount+=loopCount,stopLoop=!(depth=-1);for(var i=0;i<operations.length-1&&(tryNumber(operations[i]),!complete);i++)restoreData();if(!complete)for(i=0;i<618&&(tryNumber("random"),!complete);i++)restoreData()}function tryNumber(operation){numbersBackup[++depth]=numbers.slice(),possibleValueBackup[depth]=arrayDeepCopy(possibleValue);for(var possibleArray=function(operation){var arr=[];switch(possibleValue.forEach(function(value,index){value instanceof Array&&arr.push({index:index,length:value.length})}),operation){case"original":break;case"asc":case"desc":var asc="asc"===operation?-1:1;arr.sort(function(o1,o2){return o1.length<o2.length?asc:o1.length>o2.length?-asc:0});break;case"random":arr.sort(function(){return.5-Math.random()})}return arr}(operation),i=0;i<possibleArray.length&&!stopLoop;i++){for(var index=possibleArray[i].index,arr=possibleValue[index],error=0,j=0;j<arr.length&&!stopLoop&&(updateState(index,arr[j],"假设法假设"),loopSolveSudoku(),possibleValue.some(function(arr){if(arr instanceof Array)return 0===arr.length})?error++:sudokuComplete()?complete=!0:(tryNumber(operation),depth--),!complete);j++)numbers=numbersBackup[depth].slice(),possibleValue=arrayDeepCopy(possibleValueBackup[depth]);if(error===arr.length)break;if(complete)break}}function restoreData(){maxCount+=maxCountStep,stopLoop=!(depth=-1),numbers=numbersBackup[0].slice(),possibleValue=arrayDeepCopy(possibleValueBackup[0])}function arrayDeepCopy(source){var copy=[];return function loopCopy(copy,source){source.forEach(function(item,index){item instanceof Array?(copy[index]=[],loopCopy(copy[index],item)):copy[index]=item})}(copy,source),copy}function sudokuComplete(){return-1===numbers.indexOf(0)}return{complete:complete,loopCount:loopCount,duration:Math.floor(performance.now()-startTime),numberArray:numbers,message:message}},isComplete:function(){for(var i=0;i<3;i++)for(var j=0;j<3;j++)if(!this.grids[i][j].isComplete())return!1;return!0},simpleRandom:function(ratio){var j,k,number;for(ratio=ratio||.4,this.clear(),j=1;j<10;j++){for(;number=this._rand(1,10);){for(k=3*Math.floor((j-1)/3)+1;number&&k<j;k++)this.getNumber(k,k)===number&&(number=0);if(number)break}this.setNumber(j,j,number)}for(j=1;j<10;j++){for(;number=this._rand(1,10);){for(k=3*Math.floor((j-1)/3)+1;number&&k<j;k++)this.getNumber(k,10-k)===number&&(number=0);if(number&&number!==this.getNumber(j,j)&&number!==this.getNumber(10-j,10-j))break}this.setNumber(j,10-j,number),3===j&&(j+=3)}for(var numberArray=this.solve().numberArray,i=0;i<numberArray.length;i++)Math.random()<ratio&&(numberArray[i]=0);this.setNumberArray(numberArray)},_rand:janvas.Utils.randInt,_checkRow:function(left,center,right){for(var k=0;k<3;k++){for(var i=0;i<3;i++)for(var j=0;j<3;j++){var c=this._cache[3*i+j],grid=arguments[i];c.number=grid.getNumber(k,j),c.text=grid.getText(k,j)}this._check()}},_checkColumn:function(top,middle,bottom){for(var k=0;k<3;k++){for(var i=0;i<3;i++)for(var j=0;j<3;j++){var c=this._cache[3*i+j],grid=arguments[i];c.number=grid.getNumber(j,k),c.text=grid.getText(j,k)}this._check()}},_check:function(){for(var i=0;i<8;i++)for(var j=i+1;j<9;j++){var c1=this._cache[i],c2=this._cache[j];c1.number===c2.number&&(c1.text.error(!0),c2.text.error(!0))}}},events:{eventdown:function(ev){var rect;outer:for(var i=0;i<3;i++)for(var j=0;j<3;j++)if(this._grid=this.grids[i][j],rect=this._grid.isPointInPath(ev.$x,ev.$y)){this.selector.setStart(ev.$x-this._offset,ev.$y-this._offset),this.selector.activate=!0,this.selector.eventmove(ev.$x,ev.$y),this._rect=rect;break outer}this.draw()},eventmove:function(ev){if(this.selector.activate)this.selector.eventmove(ev.$x,ev.$y);else if(this.mainground.isPointInPath(ev.$x,ev.$y))for(var i=0;i<3;i++)for(var j=0;j<3;j++)this.grids[i][j].eventmove(ev.$x,ev.$y);this.draw()},eventup:function(){var number=this.selector.getEventNumber();number?(this._grid.setNumber(this._rect.i,this._rect.j,number,!0),this.isComplete()&&this.onComplete()):this.selector.activate&&this._grid.setNumber(this._rect.i,this._rect.j,0),this.selector.activate=!1,this.check(),this.draw()},onComplete:janvas.Utils.noop,mousedown:function(ev){switch(ev.button){case 0:this.eventdown(ev);break;case 1:this.setNumberArray(this.solve().numberArray);break;case 2:this.simpleRandom()}},mousemove:function(ev){this.eventmove(ev)},mouseup:function(){this.eventup()},touchstart:function(ev){switch(ev.preventDefault(),ev.targetTouches.length){case 1:this.eventdown(ev.targetTouches[0]);break;case 2:this._fingerOut(ev)&&this.setNumberArray(this.solve().numberArray);break;case 3:this._fingerOut(ev)&&this.simpleRandom()}},_fingerOut:function(ev){for(var i=0;i<ev.targetTouches.length;i++){var _ev=ev.targetTouches[i];if(this.mainground.isPointInPath(_ev.$x,_ev.$y))return!1}return!0},touchmove:function(ev){this.eventmove(ev.targetTouches[0])},touchend:function(){this.eventup()}},functions:{getGrid:function(row,column){return this.grids[Math.floor((row-1)/3)][Math.floor((column-1)/3)]},mod:function(num){return(num-1)%3}}});function _error(error){this._error=error,this.getStyle().setFillStyle(error?"#ed1524":this.getStyle()._lastFillStyle)}function Grid($ctx){this.rects=[],this.texts=[],this.numbers=[];for(var i=0;i<3;i++){for(var t1=[],t2=[],t3=new Array(3),j=0;j<3;j++){var t=new janvas.Rect($ctx);t.getStyle().setFillStyle("#fefefe").setStrokeStyle("#bdc4d3"),t.i=i,t.j=j,t1.push(t),(t=new janvas.Text($ctx,0,0,"")).error=_error,t.getStyle().setTextAlign("center").setTextBaseline("middle"),t2.push(t),t3[j]=0}this.rects.push(t1),this.texts.push(t2),this.numbers.push(t3)}this.border=new janvas.Rect($ctx),this.border.getStyle().setStrokeStyle("#000000")}}return{coordinate:function(container){return new janvas.Canvas({container:container,props:{_backgroundColor:"rgb(237, 237, 237)",_font:"12px Consolas",_span:50,_dash:[10,5],_dashColor:"rgba(0, 0, 0, 0.2)"},methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0,0,0),this.xAxis=new janvas.Line(this.$ctx,0,0,0,0),this.yAxis=new janvas.Line(this.$ctx,0,0,0,0),this.xLines=[],this.xTexts=[],this.yLines=[],this.yTexts=[],this.oText=new janvas.Text(this.$ctx,0,0,"0")},draw:function(){this.background.fill(),this.xAxis.stroke(),this.yAxis.stroke(),this.xLines.forEach(function(line){line.stroke()}),this.yLines.forEach(function(line){line.stroke()}),this.xTexts.forEach(function(text){text.fill()}),this.yTexts.forEach(function(text){text.fill()}),this.oText.fill()}},events:{resize:function(){this.background.setWidth(this.$width).setHeight(this.$height),this.xAxis.setEnd(this.$width,0),this.yAxis.setEnd(0,this.$height),this.adjustLength(Math.floor(this.$width/this._span-.2),this.xTexts,this.xLines,!0),this.adjustLength(Math.floor(this.$height/this._span-.2),this.yTexts,this.yLines,!1),this.setStyles()}},functions:{setStyles:function(){this.background.getStyle().setFillStyle(this._backgroundColor),this.oText.getStyle().setFont(this._font).setTextAlign("left").setTextBaseline("top"),this.xLines.forEach(function(line){line.getStyle().setStrokeStyle(this._dashColor).setLineDash(this._dash)},this),this.yLines.forEach(function(line){line.getStyle().setStrokeStyle(this._dashColor).setLineDash(this._dash)},this),this.xTexts.forEach(function(text){text.getStyle().setFont(this._font).setTextAlign("center").setTextBaseline("top")},this),this.yTexts.forEach(function(text){text.getStyle().setFont(this._font).setTextAlign("left").setTextBaseline("middle")},this)},adjustLength:function(count,texts,lines,inAxisX){for(var pos;(pos=lines.length)<count;)pos=(pos+1)*this._span,inAxisX?(texts.push(new janvas.Text(this.$ctx,pos,0,pos+"")),lines.push(new janvas.Line(this.$ctx,pos,0,pos,0))):(texts.push(new janvas.Text(this.$ctx,0,pos,pos+"")),lines.push(new janvas.Line(this.$ctx,0,pos,0,pos)));0<=count&&(texts.length=lines.length=count),lines.forEach(function(line){inAxisX?line.setEndY(this.$height):line.setEndX(this.$width)},this)}}})},antv:antv,taichi:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:16,props:{addCount:0,taichi:[]},components:{Taichi:(Taichi.prototype={init:function(x,y){this.x=x,this.y=y,this.outer.setStart(x,y),this.left.init(x,y,x,y),this.right.init(x,y,x,y),this.top.init(x,y-this.r/2,x,y),this.bottom.init(x,y+this.r/2,x,y),this.topSmall.init(x,y-this.r/2,x,y),this.bottomSmall.init(x,y+this.r/2,x,y)},update:function(){this.rotate(),this.gradient()||(this.update=this._update)},_update:function(){this.rotate()},draw:function(){this.outer.stroke(),this.left.fill(),this.right.fill(),this.top.fill(),this.bottom.fill(),this.topSmall.fill(),this.bottomSmall.fill()},rotate:function(){var angle=this.left.getMatrix().getAngle()+this.rotateSpeed;this.left.getMatrix().setAngle(angle),this.right.getMatrix().setAngle(angle),this.top.getMatrix().setAngle(angle),this.bottom.getMatrix().setAngle(angle),this.topSmall.getMatrix().setAngle(angle),this.bottomSmall.getMatrix().setAngle(angle)},gradient:function(){var grd=this.grd;if(grd.count<grd.maxCount){var ratio=grd.count/grd.maxCount;return janvas.Rgb.sRgbGammaMixing(grd.outerStart,grd.black,ratio,grd.rgb),this.outer.getStyle().setStrokeStyle(grd.rgb.sRgbCompanding().toRgbString()),this._grd(this.left,grd.white,grd.black,ratio),this.top.getStyle().setFillStyle(this.left.getStyle().getFillStyle()),this.bottomSmall.getStyle().setFillStyle(this.left.getStyle().getFillStyle()),this._grd(this.right,grd.black,grd.white,ratio),this.bottom.getStyle().setFillStyle(this.right.getStyle().getFillStyle()),this.topSmall.getStyle().setFillStyle(this.right.getStyle().getFillStyle()),grd.count++,!0}return this.outer.getStyle().setStrokeStyle("#000000"),this.left.getStyle().setFillStyle("#000000"),this.top.getStyle().setFillStyle("#000000"),this.bottomSmall.getStyle().setFillStyle("#000000"),this.right.getStyle().setFillStyle("white"),this.bottom.getStyle().setFillStyle("white"),this.topSmall.getStyle().setFillStyle("white"),!1},_grd:function(obj,start,end,ratio){janvas.Rgb.sRgbGammaMixing(start,end,ratio,this.grd.rgb),obj.getStyle().setFillStyle(this.grd.rgb.sRgbCompanding().toRgbString())},collide:function(taichi){var x1=this.x,y1=this.y,r1=17*this.r/16,x2=taichi.x,y2=taichi.y,r2=17*taichi.r/16,cp1=this.cp,cp2=taichi.cp,r=Math.min(r1,r2);janvas.Collision.arc(x1,y1,r1,x2,y2,r2)&&(cp1.init(x1,y1).subtract(cp2.init(x2,y2)).unit().scale(r,r),isNaN(cp1.x)&&(.5<Math.random()?cp1.init(r,0):cp1.init(0,r)),this.init(x1+cp1.x/r1,y1+cp1.y/r1),cp1.inverse(),taichi.init(x2+cp1.x/r2,y2+cp1.y/r2))},inRect:function(rect){return janvas.Collision.arcRect(this.x,this.y,this.r,rect.getStartX(),rect.getStartY(),rect.getWidth(),rect.getHeight())}},Taichi)},methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0,this.$width,this.$height)},update:function(ts){ts>1e3*this.addCount&&(this.addCount++,this.add());var flag=!1;this.taichi.forEach(function(tc1){tc1.update(),this.taichi.forEach(function(tc2){tc1!==tc2&&tc1.collide(tc2)}),tc1.in=tc1.inRect(this.background),tc1.in||(flag=!0)},this),flag&&(this.taichi=this.taichi.filter(function(tc){return tc.in}))},draw:function(){this.$clear(),this.taichi.forEach(function(tc){tc.draw()})}},events:{mousedown:function(ev){this.add(ev.$x,ev.$y)},visibilitychange:function(visible){visible?this.$raf.resume():this.$raf.pause()},resize:function(){this.background.setWidth(this.$width).setHeight(this.$height)}},functions:{add:function(x,y){this.taichi.push(new this.Taichi(this.$ctx,x||janvas.Utils.randInt(0,this.$width),y||janvas.Utils.randInt(0,this.$height),janvas.Utils.randInt(20,100)))}}});function Taichi(bottomSmall,x,y,r){var outer=new janvas.Arc(bottomSmall,x,y,r);outer.getStyle().setLineWidth(r/8);var left=new janvas.Arc(bottomSmall,x,y,r,Math.PI/2,-Math.PI/2,!1,x,y),right=new janvas.Arc(bottomSmall,x,y,r,Math.PI/2,-Math.PI/2,!0,x,y);right.getStyle().setFillStyle("white");var top=new janvas.Arc(bottomSmall,x,y-r/2,r/2,0,2*Math.PI,!1,x,y),bottom=new janvas.Arc(bottomSmall,x,y+r/2,r/2,0,2*Math.PI,!1,x,y);bottom.getStyle().setFillStyle("white");var topSmall=new janvas.Arc(bottomSmall,x,y-r/2,r/8,0,2*Math.PI,!1,x,y),bottomSmall=new janvas.Arc(bottomSmall,x,y+r/2,r/8,0,2*Math.PI,!1,x,y);topSmall.getStyle().setFillStyle("white"),this.x=x,this.y=y,this.r=r,this.rotateSpeed=janvas.Utils.randSign()*Math.PI/2e3*16*42/r,this.cp=new janvas.Point,this.outer=outer,this.left=left,this.right=right,this.top=top,this.bottom=bottom,this.topSmall=topSmall,this.bottomSmall=bottomSmall,this.grd={rgb:new janvas.Rgb(0,0,0),outerStart:new janvas.Rgb(255,255,255).sRgbInverseCompanding(),black:new janvas.Rgb(0,0,0).sRgbInverseCompanding(),white:new janvas.Rgb(255,255,255).sRgbInverseCompanding(),count:0,maxCount:Math.ceil(62.5)}}},tiger:tiger,clock:clock,beziermaker:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:16,props:{position:0,size:Math.floor(625),keys:["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Delete","Enter","w","s","a","d","q","e"]},components:{factory:(Dot.prototype={setStart:function(x,y){this._x=x,this._y=y,this.arc.setStart(x,y),this.text.setStart(x+2*this._r,y).setText(this.getReadableText())},getReadableText:function(){return"p"+this._index+"("+this._x+","+this._y+")"},initStyles:function(){this.arc.getStyle().setStrokeStyle("hsl(0, 80%, 50%)").setLineWidth(2),this.text.getStyle().setFont("12px sans-serif").setTextAlign("start").setTextBaseline("middle")},drawHighlight:function(){this.arc.fillStroke(),this.text.fill()},drawDefault:function(){this.arc.fill(),this.text.fill()},highlight:function(flag){this._highlight!==flag&&(this._highlight=flag,this.draw=flag?this.drawHighlight:this.drawDefault)},mark:function(){this._lastX=this._x,this._lastY=this._y},onmove:function(moveX,moveY){this.setStart(this._lastX+moveX,this._lastY+moveY)},getX:function(){return this._x},getY:function(){return this._y},getIndex:function(){return this._index},decreaseIndex:function(){this._index--,this.text.setText(this.getReadableText())},isPointInPath:function(x,y){return this.arc.isPointInPath(x,y)}},{_index:0,newDot:function($ctx,x,y){return new Dot($ctx,x,y,this._index++)},decreaseAutoIndex:function(){this._index--}})},methods:{init:function(){this.dots=[],this.polyline=new janvas.Polyline(this.$ctx,0,0,[]),this.bezier=new janvas.Bezier(this.$ctx,0,0,this.polyline.getPoints(),2*this.size),this.bezier.getStyle().setStrokeStyle("hsl(0, 80%, 50%)"),this.transformedPoints=this.bezier.getTransformedPoints(),this.hint=new janvas.Text(this.$ctx,0,0,""),this.hint.getStyle().setFillStyle("rgba(0, 0, 0, 0.5)").setFont("12px sans-serif").setTextAlign("end").setTextBaseline("middle"),this.cursor=new janvas.Triangle(this.$ctx,0,0),this.cursor.getStyle().setFillStyle("hsl(270, 80%, 50%)")},draw:function(){this.$clear(),this.polyline.stroke(),this.bezier.stroke(),this.dots.forEach(function(dot){dot.draw()}),this.hint.fill(),this.updateCursor(),this.cursor.fill()}},events:{mousedown:function(ev){this._autoResize&&(ev.$x>.875*this.$width&&(this.$wrapper.style.width=1.5*this.$width+"px"),ev.$y>.875*this.$height&&(this.$wrapper.style.height=1.5*this.$height+"px")),4===ev.buttons||(2===ev.buttons?this.dots.forEach(function(dot){dot.mark()}):(this.current?this.toggleLocked(this.current):(this.locked&&this.locked.highlight(!1),this.dots.push(this.locked=this.current=this.factory.newDot(this.$ctx,ev.$x,ev.$y)),this.polyline.append(ev.$x,ev.$y)),this.locked.mark()))},mousemove:function(ev){2===ev.buttons?this.dots.forEach(function(dot){dot.onmove(ev.$moveX,ev.$moveY),this.polyline.update(dot.getIndex(),dot.getX(),dot.getY())},this):1===ev.buttons?(this.locked.onmove(ev.$moveX,ev.$moveY),this.polyline.update(this.locked.getIndex(),this.locked.getX(),this.locked.getY())):(this.current&&this.current.highlight(!1),this.current=void 0,this.dots.forEach(function(dot){dot.isPointInPath(ev.$x,ev.$y)&&(this.current=dot)},this),this.current?(this.locked.highlight(!1),this.current.highlight(!0)):this.locked&&this.locked.highlight(!0)),this.hint.setStart(ev.$x,ev.$y).setText("("+ev.$x+","+ev.$y+")")},mouseover:function(){this.$raf.resume()},mouseout:function(){this.$raf.pause()},keydown:function(ev){if(void 0!==this.locked){this.keys.some(function(value){return value===ev.key})&&ev.preventDefault();var increase=ev.repeat?5:1;switch(ev.key){case"ArrowUp":case"w":this.locked.setStart(this.locked.getX(),this.locked.getY()-increase),this.polyline.update(this.locked.getIndex(),this.locked.getX(),this.locked.getY());break;case"ArrowDown":case"s":this.locked.setStart(this.locked.getX(),this.locked.getY()+increase),this.polyline.update(this.locked.getIndex(),this.locked.getX(),this.locked.getY());break;case"ArrowLeft":case"a":this.locked.setStart(this.locked.getX()-increase,this.locked.getY()),this.polyline.update(this.locked.getIndex(),this.locked.getX(),this.locked.getY());break;case"ArrowRight":case"d":this.locked.setStart(this.locked.getX()+increase,this.locked.getY()),this.polyline.update(this.locked.getIndex(),this.locked.getX(),this.locked.getY());break;case"Delete":0<this.dots.length&&(this.dots.forEach(function(dot,index){index>this.locked.getIndex()&&dot.decreaseIndex()},this),this.factory.decreaseAutoIndex(),this.dots.splice(this.dots.indexOf(this.locked),1),this.polyline.delete(this.locked.getIndex()),this.locked=this.dots[this.locked.getIndex()]||this.dots[this.locked.getIndex()-1],this.locked&&this.locked.highlight(!0));break;case"Enter":console.log("SOURCEDOTS: "+this.polyline.getTransformedPoints().toString()),console.log("CALCULATED: "+this.bezier.getTransformedPoints().toString());break;case"q":this.toggleLocked(this.dots[this.locked.getIndex()-1]||this.dots[this.dots.length-1]);break;case"e":this.toggleLocked(this.dots[this.locked.getIndex()+1]||this.dots[0])}}},autoResize:function(flag){this._autoResize=flag}},functions:{toggleLocked:function(dot){this.locked.highlight(!1),this.locked=dot,this.locked.highlight(!0)},updateCursor:function(){var x2,y2=this.position,transformedPoints=this.transformedPoints,x1=transformedPoints[y2],y1=transformedPoints[y2+1],y2=0!==y2?(x2=transformedPoints[y2-2],transformedPoints[y2-1]):(x2=transformedPoints[y2+2],transformedPoints[y2+3]);this.position+=2,this.position===transformedPoints.length&&(this.position=0),this.cursor.setStart(x1,y1).setRotation(Math.atan2(y1-y2,x1-x2))}}});function Dot($ctx,x,y,index){this._index=index,this._r=5,this.arc=new janvas.Arc($ctx,0,0,this._r),this.text=new janvas.Text($ctx),this.setStart(x,y),this.initStyles(),this.highlight(!0)}},flydots:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:16,props:{dots:[],lines:[]},components:{factory:(Dot.prototype={setStart:function(x,y){this._x=x,this._y=y,this.arc.setStart(x,y),this._relateStart.forEach(this.startCallback,this),this._relateEnd.forEach(this.endCallBack,this)},closer:function(x,y){this._vx=(x-this._x)/Math.abs(x-this._x),this._vy=(y-this._y)/Math.abs(y-this._y)},restore:function(){this._vx=this._lvx,this._vy=this._lvy},relateStart:function(line){this._relateStart.push(line)},relateEnd:function(line){this._relateEnd.push(line)},startCallback:function(line){line.setStart(this._x,this._y)},endCallBack:function(line){line.setEnd(this._x,this._y)},setBounding:function(width,height){this._left=this._top=-50,this._right=width+50,this._bottom=height+50},update:function(){this._x+=this._vx,this._y+=this._vy,this.setStart(this._x,this._y),(this._x<this._left||this._x>this._right)&&(this._lvx=this._vx*=-1),(this._y<this._top||this._y>this._bottom)&&(this._lvy=this._vy*=-1)},draw:function(){this.arc.fill()}},Line.prototype={update:function(){var _ratio=1-janvas.Utils.pythagorean(this.line.getStartX()-this.line.getEndX(),this.line.getStartY()-this.line.getEndY())/100;this.line.getStyle().setAlpha(this._ratio=_ratio<0?0:_ratio)},draw:function(){this._ratio&&this.line.stroke()}},{Dot:Dot,Line:Line})},methods:{init:function(){for(var i=0;i<100;i++){var dot=new this.factory.Dot(this.$ctx,this.$width,this.$height);this.dots.forEach(function(target){this.lines.push(new this.factory.Line(this.$ctx,dot,target))},this),this.dots.push(dot)}this.cursor=new this.factory.Dot,this.dots.forEach(function(target){this.lines.push(new this.factory.Line(this.$ctx,this.cursor,target))},this)},update:function(){this.dots.forEach(function(dot){dot.update()},this),this.lines.forEach(function(line){line.update()})},draw:function(){this.$clear(),this.lines.forEach(function(line){line.draw()}),this.dots.forEach(function(dot){dot.draw()})}},events:{mousedown:function(ev){this.dots.forEach(function(dot){dot.closer(ev.$x,ev.$y)},this)},mousemove:function(ev){this.cursor.setStart(ev.$x,ev.$y)},mouseup:function(){this.dots.forEach(function(dot){dot.restore()})},resize:function(){this.dots.forEach(function(dot){dot.setBounding(this.$width,this.$height)},this)},visibilitychange:function(visible){visible?this.$raf.resume():this.$raf.pause()}}});function Dot($ctx,width,height){this.setBounding(width,height),this._x=janvas.Utils.randInt(this._left,this._right,!0),this._y=janvas.Utils.randInt(this._top,this._bottom,!0),this._r=3,this._lvx=this._vx=janvas.Utils.randSign()*janvas.Utils.randInt(10,100,!0)/100,this._lvy=this._vy=janvas.Utils.randSign()*janvas.Utils.randInt(10,100,!0)/100,this._relateStart=[],this._relateEnd=[],this.arc=new janvas.Arc($ctx,this._x,this._y,this._r),this.arc.getStyle().setFillStyle("hsl(0, 0%, 40%)")}function Line($ctx,source,target){this.line=new janvas.Line($ctx),source.relateStart(this.line),target.relateEnd(this.line)}},aboutwheel:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:16,props:{size:50},methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0,this.$width,this.$height);var cx=this.$width/2,cy=this.$height/2;this.img=new janvas.Image(this.$ctx,cx-this.size,cy-this.size,"img/complex.svg",cx,cy,2*this.size,2*this.size),this.img.getStyle().setStrokeStyle("grey"),this.img.animationQueue=[],this.img.count=this.img.maxCount=Math.floor(256/this.$interval),this.$raf.resume()},update:function(ts){this.img.getMatrix().setAngle(Math.PI/2e3*ts),this.scaleAnimation()},draw:function(){this.$clear(),this.img.draw(),this.img._mousein&&this.img.stroke()}},events:{mousedown:function(){this.img._mousein&&(this._mousedown=!0,this.img.lastX=this.img.getStartX(),this.img.lastY=this.img.getStartY())},mousemove:function(ev){var mx,my;this._mousedown?(mx=this.img.lastX+ev.$moveX,my=this.img.lastY+ev.$moveY,this.img.init(mx,my,mx+this.size,my+this.size)):this.img._mousein=this.img.isPointInPath(ev.$x,ev.$y)},mouseup:function(){this._mousedown=!1},wheel:function(ev){ev.preventDefault(),1!==ev.$scaling&&this.img.animationQueue.unshift(ev)}},functions:{scaleAnimation:function(){var stampCx,stampCy,scale;this.img.animationQueue.length&&this.img.count===this.img.maxCount&&(stampCy=this.img.animationQueue.pop(),this.img.lastCx=this.img.getOriginX(),this.img.lastCy=this.img.getOriginY(),this.img.targetCx=stampCy.$x+(this.img.getOriginX()-stampCy.$x)*stampCy.$scaling,this.img.targetCy=stampCy.$y+(this.img.getOriginY()-stampCy.$y)*stampCy.$scaling,this.img.lastScale=stampCy.$lastScale,this.img.targetScale=stampCy.$scale,this.img.count=0),this.img.count<this.img.maxCount&&(this.img.count++,scale=this.img.count/this.img.maxCount,stampCx=this.img.lastCx+(this.img.targetCx-this.img.lastCx)*scale,stampCy=this.img.lastCy+(this.img.targetCy-this.img.lastCy)*scale,scale=this.img.lastScale+(this.img.targetScale-this.img.lastScale)*scale,this.img.init(stampCx-this.size,stampCy-this.size,stampCx,stampCy).getMatrix().setScale(scale,scale))}}})},aboutedge:function(container){return new janvas.Canvas({container:container,props:{points:[],current:void 0},methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0,this.$width,this.$height),this.start=new janvas.Arc(this.$ctx,200,250,5),this.start.getStyle().setFillStyle("hsl(0, 80%, 60%)"),this.end=new janvas.Arc(this.$ctx,500,250,5),this.end.getStyle().setFillStyle("hsl(90, 80%, 60%)"),this.an=new janvas.Arc(this.$ctx,525,300,5),this.an.getStyle().setFillStyle("hsl(180, 80%, 60%)"),this.points.push(this.start,this.end,this.an),this.edge=new janvas.Edge(this.$ctx),this.text=new janvas.Text(this.$ctx,0,0,"Janvas"),this.text.getStyle().setFont("12px sans-serif").setTextAlign("center").setTextBaseline("middle"),this.edge.setEmptyLength(janvas.Utils.measureTextWidth(this.text.getText(),this.text.getStyle().getFont())/.809),this.head=new janvas.Triangle(this.$ctx).setLength(12),this.head.getStyle().setFillStyle("hsl(270, 80%, 60%)"),this.setCurvePropsAndDraw()},draw:function(){var an;this.$clear(),this.edge.stroke(),this.edge.ratioInRange()&&(an=this.edge.getAngle(),this.text.getMatrix().setAngle(an>-Math.PI/2&&an<Math.PI/2?an:an+Math.PI),this.text.init(this.edge.getTargetX(),this.edge.getTargetY(),this.edge.getTargetX(),this.edge.getTargetY()).fill()),this.start.fill(),this.end.fill(),this.an.fill(),this.head.setRotation(this.edge.getAnchorAngle()).fill()}},events:{mousedown:function(){this._mousedown=!0,this.points.forEach(function(point){point.lastX=point.getStartX(),point.lastY=point.getStartY()})},mousemove:function(ev){this._mousedown?2===ev.buttons?(this.points.forEach(function(point){point.setStart(point.lastX+ev.$moveX,point.lastY+ev.$moveY)},this),this.setCurvePropsAndDraw()):this.current&&(this.current.setStart(this.current.lastX+ev.$moveX,this.current.lastY+ev.$moveY),this.setCurvePropsAndDraw()):(this.current=void 0,this.points.forEach(function(point){point.isPointInPath(ev.$x,ev.$y)&&(this.current=point,this.setCursor("pointer"))},this),this.current||this.setCursor(""))},mouseup:function(){this._mousedown=!1}},functions:{setCurvePropsAndDraw:function(){this.edge.setStart(this.start.getStartX(),this.start.getStartY()).setEnd(this.end.getStartX(),this.end.getStartY()).setAnchor(this.an.getStartX(),this.an.getStartY()),this.head.setStart(this.end.getStartX(),this.end.getStartY()),this.draw()},setCursor:function(cursor){this.$canvas.style.cursor!==cursor&&(this.$canvas.style.cursor=cursor)}}})},circletext:function(container){return new janvas.Canvas({container:container,duration:2e3,props:{back:void 0,str:"HELLOJANVAS",texts:[],length:0,ease:janvas.Utils.ease.inout.bounce},methods:{init:function(){this.back=new janvas.Rect(this.$ctx,0,0),this.back.getStyle().setFillStyle("gold"),this.setText(this.str)},resize:function(){var w=this.$width,h=this.$height;this.back.setWidth(w).setHeight(h);for(var i=0;i<this.length;i++)this.texts[i].init(w/2,h/2-.309*Math.min(w,h),w/2,h/2)},setText:function(textString){var w=this.$width,h=this.$height;for(this.length=textString.length;this.texts.length<this.length;){var text=new janvas.Text(this.$ctx).init(w/2,h/2-.309*Math.min(w,h),w/2,h/2);text.getStyle().setFont("small-caps bold 8em courier").setTextAlign("center").setTextBaseline("middle"),this.texts.push(text)}for(var i=0;i<this.length;i++)this.texts[i].setText(textString[i]).targetAngle=2*Math.PI*i/this.length;this.$raf.start()},update:function(ts){for(var i=0;i<this.length;i++){var text=this.texts[i];text.getMatrix().setAngle(text.targetAngle*this.ease(ts/this.$duration))}},draw:function(){this.back.fill();for(var i=0;i<this.length;i++)this.texts[i].fill()}},events:{keydown:function(key){key=key.key;"Backspace"===key?this.str=this.str.substring(0,this.str.length-1):1===key.length&&(this.str+=key.toUpperCase()),this.setText(this.str)}}})},coderain:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:50,props:{chars:[],fontSize:0,colors:{background:"rgb(0, 0, 0)",head:"rgb(255, 255, 255)",tail:"rgb(0, 255, 0)",saturRange:[60,90],lightRange:[30,40],count:3}},methods:{init:function(){this._initChars(),this._initColors(),this.fontSize=this.fontSize||Math.ceil(this.$width/120),this.font="bold "+this.fontSize+"px sans-serif",this.offsetY=janvas.Utils.measureTextWidth("M",this.font),this.halfY=this.offsetY/2,this.background=new janvas.Rect(this.$ctx,0,0),this.background.getStyle().setFillStyle(this.colors.background),this.heads=[],this.pinMap={},this.pinStack=[],this.serialIdIndex=0},resize:function(){var w=this.$width,h=this.$height;for(this.background.setWidth(w).setHeight(h),this.column=Math.floor(w/this.fontSize),this.count=Math.floor(this.column/4);this.heads.length<this.count;){var x=this.getRandomX(),head=this.getDefaultText();head.init(x,-this.halfY,x,-this.halfY).getMatrix().setOffsetY(-this.rand(2*h)),head.getStyle().setFillStyle(this.colors.head),head.timespan=this.rand(50,100,!0),head.timestamp=this.timestamp||0,head.tails=new Array(Math.floor(head.timespan/2)+1),head.tails[0]=this.getDefaultText();for(var i=1;i<head.tails.length;i++)head.tails[i]=this.getDefaultText(),head.tails[i].getStyle().setFillStyle(i<this.colors.count?this.colors.gradient[i]:this.colors.tail);this.heads.push(head)}this.heads.length=this.count},update:function(timestamp){this.timestamp=timestamp,this.heads.forEach(function(head){if(timestamp>=head.timestamp){head.timestamp+=head.timespan;var tails=head.tails,rand=tails[tails.length-1];this.inBackground(rand)&&(tail=this.pinStack.pop()||this.getDefaultText(),this.setTextConfig(tail,rand.getStartX(),rand.getStartY(),rand.getText(),rand.getMatrix()),tail.getStyle().setFillStyle(rand.getStyle().getFillStyle()),tail.alpha=255,tail.decre=rand.decre,this.pinMap[tail.serialId]=tail);var x=head.getMatrix(),y=head.getStartY()+x.getOffsetY();this.setTextConfig(tails[0],head.getStartX(),y,head.getText(),x),head.setText(this.getRandomChar()),x.setScale(janvas.Utils.randSign(),janvas.Utils.randSign()).setOffsetY(x.getOffsetY()+this.offsetY);for(var i=tails.length-1;0<i;i--){var next=tails[i],prev=tails[i-1];this.setTextConfig(next,prev.getStartX(),prev.getStartY(),Math.random()<.1?this.getRandomChar():prev.getText(),prev.getMatrix()),i>this.colors.count&&(next.getStyle().setFillStyle(prev.getStyle().getFillStyle()),next.decre=prev.decre)}var range=this.colors.lightRange[1]-this.colors.lightRange[0],rand=this.rand(range),tail=tails[this.colors.count];tail.getStyle().setFillStyle(this.colors.tailHsls[this.rand(this.colors.saturRange[1]-this.colors.saturRange[0])][rand]),tail.decre=rand<range/2?8:6,y>=this.$height+this.halfY&&(x.setOffsetY(0),x=this.getRandomX(),head.init(x,-this.halfY,x,-this.halfY))}},this)},draw:function(){for(var serialId in this.background.fill(),this.heads.forEach(function(head){head.fill();for(var i=1;i<head.tails.length;i++){var tail=head.tails[i];this.inBackground(tail)&&tail.fill()}},this),this.pinMap){var pin=this.pinMap[serialId];pin.alpha>pin.decre?(pin.getStyle().setAlpha((pin.alpha-=pin.decre)/255),pin.fill()):(delete this.pinMap[pin.serialId],this.pinStack.push(pin))}},_initChars:function(){if(!this.chars.length){for(var i=48;i<58;i++)this.chars.push(String.fromCharCode(i));for(i=12448;i<12543;i++)this.chars.push(String.fromCharCode(i))}},_initColors:function(){var j,hsls,tailRgb=(new janvas.Rgb).fromRgbString(this.colors.tail),tailHsl=(new janvas.Hsl).fromRgb(tailRgb);for(this.colors.tailHsls=[],i=this.colors.saturRange[0];i<=this.colors.saturRange[1];i++)for(this.colors.tailHsls.push(hsls=[]),j=this.colors.lightRange[0];j<=this.colors.lightRange[1];j++)hsls.push(tailHsl.setSaturation(i).setLightness(j).toHslString());this.colors.gradient=new Array(this.colors.count);for(var headSRgb=(new janvas.Rgb).fromRgbString(this.colors.head).sRgbInverseCompanding(),tailSRgb=tailRgb.sRgbInverseCompanding(),mix=new janvas.Rgb,i=1;i<this.colors.count;i++)janvas.Rgb.sRgbGammaMixing(headSRgb,tailSRgb,i/this.colors.count,mix),this.colors.gradient[i]=mix.sRgbCompanding().toRgbString()}},events:{visibilitychange:function(visible){visible?this.$raf.resume():this.$raf.pause()}},functions:{rand:janvas.Utils.randInt,getDefaultText:function(){var text=new janvas.Text(this.$ctx,-this.halfY-1,-this.halfY-1,"");return text.serialId=this.serialIdIndex++,text.getStyle().setFont(this.font).setTextAlign("center").setTextBaseline("middle"),text},getRandomChar:function(){return this.chars[this.rand(this.chars.length)]},getRandomX:function(){for(var x;x=this.rand(this.column)*this.fontSize+this.halfY;)if(this.heads.every(function(head){return x!==head.getStartX()}))return x},setTextConfig:function(tail,x,y,text,mat){tail.init(x,y,x,y).setText(text).getMatrix().setScale(mat.getScaleX(),mat.getScaleY())},inBackground:function(b){var x=b.getStartX(),y=b.getStartY(),hy=this.halfY,b=this.background;return janvas.Collision.rect(x-hy,y-hy,x+hy,y+hy,b.getStartX(),b.getStartY(),b.getWidth(),b.getHeight())}}})},thelastjanvas:function(container){return new janvas.Canvas({container:container,duration:1/0,interval:16,components:{Dancer:(Dancer.prototype.update=function(pointer){++this.frame%20==0&&(this.dir=-this.dir),this===pointer.dancerDrag&&600<this.frame&&this.size<16&&this.onDragEnd.call(pointer.context,this),this.links.forEach(function(link){link.update()}),this.points.forEach(function(point){this===pointer.dancerDrag?point===pointer.pointDrag&&(point.x+=.1*(pointer.x-point.x),point.y+=.1*(pointer.y-point.y)):point.fn(this._size,this.dir),point.update()},this),this.links.forEach(function(link){var p1=link.p1;p1.y>pointer.ground-link.size/2&&(p1.y=pointer.ground-link.size/2,p1.x-=p1.vx,p1.vx=p1.vy=0)}),this.points[3].x+=.001*(this.x-this.points[3].x)},Dancer.prototype.draw=function(){this.links.forEach(function(link){link.draw()})},Dancer.Link=function($ctx,hsl,size,p0,p1,force,isHead){this.hsl=hsl,this.size=size,this._offset=size/10,this.p0=p0,this.p1=p1,this.distance=janvas.Utils.pythagorean(p1.x-p0.x,p1.y-p0.y),this.force=force||.5,this.isHead=isHead,this.startRect=new janvas.Rect($ctx,0,0,size/5,size/5),this.endRect=new janvas.Rect($ctx,0,0,size/5,size/5),this.body=new janvas.Line($ctx),this.body.getStyle().setStrokeStyle(this.hsl.toHslString()).setLineWidth(size).setLineCap("round").setShadowColor("rgba(0, 0, 0, 0.5)").setShadowOffsetX(size/4).setShadowOffsetY(size/4)},Dancer.Link.prototype={update:function(){var p0=this.p0,p1=this.p1,sx=p1.x-p0.x,dy=p1.y-p0.y,dist=janvas.Utils.pythagorean(sx,dy),sy=p0.w+p1.w,r0=p0.w/sy,r1=p1.w/sy,sy=(this.distance-dist)*this.force,sx=sx/dist*sy,sy=dy/dist*sy;p1.x+=sx*r0,p1.y+=sy*r0,p0.x-=sx*r1,p0.y-=sy*r1},draw:function(){var p0=this.p0,p1=this.p1,o=this._offset;this.isHead?this.body.setStart(p1.x,p1.y):this.body.setStart(p0.x,p0.y),this.body.setEnd(p1.x,p1.y).stroke(),this.startRect.getMatrix().setAngle(Math.atan2(p1.y-p0.y,p1.x-p0.x)),this.endRect.getMatrix().setAngle(this.startRect.getMatrix().getAngle()),this.startRect.init(p0.x-o,p0.y-o,p0.x,p0.y).fill(),this.endRect.init(p1.x-o,p1.y-o,p1.x,p1.y).fill()}},Dancer.Point=function(x,y,fn,w){this.x=x,this.y=y,this.w=w||.5,this.fn=fn||janvas.Utils.noop,this.px=x,this.py=y,this.vx=0,this.vy=0},Dancer.Point.prototype.update=function(){this.vx=this.x-this.px,this.vy=this.y-this.py,this.px=this.x,this.py=this.y,this.vx*=.995,this.vy*=.995,this.x+=this.vx,this.y+=this.vy+.01},Dancer)},props:{struct:{points:[{x:0,y:-4,fn:function(s,d){this.y-=.01*s}},{x:0,y:-16,fn:function(s,d){this.y-=.02*s*d}},{x:0,y:12,fn:function(s,d){this.y+=.02*s*d}},{x:-12,y:0},{x:12,y:0},{x:-3,y:34,fn:function(s,d){0<d?(this.x+=.01*s,this.y-=.015*s):this.y+=.02*s}},{x:3,y:34,fn:function(s,d){0<d?this.y+=.02*s:(this.x-=.01*s,this.y-=.015*s)}},{x:-28,y:0,fn:function(s,d){this.x+=.025*this.vx,this.y-=.001*s}},{x:28,y:0,fn:function(s,d){this.x+=.025*this.vx,this.y-=.001*s}},{x:-3,y:64,fn:function(s,d){this.y+=.015*s,0<d?this.y-=.01*s:this.y+=.05*s}},{x:3,y:64,fn:function(s,d){this.y+=.015*s,0<d?this.y+=.05*s:this.y-=.01*s}}],links:[{p0:3,p1:7,size:12,lum:.5},{p0:1,p1:3,size:24,lum:.5},{p0:1,p1:0,size:60,lum:.5,disk:1},{p0:5,p1:9,size:16,lum:.5},{p0:2,p1:5,size:32,lum:.5},{p0:1,p1:2,size:50,lum:1},{p0:6,p1:10,size:16,lum:1.5},{p0:2,p1:6,size:32,lum:1.5},{p0:4,p1:8,size:12,lum:1.5},{p0:1,p1:4,size:24,lum:1.5}]}},methods:{init:function(){this.background=new janvas.Rect(this.$ctx,0,0),this.header=new janvas.Rect(this.$ctx,0,0),this.header.getStyle().setFillStyle("#222"),this.footer=new janvas.Rect(this.$ctx,0),this.footer.getStyle().setFillStyle("#222"),this.dancers=[],this.pointer={x:0,y:0,dancerDrag:null,pointDrag:null,ground:0,context:this},this._initDancer()},resize:function(){var w=this.$width,h=this.$height;this.background.setWidth(w).setHeight(h),this.header.setWidth(w).setHeight(.15*h),this.footer.setStartY(.85*h).setWidth(w).setHeight(this.header.getHeight()),this.pointer.ground=500<h?this.footer.getStartY():h;for(var i=0;i<this.dancers.length;i++)this.dancers[i].x=(i+2)*w/9},draw:function(){this.background.fill(),this.header.fill(),this.footer.fill(),this.dancers.forEach(function(dancer){dancer.update(this.pointer),dancer.draw()},this)},_initDancer:function(){for(var w=this.$width,h=this.$height,i=0;i<6;i++)this._pushDancer(new janvas.Hsl(360*i/7,30,80),Math.sqrt(Math.min(w,h))/6,(i+2)*w/9,.5*h-100)},_pushDancer:function(hsl,size,x,dancer){dancer=new this.Dancer(this.$ctx,hsl,size,x,dancer,this.struct);dancer.onDragEnd=this._onDancerDragEnd,this.dancers.push(dancer)},_onDancerDragEnd:function(dancer){var hsl=dancer.hsl,pointer=this.pointer;pointer.dancerDrag=null,this._pushDancer(hsl.clone().setHue(hsl.getHue()+90).setLightness(1.25*hsl.getLightness()),2*dancer.size,pointer.x,pointer.y-100*dancer.size*2),this.dancers.sort(function(d0,d1){return d0.size-d1.size})}},events:{eventdown:function(ev){var pointer=this.pointer;pointer.x=ev.$x,pointer.y=ev.$y,this.dancers.forEach(function(dancer){dancer.points.forEach(function(point){janvas.Utils.pythagorean(ev.$x-point.x,ev.$y-point.y)<60&&(pointer.dancerDrag=dancer,pointer.pointDrag=point,dancer.frame=0)})})},eventmove:function(ev){this.pointer.x=ev.$x,this.pointer.y=ev.$y},eventup:function(){this.pointer.dancerDrag=null},visibilitychange:function(visible){visible?this.$raf.resume():this.$raf.pause()},mousedown:function(ev){this.eventdown(ev)},mousemove:function(ev){this.eventmove(ev)},mouseup:function(){this.eventup()},touchstart:function(ev){ev.preventDefault(),this.eventdown(ev.targetTouches[0])},touchmove:function(ev){ev.preventDefault(),this.eventmove(ev.targetTouches[0])},touchend:function(){this.eventup()}}});function Dancer($ctx,hsl,size,x,y,struct){this.hsl=hsl,this.size=size,this._size=16*Math.sqrt(size),this.x=x,this.points=[],this.links=[],this.frame=0,this.dir=1,struct.points.forEach(function(point){this.points.push(new Dancer.Point(size*point.x+x,size*point.y+y,point.fn))},this),struct.links.forEach(function(link){this.links.push(new Dancer.Link($ctx,hsl.clone().setLightness(hsl.getLightness()*link.lum),link.size*size/3,this.points[link.p0],this.points[link.p1],link.force,link.disk))},this)}},stats:function(container){return new janvas.Canvas({container:"#stats",duration:1/0,props:{fpsTimespan:1e3,mbTimespan:500},components:{factory:(Panel.prototype.show=function(){background.getStyle().setFillStyle(this.bg),topBack.getStyle().setFillStyle(this.bg),text.setText(this.name).getStyle().setFillStyle(this.fg),graph.getStyle().setFillStyle(this.fg),graphAlpha.getStyle().setFillStyle(this.bgAlpha),right.getStyle().setFillStyle(this.fg),rightAlpha.getStyle().setFillStyle(this.bgAlpha),background.fill(),text.fill(),graph.fill(),graphAlpha.fill()},Panel.prototype.update=function(value,maxValue){value<this.min&&(this.min=value),value>this.max&&(this.max=value),text.setText(Math.round(value)+" "+this.name+" ("+Math.round(this.min)+"-"+Math.round(this.max)+")"),rightAlpha.setHeight(Math.round(30*(1-value/maxValue))),topBack.fill(),text.fill(),image.draw(),right.fill(),rightAlpha.fill()},{init:function(context){var _ctx=context.$ctx,_dpr=context.$dpr;background=new janvas.Rect(_ctx,0,0,80,48),topBack=new janvas.Rect(_ctx,0,0,80,15),(text=new janvas.Text(_ctx,3,2)).getStyle().setFont("bold 9px Helvetica,Arial,sans-serif").setTextBaseline("top"),graph=new janvas.Rect(_ctx,3,15,74,30),graphAlpha=new janvas.Rect(_ctx,3,15,74,30),right=new janvas.Rect(_ctx,76,15,1,30),rightAlpha=new janvas.Rect(_ctx,76,15,1,30),image=new janvas.Image(_ctx,3,15,context.$canvas,0,0,73,30,4*_dpr,15*_dpr,73*_dpr,30*_dpr)},Panel:Panel})},methods:{init:function(){this.factory.init(this),this.panels=[],this.addPanel("FPS","#00ffff","#000022"),this.addPanel("MS","#00ff00","#002200"),performance&&performance.memory&&this.addPanel("MB","#ff0088","#220011"),this.showPanel(0),this.$raf.resume(),this.$wrapper.style.cursor="pointer"},update:function(){var memory,ts=performance.now();if(void 0===this._ts)return this._ts=ts;switch(this.frames++,this.panel.name){case"FPS":ts>=this._ts+this.fpsTimespan&&(this.panel.update(1e3*this.frames/(ts-this._ts),100),this._ts=ts,this.frames=0);break;case"MS":this.panel.update(ts-this._ts,50),this._ts=ts;break;case"MB":ts>=this._ts+this.mbTimespan&&(memory=performance.memory,this.panel.update(memory.usedJSHeapSize/1048576,memory.totalJSHeapSize/1048576),this._ts=ts)}},showPanel:function(mode){this.panel=this.panels[this.mode=mode],this.panel.show(),this.frames=0,this._ts=void 0},addPanel:function(name,fg,bg){this.panels.push(new this.factory.Panel(name,fg,bg))},updatePanel:function(name,value,maxValue){this.panel.name===name&&this.panel.update(value,maxValue)},removePanel:function(){var index;1<this.panels.length&&(index=this.panels.indexOf(this.panel),this.panels.splice(index,1),this.showPanel(index<this.panels.length?index:index-1))}},events:{click:function(){this.showPanel(++this.mode%this.panels.length)}}});function Panel(name,fg,bg){this.name=name,this.fg=fg,this.bg=bg,this.bgAlpha=(new janvas.Rgb).fromHexString(this.bg).setAlpha(230).toHexString(!0),this.min=1/0,this.max=0}var background,topBack,text,graph,graphAlpha,right,rightAlpha,image},sudoku:sudoku,cursor:function(container){return new janvas.Canvas({container:container,props:{data:["alias","help","copy","progress","wait","crosshair","no-drop","not-allowed","text","vertical-text","col-resize","row-resize","zoom-in","zoom-out","move","all-scroll","pointer","grab","grabbing","cell","n-resize","s-resize","ns-resize","e-resize","w-resize","ew-resize","ne-resize","sw-resize","nesw-resize","nw-resize","se-resize","nwse-resize","inherit","revert","unset","none"]},components:{Button:(janvas.Utils.inheritPrototype(Button,janvas.Animation),Button.prototype.draw=function(){this.mousein?this.rect.fillStroke():this.rect.fill(),this.text.fill()},Button.prototype.resize=function(x,y,size){var cx=x+size/2,cy=y+size/2;this.rect.init(x,y,cx,cy).setWidth(size).setHeight(size),this.text.init(cx,cy,cx,cy)},Button.prototype.setColor=function(color){this.rect.getStyle().setFillStyle(color)},Button.prototype.getText=function(){return this.text.getText()},Button.prototype.setFont=function(font){this.text.getStyle().setFont(font)},Button.prototype.onUpdate=function(ratio){ratio=.236*janvas.Utils.ease.out.elastic(ratio),this.rect.getMatrix().setScale(1+ratio,1+ratio),this.text.getMatrix().setScale(1+ratio,1+ratio)},Button.prototype.eventmove=function(x,y){if(this.rect.isPointInPath(x,y)){if(!this.mousein)return this.isRunning()?this.reverse():this.start(),this.mousein=!0}else this.mousein&&(this.reverse(),this.mousein=!1)},Button)},methods:{init:function(){var params=this.params={};params.center=new janvas.Point,params.start=new janvas.Point,params.hsl=new janvas.Hsl(0,71,62);for(var buttons=this.buttons=new Array(length),i=0;i<this.data.length;i++)buttons[i]=new this.Button(this.$ctx,this.$raf,this.data[i])},resize:function(){var w=this.$width,h=this.$height,params=this.params;params.center.init(w,h).scale(.5,.5),params.size=.809*Math.min(w,h),params.start.init(-params.size/2,-params.size/2).add(params.center),params.start.init(Math.floor(params.start.x),Math.floor(params.start.y)),params.count=Math.ceil(Math.sqrt(this.data.length)),params.gridSize=Math.floor(params.size/params.count);for(var fontSize,min=1/0,i=0;i<this.buttons.length;i++)(fontSize=this.buttons[i]).setColor(params.hsl.setHue(360/(params.count-1)*i).toHslString()),fontSize.resize(params.start.x+i%params.count*params.gridSize,params.start.y+Math.floor(i/params.count)*params.gridSize,params.gridSize),min=(fontSize=janvas.Utils.measureTextFontSize(fontSize.getText(),params.gridSize,"courier"))<min?fontSize:min;for(i=0;i<this.buttons.length;i++)this.buttons[i].setFont("bold "+min+"px courier")},update:function(a,b){for(var i=0;i<this.buttons.length;i++)this.buttons[i].update(b)},draw:function(){this.$clear();for(var i=0;i<this.buttons.length;i++)this.buttons[i].draw()}},events:{mousemove:function(ev){for(var btn,btns=this.buttons,i=0;i<btns.length;i++)if((btn=btns[i]).eventmove(ev.$x,ev.$y)){btns.push(btns.splice(i,1)[0]),this.$canvas.style.cursor=btn.getText();break}}}});function Button(ctx,raf,text){janvas.Animation.call(this,raf,1e3),this.rect=new janvas.Rect(ctx,0,0,0,0),this.text=new janvas.Text(ctx,0,0,text),this.rect.getStyle().setFillStyle("pink").setLineWidth(2),this.text.getStyle().setFillStyle("white").setFont("24px sans-serif").setTextAlign("center").setTextBaseline("middle"),this.mousein=!1}}}});