mirror of
https://github.com/konvajs/konva.git
synced 2025-04-05 20:48:28 +08:00
2 lines
6.9 KiB
JavaScript
2 lines
6.9 KiB
JavaScript
Kinetic.Stage=function(a){this._initStage(a)},Kinetic.Stage.prototype={_initStage:function(a){this.setDefaultAttrs({width:400,height:200}),Kinetic.Container.call(this,a),this._setStageDefaultProperties(),this._id=Kinetic.Global.idCounter++,this._buildDOM(),this._bindContentEvents();var b=Kinetic.Global;b.stages.push(this),this._addId(this),this._addName(this)},setContainer:function(a){typeof a=="string"&&(a=document.getElementById(a)),this.setAttr("container",a)},setHeight:function(a){Kinetic.Node.prototype.setHeight.call(this,a),this._resizeDOM()},setWidth:function(a){Kinetic.Node.prototype.setWidth.call(this,a),this._resizeDOM()},clear:function(){var a=this.children;for(var b=0;b<a.length;b++)a[b].clear()},reset:function(){this.removeChildren(),this._setStageDefaultProperties(),this.setAttrs(this.defaultNodeAttrs)},getMousePosition:function(a){return this.mousePos},getTouchPosition:function(a){return this.touchPos},getUserPosition:function(a){return this.getTouchPosition()||this.getMousePosition()},getStage:function(){return this},getDOM:function(){return this.content},toDataURL:function(a){function i(d){var e=h[d],j=e.toDataURL(),k=new Image;k.onload=function(){g.drawImage(k,0,0),d<h.length-1?i(d+1):a.callback(f.toDataURL(b,c))},k.src=j}var b=a&&a.mimeType?a.mimeType:null,c=a&&a.quality?a.quality:null,d=a&&a.width?a.width:this.attrs.width,e=a&&a.height?a.height:this.attrs.height,f=new Kinetic.Canvas(d,e),g=f.getContext(),h=this.children;i(0)},toImage:function(a){this.toDataURL({callback:function(b){Kinetic.Type._getImage(b,function(b){a.callback(b)})}})},getIntersection:function(a){var b,c=this.getChildren();for(var d=c.length-1;d>=0;d--){var e=c[d];if(e.isVisible()&&e.isListening()){var f=e.bufferCanvas.context.getImageData(Math.round(a.x),Math.round(a.y),1,1).data;if(f[3]===255){var g=Kinetic.Type._rgbToHex(f[0],f[1],f[2]);return b=Kinetic.Global.shapes[g],{shape:b,pixel:f}}if(f[0]>0||f[1]>0||f[2]>0||f[3]>0)return{pixel:f}}}return null},_getNodeById:function(a){return this.ids[a]||null},_getNodesByName:function(a){return this.names[a]||[]},_resizeDOM:function(){if(this.content){var a=this.attrs.width,b=this.attrs.height;this.content.style.width=a+"px",this.content.style.height=b+"px",this.bufferCanvas.setSize(a,b);var c=this.children;for(var d=0;d<c.length;d++){var e=c[d];e.getCanvas().setSize(a,b),e.bufferCanvas.setSize(a,b),e.draw()}}},add:function(a){return Kinetic.Container.prototype.add.call(this,a),a.canvas.setSize(this.attrs.width,this.attrs.height),a.bufferCanvas.setSize(this.attrs.width,this.attrs.height),a.draw(),this.content.appendChild(a.canvas.element),this},_setUserPosition:function(a){a||(a=window.event),this._setMousePosition(a),this._setTouchPosition(a)},_bindContentEvents:function(){var a=Kinetic.Global,b=this,c=["mousedown","mousemove","mouseup","mouseout","touchstart","touchmove","touchend"];for(var d=0;d<c.length;d++){var e=c[d];(function(){var a=e;b.content.addEventListener(a,function(c){b["_"+a](c)},!1)})()}},_mouseout:function(a){this._setUserPosition(a);var b=Kinetic.Global,c=this.targetShape;c&&!b.drag.moving&&(c._handleEvent("mouseout",a),c._handleEvent("mouseleave",a),this.targetShape=null),this.mousePos=undefined,b._endDrag(a)},_mousemove:function(a){this._setUserPosition(a);var b=Kinetic.Global,c=this.getIntersection(this.getUserPosition());if(c){var d=c.shape;d&&(!b.drag.moving&&c.pixel[3]===255&&(!this.targetShape||this.targetShape._id!==d._id)?(this.targetShape&&(this.targetShape._handleEvent("mouseout",a,d),this.targetShape._handleEvent("mouseleave",a,d)),d._handleEvent("mouseover",a,this.targetShape),d._handleEvent("mouseenter",a,this.targetShape),this.targetShape=d):d._handleEvent("mousemove",a))}else this.targetShape&&!b.drag.moving&&(this.targetShape._handleEvent("mouseout",a),this.targetShape._handleEvent("mouseleave",a),this.targetShape=null);b._startDrag(a)},_mousedown:function(a){this._setUserPosition(a);var b=this.getIntersection(this.getUserPosition());if(b&&b.shape){var c=b.shape;this.clickStart=!0,c._handleEvent("mousedown",a)}this.attrs.draggable&&this._initDrag()},_mouseup:function(a){this._setUserPosition(a);var b=Kinetic.Global,c=this.getIntersection(this.getUserPosition()),d=this;if(c&&c.shape){var e=c.shape;e._handleEvent("mouseup",a),this.clickStart&&(!b.drag.moving||!b.drag.node)&&(e._handleEvent("click",a),this.inDoubleClickWindow&&e._handleEvent("dblclick",a),this.inDoubleClickWindow=!0,setTimeout(function(){d.inDoubleClickWindow=!1},this.dblClickWindow))}this.clickStart=!1,b._endDrag(a)},_touchstart:function(a){this._setUserPosition(a),a.preventDefault();var b=this.getIntersection(this.getUserPosition());if(b&&b.shape){var c=b.shape;this.tapStart=!0,c._handleEvent("touchstart",a)}this.attrs.draggable&&this._initDrag()},_touchend:function(a){this._setUserPosition(a);var b=Kinetic.Global,c=this.getIntersection(this.getUserPosition()),d=this;if(c&&c.shape){var e=c.shape;e._handleEvent("touchend",a),this.tapStart&&(!b.drag.moving||!b.drag.node)&&(e._handleEvent("tap",a),this.inDoubleClickWindow&&e._handleEvent("dbltap",a),this.inDoubleClickWindow=!0,setTimeout(function(){d.inDoubleClickWindow=!1},this.dblClickWindow))}this.tapStart=!1,b._endDrag(a)},_touchmove:function(a){this._setUserPosition(a);var b=Kinetic.Global;a.preventDefault();var c=this.getIntersection(this.getUserPosition());if(c&&c.shape){var d=c.shape;d._handleEvent("touchmove",a)}b._startDrag(a)},_setMousePosition:function(a){var b=a.clientX-this._getContentPosition().left,c=a.clientY-this._getContentPosition().top;this.mousePos={x:b,y:c}},_setTouchPosition:function(a){if(a.touches!==undefined&&a.touches.length===1){var b=a.touches[0],c=b.clientX-this._getContentPosition().left,d=b.clientY-this._getContentPosition().top;this.touchPos={x:c,y:d}}},_getContentPosition:function(){var a=this.content.getBoundingClientRect();return{top:a.top,left:a.left}},_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(a){a.attrs.id!==undefined&&(this.ids[a.attrs.id]=a)},_removeId:function(a){a!==undefined&&delete this.ids[a]},_addName:function(a){var b=a.attrs.name;b!==undefined&&(this.names[b]===undefined&&(this.names[b]=[]),this.names[b].push(a))},_removeName:function(a,b){if(a!==undefined){var c=this.names[a];if(c!==undefined){for(var d=0;d<c.length;d++){var e=c[d];e._id===b&&c.splice(d,1)}c.length===0&&delete this.names[a]}}},_onContent:function(a,b){var c=a.split(" ");for(var d=0;d<c.length;d++){var e=c[d];this.content.addEventListener(e,b,!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={}}},Kinetic.Global.extend(Kinetic.Stage,Kinetic.Container),Kinetic.Node.addGetters(Kinetic.Stage,["container"]);
|