2012-07-29 07:08:14 +08:00
|
|
|
/**
|
|
|
|
|
* KineticJS JavaScript Library core
|
|
|
|
|
* http://www.kineticjs.com/
|
|
|
|
|
* Copyright 2012, Eric Rowell
|
|
|
|
|
* Licensed under the MIT or GPL Version 2 licenses.
|
2012-10-03 15:04:56 +08:00
|
|
|
* Date: Oct 03 2012
|
2012-07-29 07:08:14 +08:00
|
|
|
*
|
|
|
|
|
* Copyright (C) 2011 - 2012 by Eric Rowell
|
|
|
|
|
*
|
|
|
|
|
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
|
|
|
* of this software and associated documentation files (the "Software"), to deal
|
|
|
|
|
* in the Software without restriction, including without limitation the rights
|
|
|
|
|
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
|
|
|
* copies of the Software, and to permit persons to whom the Software is
|
|
|
|
|
* furnished to do so, subject to the following conditions:
|
|
|
|
|
*
|
|
|
|
|
* The above copyright notice and this permission notice shall be included in
|
|
|
|
|
* all copies or substantial portions of the Software.
|
|
|
|
|
*
|
|
|
|
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
|
|
|
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
|
|
|
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
|
|
|
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
|
|
|
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
|
|
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
|
|
|
* THE SOFTWARE.
|
|
|
|
|
*/
|
2012-10-03 15:04:56 +08:00
|
|
|
var Kinetic={};Kinetic.Filters={},Kinetic.Plugins={},Kinetic.Global={BUBBLE_WHITELIST:["mousedown","mousemove","mouseup","mouseover","mouseout","click","dblclick","touchstart","touchmove","touchend","tap","dbltap","dragstart","dragmove","dragend"],BUFFER_WHITELIST:["fill","stroke","textFill","textStroke"],BUFFER_BLACKLIST:["shadow"],stages:[],idCounter:0,tempNodes:{},shapes:{},maxDragTimeInterval:20,drag:{moving:!1,offset:{x:0,y:0},lastDrawTime:0},warn:function(e){console&&console.warn&&console.warn("Kinetic warning: "+e)},extend:function(e,t){for(var n in t.prototype)n in e.prototype||(e.prototype[n]=t.prototype[n])},_pullNodes:function(e){var t=this.tempNodes;for(var n in t){var r=t[n];r.getStage()!==undefined&&r.getStage()._id===e._id&&(e._addId(r),e._addName(r),this._removeTempNode(r))}},_addTempNode:function(e){this.tempNodes[e._id]=e},_removeTempNode:function(e){delete this.tempNodes[e._id]}},Kinetic.Transition=function(e,t){function r(e,t,i,s){for(var o in e)o!=="duration"&&o!=="easing"&&o!=="callback"&&(Kinetic.Type._isObject(e[o])?(i[o]={},r(e[o],t[o],i[o],s)):n._add(n._getTween(t,o,e[o],i,s)))}this.node=e,this.config=t,this.tweens=[];var n=this,i={};r(t,e.attrs,i,i);var s=0;for(var o=0;o<this.tweens.length;o++){var u=this.tweens[o];u.onFinished=function(){s++,s>=n.tweens.length&&n.onFinished()}}},Kinetic.Transition.prototype={start:function(){for(var e=0;e<this.tweens.length;e++)this.tweens[e].start()},stop:function(){for(var e=0;e<this.tweens.length;e++)this.tweens[e].stop()},resume:function(){for(var e=0;e<this.tweens.length;e++)this.tweens[e].resume()},_onEnterFrame:function(){for(var e=0;e<this.tweens.length;e++)this.tweens[e].onEnterFrame()},_add:function(e){this.tweens.push(e)},_getTween:function(e,t,n,r,i){var s=this.config,o=this.node,u=s.easing;u===undefined&&(u="linear");var a=new Kinetic.Tween(o,function(e){r[t]=e,o.setAttrs(i)},Kinetic.Tweens[u],e[t],n,s.duration);return a}},Kinetic.Filters.Grayscale=function(e){var t=e.data;for(var n=0;n<t.length;n+=4){var r=.34*t[n]+.5*t[n+1]+.16*t[n+2];t[n]=r,t[n+1]=r,t[n+2]=r}},Kinetic.Type={_isElement:function(e){return!!e&&e.nodeType==1},_isFunction:function(e){return!!(e&&e.constructor&&e.call&&e.apply)},_isObject:function(e){return!!e&&e.constructor==Object},_isArray:function(e){return Object.prototype.toString.call(e)=="[object Array]"},_isNumber:function(e){return Object.prototype.toString.call(e)=="[object Number]"},_isString:function(e){return Object.prototype.toString.call(e)=="[object String]"},_hasMethods:function(e){var t=[];for(var n in e)this._isFunction(e[n])&&t.push(n);return t.length>0},_getXY:function(e){if(this._isNumber(e))return{x:e,y:e};if(this._isArray(e)){if(e.length===1){var t=e[0];if(this._isNumber(t))return{x:t,y:t};if(this._isArray(t))return{x:t[0],y:t[1]};if(this._isObject(t))return t}else if(e.length>=2)return{x:e[0],y:e[1]}}else if(this._isObject(e))return e;return{x:0,y:0}},_getSize:function(e){if(this._isNumber(e))return{width:e,height:e};if(this._isArray(e))if(e.length===1){var t=e[0];if(this._isNumber(t))return{width:t,height:t};if(this._isArray(t)){if(t.length>=4)return{width:t[2],height:t[3]};if(t.length>=2)return{width:t[0],height:t[1]}}else if(this._isObject(t))return t}else{if(e.length>=4)return{width:e[2],height:e[3]};if(e.length>=2)return{width:e[0],height:e[1]}}else if(this._isObject(e))return e;return{width:0,height:0}},_getPoints:function(e){if(e===undefined)return[];if(this._isObject(e[0]))return e;var t=[];for(var n=0;n<e.length;n+=2)t.push({x:e[n],y:e[n+1]});return t},_getImage:function(e,t){if(!e)t(null);else if(this._isElement(e))t(e);else if(this._isString(e)){var n=new Image;n.onload=function(){t(n)},n.src=e}else if(e.data){var r=document.createElement("canvas");r.width=e.width,r.height=e.height;var i=r.getContext("2d");i.putImageData(e,0,0);var s=r.toDataURL(),n=new Image;n.onload=function(){t(n)},n.src=s}else t(null)},_rgbToHex:function(e,t,n){return((1<<24)+(e<<16)+(t<<8)+n).toString(16).slice(1)},_hexToRgb:function(e){var t=parseInt(e,16);return{r:t>>16&255,g:t>>8&255,b:t&255}},_getRandomColorKey:function(
|
|
|
|
|
e){this._setUserPosition(e),e.preventDefault();var t=this.getIntersection(this.getUserPosition());if(t&&t.shape){var n=t.shape;n._handleEvent("touchmove",e)}this._startDrag(e)},_setMousePosition:function(e){var t=e.clientX-this._getContentPosition().left,n=e.clientY-this._getContentPosition().top;this.mousePos={x:t,y:n}},_setTouchPosition:function(e){if(e.touches!==undefined&&e.touches.length===1){var t=e.touches[0],n=t.clientX-this._getContentPosition().left,r=t.clientY-this._getContentPosition().top;this.touchPos={x:n,y:r}}},_getContentPosition:function(){var e=this.content.getBoundingClientRect();return{top:e.top,left:e.left}},_endDrag:function(e){var t=Kinetic.Global,n=t.drag.node;n&&(n.nodeType==="Stage"?n.draw():n.getLayer().draw(),t.drag.moving&&(t.drag.moving=!1,n._handleEvent("dragend",e))),t.drag.node=null,this.dragAnim.stop()},_startDrag:function(e){var t=this,n=Kinetic.Global,r=n.drag.node;if(r){var i=t.getUserPosition(),s=r.attrs.dragBoundFunc,o={x:i.x-n.drag.offset.x,y:i.y-n.drag.offset.y};s!==undefined&&(o=s.call(r,o,e)),r.setAbsolutePosition(o),n.drag.moving||(n.drag.moving=!0,n.drag.node._handleEvent("dragstart",e)),n.drag.node._handleEvent("dragmove",e)}},_buildDOM:function(){this.content=document.createElement("div"),this.content.style.position="relative",this.content.style.display="inline-block",this.content.className="kineticjs-content",this.attrs.container.appendChild(this.content),this.bufferCanvas=new Kinetic.Canvas({width:this.attrs.width,height:this.attrs.height}),this._resizeDOM()},_addId:function(e){e.attrs.id!==undefined&&(this.ids[e.attrs.id]=e)},_removeId:function(e){e!==undefined&&delete this.ids[e]},_addName:function(e){var t=e.attrs.name;t!==undefined&&(this.names[t]===undefined&&(this.names[t]=[]),this.names[t].push(e))},_removeName:function(e,t){if(e!==undefined){var n=this.names[e];if(n!==undefined){for(var r=0;r<n.length;r++){var i=n[r];i._id===t&&n.splice(r,1)}n.length===0&&delete this.names[e]}}},_onContent:function(e,t){var n=e.split(" ");for(var r=0;r<n.length;r++){var i=n[r];this.content.addEventListener(i,t,!1)}},_setStageDefaultProperties:function(){this.nodeType="Stage",this.dblClickWindow=400,this.targetShape=null,this.mousePos=undefined,this.clickStart=!1,this.touchPos=undefined,this.tapStart=!1,this.ids={},this.names={},this.dragAnim=new Kinetic.Animation}},Kinetic.Global.extend(Kinetic.Stage,Kinetic.Container),Kinetic.Node.addGetters(Kinetic.Stage,["width","height","container"]),Kinetic.Layer=function(e){this._initLayer(e)},Kinetic.Layer.prototype={_initLayer:function(e){this.setDefaultAttrs({clearBeforeDraw:!0}),this.nodeType="Layer",this.beforeDrawFunc=undefined,this.afterDrawFunc=undefined,this.canvas=new Kinetic.Canvas,this.canvas.getElement().style.position="absolute",this.bufferCanvas=new Kinetic.Canvas,this.bufferCanvas.name="buffer",Kinetic.Container.call(this,e)},draw:function(e){this.beforeDrawFunc!==undefined&&this.beforeDrawFunc.call(this),e?this._draw(e):(this._draw(this.getCanvas()),this._draw(this.bufferCanvas)),this.afterDrawFunc!==undefined&&this.afterDrawFunc.call(this)},drawBuffer:function(){this.draw(this.bufferCanvas)},drawScene:function(){this.draw(this.getCanvas())},beforeDraw:function(e){this.beforeDrawFunc=e},afterDraw:function(e){this.afterDrawFunc=e},getCanvas:function(){return this.canvas},getContext:function(){return this.canvas.context},clear:function(){this.getCanvas().clear()},setVisible:function(e){Kinetic.Node.prototype.setVisible.call(this,e),e?(this.canvas.element.style.display="block",this.bufferCanvas.element.style.display="block"):(this.canvas.element.style.display="none",this.bufferCanvas.element.style.display="none")},moveToTop:function(){Kinetic.Node.prototype.moveToTop.call(this);var e=this.getStage();e&&(e.content.removeChild(this.canvas.element),e.content.appendChild(this.canvas.element))},moveUp:function(){if(Kinetic.Node.prototype.moveUp.call(this)){var e=this.getStage();e&&(e.content.removeChild(this.canvas.element),this.index<e.getChildren().length-1?e.content.insertBefore(this.canvas.element,e.getChildren()[this.index+1].
|
|
|
|
|
.abs(m)&&(u=m,p=!0),i=Kinetic.Path.getPointOnEllipticalArc(s.points[0],s.points[1],s.points[2],s.points[3],u,s.points[6]);break;case"C":u===0?o>s.pathLength?u=1e-8:u=o/s.pathLength:o>f?u+=(o-f)/s.pathLength:u-=(f-o)/s.pathLength,u>1&&(u=1,p=!0),i=Kinetic.Path.getPointOnCubicBezier(u,s.start.x,s.start.y,s.points[0],s.points[1],s.points[2],s.points[3],s.points[4],s.points[5]);break;case"Q":u===0?u=o/s.pathLength:o>f?u+=(o-f)/s.pathLength:u-=(f-o)/s.pathLength,u>1&&(u=1,p=!0),i=Kinetic.Path.getPointOnQuadraticBezier(u,s.start.x,s.start.y,s.points[0],s.points[1],s.points[2],s.points[3])}i!==undefined&&(f=Kinetic.Path.getLineLength(r.x,r.y,i.x,i.y)),p&&(p=!1,s=undefined)}};for(var l=0;l<n.length;l++){f(n[l]);if(r===undefined||i===undefined)break;var c=Kinetic.Path.getLineLength(r.x,r.y,i.x,i.y),h=0,p=Kinetic.Path.getPointOnLine(h+c/2,r.x,r.y,i.x,i.y),d=Math.atan2(i.y-r.y,i.x-r.x);this.glyphInfo.push({transposeX:p.x,transposeY:p.y,text:n[l],rotation:d,p0:r,p1:i}),r=i}}},Kinetic.Global.extend(Kinetic.TextPath,Kinetic.Shape),Kinetic.Node.addGettersSetters(Kinetic.TextPath,["fontFamily","fontSize","fontStyle","textFill","textStroke","textStrokeWidth","text"]);
|
