From f274cc99f6653b2311c6ea9f8904bb24aa3582b2 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 18 Apr 2013 16:35:06 +0200 Subject: [PATCH 1/3] Don't call event handlers in constructor --- src/ol/renderer/webgl/webgllayerrenderer.js | 111 +++++++++++++------- 1 file changed, 71 insertions(+), 40 deletions(-) diff --git a/src/ol/renderer/webgl/webgllayerrenderer.js b/src/ol/renderer/webgl/webgllayerrenderer.js index c0ed01dabe..4787976241 100644 --- a/src/ol/renderer/webgl/webgllayerrenderer.js +++ b/src/ol/renderer/webgl/webgllayerrenderer.js @@ -51,30 +51,6 @@ ol.renderer.webgl.Layer = function(mapRenderer, layer) { */ this.projectionMatrix = goog.vec.Mat4.createNumberIdentity(); - /** - * @private - * @type {!goog.vec.Mat4.Float32} - */ - this.brightnessMatrix_ = goog.vec.Mat4.createFloat32(); - - /** - * @private - * @type {!goog.vec.Mat4.Float32} - */ - this.contrastMatrix_ = goog.vec.Mat4.createFloat32(); - - /** - * @private - * @type {!goog.vec.Mat4.Float32} - */ - this.hueMatrix_ = goog.vec.Mat4.createFloat32(); - - /** - * @private - * @type {!goog.vec.Mat4.Float32} - */ - this.saturationMatrix_ = goog.vec.Mat4.createFloat32(); - /** * @private * @type {!goog.vec.Mat4.Float32} @@ -87,10 +63,33 @@ ol.renderer.webgl.Layer = function(mapRenderer, layer) { */ this.colorMatrixDirty_ = true; - this.handleLayerBrightnessChange(); - this.handleLayerContrastChange(); - this.handleLayerHueChange(); - this.handleLayerSaturationChange(); + /** + * @private + * @type {!goog.vec.Mat4.Float32} + */ + this.brightnessMatrix_ = goog.vec.Mat4.createFloat32(); + this.updateBrightnessMatrix_(); + + /** + * @private + * @type {!goog.vec.Mat4.Float32} + */ + this.contrastMatrix_ = goog.vec.Mat4.createFloat32(); + this.updateContrastMatrix_(); + + /** + * @private + * @type {!goog.vec.Mat4.Float32} + */ + this.hueMatrix_ = goog.vec.Mat4.createFloat32(); + this.updateHueMatrix_(); + + /** + * @private + * @type {!goog.vec.Mat4.Float32} + */ + this.saturationMatrix_ = goog.vec.Mat4.createFloat32(); + this.updateSaturationMatrix_(); }; goog.inherits(ol.renderer.webgl.Layer, ol.renderer.Layer); @@ -193,9 +192,7 @@ ol.renderer.webgl.Layer.prototype.getProjectionMatrix = function() { * @inheritDoc */ ol.renderer.webgl.Layer.prototype.handleLayerBrightnessChange = function() { - var value = this.getLayer().getBrightness(); - ol.vec.Mat4.makeBrightness(this.brightnessMatrix_, value); - this.colorMatrixDirty_ = true; + this.updateBrightnessMatrix_(); this.dispatchChangeEvent(); }; @@ -204,9 +201,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerBrightnessChange = function() { * @inheritDoc */ ol.renderer.webgl.Layer.prototype.handleLayerContrastChange = function() { - var value = this.getLayer().getContrast(); - ol.vec.Mat4.makeContrast(this.contrastMatrix_, value); - this.colorMatrixDirty_ = true; + this.updateContrastMatrix_(); this.dispatchChangeEvent(); }; @@ -215,9 +210,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerContrastChange = function() { * @inheritDoc */ ol.renderer.webgl.Layer.prototype.handleLayerHueChange = function() { - var value = this.getLayer().getHue(); - ol.vec.Mat4.makeHue(this.hueMatrix_, value); - this.colorMatrixDirty_ = true; + this.updateHueMatrix_(); this.dispatchChangeEvent(); }; @@ -226,9 +219,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerHueChange = function() { * @inheritDoc */ ol.renderer.webgl.Layer.prototype.handleLayerSaturationChange = function() { - var saturation = this.getLayer().getSaturation(); - ol.vec.Mat4.makeSaturation(this.saturationMatrix_, saturation); - this.colorMatrixDirty_ = true; + this.updateSaturationMatrix_(); this.dispatchChangeEvent(); }; @@ -243,6 +234,16 @@ ol.renderer.webgl.Layer.prototype.handleWebGLContextLost = function() { }; +/** + * @private + */ +ol.renderer.webgl.Layer.prototype.updateBrightnessMatrix_ = function() { + var brightness = this.getLayer().getBrightness(); + ol.vec.Mat4.makeBrightness(this.brightnessMatrix_, brightness); + this.colorMatrixDirty_ = true; +}; + + /** * @private */ @@ -255,3 +256,33 @@ ol.renderer.webgl.Layer.prototype.updateColorMatrix_ = function() { goog.vec.Mat4.multMat(colorMatrix, this.hueMatrix_, colorMatrix); this.colorMatrixDirty_ = false; }; + + +/** + * @private + */ +ol.renderer.webgl.Layer.prototype.updateContrastMatrix_ = function() { + var contrast = this.getLayer().getContrast(); + ol.vec.Mat4.makeContrast(this.contrastMatrix_, contrast); + this.colorMatrixDirty_ = true; +}; + + +/** + * @private + */ +ol.renderer.webgl.Layer.prototype.updateHueMatrix_ = function() { + var hue = this.getLayer().getHue(); + ol.vec.Mat4.makeHue(this.hueMatrix_, hue); + this.colorMatrixDirty_ = true; +}; + + +/** + * @private + */ +ol.renderer.webgl.Layer.prototype.updateSaturationMatrix_ = function() { + var saturation = this.getLayer().getSaturation(); + ol.vec.Mat4.makeSaturation(this.saturationMatrix_, saturation); + this.colorMatrixDirty_ = true; +}; From 85a95a0036fcf957d054a47afb74de5529b4feca Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 18 Apr 2013 18:58:59 +0200 Subject: [PATCH 2/3] Call render and requestRenderFrame directly instead of using changed events --- src/ol/renderer/layerrenderer.js | 35 +++++++++++++-------- src/ol/renderer/maprenderer.js | 25 --------------- src/ol/renderer/webgl/webgllayerrenderer.js | 8 ++--- 3 files changed, 26 insertions(+), 42 deletions(-) diff --git a/src/ol/renderer/layerrenderer.js b/src/ol/renderer/layerrenderer.js index 89fb913b6a..72bbc5ed8a 100644 --- a/src/ol/renderer/layerrenderer.js +++ b/src/ol/renderer/layerrenderer.js @@ -72,14 +72,6 @@ ol.renderer.Layer = function(mapRenderer, layer) { goog.inherits(ol.renderer.Layer, ol.Object); -/** - * @protected - */ -ol.renderer.Layer.prototype.dispatchChangeEvent = function() { - this.dispatchEvent(goog.events.EventType.CHANGE); -}; - - /** * @protected * @return {ol.layer.Layer} Layer. @@ -133,7 +125,7 @@ ol.renderer.Layer.prototype.handleLayerHueChange = goog.nullFunction; ol.renderer.Layer.prototype.handleImageChange = function(event) { var image = /** @type {ol.Image} */ (event.target); if (image.getState() === ol.ImageState.LOADED) { - this.getMap().render(); + this.renderIfReadyAndVisible(); } }; @@ -142,7 +134,7 @@ ol.renderer.Layer.prototype.handleImageChange = function(event) { * @protected */ ol.renderer.Layer.prototype.handleLayerLoad = function() { - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; @@ -150,7 +142,7 @@ ol.renderer.Layer.prototype.handleLayerLoad = function() { * @protected */ ol.renderer.Layer.prototype.handleLayerOpacityChange = function() { - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; @@ -164,7 +156,10 @@ ol.renderer.Layer.prototype.handleLayerSaturationChange = goog.nullFunction; * @protected */ ol.renderer.Layer.prototype.handleLayerVisibleChange = function() { - this.dispatchChangeEvent(); + var layer = this.getLayer(); + if (layer.isReady()) { + this.getMap().render(); + } }; @@ -176,7 +171,10 @@ ol.renderer.Layer.prototype.handleLayerVisibleChange = function() { ol.renderer.Layer.prototype.handleTileChange_ = function(event) { var tile = /** @type {ol.Tile} */ (event.target); if (tile.getState() === ol.TileState.LOADED) { - this.getMap().requestRenderFrame(); + var layer = this.getLayer(); + if (layer.getVisible() && layer.isReady()) { + this.getMap().requestRenderFrame(); + } } }; @@ -188,6 +186,17 @@ ol.renderer.Layer.prototype.handleTileChange_ = function(event) { ol.renderer.Layer.prototype.renderFrame = goog.abstractMethod; +/** + * @protected + */ +ol.renderer.Layer.prototype.renderIfReadyAndVisible = function() { + var layer = this.getLayer(); + if (layer.getVisible() && layer.isReady()) { + this.getMap().render(); + } +}; + + /** * @param {ol.FrameState} frameState Frame state. * @param {ol.source.TileSource} tileSource Tile source. diff --git a/src/ol/renderer/maprenderer.js b/src/ol/renderer/maprenderer.js index adc4de270f..a399d4e5b8 100644 --- a/src/ol/renderer/maprenderer.js +++ b/src/ol/renderer/maprenderer.js @@ -3,8 +3,6 @@ goog.provide('ol.renderer.Map'); goog.require('goog.Disposable'); goog.require('goog.asserts'); goog.require('goog.dispose'); -goog.require('goog.events'); -goog.require('goog.events.EventType'); goog.require('goog.functions'); goog.require('goog.object'); goog.require('goog.vec.Mat4'); @@ -42,12 +40,6 @@ ol.renderer.Map = function(container, map) { */ this.layerRenderers_ = {}; - /** - * @private - * @type {Object.} - */ - this.layerRendererChangeListenKeys_ = {}; - }; goog.inherits(ol.renderer.Map, goog.Disposable); @@ -101,8 +93,6 @@ ol.renderer.Map.prototype.disposeInternal = function() { goog.object.forEach(this.layerRenderers_, function(layerRenderer) { goog.dispose(layerRenderer); }); - goog.object.forEach( - this.layerRendererChangeListenKeys_, goog.events.unlistenByKey); goog.base(this, 'disposeInternal'); }; @@ -125,9 +115,6 @@ ol.renderer.Map.prototype.getLayerRenderer = function(layer) { } else { var layerRenderer = this.createLayerRenderer(layer); this.layerRenderers_[layerKey] = layerRenderer; - this.layerRendererChangeListenKeys_[layerKey] = goog.events.listen( - layerRenderer, goog.events.EventType.CHANGE, - this.handleLayerRendererChange_, false, this); return layerRenderer; } }; @@ -150,15 +137,6 @@ ol.renderer.Map.prototype.getMap = function() { }; -/** - * @param {goog.events.Event} event Event. - * @private - */ -ol.renderer.Map.prototype.handleLayerRendererChange_ = function(event) { - this.getMap().render(); -}; - - /** * @param {string} layerKey Layer key. * @return {ol.renderer.Layer} Layer renderer. @@ -168,9 +146,6 @@ ol.renderer.Map.prototype.removeLayerRendererByKey_ = function(layerKey) { goog.asserts.assert(layerKey in this.layerRenderers_); var layerRenderer = this.layerRenderers_[layerKey]; delete this.layerRenderers_[layerKey]; - goog.asserts.assert(layerKey in this.layerRendererChangeListenKeys_); - goog.events.unlistenByKey(this.layerRendererChangeListenKeys_[layerKey]); - delete this.layerRendererChangeListenKeys_[layerKey]; return layerRenderer; }; diff --git a/src/ol/renderer/webgl/webgllayerrenderer.js b/src/ol/renderer/webgl/webgllayerrenderer.js index 4787976241..ef66c43762 100644 --- a/src/ol/renderer/webgl/webgllayerrenderer.js +++ b/src/ol/renderer/webgl/webgllayerrenderer.js @@ -193,7 +193,7 @@ ol.renderer.webgl.Layer.prototype.getProjectionMatrix = function() { */ ol.renderer.webgl.Layer.prototype.handleLayerBrightnessChange = function() { this.updateBrightnessMatrix_(); - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; @@ -202,7 +202,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerBrightnessChange = function() { */ ol.renderer.webgl.Layer.prototype.handleLayerContrastChange = function() { this.updateContrastMatrix_(); - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; @@ -211,7 +211,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerContrastChange = function() { */ ol.renderer.webgl.Layer.prototype.handleLayerHueChange = function() { this.updateHueMatrix_(); - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; @@ -220,7 +220,7 @@ ol.renderer.webgl.Layer.prototype.handleLayerHueChange = function() { */ ol.renderer.webgl.Layer.prototype.handleLayerSaturationChange = function() { this.updateSaturationMatrix_(); - this.dispatchChangeEvent(); + this.renderIfReadyAndVisible(); }; From d291d230929e239a460cfdff50bcb91566f69dc2 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 18 Apr 2013 18:59:22 +0200 Subject: [PATCH 3/3] ol.renderer.Layer no longer needs to inherit from ol.Object --- src/ol/renderer/layerrenderer.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/ol/renderer/layerrenderer.js b/src/ol/renderer/layerrenderer.js index 72bbc5ed8a..b7f2db1d94 100644 --- a/src/ol/renderer/layerrenderer.js +++ b/src/ol/renderer/layerrenderer.js @@ -1,5 +1,6 @@ goog.provide('ol.renderer.Layer'); +goog.require('goog.Disposable'); goog.require('goog.events'); goog.require('goog.events.EventType'); goog.require('ol.Attribution'); @@ -21,7 +22,7 @@ goog.require('ol.source.TileSource'); /** * @constructor - * @extends {ol.Object} + * @extends {goog.Disposable} * @param {ol.renderer.Map} mapRenderer Map renderer. * @param {ol.layer.Layer} layer Layer. */ @@ -69,7 +70,7 @@ ol.renderer.Layer = function(mapRenderer, layer) { this.handleLayerVisibleChange, false, this); }; -goog.inherits(ol.renderer.Layer, ol.Object); +goog.inherits(ol.renderer.Layer, goog.Disposable); /**