ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

separate map and renderer

Browse Source
This commit is contained in:
Éric Lemoine
2012-08-13 23:38:37 +02:00
parent c7f78caec9
commit 9efa34a2a3
10 changed files with 473 additions and 367 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ol/base/createmap.js
+7 -5
View File
@@ -7,7 +7,7 @@ goog.require('ol.Map');
goog.require('ol.MapProperty');
goog.require('ol.Projection');
goog.require('ol.dom');
goog.require('ol.dom.Map');
goog.require('ol.dom.MapRenderer');
goog.require('ol.interaction.AltDragRotate');
goog.require('ol.interaction.CenterConstraint');
goog.require('ol.interaction.Constraints');
@@ -20,7 +20,7 @@ goog.require('ol.interaction.ResolutionConstraint');
goog.require('ol.interaction.RotationConstraint');
goog.require('ol.interaction.ShiftDragZoom');
goog.require('ol.webgl');
goog.require('ol.webgl.Map');
goog.require('ol.webgl.MapRenderer');
/**
@@ -128,16 +128,18 @@ ol.createMap = function(target, opt_values, opt_rendererHints) {
rendererHints = ol.DEFAULT_RENDERER_HINT;
}
var i, rendererHint;
var i, rendererHint, rendererConstructor;
for (i = 0; i < rendererHints.length; ++i) {
rendererHint = rendererHints[i];
if (rendererHint == ol.RendererHint.DOM) {
if (ol.ENABLE_DOM && ol.dom.isSupported()) {
return new ol.dom.Map(target, values);
rendererConstructor = ol.dom.MapRenderer;
return new ol.Map(target, rendererConstructor, values);
}
} else if (rendererHint == ol.RendererHint.WEBGL) {
if (ol.ENABLE_WEBGL && ol.webgl.isSupported()) {
return new ol.webgl.Map(target, values);
rendererConstructor = ol.webgl.MapRenderer;
return new ol.Map(target, rendererConstructor, values);
}
}
}
src/ol/base/layerrenderer.js
+13 -5
View File
@@ -11,18 +11,18 @@ goog.require('ol.Object');
/**
* @constructor
* @extends {ol.Object}
* @param {ol.Map} map Map.
* @param {ol.MapRenderer} mapRenderer Map renderer.
* @param {ol.Layer} layer Layer.
*/
ol.LayerRenderer = function(map, layer) {
ol.LayerRenderer = function(mapRenderer, layer) {
goog.base(this);
/**
* @private
* @type {ol.Map}
* @type {ol.MapRenderer}
*/
this.map_ = map;
this.mapRenderer_ = mapRenderer;
/**
* @private
@@ -69,11 +69,19 @@ ol.LayerRenderer.prototype.getLayer = function() {
};
/**
* @return {ol.MapRenderer} Map renderer.
*/
ol.LayerRenderer.prototype.getMapRenderer = function() {
return this.mapRenderer_;
};
/**
* @return {ol.Map} Map.
*/
ol.LayerRenderer.prototype.getMap = function() {
return this.map_;
return this.mapRenderer_.getMap();
};
src/ol/base/map.js
+12 -273
View File
@@ -71,11 +71,13 @@ ol.MapPaneZIndex = {
* @constructor
* @extends {ol.Object}
* @param {Element} target Target.
* @param {Function} rendererConstructor Renderer constructor.
* @param {Object=} opt_values Values.
* @param {goog.dom.ViewportSizeMonitor=} opt_viewportSizeMonitor
* Viewport size monitor.
*/
ol.Map = function(target, opt_values, opt_viewportSizeMonitor) {
ol.Map = function(
target, rendererConstructor, opt_values, opt_viewportSizeMonitor) {
goog.base(this);
@@ -148,22 +150,11 @@ ol.Map = function(target, opt_values, opt_viewportSizeMonitor) {
this.registerDisposable(dragger);
/**
* @type {ol.MapRenderer}
* @private
* @type {goog.fx.anim.Animated}
*/
this.animation_ = new ol.MapAnimation(this);
/**
* @private
* @type {boolean}
*/
this.animating_ = false;
/**
* @private
* @type {number}
*/
this.freezeRenderingCount_ = 0;
this.renderer_ = new rendererConstructor(target, this);
this.registerDisposable(this.renderer_);
/**
* @private
@@ -171,18 +162,6 @@ ol.Map = function(target, opt_values, opt_viewportSizeMonitor) {
*/
this.target_ = target;
/**
* @private
* @type {Array.<number>}
*/
this.layersListenerKeys_ = null;
/**
* @protected
* @type {Object.<number, ol.LayerRenderer>}
*/
this.layerRenderers = {};
/**
* @private
* @type {goog.dom.ViewportSizeMonitor}
@@ -193,18 +172,10 @@ ol.Map = function(target, opt_values, opt_viewportSizeMonitor) {
goog.events.listen(this.viewportSizeMonitor_, goog.events.EventType.RESIZE,
this.handleViewportResize, false, this);
goog.events.listen(this,
ol.Object.getChangedEventType(ol.MapProperty.BACKGROUND_COLOR),
this.handleBackgroundColorChanged, false, this);
goog.events.listen(
this, ol.Object.getChangedEventType(ol.MapProperty.CENTER),
this.handleCenterChanged, false, this);
goog.events.listen(
this, ol.Object.getChangedEventType(ol.MapProperty.LAYERS),
this.handleLayersChanged, false, this);
goog.events.listen(
this, ol.Object.getChangedEventType(ol.MapProperty.PROJECTION),
this.handleProjectionChanged, false, this);
@@ -229,52 +200,17 @@ ol.Map = function(target, opt_values, opt_viewportSizeMonitor) {
this.setValues(opt_values);
}
this.handleViewportResize();
};
goog.inherits(ol.Map, ol.Object);
/**
* @param {ol.Layer} layer Layer.
* @protected
*/
ol.Map.prototype.addLayer = function(layer) {
var layerRenderer = this.createLayerRenderer(layer);
this.setLayerRenderer(layer, layerRenderer);
};
/**
* @private
*/
ol.Map.prototype.animate_ = function() {
goog.asserts.assert(!this.animating_);
goog.fx.anim.registerAnimation(this.animation_);
this.animating_ = true;
};
/**
* @return {boolean} Can rotate.
*/
ol.Map.prototype.canRotate = goog.functions.FALSE;
/**
* @param {ol.Layer} layer Layer.
* @protected
* @return {ol.LayerRenderer} layerRenderer Layer renderer.
*/
ol.Map.prototype.createLayerRenderer = goog.abstractMethod;
/**
* @inheritDoc
*/
ol.Map.prototype.disposeInternal = function() {
goog.object.forEach(this.layerRenderers, function(layerRenderer) {
goog.dispose(layerRenderer);
});
goog.base(this, 'disposeInternal');
ol.Map.prototype.canRotate = function() {
return this.renderer_.canRotate();
};
@@ -300,29 +236,6 @@ ol.Map.prototype.fitUserExtent = function(userExtent) {
};
/**
* @param {function(this: T, ol.Layer, ol.LayerRenderer, number)} f Function.
* @param {T=} opt_obj Object.
* @template T
*/
ol.Map.prototype.forEachReadyVisibleLayer = function(f, opt_obj) {
var layers = this.getLayers();
layers.forEach(function(layer, index) {
if (layer.isReady() && layer.getVisible()) {
var layerRenderer = this.getLayerRenderer(layer);
f.call(opt_obj, layer, layerRenderer, index);
}
}, this);
};
/**
*/
ol.Map.prototype.freezeRendering = function() {
++this.freezeRenderingCount_;
};
/**
* @return {ol.Color|undefined} Background color.
*/
@@ -395,19 +308,6 @@ goog.exportProperty(
ol.Map.prototype.getInteractions);
/**
* @param {ol.Layer} layer Layer.
* @protected
* @return {ol.LayerRenderer} Layer renderer.
*/
ol.Map.prototype.getLayerRenderer = function(layer) {
var key = goog.getUid(layer);
var layerRenderer = this.layerRenderers[key];
goog.asserts.assert(goog.isDef(layerRenderer));
return layerRenderer;
};
/**
* @return {ol.Collection} Layers.
*/
@@ -568,11 +468,6 @@ goog.exportProperty(
ol.Map.prototype.getUserProjection);
/**
*/
ol.Map.prototype.handleBackgroundColorChanged = goog.nullFunction;
/**
* @param {goog.events.BrowserEvent} browserEvent Browser event.
* @param {string=} opt_type Type.
@@ -607,52 +502,6 @@ ol.Map.prototype.handleDraggerEvent = function(dragEvent) {
};
/**
* @param {ol.CollectionEvent} collectionEvent Collection event.
* @protected
*/
ol.Map.prototype.handleLayersAdd = function(collectionEvent) {
var layer = /** @type {ol.Layer} */ collectionEvent.elem;
this.addLayer(layer);
};
/**
* @protected
*/
ol.Map.prototype.handleLayersChanged = function() {
var layerRenderers = goog.object.getValues(this.layerRenderers);
goog.array.forEach(layerRenderers, function(layerRenderer) {
this.removeLayerRenderer(layerRenderer);
}, this);
this.layerRenderers = {};
if (!goog.isNull(this.layersListenerKeys_)) {
goog.array.forEach(this.layersListenerKeys_, goog.events.unlistenByKey);
this.layersListenerKeys_ = null;
}
var layers = this.getLayers();
if (goog.isDefAndNotNull(layers)) {
layers.forEach(this.addLayer, this);
this.layersListenerKeys_ = [
goog.events.listen(layers, ol.CollectionEventType.ADD,
this.handleLayersAdd, false, this),
goog.events.listen(layers, ol.CollectionEventType.REMOVE,
this.handleLayersRemove, false, this)
];
}
};
/**
* @param {ol.CollectionEvent} collectionEvent Collection event.
* @protected
*/
ol.Map.prototype.handleLayersRemove = function(collectionEvent) {
var layer = /** @type {ol.Layer} */ collectionEvent.elem;
this.removeLayer(layer);
};
/**
* @protected
*/
@@ -731,63 +580,6 @@ ol.Map.prototype.recalculateTransforms_ = function() {
};
/**
* @param {ol.Layer} layer Layer.
* @protected
*/
ol.Map.prototype.removeLayer = function(layer) {
goog.dispose(this.removeLayerRenderer(layer));
};
/**
* @param {ol.Layer} layer Layer.
* @return {ol.LayerRenderer} Layer renderer.
* @protected
*/
ol.Map.prototype.removeLayerRenderer = function(layer) {
var key = goog.getUid(layer);
if (key in this.layerRenderers) {
var layerRenderer = this.layerRenderers[key];
delete this.layerRenderers[key];
return layerRenderer;
} else {
return null;
}
};
/**
*/
ol.Map.prototype.render = function() {
if (!this.animating_) {
if (this.freezeRenderingCount_ === 0) {
if (this.renderInternal()) {
this.animate_();
}
} else {
this.dirty_ = true;
}
}
};
/**
* @protected
* @return {boolean} Animating.
*/
ol.Map.prototype.renderInternal = function() {
this.dirty_ = false;
var animate = false;
this.forEachReadyVisibleLayer(function(layer, layerRenderer) {
if (layerRenderer.render()) {
animate = true;
}
});
return animate;
};
/**
* @param {ol.Color} backgroundColor Background color.
*/
@@ -824,18 +616,6 @@ goog.exportProperty(
ol.Map.prototype.setInteractions);
/**
* @param {ol.Layer} layer Layer.
* @param {ol.LayerRenderer} layerRenderer Layer renderer.
* @protected
*/
ol.Map.prototype.setLayerRenderer = function(layer, layerRenderer) {
var key = goog.getUid(layer);
goog.asserts.assert(!(key in this.layerRenderers));
this.layerRenderers[key] = layerRenderer;
};
/**
* @export
* @param {ol.Collection} layers Layers.
@@ -929,20 +709,6 @@ goog.exportProperty(
ol.Map.prototype.setUserProjection);
/**
*/
ol.Map.prototype.unfreezeRendering = function() {
goog.asserts.assert(this.freezeRenderingCount_ > 0);
if (--this.freezeRenderingCount_ === 0) {
if (!this.animating_ && this.dirty_) {
if (this.renderInternal()) {
this.animate_();
}
}
}
};
/**
* @private
*/
@@ -1010,37 +776,10 @@ ol.Map.prototype.updateMatrices_ = function() {
* @template T
*/
ol.Map.prototype.withFrozenRendering = function(f, opt_obj) {
this.freezeRendering();
this.renderer_.freezeRendering();
try {
f.call(opt_obj);
} finally {
this.unfreezeRendering();
}
};
/**
* @constructor
* @implements {goog.fx.anim.Animated}
* @param {!ol.Map} map Map.
*/
ol.MapAnimation = function(map) {
/**
* @private
* @type {ol.Map}
*/
this.map_ = map;
};
/**
* @inheritDoc
*/
ol.MapAnimation.prototype.onAnimationFrame = function() {
if (!this.map_.renderInternal()) {
goog.fx.anim.unregisterAnimation(this);
this.renderer_.unfreezeRendering();
}
};
src/ol/base/maprenderer.js
+367
View File
@@ -0,0 +1,367 @@
// FIXME unregister listeners when disposed
goog.provide('ol.MapRenderer');
goog.require('goog.events');
goog.require('goog.Disposable');
goog.require('goog.fx.anim');
goog.require('goog.fx.anim.Animated');
goog.require('ol.Map');
goog.require('ol.MapProperty');
/**
* @constructor
* @extends {goog.Disposable}
* @param {Element} target Target.
* @param {ol.Map} map Map.
*/
ol.MapRenderer = function(target, map) {
goog.base(this);
/**
* @private
* @type {Element}
*/
this.target_ = target;
/**
* @protected
* @type {ol.Map}
*/
this.map = map;
/**
* @private
* @type {ol.MapRendererAnimation}
*/
this.animation_ = new ol.MapRendererAnimation(this);
/**
* @private
* @type {boolean}
*/
this.animating_ = false;
/**
* @private
* @type {boolean}
*/
this.dirty_ = false;
/**
* @private
* @type {number}
*/
this.freezeRenderingCount_ = 0;
/**
* @private
* @type {Array.<number>}
*/
this.layersListenerKeys_ = null;
/**
* @protected
* @type {Object.<number, ol.LayerRenderer>}
*/
this.layerRenderers = {};
goog.events.listen(map,
ol.Object.getChangedEventType(ol.MapProperty.BACKGROUND_COLOR),
this.handleBackgroundColorChanged, false, this);
goog.events.listen(
map, ol.Object.getChangedEventType(ol.MapProperty.CENTER),
this.handleCenterChanged, false, this);
goog.events.listen(
map, ol.Object.getChangedEventType(ol.MapProperty.LAYERS),
this.handleLayersChanged, false, this);
goog.events.listen(
map, ol.Object.getChangedEventType(ol.MapProperty.RESOLUTION),
this.handleResolutionChanged, false, this);
goog.events.listen(
map, ol.Object.getChangedEventType(ol.MapProperty.ROTATION),
this.handleRotationChanged, false, this);
goog.events.listen(
map, ol.Object.getChangedEventType(ol.MapProperty.SIZE),
this.handleSizeChanged, false, this);
};
goog.inherits(ol.MapRenderer, goog.Disposable);
/**
* @inheritDoc
*/
ol.MapRenderer.prototype.disposeInternal = function() {
goog.object.forEach(this.layerRenderers, function(layerRenderer) {
goog.dispose(layerRenderer);
});
goog.base(this, 'disposeInternal');
};
/**
* @param {function(this: T, ol.Layer, ol.LayerRenderer, number)} f Function.
* @param {T=} opt_obj Object.
* @template T
*/
ol.MapRenderer.prototype.forEachReadyVisibleLayer = function(f, opt_obj) {
var layers = this.map.getLayers();
layers.forEach(function(layer, index) {
if (layer.isReady() && layer.getVisible()) {
var layerRenderer = this.getLayerRenderer(layer);
f.call(opt_obj, layer, layerRenderer, index);
}
}, this);
};
/**
* @return {ol.Map}
*/
ol.MapRenderer.prototype.getMap = function() {
return this.map;
};
/**
* @param {ol.Layer} layer Layer.
* @protected
* @return {ol.LayerRenderer} Layer renderer.
*/
ol.MapRenderer.prototype.getLayerRenderer = function(layer) {
var key = goog.getUid(layer);
var layerRenderer = this.layerRenderers[key];
goog.asserts.assert(goog.isDef(layerRenderer));
return layerRenderer;
};
/**
* @param {ol.Layer} layer Layer.
* @param {ol.LayerRenderer} layerRenderer Layer renderer.
* @protected
*/
ol.MapRenderer.prototype.setLayerRenderer = function(layer, layerRenderer) {
var key = goog.getUid(layer);
goog.asserts.assert(!(key in this.layerRenderers));
this.layerRenderers[key] = layerRenderer;
};
/**
* @return {boolean} Can rotate.
*/
ol.MapRenderer.prototype.canRotate = goog.functions.FALSE;
/**
*/
ol.MapRenderer.prototype.handleBackgroundColorChanged = goog.nullFunction;
/**
* @protected
*/
ol.MapRenderer.prototype.handleCenterChanged = goog.nullFunction;
/**
* @protected
*/
ol.MapRenderer.prototype.handleLayersChanged = function() {
var layerRenderers = goog.object.getValues(this.layerRenderers);
goog.array.forEach(layerRenderers, function(layerRenderer) {
this.removeLayerRenderer(layerRenderer);
}, this);
this.layerRenderers = {};
if (!goog.isNull(this.layersListenerKeys_)) {
goog.array.forEach(this.layersListenerKeys_, goog.events.unlistenByKey);
this.layersListenerKeys_ = null;
}
var layers = this.map.getLayers();
if (goog.isDefAndNotNull(layers)) {
layers.forEach(this.addLayer, this);
this.layersListenerKeys_ = [
goog.events.listen(layers, ol.CollectionEventType.ADD,
this.handleLayersAdd, false, this),
goog.events.listen(layers, ol.CollectionEventType.REMOVE,
this.handleLayersRemove, false, this)
];
}
};
/**
* @param {ol.CollectionEvent} collectionEvent Collection event.
* @protected
*/
ol.MapRenderer.prototype.handleLayersAdd = function(collectionEvent) {
var layer = /** @type {ol.Layer} */ collectionEvent.elem;
this.addLayer(layer);
};
/**
* @param {ol.Layer} layer Layer.
* @protected
*/
ol.MapRenderer.prototype.addLayer = function(layer) {
var layerRenderer = this.createLayerRenderer(layer);
this.setLayerRenderer(layer, layerRenderer);
};
/**
* @param {ol.Layer} layer Layer.
* @protected
* @return {ol.LayerRenderer} layerRenderer Layer renderer.
*/
ol.MapRenderer.prototype.createLayerRenderer = goog.abstractMethod;
/**
* @param {ol.CollectionEvent} collectionEvent Collection event.
* @protected
*/
ol.MapRenderer.prototype.handleLayersRemove = function(collectionEvent) {
var layer = /** @type {ol.Layer} */ collectionEvent.elem;
this.removeLayer(layer);
};
/**
* @param {ol.Layer} layer Layer.
* @protected
*/
ol.MapRenderer.prototype.removeLayer = function(layer) {
goog.dispose(this.removeLayerRenderer(layer));
};
/**
* @param {ol.Layer} layer Layer.
* @return {ol.LayerRenderer} Layer renderer.
* @protected
*/
ol.MapRenderer.prototype.removeLayerRenderer = function(layer) {
var key = goog.getUid(layer);
if (key in this.layerRenderers) {
var layerRenderer = this.layerRenderers[key];
delete this.layerRenderers[key];
return layerRenderer;
} else {
return null;
}
};
/**
* @protected
*/
ol.MapRenderer.prototype.handleResolutionChanged = goog.nullFunction;
/**
* @protected
*/
ol.MapRenderer.prototype.handleRotationChanged = goog.nullFunction;
/**
* @protected
*/
ol.MapRenderer.prototype.handleSizeChanged = goog.nullFunction;
/**
*/
ol.MapRenderer.prototype.render = function() {
if (!this.animating_) {
if (this.freezeRenderingCount_ === 0) {
if (this.renderInternal()) {
this.animate_();
}
} else {
this.dirty_ = true;
}
}
};
/**
* @protected
* @return {boolean} Animating.
*/
ol.MapRenderer.prototype.renderInternal = function() {
this.dirty_ = false;
var animate = false;
this.forEachReadyVisibleLayer(function(layer, layerRenderer) {
if (layerRenderer.render()) {
animate = true;
}
});
return animate;
};
/**
* @private
*/
ol.MapRenderer.prototype.animate_ = function() {
goog.asserts.assert(!this.animating_);
goog.fx.anim.registerAnimation(this.animation_);
this.animating_ = true;
};
/**
*/
ol.MapRenderer.prototype.freezeRendering = function() {
++this.freezeRenderingCount_;
};
/**
*/
ol.MapRenderer.prototype.unfreezeRendering = function() {
goog.asserts.assert(this.freezeRenderingCount_ > 0);
if (--this.freezeRenderingCount_ === 0) {
if (!this.animating_ && this.dirty_) {
if (this.renderInternal()) {
this.animate_();
}
}
}
};
/**
* @constructor
* @implements {goog.fx.anim.Animated}
* @param {!ol.MapRenderer} renderer renderer.
*/
ol.MapRendererAnimation = function(renderer) {
/**
* @private
* @type {ol.MapRenderer}
*/
this.renderer_ = renderer;
};
/**
* @inheritDoc
*/
ol.MapRendererAnimation.prototype.onAnimationFrame = function() {
if (!this.renderer_.renderInternal()) {
goog.fx.anim.unregisterAnimation(this);
}
};