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

12
src/ol/base/createmap.js
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);
}
}
}

18
src/ol/base/layerrenderer.js
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();
};

285
src/ol/base/map.js
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();
}
};

367
src/ol/base/maprenderer.js Normal file
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);
}
};

12
src/ol/dom/layerrenderer.js
View File

@@ -8,12 +8,12 @@ goog.require('ol.LayerRenderer');
/**
* @constructor
* @extends {ol.LayerRenderer}
* @param {ol.dom.Map} map Map.
* @param {ol.MapRenderer} mapRenderer Map renderer.
* @param {ol.Layer} layer Layer.
* @param {!Element} target Target.
*/
ol.dom.LayerRenderer = function(map, layer, target) {
goog.base(this, map, layer);
ol.dom.LayerRenderer = function(mapRenderer, layer, target) {
goog.base(this, mapRenderer, layer);
/**
* @type {!Element}
@@ -38,10 +38,10 @@ goog.inherits(ol.dom.LayerRenderer, ol.LayerRenderer);
/**
* @override
* @return {ol.dom.Map} Map.
* @return {ol.MapRenderer} Map renderer.
*/
ol.dom.LayerRenderer.prototype.getMap = function() {
return /** @type {ol.dom.Map} */ goog.base(this, 'getMap');
ol.dom.LayerRenderer.prototype.getMapRenderer = function() {
return /** @type {ol.dom.MapRenderer} */ goog.base(this, 'getMapRenderer');
};

44
src/ol/dom/map.js → src/ol/dom/maprenderer.js
View File

@@ -1,4 +1,4 @@
goog.provide('ol.dom.Map');
goog.provide('ol.dom.MapRenderer');
goog.require('goog.asserts');
goog.require('goog.dom');
@@ -6,6 +6,7 @@ goog.require('goog.dom.TagName');
goog.require('goog.style');
goog.require('ol.Coordinate');
goog.require('ol.Map');
goog.require('ol.MapRenderer');
goog.require('ol.TileLayer');
goog.require('ol.dom.TileLayerRenderer');
@@ -13,13 +14,13 @@ goog.require('ol.dom.TileLayerRenderer');
/**
* @constructor
* @extends {ol.Map}
* @extends {ol.MapRenderer}
* @param {Element} target Target.
* @param {Object.<string, *>=} opt_values Values.
* @param {ol.Map} map Map.
*/
ol.dom.Map = function(target, opt_values) {
ol.dom.MapRenderer = function(target, map) {
goog.base(this, target);
goog.base(this, target, map);
/**
* @type {!Element}
@@ -61,27 +62,20 @@ ol.dom.Map = function(target, opt_values) {
* @private
*/
this.layersPaneOffset_ = null;
if (goog.isDef(opt_values)) {
this.setValues(opt_values);
}
this.handleViewportResize();
};
goog.inherits(ol.dom.Map, ol.Map);
goog.inherits(ol.dom.MapRenderer, ol.MapRenderer);
/**
* Reset the layers pane to its initial position.
* @private
*/
ol.dom.Map.prototype.resetLayersPane_ = function() {
ol.dom.MapRenderer.prototype.resetLayersPane_ = function() {
var offset = new ol.Coordinate(0, 0);
goog.style.setPosition(this.layersPane_, offset);
this.layersPaneOffset_ = offset;
this.renderedCenter_ = this.getCenter();
this.renderedCenter_ = this.map.getCenter();
this.setOrigin_();
};
@@ -91,10 +85,10 @@ ol.dom.Map.prototype.resetLayersPane_ = function() {
* Set the origin for each layer renderer.
* @private
*/
ol.dom.Map.prototype.setOrigin_ = function() {
var center = this.getCenter();
var resolution = this.getResolution();
var targetSize = this.getSize();
ol.dom.MapRenderer.prototype.setOrigin_ = function() {
var center = this.map.getCenter();
var resolution = this.map.getResolution();
var targetSize = this.map.getSize();
var targetWidth = targetSize.width;
var targetHeight = targetSize.height;
var origin = new ol.Coordinate(
@@ -110,10 +104,10 @@ ol.dom.Map.prototype.setOrigin_ = function() {
* Move the layers pane.
* @private
*/
ol.dom.Map.prototype.shiftLayersPane_ = function() {
var center = this.getCenter();
ol.dom.MapRenderer.prototype.shiftLayersPane_ = function() {
var center = this.map.getCenter();
var oldCenter = this.renderedCenter_;
var resolution = this.getResolution();
var resolution = this.map.getResolution();
var dx = Math.round((oldCenter.x - center.x) / resolution);
var dy = Math.round((center.y - oldCenter.y) / resolution);
if (!(dx === 0 && dy === 0)) {
@@ -129,7 +123,7 @@ ol.dom.Map.prototype.shiftLayersPane_ = function() {
/**
* @inheritDoc
*/
ol.dom.Map.prototype.createLayerRenderer = function(layer) {
ol.dom.MapRenderer.prototype.createLayerRenderer = function(layer) {
if (layer instanceof ol.TileLayer) {
@@ -154,7 +148,7 @@ ol.dom.Map.prototype.createLayerRenderer = function(layer) {
/**
* @inheritDoc
*/
ol.dom.Map.prototype.handleCenterChanged = function() {
ol.dom.MapRenderer.prototype.handleCenterChanged = function() {
goog.base(this, 'handleCenterChanged');
// FIXME: shiftLayersPane_ and resetLayersPane_ should be called
// elsewhere as we may be frozen here
@@ -170,7 +164,7 @@ ol.dom.Map.prototype.handleCenterChanged = function() {
/**
* @inheritDoc
*/
ol.dom.Map.prototype.handleResolutionChanged = function() {
ol.dom.MapRenderer.prototype.handleResolutionChanged = function() {
goog.base(this, 'handleResolutionChanged');
// FIXME: resetLayersPane_ should be called
// elsewhere as we may be frozen here

6
src/ol/dom/tilelayerrenderer.js
View File

@@ -13,12 +13,12 @@ goog.require('ol.dom.LayerRenderer');
/**
* @constructor
* @extends {ol.dom.LayerRenderer}
* @param {ol.dom.Map} map Map.
* @param {ol.MapRenderer} mapRenderer Map renderer..
* @param {ol.TileLayer} tileLayer Tile layer.
* @param {!Element} target Target.
*/
ol.dom.TileLayerRenderer = function(map, tileLayer, target) {
goog.base(this, map, tileLayer, target);
ol.dom.TileLayerRenderer = function(mapRenderer, tileLayer, target) {
goog.base(this, mapRenderer, tileLayer, target);
/**
* @type {Object}

15
src/ol/webgl/layerrenderer.js
View File

@@ -9,11 +9,11 @@ goog.require('ol.LayerRenderer');
/**
* @constructor
* @extends {ol.LayerRenderer}
* @param {ol.webgl.Map} map Map.
* @param {ol.MapRenderer} mapRenderer Map renderer.
* @param {ol.Layer} layer Layer.
*/
ol.webgl.LayerRenderer = function(map, layer) {
goog.base(this, map, layer);
ol.webgl.LayerRenderer = function(mapRenderer, layer) {
goog.base(this, mapRenderer, layer);
};
goog.inherits(ol.webgl.LayerRenderer, ol.LayerRenderer);
@@ -36,17 +36,16 @@ ol.webgl.LayerRenderer.prototype.getTexture = goog.abstractMethod;
* @return {WebGLRenderingContext} GL.
*/
ol.webgl.LayerRenderer.prototype.getGL = function() {
var map = /** @type {ol.webgl.Map} */ this.getMap();
return map.getGL();
return this.getMapRenderer().getGL();
};
/**
* @override
* @return {ol.webgl.Map} Map.
* @return {ol.MapRenderer} MapRenderer.
*/
ol.webgl.LayerRenderer.prototype.getMap = function() {
return /** @type {ol.webgl.Map} */ goog.base(this, 'getMap');
ol.webgl.LayerRenderer.prototype.getMapRenderer = function() {
return /** @type {ol.webgl.MapRenderer} */ goog.base(this, 'getMapRenderer');
};

67
src/ol/webgl/map.js → src/ol/webgl/maprenderer.js
View File

@@ -4,7 +4,7 @@
// FIXME defer cleanup until post-render
// FIXME check against gl.getParameter(webgl.MAX_TEXTURE_SIZE)
goog.provide('ol.webgl.Map');
goog.provide('ol.webgl.MapRenderer');
goog.provide('ol.webgl.map.shader');
goog.require('goog.debug.Logger');
@@ -134,13 +134,13 @@ goog.addSingletonGetter(ol.webgl.map.shader.Vertex);
/**
* @constructor
* @extends {ol.Map}
* @extends {ol.MapRenderer}
* @param {Element} target Target.
* @param {Object.<string, *>=} opt_values Values.
* @param {ol.Map} map Map.
*/
ol.webgl.Map = function(target, opt_values) {
ol.webgl.MapRenderer = function(target, map) {
goog.base(this, target);
goog.base(this, target, map);
/**
* @private
@@ -232,21 +232,16 @@ ol.webgl.Map = function(target, opt_values) {
*/
this.layerRendererChangeListenKeys_ = {};
if (goog.isDef(opt_values)) {
this.setValues(opt_values);
}
this.handleViewportResize();
this.handleWebGLContextRestored();
};
goog.inherits(ol.webgl.Map, ol.Map);
goog.inherits(ol.webgl.MapRenderer, ol.MapRenderer);
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.addLayer = function(layer) {
ol.webgl.MapRenderer.prototype.addLayer = function(layer) {
goog.base(this, 'addLayer', layer);
if (layer.getVisible()) {
this.render();
@@ -259,7 +254,7 @@ ol.webgl.Map.prototype.addLayer = function(layer) {
* @param {number} magFilter Mag filter.
* @param {number} minFilter Min filter.
*/
ol.webgl.Map.prototype.bindImageTexture =
ol.webgl.MapRenderer.prototype.bindImageTexture =
function(image, magFilter, minFilter) {
var gl = this.getGL();
var imageKey = image.src;
@@ -301,13 +296,13 @@ ol.webgl.Map.prototype.bindImageTexture =
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.canRotate = goog.functions.TRUE;
ol.webgl.MapRenderer.prototype.canRotate = goog.functions.TRUE;
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.createLayerRenderer = function(layer) {
ol.webgl.MapRenderer.prototype.createLayerRenderer = function(layer) {
var gl = this.getGL();
if (layer instanceof ol.TileLayer) {
return new ol.webgl.TileLayerRenderer(this, layer);
@@ -321,7 +316,7 @@ ol.webgl.Map.prototype.createLayerRenderer = function(layer) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.disposeInternal = function() {
ol.webgl.MapRenderer.prototype.disposeInternal = function() {
var gl = this.getGL();
if (!gl.isContextLost()) {
goog.object.forEach(this.programCache_, function(program) {
@@ -341,7 +336,7 @@ ol.webgl.Map.prototype.disposeInternal = function() {
/**
* @return {WebGLRenderingContext} GL.
*/
ol.webgl.Map.prototype.getGL = function() {
ol.webgl.MapRenderer.prototype.getGL = function() {
return this.gl_;
};
@@ -351,7 +346,7 @@ ol.webgl.Map.prototype.getGL = function() {
* @param {ol.webgl.shader.Vertex} vertexShaderObject Vertex shader.
* @return {WebGLProgram} Program.
*/
ol.webgl.Map.prototype.getProgram = function(
ol.webgl.MapRenderer.prototype.getProgram = function(
fragmentShaderObject, vertexShaderObject) {
var programKey =
goog.getUid(fragmentShaderObject) + '/' + goog.getUid(vertexShaderObject);
@@ -381,7 +376,7 @@ ol.webgl.Map.prototype.getProgram = function(
* @param {ol.webgl.Shader} shaderObject Shader object.
* @return {WebGLShader} Shader.
*/
ol.webgl.Map.prototype.getShader = function(shaderObject) {
ol.webgl.MapRenderer.prototype.getShader = function(shaderObject) {
var shaderKey = goog.getUid(shaderObject);
if (shaderKey in this.shaderCache_) {
return this.shaderCache_[shaderKey];
@@ -407,8 +402,8 @@ ol.webgl.Map.prototype.getShader = function(shaderObject) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.handleBackgroundColorChanged = function() {
var backgroundColor = this.getBackgroundColor();
ol.webgl.MapRenderer.prototype.handleBackgroundColorChanged = function() {
var backgroundColor = this.getMap().getBackgroundColor();
this.clearColor_ = new ol.Color(
backgroundColor.r / 255,
backgroundColor.g / 255,
@@ -421,7 +416,7 @@ ol.webgl.Map.prototype.handleBackgroundColorChanged = function() {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.handleCenterChanged = function() {
ol.webgl.MapRenderer.prototype.handleCenterChanged = function() {
goog.base(this, 'handleCenterChanged');
this.render();
};
@@ -431,7 +426,7 @@ ol.webgl.Map.prototype.handleCenterChanged = function() {
* @param {goog.events.Event} event Event.
* @protected
*/
ol.webgl.Map.prototype.handleLayerRendererChange = function(event) {
ol.webgl.MapRenderer.prototype.handleLayerRendererChange = function(event) {
this.render();
};
@@ -439,7 +434,7 @@ ol.webgl.Map.prototype.handleLayerRendererChange = function(event) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.handleResolutionChanged = function() {
ol.webgl.MapRenderer.prototype.handleResolutionChanged = function() {
goog.base(this, 'handleResolutionChanged');
this.render();
};
@@ -448,7 +443,7 @@ ol.webgl.Map.prototype.handleResolutionChanged = function() {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.handleRotationChanged = function() {
ol.webgl.MapRenderer.prototype.handleRotationChanged = function() {
goog.base(this, 'handleRotationChanged');
this.render();
};
@@ -457,9 +452,9 @@ ol.webgl.Map.prototype.handleRotationChanged = function() {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.handleSizeChanged = function() {
ol.webgl.MapRenderer.prototype.handleSizeChanged = function() {
goog.base(this, 'handleSizeChanged');
var size = this.getSize();
var size = this.getMap().getSize();
if (!goog.isDef(size)) {
return;
}
@@ -477,7 +472,7 @@ ol.webgl.Map.prototype.handleSizeChanged = function() {
* @param {goog.events.Event} event Event.
* @protected
*/
ol.webgl.Map.prototype.handleWebGLContextLost = function(event) {
ol.webgl.MapRenderer.prototype.handleWebGLContextLost = function(event) {
if (goog.DEBUG) {
ol.webgl.map.logger.info('WebGLContextLost');
}
@@ -496,7 +491,7 @@ ol.webgl.Map.prototype.handleWebGLContextLost = function(event) {
/**
* @protected
*/
ol.webgl.Map.prototype.handleWebGLContextRestored = function() {
ol.webgl.MapRenderer.prototype.handleWebGLContextRestored = function() {
if (goog.DEBUG) {
ol.webgl.map.logger.info('WebGLContextRestored');
}
@@ -514,7 +509,7 @@ ol.webgl.Map.prototype.handleWebGLContextRestored = function() {
* @param {Image} image Image.
* @return {boolean} Is image texture loaded.
*/
ol.webgl.Map.prototype.isImageTextureLoaded = function(image) {
ol.webgl.MapRenderer.prototype.isImageTextureLoaded = function(image) {
return image.src in this.textureCache_[image.src];
};
@@ -522,13 +517,13 @@ ol.webgl.Map.prototype.isImageTextureLoaded = function(image) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.renderInternal = function() {
ol.webgl.MapRenderer.prototype.renderInternal = function() {
if (!this.isDef()) {
if (!this.getMap().isDef()) {
return false;
}
var size = this.getSize();
var size = this.getMap().getSize();
var animate = goog.base(this, 'renderInternal');
@@ -600,7 +595,7 @@ ol.webgl.Map.prototype.renderInternal = function() {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.removeLayer = function(layer) {
ol.webgl.MapRenderer.prototype.removeLayer = function(layer) {
goog.base(this, 'removeLayer', layer);
if (layer.getVisible()) {
this.render();
@@ -611,7 +606,7 @@ ol.webgl.Map.prototype.removeLayer = function(layer) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.removeLayerRenderer = function(layer) {
ol.webgl.MapRenderer.prototype.removeLayerRenderer = function(layer) {
var layerRenderer = goog.base(this, 'removeLayerRenderer', layer);
if (!goog.isNull(layerRenderer)) {
var layerKey = goog.getUid(layer);
@@ -625,7 +620,7 @@ ol.webgl.Map.prototype.removeLayerRenderer = function(layer) {
/**
* @inheritDoc
*/
ol.webgl.Map.prototype.setLayerRenderer = function(layer, layerRenderer) {
ol.webgl.MapRenderer.prototype.setLayerRenderer = function(layer, layerRenderer) {
goog.base(this, 'setLayerRenderer', layer, layerRenderer);
var layerKey = goog.getUid(layer);
this.layerRendererChangeListenKeys_[layerKey] = goog.events.listen(

14
src/ol/webgl/tilelayerrenderer.js
View File

@@ -76,12 +76,12 @@ goog.addSingletonGetter(ol.webgl.tilelayerrenderer.shader.Vertex);
/**
* @constructor
* @extends {ol.webgl.LayerRenderer}
* @param {ol.webgl.Map} map Map.
* @param {ol.MapRenderer} mapRenderer Map renderer.
* @param {ol.TileLayer} tileLayer Tile layer.
*/
ol.webgl.TileLayerRenderer = function(map, tileLayer) {
ol.webgl.TileLayerRenderer = function(mapRenderer, tileLayer) {
goog.base(this, map, tileLayer);
goog.base(this, mapRenderer, tileLayer);
/**
* @private
@@ -250,8 +250,9 @@ ol.webgl.TileLayerRenderer.prototype.handleWebGLContextLost = function() {
ol.webgl.TileLayerRenderer.prototype.render = function() {
var gl = this.getGL();
var map = this.getMap();
var mapRenderer = this.getMapRenderer();
goog.asserts.assert(map.isDef());
var mapCenter = map.getCenter();
var mapExtent = map.getExtent();
@@ -293,7 +294,8 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
gl.clear(goog.webgl.COLOR_BUFFER_BIT);
gl.disable(goog.webgl.BLEND);
var program = map.getProgram(this.fragmentShader_, this.vertexShader_);
var program = mapRenderer.getProgram(
this.fragmentShader_, this.vertexShader_);
gl.useProgram(program);
if (goog.isNull(this.locations_)) {
this.locations_ = {
@@ -385,7 +387,7 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
framebufferExtentSize.height - 1;
goog.vec.Vec4.setFromValues(uTileOffset, sx, sy, tx, ty);
gl.uniform4fv(this.locations_.uTileOffset, uTileOffset);
map.bindImageTexture(
mapRenderer.bindImageTexture(
tile.getImage(), goog.webgl.LINEAR, goog.webgl.LINEAR);
gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4);
}, this);