From fa88b578a451f587bad4590041706fc0e73f2798 Mon Sep 17 00:00:00 2001 From: Andreas Hocevar Date: Tue, 13 Oct 2015 14:22:02 +0200 Subject: [PATCH] Create ol.source.UrlTile --- src/ol/source/tiledebugsource.js | 5 +- src/ol/source/tileimagesource.js | 124 +++-------------------- src/ol/source/tileutfgridsource.js | 5 +- src/ol/source/urltilesource.js | 151 +++++++++++++++++++++++++++++ 4 files changed, 170 insertions(+), 115 deletions(-) create mode 100644 src/ol/source/urltilesource.js diff --git a/src/ol/source/tiledebugsource.js b/src/ol/source/tiledebugsource.js index 3bfd917b34..32a0fad16d 100644 --- a/src/ol/source/tiledebugsource.js +++ b/src/ol/source/tiledebugsource.js @@ -45,7 +45,10 @@ goog.inherits(ol.DebugTile_, ol.Tile); /** - * @inheritDoc + * Get the image element for this tile. + * @param {Object=} opt_context Optional context. Only used by the DOM + * renderer. + * @return {HTMLCanvasElement} Image. */ ol.DebugTile_.prototype.getImage = function(opt_context) { var key = opt_context !== undefined ? goog.getUid(opt_context) : -1; diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js index 964e7d7690..f5b1929ccf 100644 --- a/src/ol/source/tileimagesource.js +++ b/src/ol/source/tileimagesource.js @@ -6,15 +6,10 @@ goog.require('goog.events.EventType'); goog.require('goog.object'); goog.require('ol.ImageTile'); goog.require('ol.TileCache'); -goog.require('ol.TileCoord'); -goog.require('ol.TileLoadFunctionType'); goog.require('ol.TileState'); -goog.require('ol.TileUrlFunction'); -goog.require('ol.TileUrlFunctionType'); goog.require('ol.proj'); goog.require('ol.reproj.Tile'); -goog.require('ol.source.Tile'); -goog.require('ol.source.TileEvent'); +goog.require('ol.source.UrlTile'); @@ -24,7 +19,7 @@ goog.require('ol.source.TileEvent'); * * @constructor * @fires ol.source.TileEvent - * @extends {ol.source.Tile} + * @extends {ol.source.UrlTile} * @param {olx.source.TileImageOptions} options Image tile options. * @api */ @@ -39,18 +34,13 @@ ol.source.TileImage = function(options) { state: options.state !== undefined ? /** @type {ol.source.State} */ (options.state) : undefined, tileGrid: options.tileGrid, + tileLoadFunction: goog.isDef(options.tileLoadFunction) ? + options.tileLoadFunction : ol.source.TileImage.defaultTileLoadFunction, tilePixelRatio: options.tilePixelRatio, + tileUrlFunction: options.tileUrlFunction, wrapX: options.wrapX }); - /** - * @protected - * @type {ol.TileUrlFunctionType} - */ - this.tileUrlFunction = options.tileUrlFunction !== undefined ? - options.tileUrlFunction : - ol.TileUrlFunction.nullTileUrlFunction; - /** * @protected * @type {?string} @@ -58,13 +48,6 @@ ol.source.TileImage = function(options) { this.crossOrigin = options.crossOrigin !== undefined ? options.crossOrigin : null; - /** - * @protected - * @type {ol.TileLoadFunctionType} - */ - this.tileLoadFunction = options.tileLoadFunction !== undefined ? - options.tileLoadFunction : ol.source.TileImage.defaultTileLoadFunction; - /** * @protected * @type {function(new: ol.ImageTile, ol.TileCoord, ol.TileState, string, @@ -97,16 +80,7 @@ ol.source.TileImage = function(options) { */ this.renderReprojectionEdges_ = false; }; -goog.inherits(ol.source.TileImage, ol.source.Tile); - - -/** - * @param {ol.ImageTile} imageTile Image tile. - * @param {string} src Source. - */ -ol.source.TileImage.defaultTileLoadFunction = function(imageTile, src) { - imageTile.getImage().src = src; -}; +goog.inherits(ol.source.TileImage, ol.source.UrlTile); /** @@ -249,7 +223,7 @@ ol.source.TileImage.prototype.getTileInternal = this.crossOrigin, this.tileLoadFunction); goog.events.listen(tile, goog.events.EventType.CHANGE, - this.handleTileChange_, false, this); + this.handleTileChange, false, this); this.tileCache.set(tileCoordKey, tile); return tile; @@ -257,50 +231,6 @@ ol.source.TileImage.prototype.getTileInternal = }; -/** - * Return the tile load function of the source. - * @return {ol.TileLoadFunctionType} TileLoadFunction - * @api - */ -ol.source.TileImage.prototype.getTileLoadFunction = function() { - return this.tileLoadFunction; -}; - - -/** - * Return the tile URL function of the source. - * @return {ol.TileUrlFunctionType} TileUrlFunction - * @api - */ -ol.source.TileImage.prototype.getTileUrlFunction = function() { - return this.tileUrlFunction; -}; - - -/** - * Handle tile change events. - * @param {goog.events.Event} event Event. - * @private - */ -ol.source.TileImage.prototype.handleTileChange_ = function(event) { - var tile = /** @type {ol.Tile} */ (event.target); - switch (tile.getState()) { - case ol.TileState.LOADING: - this.dispatchEvent( - new ol.source.TileEvent(ol.source.TileEventType.TILELOADSTART, tile)); - break; - case ol.TileState.LOADED: - this.dispatchEvent( - new ol.source.TileEvent(ol.source.TileEventType.TILELOADEND, tile)); - break; - case ol.TileState.ERROR: - this.dispatchEvent( - new ol.source.TileEvent(ol.source.TileEventType.TILELOADERROR, tile)); - break; - } -}; - - /** * Sets whether to render reprojection edges or not (usually for debugging). * @param {boolean} render Render the edges. @@ -346,41 +276,9 @@ ol.source.TileImage.prototype.setTileGridForProjection = /** - * Set the tile load function of the source. - * @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function. - * @api + * @param {ol.ImageTile} imageTile Image tile. + * @param {string} src Source. */ -ol.source.TileImage.prototype.setTileLoadFunction = function(tileLoadFunction) { - this.tileCache.clear(); - this.tileCacheForProjection = {}; - this.tileLoadFunction = tileLoadFunction; - this.changed(); -}; - - -/** - * Set the tile URL function of the source. - * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. - * @api - */ -ol.source.TileImage.prototype.setTileUrlFunction = function(tileUrlFunction) { - // FIXME It should be possible to be more intelligent and avoid clearing the - // FIXME cache. The tile URL function would need to be incorporated into the - // FIXME cache key somehow. - this.tileCache.clear(); - this.tileCacheForProjection = {}; - this.tileUrlFunction = tileUrlFunction; - this.changed(); -}; - - -/** - * @inheritDoc - */ -ol.source.TileImage.prototype.useTile = function(z, x, y, projection) { - var tileCache = this.getTileCacheForProjection(projection); - var tileCoordKey = this.getKeyZXY(z, x, y); - if (tileCache && tileCache.containsKey(tileCoordKey)) { - tileCache.get(tileCoordKey); - } +ol.source.TileImage.defaultTileLoadFunction = function(imageTile, src) { + imageTile.getImage().src = src; }; diff --git a/src/ol/source/tileutfgridsource.js b/src/ol/source/tileutfgridsource.js index 8862353677..5cc861ab36 100644 --- a/src/ol/source/tileutfgridsource.js +++ b/src/ol/source/tileutfgridsource.js @@ -256,7 +256,10 @@ goog.inherits(ol.source.TileUTFGridTile_, ol.Tile); /** - * @inheritDoc + * Get the image element for this tile. + * @param {Object=} opt_context Optional context. Only used for the DOM + * renderer. + * @return {Image} Image. */ ol.source.TileUTFGridTile_.prototype.getImage = function(opt_context) { return null; diff --git a/src/ol/source/urltilesource.js b/src/ol/source/urltilesource.js new file mode 100644 index 0000000000..ccec07a350 --- /dev/null +++ b/src/ol/source/urltilesource.js @@ -0,0 +1,151 @@ +goog.provide('ol.source.UrlTile'); + +goog.require('goog.events'); +goog.require('ol.TileLoadFunctionType'); +goog.require('ol.TileState'); +goog.require('ol.TileUrlFunction'); +goog.require('ol.TileUrlFunctionType'); +goog.require('ol.source.Tile'); +goog.require('ol.source.TileEvent'); + + +/** + * @typedef {{attributions: (Array.|undefined), + * cacheSize: (number|undefined), + * extent: (ol.Extent|undefined), + * logo: (string|olx.LogoOptions|undefined), + * opaque: (boolean|undefined), + * projection: ol.proj.ProjectionLike, + * state: (ol.source.State|string|undefined), + * tileGrid: (ol.tilegrid.TileGrid|undefined), + * tileLoadFunction: ol.TileLoadFunctionType, + * tilePixelRatio: (number|undefined), + * tileUrlFunction: (ol.TileUrlFunctionType|undefined), + * wrapX: (boolean|undefined)}} + */ +ol.source.UrlTileOptions; + + + +/** + * @classdesc + * Base class for sources providing tiles divided into a tile grid over http. + * + * @constructor + * @fires ol.source.TileEvent + * @extends {ol.source.Tile} + * @param {ol.source.UrlTileOptions} options Image tile options. + */ +ol.source.UrlTile = function(options) { + + goog.base(this, { + attributions: options.attributions, + extent: options.extent, + logo: options.logo, + opaque: options.opaque, + projection: options.projection, + state: goog.isDef(options.state) ? + /** @type {ol.source.State} */ (options.state) : undefined, + tileGrid: options.tileGrid, + tilePixelRatio: options.tilePixelRatio, + wrapX: options.wrapX + }); + + /** + * @protected + * @type {ol.TileUrlFunctionType} + */ + this.tileUrlFunction = goog.isDef(options.tileUrlFunction) ? + options.tileUrlFunction : + ol.TileUrlFunction.nullTileUrlFunction; + + /** + * @protected + * @type {ol.TileLoadFunctionType} + */ + this.tileLoadFunction = options.tileLoadFunction; + +}; +goog.inherits(ol.source.UrlTile, ol.source.Tile); + + +/** + * Return the tile load function of the source. + * @return {ol.TileLoadFunctionType} TileLoadFunction + * @api + */ +ol.source.UrlTile.prototype.getTileLoadFunction = function() { + return this.tileLoadFunction; +}; + + +/** + * Return the tile URL function of the source. + * @return {ol.TileUrlFunctionType} TileUrlFunction + * @api + */ +ol.source.UrlTile.prototype.getTileUrlFunction = function() { + return this.tileUrlFunction; +}; + + +/** + * Handle tile change events. + * @param {goog.events.Event} event Event. + * @protected + */ +ol.source.UrlTile.prototype.handleTileChange = function(event) { + var tile = /** @type {ol.Tile} */ (event.target); + switch (tile.getState()) { + case ol.TileState.LOADING: + this.dispatchEvent( + new ol.source.TileEvent(ol.source.TileEventType.TILELOADSTART, tile)); + break; + case ol.TileState.LOADED: + this.dispatchEvent( + new ol.source.TileEvent(ol.source.TileEventType.TILELOADEND, tile)); + break; + case ol.TileState.ERROR: + this.dispatchEvent( + new ol.source.TileEvent(ol.source.TileEventType.TILELOADERROR, tile)); + break; + } +}; + + +/** + * Set the tile load function of the source. + * @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function. + * @api + */ +ol.source.UrlTile.prototype.setTileLoadFunction = function(tileLoadFunction) { + this.tileCache.clear(); + this.tileLoadFunction = tileLoadFunction; + this.changed(); +}; + + +/** + * Set the tile URL function of the source. + * @param {ol.TileUrlFunctionType} tileUrlFunction Tile URL function. + * @api + */ +ol.source.UrlTile.prototype.setTileUrlFunction = function(tileUrlFunction) { + // FIXME It should be possible to be more intelligent and avoid clearing the + // FIXME cache. The tile URL function would need to be incorporated into the + // FIXME cache key somehow. + this.tileCache.clear(); + this.tileUrlFunction = tileUrlFunction; + this.changed(); +}; + + +/** + * @inheritDoc + */ +ol.source.UrlTile.prototype.useTile = function(z, x, y) { + var tileCoordKey = this.getKeyZXY(z, x, y); + if (this.tileCache.containsKey(tileCoordKey)) { + this.tileCache.get(tileCoordKey); + } +};