(function() { // constants var HASH = '#', BEFORE_DRAW ='beforeDraw', DRAW = 'draw', /* * 2 - 3 - 4 * | | * 1 - 0 5 * | * 8 - 7 - 6 */ INTERSECTION_OFFSETS = [ {x: 0, y: 0}, // 0 {x: -1, y: 0}, // 1 {x: -1, y: -1}, // 2 {x: 0, y: -1}, // 3 {x: 1, y: -1}, // 4 {x: 1, y: 0}, // 5 {x: 1, y: 1}, // 6 {x: 0, y: 1}, // 7 {x: -1, y: 1} // 8 ], INTERSECTION_OFFSETS_LEN = INTERSECTION_OFFSETS.length; Kinetic.Util.addMethods(Kinetic.Layer, { ___init: function(config) { this.nodeType = 'Layer'; this.canvas = new Kinetic.SceneCanvas(); this.hitCanvas = new Kinetic.HitCanvas(); // call super constructor Kinetic.Container.call(this, config); }, _validateAdd: function(child) { var type = child.getType(); if (type !== 'Group' && type !== 'Shape') { Kinetic.Util.error('You may only add groups and shapes to a layer.'); } }, /** * get visible intersection shape. This is the preferred * method for determining if a point intersects a shape or not * @method * @memberof Kinetic.Layer.prototype * @param {Kinetic.Shape} shape */ getIntersection: function() { var pos = Kinetic.Util._getXY(Array.prototype.slice.call(arguments)), shape, i, intersectionOffset; if(this.isVisible()) { for (i=0; i * layer.clear(0, 0, 100, 100); */ clear: function() { var context = this.getContext(), hitContext = this.getHitCanvas().getContext(); context.clear.apply(context, arguments); hitContext.clear.apply(hitContext, arguments); return this; }, // extend Node.prototype.setVisible setVisible: function(visible) { Kinetic.Node.prototype.setVisible.call(this, visible); if(visible) { this.getCanvas()._canvas.style.display = 'block'; this.hitCanvas._canvas.style.display = 'block'; } else { this.getCanvas()._canvas.style.display = 'none'; this.hitCanvas._canvas.style.display = 'none'; } return this; }, // extend Node.prototype.setZIndex setZIndex: function(index) { Kinetic.Node.prototype.setZIndex.call(this, index); var stage = this.getStage(); if(stage) { stage.content.removeChild(this.getCanvas()._canvas); if(index < stage.getChildren().length - 1) { stage.content.insertBefore(this.getCanvas()._canvas, stage.getChildren()[index + 1].getCanvas()._canvas); } else { stage.content.appendChild(this.getCanvas()._canvas); } } return this; }, // extend Node.prototype.moveToTop moveToTop: function() { Kinetic.Node.prototype.moveToTop.call(this); var stage = this.getStage(); if(stage) { stage.content.removeChild(this.getCanvas()._canvas); stage.content.appendChild(this.getCanvas()._canvas); } }, // extend Node.prototype.moveUp moveUp: function() { if(Kinetic.Node.prototype.moveUp.call(this)) { var stage = this.getStage(); if(stage) { stage.content.removeChild(this.getCanvas()._canvas); if(this.index < stage.getChildren().length - 1) { stage.content.insertBefore(this.getCanvas()._canvas, stage.getChildren()[this.index + 1].getCanvas()._canvas); } else { stage.content.appendChild(this.getCanvas()._canvas); } } } }, // extend Node.prototype.moveDown moveDown: function() { if(Kinetic.Node.prototype.moveDown.call(this)) { var stage = this.getStage(); if(stage) { var children = stage.getChildren(); stage.content.removeChild(this.getCanvas()._canvas); stage.content.insertBefore(this.getCanvas()._canvas, children[this.index + 1].getCanvas()._canvas); } } }, // extend Node.prototype.moveToBottom moveToBottom: function() { if(Kinetic.Node.prototype.moveToBottom.call(this)) { var stage = this.getStage(); if(stage) { var children = stage.getChildren(); stage.content.removeChild(this.getCanvas()._canvas); stage.content.insertBefore(this.getCanvas()._canvas, children[1].getCanvas()._canvas); } } }, getLayer: function() { return this; }, remove: function() { var stage = this.getStage(), canvas = this.getCanvas(), _canvas = canvas._canvas; Kinetic.Node.prototype.remove.call(this); if(stage && _canvas && Kinetic.Util._isInDocument(_canvas)) { stage.content.removeChild(_canvas); } return this; }, getStage: function() { return this.parent; } }); Kinetic.Util.extend(Kinetic.Layer, Kinetic.Container); // add getters and setters Kinetic.Factory.addGetterSetter(Kinetic.Layer, 'clearBeforeDraw', true); /** * set flag which determines if the layer is cleared or not * before drawing * @name setClearBeforeDraw * @method * @memberof Kinetic.Node.prototype * @param {Boolean} clearBeforeDraw */ /** * get flag which determines if the layer is cleared or not * before drawing * @name getClearBeforeDraw * @method * @memberof Kinetic.Node.prototype */ })();