diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index 338981e..fe1b880 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -91,14 +91,6 @@ */ this.eventsAdded = false; - /** - * The ID of the requestAnimationFrame call, so we can clear it in destroy. - * - * @member {number} - * @private - */ - this.requestId = 0; - //this will make it so that you don't have to call bind all the time /** @@ -169,23 +161,30 @@ */ this.resolution = 1; - /** - * The update method bound to our context. - * - * @member {function} - * @private - */ - this.updateBound = this.update.bind(this); - this.setTargetElement(this.renderer.view, this.renderer.resolution); - - this.update(); } InteractionManager.prototype.constructor = InteractionManager; module.exports = InteractionManager; /** + * Ensures the interaction checks don't happen too often by delaying the update loop + * + * @private + */ +InteractionManager.prototype._tick = function (deltaTime) +{ + this._deltaTime += deltaTime; + + if (this._deltaTime < this.interactionFrequency) + { + return; + } + + this.update(); +}; + +/** * Sets the DOM element which will receive mouse/touch events. This is useful for when you have * other DOM elements on top of the renderers Canvas element. With this you'll be bale to deletegate * another DOM element to receive those events. @@ -216,6 +215,8 @@ return; } + core.ticker.shared.add(this._tick, this); + if (window.navigator.msPointerEnabled) { this.interactionDOMElement.style['-ms-content-zooming'] = 'none'; @@ -246,6 +247,8 @@ return; } + core.ticker.shared.remove(this._tick); + if (window.navigator.msPointerEnabled) { this.interactionDOMElement.style['-ms-content-zooming'] = ''; @@ -268,15 +271,15 @@ }; /** - * updates the state of interactive objects - * - * @private + * Updates the state of interactive objects. + * Invoked by a throttled ticker update from + * {@link PIXI.ticker.shared}. */ InteractionManager.prototype.update = function () { - this.requestId = requestAnimationFrame(this.updateBound); + this._deltaTime = 0; - if( this.throttleUpdate() || !this.interactionDOMElement) + if (!this.interactionDOMElement) { return; } @@ -290,7 +293,7 @@ this.cursor = 'inherit'; - this.processInteractive(this.mouse.global, this.renderer._lastObjectRendered , this.processMouseOverOut.bind(this) , true ); + this.processInteractive(this.mouse.global, this.renderer._lastObjectRendered, this.processMouseOverOut, true ); if (this.currentCursorStyle !== this.cursor) { @@ -325,29 +328,6 @@ }; /** - * Ensures the interaction checks don't happen too often by delaying the update loop - * - * @private - */ -InteractionManager.prototype.throttleUpdate = function () -{ - // frequency of 30fps?? - var now = Date.now(); - var diff = now - this.last; - - diff = (diff * this.interactionFrequency ) / 1000; - - if (diff < 1) - { - return true; - } - - this.last = now; - - return false; -}; - -/** * Maps x and y coords from a DOM object and maps them correctly to the pixi view. The resulting value is stored in the point. * This takes into account the fact that the DOM element could be scaled and positioned anywhere on the screen. * @@ -488,7 +468,7 @@ this.mouse.originalEvent = event; this.eventData.data = this.mouse; this.eventData.stopped = false; - + // Update internal mouse reference this.mapPositionToPoint( this.mouse.global, event.clientX, event.clientY); @@ -865,10 +845,6 @@ this.processTouchMove = null; this._tempPoint = null; - - cancelAnimationFrame(this.requestId); - - this.updateBound = null; }; core.WebGLRenderer.registerPlugin('interaction', InteractionManager);