From fe1f98899f08a222be2f5d7b8d9ee391a609cae3 Mon Sep 17 00:00:00 2001 From: Olivier Terral Date: Wed, 13 Nov 2013 13:18:04 +0100 Subject: [PATCH 01/26] Add Zoomify stuff --- examples/zoomify.html | 50 +++++++++ examples/zoomify.js | 39 +++++++ src/objectliterals.jsdoc | 17 +++ src/ol/proj/proj.js | 3 +- src/ol/source/zoomifysource.exports | 1 + src/ol/source/zoomifysource.js | 142 ++++++++++++++++++++++++ src/ol/tilegrid/zoomifytilegrid.exports | 1 + src/ol/tilegrid/zoomifytilegrid.js | 85 ++++++++++++++ 8 files changed, 337 insertions(+), 1 deletion(-) create mode 100644 examples/zoomify.html create mode 100644 examples/zoomify.js create mode 100644 src/ol/source/zoomifysource.exports create mode 100644 src/ol/source/zoomifysource.js create mode 100644 src/ol/tilegrid/zoomifytilegrid.exports create mode 100644 src/ol/tilegrid/zoomifytilegrid.js diff --git a/examples/zoomify.html b/examples/zoomify.html new file mode 100644 index 0000000000..396a736392 --- /dev/null +++ b/examples/zoomify.html @@ -0,0 +1,50 @@ + + + + + + + + + + + Zoomify example + + + +
+
+
+ OpenLayers 3 Examples +
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+

Zoomify example

+

Example of a Zoomify source.

+
+

See the zoomify.js source to see how this is done.

+
+
zoomify
+
+ +
+ +
+ + + + + + diff --git a/examples/zoomify.js b/examples/zoomify.js new file mode 100644 index 0000000000..8da21f32ab --- /dev/null +++ b/examples/zoomify.js @@ -0,0 +1,39 @@ +goog.require('ol.Map'); +goog.require('ol.RendererHint'); +goog.require('ol.View2D'); +goog.require('ol.layer.Tile'); +goog.require('ol.proj'); +goog.require('ol.proj.Projection'); +goog.require('ol.proj.Units'); +goog.require('ol.source.Zoomify'); + +var imgWidth = 8001; +var imgHeight = 6943; +var imgCenter = [imgWidth / 2, -imgHeight / 2]; +var url = 'http://mapy.mzk.cz/AA22/0103/'; + +var proj = new ol.proj.Projection({ + code: 'ZOOMIFY', + units: ol.proj.Units.PIXELS, + extent: [0, 0, imgWidth, imgHeight] +}); + +var source = new ol.source.Zoomify({ + url: url, + size: [imgWidth, imgHeight] +}); + +var map = new ol.Map({ + layers: [ + new ol.layer.Tile({ + source: source + }) + ], + renderer: ol.RendererHint.CANVAS, + target: 'map', + view: new ol.View2D({ + projection: proj, + center: imgCenter, + zoom: 0 + }) +}); diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 8f9a3053fc..ecb47640cb 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -840,6 +840,17 @@ * @todo stability experimental */ +/** + * @typedef {Object} ol.source.ZoomifyOptions + * @property {Array.|undefined} attributions Attributions. + * @property {null|string|undefined} crossOrigin Cross origin setting for image + * requests. + * @property {string|undefined} logo Logo. + * @property {!string} url Prefix of URL template. + * @property {ol.Size} size Size of the image. + * @todo stability experimental + */ + /** * @typedef {Object} olx.style.IconOptions * @property {string|ol.expr.Expression} url Icon image URL. @@ -954,3 +965,9 @@ * @property {number} maxZoom Maximum zoom. * @todo stability experimental */ + +/** + * @typedef {Object} ol.tilegrid.ZoomifyOptions + * @property {!Array.} resolutions Resolutions. + * @todo stability experimental + */ diff --git a/src/ol/proj/proj.js b/src/ol/proj/proj.js index bcb3f31e2d..c0c750a88f 100644 --- a/src/ol/proj/proj.js +++ b/src/ol/proj/proj.js @@ -40,7 +40,8 @@ ol.proj.ProjectionLike; ol.proj.Units = { DEGREES: 'degrees', FEET: 'ft', - METERS: 'm' + METERS: 'm', + PIXELS: 'pixels' }; diff --git a/src/ol/source/zoomifysource.exports b/src/ol/source/zoomifysource.exports new file mode 100644 index 0000000000..57fce6e8b7 --- /dev/null +++ b/src/ol/source/zoomifysource.exports @@ -0,0 +1 @@ +@exportClass ol.source.Zoomify ol.source.ZoomifyOptions diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js new file mode 100644 index 0000000000..fa0250e4e1 --- /dev/null +++ b/src/ol/source/zoomifysource.js @@ -0,0 +1,142 @@ +goog.provide('ol.source.Zoomify'); + +goog.require('goog.array'); +goog.require('ol.TileCoord'); +goog.require('ol.TileUrlFunction'); +goog.require('ol.proj'); +goog.require('ol.source.TileImage'); +goog.require('ol.tilegrid.Zoomify'); + + + +/** + * @constructor + * @extends {ol.source.TileImage} + * @param {ol.source.ZoomifyOptions} options Zoomify options. + * @todo stability experimental + */ +ol.source.Zoomify = function(options) { + + /** + * Prefix of URL template. + * @private + * @type {!string} + */ + this.url_ = options.url; + + /** + * Size of the image. + * @private + * @type {ol.Size} + */ + this.size_ = options.size; + + /** + * Depth of the Zoomify pyramid, number of tiers (zoom levels). + * @private + * @type {number} + */ + this.numberOfTiers_ = 0; + + /** + * Number of tiles up to the given tier of pyramid. + * @private + * @type {Array.} + */ + this.tileCountUpToTier_ = null; + + /** + * Size (in tiles) for each tier of pyramid. + * @private + * @type {Array.} + */ + this.tierSizeInTiles_ = null; + + /** + * Image size in pixels for each pyramid tier. + * @private + * @type {Array.} + */ + this.tierImageSize_ = null; + + var imageSize = [].concat(this.size_); + var tiles = [ + Math.ceil(this.size_[0] / ol.DEFAULT_TILE_SIZE), + Math.ceil(this.size_[1] / ol.DEFAULT_TILE_SIZE) + ]; + this.tierSizeInTiles_ = [tiles]; + this.tierImageSize_ = [imageSize]; + + while (imageSize[0] > ol.DEFAULT_TILE_SIZE || + imageSize[1] > ol.DEFAULT_TILE_SIZE) { + + imageSize = [ + Math.floor(imageSize[0] / 2), + Math.floor(imageSize[1] / 2) + ]; + tiles = [ + Math.ceil(imageSize[0] / ol.DEFAULT_TILE_SIZE), + Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) + ]; + this.tierSizeInTiles_.push(tiles); + this.tierImageSize_.push(imageSize); + } + + this.tierSizeInTiles_.reverse(); + this.tierImageSize_.reverse(); + this.numberOfTiers_ = this.tierSizeInTiles_.length; + var resolutions = [1]; + this.tileCountUpToTier_ = [0]; + for (var i = 1; i < this.numberOfTiers_; i++) { + resolutions.unshift(Math.pow(2, i)); + this.tileCountUpToTier_.push( + this.tierSizeInTiles_[i - 1][0] * this.tierSizeInTiles_[i - 1][1] + + this.tileCountUpToTier_[i - 1] + ); + } + + + var createFromUrl = function(url) { + var template = url + '{tileIndex}/{z}-{x}-{y}.jpg'; + return ( + /** + * @this {ol.source.TileImage} + * @param {ol.TileCoord} tileCoord Tile Coordinate. + * @param {ol.proj.Projection} projection Projection. + * @return {string|undefined} Tile URL. + */ + function(tileCoord, projection) { + if (goog.isNull(tileCoord)) { + return undefined; + } else { + var tileIndex = tileCoord.x + + (tileCoord.y * this.tierSizeInTiles_[tileCoord.z][0]) + + this.tileCountUpToTier_[tileCoord.z]; + return template.replace('{tileIndex}', 'TileGroup' + + Math.floor((tileIndex) / ol.DEFAULT_TILE_SIZE)) + .replace('{z}', '' + tileCoord.z) + .replace('{x}', '' + tileCoord.x) + .replace('{y}', '' + tileCoord.y); + } + } + ); + }; + + var tileGrid = new ol.tilegrid.Zoomify({ + resolutions: resolutions + }); + var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( + tileGrid.createTileCoordTransform(), + createFromUrl(this.url_)); + + + goog.base(this, { + attributions: options.attributions, + crossOrigin: options.crossOrigin, + logo: options.logo, + tileGrid: tileGrid, + tileUrlFunction: tileUrlFunction + }); + +}; +goog.inherits(ol.source.Zoomify, ol.source.TileImage); diff --git a/src/ol/tilegrid/zoomifytilegrid.exports b/src/ol/tilegrid/zoomifytilegrid.exports new file mode 100644 index 0000000000..132b391d5b --- /dev/null +++ b/src/ol/tilegrid/zoomifytilegrid.exports @@ -0,0 +1 @@ +@exportClass ol.tilegrid.Zoomify ol.tilegrid.ZoomifyOptions diff --git a/src/ol/tilegrid/zoomifytilegrid.js b/src/ol/tilegrid/zoomifytilegrid.js new file mode 100644 index 0000000000..a88f54f861 --- /dev/null +++ b/src/ol/tilegrid/zoomifytilegrid.js @@ -0,0 +1,85 @@ +goog.provide('ol.tilegrid.Zoomify'); + +goog.require('goog.math'); +goog.require('ol.TileCoord'); +goog.require('ol.proj'); +goog.require('ol.tilegrid.TileGrid'); + + + +/** + * @constructor + * @extends {ol.tilegrid.TileGrid} + * @param {ol.tilegrid.ZoomifyOptions} options Zoomify options. + * @todo stability experimental + */ +ol.tilegrid.Zoomify = function(options) { + goog.base(this, { + origin: [0, 0], + resolutions: options.resolutions + }); + +}; +goog.inherits(ol.tilegrid.Zoomify, ol.tilegrid.TileGrid); + + +/** + * @inheritDoc + */ +ol.tilegrid.Zoomify.prototype.createTileCoordTransform = function(opt_options) { + var options = goog.isDef(opt_options) ? opt_options : {}; + var minZ = this.minZoom; + var maxZ = this.maxZoom; + var tmpTileCoord = new ol.TileCoord(0, 0, 0); + /** @type {Array.} */ + var tileRangeByZ = null; + if (goog.isDef(options.extent)) { + tileRangeByZ = new Array(maxZ + 1); + var z; + for (z = 0; z <= maxZ; ++z) { + if (z < minZ) { + tileRangeByZ[z] = null; + } else { + tileRangeByZ[z] = this.getTileRangeForExtentAndZ(options.extent, z); + } + } + } + return ( + /** + * @param {ol.TileCoord} tileCoord Tile coordinate. + * @param {ol.proj.Projection} projection Projection. + * @param {ol.TileCoord=} opt_tileCoord Destination tile coordinate. + * @return {ol.TileCoord} Tile coordinate. + */ + function(tileCoord, projection, opt_tileCoord) { + var z = tileCoord.z; + if (z < minZ || maxZ < z) { + return null; + } + var n = Math.pow(2, z); + var x = tileCoord.x; + if (x < 0 || n <= x) { + return null; + } + var y = tileCoord.y; + if (y < -n || -1 < y) { + return null; + } + if (!goog.isNull(tileRangeByZ)) { + tmpTileCoord.z = z; + tmpTileCoord.x = x; + tmpTileCoord.y = y; + if (!tileRangeByZ[z].contains(tmpTileCoord)) { + return null; + } + } + if (goog.isDef(opt_tileCoord)) { + opt_tileCoord.z = z; + opt_tileCoord.x = x; + opt_tileCoord.y = -y - 1; + return opt_tileCoord; + } else { + return new ol.TileCoord(z, x, -y - 1); + } + }); +}; From beefa6845ffd22ae0b6dad44ff487314301f07a0 Mon Sep 17 00:00:00 2001 From: scharrier Date: Wed, 13 Nov 2013 14:45:53 +0100 Subject: [PATCH 02/26] Resize bad tiles + changed demo image (due to crossorigin problems) --- examples/zoomify.js | 15 +++++++++----- src/ol/source/zoomifysource.js | 36 +++++++++++++++++++++++++++++++++- 2 files changed, 45 insertions(+), 6 deletions(-) diff --git a/examples/zoomify.js b/examples/zoomify.js index 8da21f32ab..91d606792d 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -7,11 +7,15 @@ goog.require('ol.proj.Projection'); goog.require('ol.proj.Units'); goog.require('ol.source.Zoomify'); -var imgWidth = 8001; -var imgHeight = 6943; -var imgCenter = [imgWidth / 2, -imgHeight / 2]; -var url = 'http://mapy.mzk.cz/AA22/0103/'; +//var imgWidth = 8001; +//var imgHeight = 6943; +//var url = 'http://mapy.mzk.cz/AA22/0103/' +var imgWidth = 9911; +var imgHeight = 6100; +var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + + '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/'; +var imgCenter = [imgWidth / 2, - imgHeight / 2]; var proj = new ol.proj.Projection({ code: 'ZOOMIFY', units: ol.proj.Units.PIXELS, @@ -20,7 +24,8 @@ var proj = new ol.proj.Projection({ var source = new ol.source.Zoomify({ url: url, - size: [imgWidth, imgHeight] + size: [imgWidth, imgHeight], + crossOrigin: 'anonymous' }); var map = new ol.Map({ diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index fa0250e4e1..6401a3b006 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -1,6 +1,7 @@ goog.provide('ol.source.Zoomify'); goog.require('goog.array'); +goog.require('ol.Image'); goog.require('ol.TileCoord'); goog.require('ol.TileUrlFunction'); goog.require('ol.proj'); @@ -122,6 +123,38 @@ ol.source.Zoomify = function(options) { ); }; + /** + * Resize small tiles. Warning : needs a good crossOrigin handling. + * + * @param {ol.ImageTile} imageTile Current tile + * @param {String} src Src url + */ + var tileLoadFunction = function(imageTile, src) { + var image = imageTile.getImage(); + + // Bad image size (only if correct crossOrigin handling) + if (image.crossOrigin) { + image.onload = function() { + if (this.width < ol.DEFAULT_TILE_SIZE || + this.height < ol.DEFAULT_TILE_SIZE) { + // Copy image data into the canvas + var canvas = document.createElement('canvas'); + if (canvas.getContext) { + canvas.width = ol.DEFAULT_TILE_SIZE; + canvas.height = ol.DEFAULT_TILE_SIZE; + var ctx = canvas.getContext('2d'); + ctx.drawImage(this, 0, 0); + + // Change original image + image = new Image() ; + image.src = canvas.toDataURL(); + } + } + }; + } + image.src = src; + }; + var tileGrid = new ol.tilegrid.Zoomify({ resolutions: resolutions }); @@ -135,7 +168,8 @@ ol.source.Zoomify = function(options) { crossOrigin: options.crossOrigin, logo: options.logo, tileGrid: tileGrid, - tileUrlFunction: tileUrlFunction + tileUrlFunction: tileUrlFunction, + tileLoadFunction: tileLoadFunction }); }; From 3fe81e451a185be860854e0b419cae1e2f4f141b Mon Sep 17 00:00:00 2001 From: scharrier Date: Wed, 13 Nov 2013 15:27:51 +0100 Subject: [PATCH 03/26] Remove extra tiles. --- src/ol/source/zoomifysource.js | 4 ++-- src/ol/tilegrid/zoomifytilegrid.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index 6401a3b006..b701ffc2b2 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -146,7 +146,7 @@ ol.source.Zoomify = function(options) { ctx.drawImage(this, 0, 0); // Change original image - image = new Image() ; + image = new Image(); image.src = canvas.toDataURL(); } } @@ -159,7 +159,7 @@ ol.source.Zoomify = function(options) { resolutions: resolutions }); var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( - tileGrid.createTileCoordTransform(), + tileGrid.createTileCoordTransform({extent: [0, 0].concat(this.size_)}), createFromUrl(this.url_)); diff --git a/src/ol/tilegrid/zoomifytilegrid.js b/src/ol/tilegrid/zoomifytilegrid.js index a88f54f861..6d14a70a1c 100644 --- a/src/ol/tilegrid/zoomifytilegrid.js +++ b/src/ol/tilegrid/zoomifytilegrid.js @@ -68,7 +68,7 @@ ol.tilegrid.Zoomify.prototype.createTileCoordTransform = function(opt_options) { if (!goog.isNull(tileRangeByZ)) { tmpTileCoord.z = z; tmpTileCoord.x = x; - tmpTileCoord.y = y; + tmpTileCoord.y = -y - 1; if (!tileRangeByZ[z].contains(tmpTileCoord)) { return null; } From bf9ea3368c8ebdececaac45a870664e11c4305ab Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Mon, 16 Dec 2013 16:04:17 +0100 Subject: [PATCH 04/26] Export ol.proj.Units.PIXELS --- src/ol/proj.exports | 1 + 1 file changed, 1 insertion(+) diff --git a/src/ol/proj.exports b/src/ol/proj.exports index 18aa42ab25..7084796821 100644 --- a/src/ol/proj.exports +++ b/src/ol/proj.exports @@ -6,6 +6,7 @@ @exportProperty ol.proj.Units.DEGREES @exportProperty ol.proj.Units.FEET @exportProperty ol.proj.Units.METERS +@exportProperty ol.proj.Units.PIXELS @exportSymbol ol.proj.addProjection @exportSymbol ol.proj.get From af6f4fa77e07bfbaf7689ad0065016757d506759 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:06:42 +0100 Subject: [PATCH 05/26] Update ol.source.Zoomify to use new exports system --- src/objectliterals.jsdoc | 2 +- src/ol/source/zoomifysource.exports | 2 +- src/ol/source/zoomifysource.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index ecb47640cb..90150ef0eb 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -841,7 +841,7 @@ */ /** - * @typedef {Object} ol.source.ZoomifyOptions + * @typedef {Object} olx.source.ZoomifyOptions * @property {Array.|undefined} attributions Attributions. * @property {null|string|undefined} crossOrigin Cross origin setting for image * requests. diff --git a/src/ol/source/zoomifysource.exports b/src/ol/source/zoomifysource.exports index 57fce6e8b7..38f7c1657b 100644 --- a/src/ol/source/zoomifysource.exports +++ b/src/ol/source/zoomifysource.exports @@ -1 +1 @@ -@exportClass ol.source.Zoomify ol.source.ZoomifyOptions +@exportSymbol ol.source.Zoomify diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index b701ffc2b2..e798889f9a 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -13,7 +13,7 @@ goog.require('ol.tilegrid.Zoomify'); /** * @constructor * @extends {ol.source.TileImage} - * @param {ol.source.ZoomifyOptions} options Zoomify options. + * @param {olx.source.ZoomifyOptions} options Zoomify options. * @todo stability experimental */ ol.source.Zoomify = function(options) { From cb2727544a8c8c1f00fba50872983563a578df9f Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:08:00 +0100 Subject: [PATCH 06/26] Update ol.tilegrid.Zoomify to use new exports system --- src/objectliterals.jsdoc | 2 +- src/ol/tilegrid/zoomifytilegrid.exports | 2 +- src/ol/tilegrid/zoomifytilegrid.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 90150ef0eb..da4e24de3f 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -967,7 +967,7 @@ */ /** - * @typedef {Object} ol.tilegrid.ZoomifyOptions + * @typedef {Object} olx.tilegrid.ZoomifyOptions * @property {!Array.} resolutions Resolutions. * @todo stability experimental */ diff --git a/src/ol/tilegrid/zoomifytilegrid.exports b/src/ol/tilegrid/zoomifytilegrid.exports index 132b391d5b..afbfc424a2 100644 --- a/src/ol/tilegrid/zoomifytilegrid.exports +++ b/src/ol/tilegrid/zoomifytilegrid.exports @@ -1 +1 @@ -@exportClass ol.tilegrid.Zoomify ol.tilegrid.ZoomifyOptions +@exportSymbol ol.tilegrid.Zoomify diff --git a/src/ol/tilegrid/zoomifytilegrid.js b/src/ol/tilegrid/zoomifytilegrid.js index 6d14a70a1c..59ba6e2889 100644 --- a/src/ol/tilegrid/zoomifytilegrid.js +++ b/src/ol/tilegrid/zoomifytilegrid.js @@ -10,7 +10,7 @@ goog.require('ol.tilegrid.TileGrid'); /** * @constructor * @extends {ol.tilegrid.TileGrid} - * @param {ol.tilegrid.ZoomifyOptions} options Zoomify options. + * @param {olx.tilegrid.ZoomifyOptions} options Zoomify options. * @todo stability experimental */ ol.tilegrid.Zoomify = function(options) { From fc4364e37315a92710e4dc3680e980bae3220e25 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:08:45 +0100 Subject: [PATCH 07/26] No need to use private variables in ol.source.Zoomify --- src/ol/source/zoomifysource.js | 87 ++++++++++------------------------ 1 file changed, 24 insertions(+), 63 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index e798889f9a..60b2fe97eb 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -13,60 +13,22 @@ goog.require('ol.tilegrid.Zoomify'); /** * @constructor * @extends {ol.source.TileImage} - * @param {olx.source.ZoomifyOptions} options Zoomify options. + * @param {olx.source.ZoomifyOptions=} opt_options Options. * @todo stability experimental */ -ol.source.Zoomify = function(options) { +ol.source.Zoomify = function(opt_options) { - /** - * Prefix of URL template. - * @private - * @type {!string} - */ - this.url_ = options.url; + var options = goog.isDef(opt_options) ? opt_options : {}; - /** - * Size of the image. - * @private - * @type {ol.Size} - */ - this.size_ = options.size; + var size = options.size; - /** - * Depth of the Zoomify pyramid, number of tiers (zoom levels). - * @private - * @type {number} - */ - this.numberOfTiers_ = 0; - - /** - * Number of tiles up to the given tier of pyramid. - * @private - * @type {Array.} - */ - this.tileCountUpToTier_ = null; - - /** - * Size (in tiles) for each tier of pyramid. - * @private - * @type {Array.} - */ - this.tierSizeInTiles_ = null; - - /** - * Image size in pixels for each pyramid tier. - * @private - * @type {Array.} - */ - this.tierImageSize_ = null; - - var imageSize = [].concat(this.size_); + var imageSize = size.slice(); var tiles = [ - Math.ceil(this.size_[0] / ol.DEFAULT_TILE_SIZE), - Math.ceil(this.size_[1] / ol.DEFAULT_TILE_SIZE) + Math.ceil(imageSize[0] / ol.DEFAULT_TILE_SIZE), + Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) ]; - this.tierSizeInTiles_ = [tiles]; - this.tierImageSize_ = [imageSize]; + var tierSizeInTiles = [tiles]; + var tierImageSize = [imageSize]; while (imageSize[0] > ol.DEFAULT_TILE_SIZE || imageSize[1] > ol.DEFAULT_TILE_SIZE) { @@ -79,24 +41,24 @@ ol.source.Zoomify = function(options) { Math.ceil(imageSize[0] / ol.DEFAULT_TILE_SIZE), Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) ]; - this.tierSizeInTiles_.push(tiles); - this.tierImageSize_.push(imageSize); + tierSizeInTiles.push(tiles); + tierImageSize.push(imageSize); } - this.tierSizeInTiles_.reverse(); - this.tierImageSize_.reverse(); - this.numberOfTiers_ = this.tierSizeInTiles_.length; + tierSizeInTiles.reverse(); + tierImageSize.reverse(); + var numberOfTiers = tierSizeInTiles.length; var resolutions = [1]; - this.tileCountUpToTier_ = [0]; - for (var i = 1; i < this.numberOfTiers_; i++) { + var tileCountUpToTier = [0]; + var i; + for (i = 1; i < numberOfTiers; i++) { resolutions.unshift(Math.pow(2, i)); - this.tileCountUpToTier_.push( - this.tierSizeInTiles_[i - 1][0] * this.tierSizeInTiles_[i - 1][1] + - this.tileCountUpToTier_[i - 1] + tileCountUpToTier.push( + tierSizeInTiles[i - 1][0] * tierSizeInTiles[i - 1][1] + + tileCountUpToTier[i - 1] ); } - var createFromUrl = function(url) { var template = url + '{tileIndex}/{z}-{x}-{y}.jpg'; return ( @@ -111,8 +73,8 @@ ol.source.Zoomify = function(options) { return undefined; } else { var tileIndex = tileCoord.x + - (tileCoord.y * this.tierSizeInTiles_[tileCoord.z][0]) + - this.tileCountUpToTier_[tileCoord.z]; + (tileCoord.y * tierSizeInTiles[tileCoord.z][0]) + + tileCountUpToTier[tileCoord.z]; return template.replace('{tileIndex}', 'TileGroup' + Math.floor((tileIndex) / ol.DEFAULT_TILE_SIZE)) .replace('{z}', '' + tileCoord.z) @@ -159,9 +121,8 @@ ol.source.Zoomify = function(options) { resolutions: resolutions }); var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( - tileGrid.createTileCoordTransform({extent: [0, 0].concat(this.size_)}), - createFromUrl(this.url_)); - + tileGrid.createTileCoordTransform({extent: [0, 0, size[0], size[1]]}), + createFromUrl(options.url)); goog.base(this, { attributions: options.attributions, From d8c81773ca770286036551063efc549aef1d5627 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:09:15 +0100 Subject: [PATCH 08/26] Make options to ol.tilegrid.Zoomify optional --- src/ol/tilegrid/zoomifytilegrid.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/ol/tilegrid/zoomifytilegrid.js b/src/ol/tilegrid/zoomifytilegrid.js index 59ba6e2889..115f1734c8 100644 --- a/src/ol/tilegrid/zoomifytilegrid.js +++ b/src/ol/tilegrid/zoomifytilegrid.js @@ -10,10 +10,11 @@ goog.require('ol.tilegrid.TileGrid'); /** * @constructor * @extends {ol.tilegrid.TileGrid} - * @param {olx.tilegrid.ZoomifyOptions} options Zoomify options. + * @param {olx.tilegrid.ZoomifyOptions=} opt_options Options. * @todo stability experimental */ -ol.tilegrid.Zoomify = function(options) { +ol.tilegrid.Zoomify = function(opt_options) { + var options = goog.isDef(opt_options) ? opt_options : options; goog.base(this, { origin: [0, 0], resolutions: options.resolutions From e229aab76aa42e2b80fcc15e561af03a5a8d3625 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:40:27 +0100 Subject: [PATCH 09/26] Don't check examples with PhantomJS that begin with // NOCHECK --- build.py | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/build.py b/build.py index c001fd0f2d..fc062ecf21 100755 --- a/build.py +++ b/build.py @@ -705,7 +705,9 @@ def host_examples(t): @target('check-examples', 'host-examples', phony=True) def check_examples(t): - examples = ['build/hosted/%(BRANCH)s/' + e for e in EXAMPLES] + examples = ['build/hosted/%(BRANCH)s/' + e + for e in EXAMPLES + if not open(e).readline().startswith('// NOCHECK')] all_examples = \ [e + '?mode=advanced' for e in examples] for example in all_examples: From 54fb2b4c2032190e4e2f4c44835bac0ec1853101 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 16 Dec 2013 16:41:21 +0100 Subject: [PATCH 10/26] Don't attempt to check Zoomify example with PhantomJS --- examples/zoomify.js | 1 + 1 file changed, 1 insertion(+) diff --git a/examples/zoomify.js b/examples/zoomify.js index 91d606792d..8a79e6d889 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -1,3 +1,4 @@ +// NOCHECK we can't check this example as it causes CORS violations in PhantomJS goog.require('ol.Map'); goog.require('ol.RendererHint'); goog.require('ol.View2D'); From 54d388f8fad53083562f592bf7918fcef4e2db85 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 12:57:55 +0100 Subject: [PATCH 11/26] Make ol.source.TileImage#tileCache protected, not private --- src/ol/source/tileimagesource.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js index dd9da53a21..a12b6ae59e 100644 --- a/src/ol/source/tileimagesource.js +++ b/src/ol/source/tileimagesource.js @@ -64,10 +64,10 @@ ol.source.TileImage = function(options) { goog.isDef(options.crossOrigin) ? options.crossOrigin : null; /** - * @private + * @protected * @type {ol.TileCache} */ - this.tileCache_ = new ol.TileCache(); + this.tileCache = new ol.TileCache(); /** * @private @@ -93,7 +93,7 @@ ol.source.TileImage.defaultTileLoadFunction = function(imageTile, src) { * @inheritDoc */ ol.source.TileImage.prototype.canExpireCache = function() { - return this.tileCache_.canExpireCache(); + return this.tileCache.canExpireCache(); }; @@ -101,7 +101,7 @@ ol.source.TileImage.prototype.canExpireCache = function() { * @inheritDoc */ ol.source.TileImage.prototype.expireCache = function(usedTiles) { - this.tileCache_.expireCache(usedTiles); + this.tileCache.expireCache(usedTiles); }; @@ -110,8 +110,8 @@ ol.source.TileImage.prototype.expireCache = function(usedTiles) { */ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { var tileCoordKey = this.getKeyZXY(z, x, y); - if (this.tileCache_.containsKey(tileCoordKey)) { - return /** @type {!ol.Tile} */ (this.tileCache_.get(tileCoordKey)); + if (this.tileCache.containsKey(tileCoordKey)) { + return /** @type {!ol.Tile} */ (this.tileCache.get(tileCoordKey)); } else { goog.asserts.assert(projection); var tileCoord = new ol.TileCoord(z, x, y); @@ -122,7 +122,7 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { goog.isDef(tileUrl) ? tileUrl : '', this.crossOrigin_, this.tileLoadFunction_); - this.tileCache_.set(tileCoordKey, tile); + this.tileCache.set(tileCoordKey, tile); return tile; } }; @@ -135,7 +135,7 @@ 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.tileCache.clear(); this.tileUrlFunction = tileUrlFunction; this.dispatchChangeEvent(); }; @@ -146,7 +146,7 @@ ol.source.TileImage.prototype.setTileUrlFunction = function(tileUrlFunction) { */ ol.source.TileImage.prototype.useTile = function(z, x, y) { var tileCoordKey = this.getKeyZXY(z, x, y); - if (this.tileCache_.containsKey(tileCoordKey)) { - this.tileCache_.get(tileCoordKey); + if (this.tileCache.containsKey(tileCoordKey)) { + this.tileCache.get(tileCoordKey); } }; From 4ad63725d949f567b5760990806d91a074fca13f Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:01:22 +0100 Subject: [PATCH 12/26] Make ol.source.TileImage#crossOrigin protected, not private --- src/ol/source/tileimagesource.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js index a12b6ae59e..273891112b 100644 --- a/src/ol/source/tileimagesource.js +++ b/src/ol/source/tileimagesource.js @@ -57,10 +57,10 @@ ol.source.TileImage = function(options) { ol.TileUrlFunction.nullTileUrlFunction; /** - * @private + * @protected * @type {?string} */ - this.crossOrigin_ = + this.crossOrigin = goog.isDef(options.crossOrigin) ? options.crossOrigin : null; /** @@ -120,7 +120,7 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { tileCoord, goog.isDef(tileUrl) ? ol.TileState.IDLE : ol.TileState.EMPTY, goog.isDef(tileUrl) ? tileUrl : '', - this.crossOrigin_, + this.crossOrigin, this.tileLoadFunction_); this.tileCache.set(tileCoordKey, tile); return tile; From 34c85d8ade6b9ef134ff0fb10e997f42f955028f Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:01:46 +0100 Subject: [PATCH 13/26] Make ol.source.TileImage#tileLoadFunction protected, not private --- src/ol/source/tileimagesource.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js index 273891112b..6f63bd21fa 100644 --- a/src/ol/source/tileimagesource.js +++ b/src/ol/source/tileimagesource.js @@ -70,10 +70,10 @@ ol.source.TileImage = function(options) { this.tileCache = new ol.TileCache(); /** - * @private + * @protected * @type {ol.TileLoadFunctionType} */ - this.tileLoadFunction_ = goog.isDef(options.tileLoadFunction) ? + this.tileLoadFunction = goog.isDef(options.tileLoadFunction) ? options.tileLoadFunction : ol.source.TileImage.defaultTileLoadFunction; }; @@ -121,7 +121,7 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { goog.isDef(tileUrl) ? ol.TileState.IDLE : ol.TileState.EMPTY, goog.isDef(tileUrl) ? tileUrl : '', this.crossOrigin, - this.tileLoadFunction_); + this.tileLoadFunction); this.tileCache.set(tileCoordKey, tile); return tile; } From b1da2c78f24135a5e711ecc7f8ce33161d417972 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:21:59 +0100 Subject: [PATCH 14/26] Refactor ol.source.Zoomify to use a private tile class --- src/ol/source/zoomifysource.js | 124 +++++++++++++++++++++++---------- 1 file changed, 89 insertions(+), 35 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index 60b2fe97eb..ebe3fe1632 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -1,8 +1,12 @@ goog.provide('ol.source.Zoomify'); goog.require('goog.array'); -goog.require('ol.Image'); +goog.require('goog.asserts'); +goog.require('goog.dom'); +goog.require('goog.dom.TagName'); +goog.require('ol.ImageTile'); goog.require('ol.TileCoord'); +goog.require('ol.TileState'); goog.require('ol.TileUrlFunction'); goog.require('ol.proj'); goog.require('ol.source.TileImage'); @@ -85,38 +89,6 @@ ol.source.Zoomify = function(opt_options) { ); }; - /** - * Resize small tiles. Warning : needs a good crossOrigin handling. - * - * @param {ol.ImageTile} imageTile Current tile - * @param {String} src Src url - */ - var tileLoadFunction = function(imageTile, src) { - var image = imageTile.getImage(); - - // Bad image size (only if correct crossOrigin handling) - if (image.crossOrigin) { - image.onload = function() { - if (this.width < ol.DEFAULT_TILE_SIZE || - this.height < ol.DEFAULT_TILE_SIZE) { - // Copy image data into the canvas - var canvas = document.createElement('canvas'); - if (canvas.getContext) { - canvas.width = ol.DEFAULT_TILE_SIZE; - canvas.height = ol.DEFAULT_TILE_SIZE; - var ctx = canvas.getContext('2d'); - ctx.drawImage(this, 0, 0); - - // Change original image - image = new Image(); - image.src = canvas.toDataURL(); - } - } - }; - } - image.src = src; - }; - var tileGrid = new ol.tilegrid.Zoomify({ resolutions: resolutions }); @@ -129,9 +101,91 @@ ol.source.Zoomify = function(opt_options) { crossOrigin: options.crossOrigin, logo: options.logo, tileGrid: tileGrid, - tileUrlFunction: tileUrlFunction, - tileLoadFunction: tileLoadFunction + tileUrlFunction: tileUrlFunction }); }; goog.inherits(ol.source.Zoomify, ol.source.TileImage); + + +/** + * @inheritDoc + */ +ol.source.Zoomify.prototype.getTile = function(z, x, y, projection) { + var tileCoordKey = this.getKeyZXY(z, x, y); + if (this.tileCache.containsKey(tileCoordKey)) { + return /** @type {!ol.source.ZoomifyTile_} */ ( + this.tileCache.get(tileCoordKey)); + } else { + goog.asserts.assert(goog.isDef(projection)); + var tileCoord = new ol.TileCoord(z, x, y); + var tileUrl = this.tileUrlFunction(tileCoord, projection); + var tile = new ol.source.ZoomifyTile_( + tileCoord, + goog.isDef(tileUrl) ? ol.TileState.IDLE : ol.TileState.EMPTY, + goog.isDef(tileUrl) ? tileUrl : '', + this.crossOrigin, + this.tileLoadFunction); + this.tileCache.set(tileCoordKey, tile); + return tile; + } +}; + + + +/** + * @constructor + * @extends {ol.ImageTile} + * @param {ol.TileCoord} tileCoord Tile coordinate. + * @param {ol.TileState} state State. + * @param {string} src Image source URI. + * @param {?string} crossOrigin Cross origin. + * @param {ol.TileLoadFunctionType} tileLoadFunction Tile load function. + * @private + */ +ol.source.ZoomifyTile_ = function( + tileCoord, state, src, crossOrigin, tileLoadFunction) { + + goog.base(this, tileCoord, state, src, crossOrigin, tileLoadFunction); + + /** + * @private + * @type {Object.} + */ + this.zoomifyImageByContext_ = {}; + +}; +goog.inherits(ol.source.ZoomifyTile_, ol.ImageTile); + + +/** + * @inheritDoc + */ +ol.source.ZoomifyTile_.prototype.getImage = function(opt_context) { + var key = goog.isDef(opt_context) ? goog.getUid(opt_context).toString() : ''; + if (key in this.zoomifyImageByContext_) { + return this.zoomifyImageByContext_[key]; + } else { + var image = goog.base(this, 'getImage', opt_context); + if (this.state == ol.TileState.LOADED) { + if (image.width == ol.DEFAULT_TILE_SIZE && + image.height == ol.DEFAULT_TILE_SIZE) { + this.zoomifyImageByContext_[key] = image; + return image; + } else { + var canvas = /** @type {HTMLCanvasElement} */ + (goog.dom.createElement(goog.dom.TagName.CANVAS)); + canvas.width = ol.DEFAULT_TILE_SIZE; + canvas.height = ol.DEFAULT_TILE_SIZE; + var context = /** @type {CanvasRenderingContext2D} */ + (canvas.getContext('2d')); + context.drawImage(image, 0, 0); + this.zoomifyImageByContext_[key] = canvas; + return canvas; + } + } else { + return image; + } + } +}; From 36826d2e0b2aff3fa82857008fe79ffcbdc0c886 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:39:33 +0100 Subject: [PATCH 15/26] Remove unused variable --- src/ol/source/zoomifysource.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index ebe3fe1632..3e28aba7d9 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -32,7 +32,6 @@ ol.source.Zoomify = function(opt_options) { Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) ]; var tierSizeInTiles = [tiles]; - var tierImageSize = [imageSize]; while (imageSize[0] > ol.DEFAULT_TILE_SIZE || imageSize[1] > ol.DEFAULT_TILE_SIZE) { @@ -46,11 +45,9 @@ ol.source.Zoomify = function(opt_options) { Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) ]; tierSizeInTiles.push(tiles); - tierImageSize.push(imageSize); } tierSizeInTiles.reverse(); - tierImageSize.reverse(); var numberOfTiers = tierSizeInTiles.length; var resolutions = [1]; var tileCountUpToTier = [0]; From 94fa3fb211c9003520436bd8f1c2ba849cacaf41 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:56:17 +0100 Subject: [PATCH 16/26] Tidy up ol.source.Zoomify tile grid calculations --- src/ol/source/zoomifysource.js | 40 ++++++++++++++-------------------- 1 file changed, 16 insertions(+), 24 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index 3e28aba7d9..d278a1d1f3 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -25,40 +25,32 @@ ol.source.Zoomify = function(opt_options) { var options = goog.isDef(opt_options) ? opt_options : {}; var size = options.size; + var imageWidth = size[0]; + var imageHeight = size[1]; - var imageSize = size.slice(); - var tiles = [ - Math.ceil(imageSize[0] / ol.DEFAULT_TILE_SIZE), - Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) - ]; - var tierSizeInTiles = [tiles]; - - while (imageSize[0] > ol.DEFAULT_TILE_SIZE || - imageSize[1] > ol.DEFAULT_TILE_SIZE) { - - imageSize = [ - Math.floor(imageSize[0] / 2), - Math.floor(imageSize[1] / 2) - ]; - tiles = [ - Math.ceil(imageSize[0] / ol.DEFAULT_TILE_SIZE), - Math.ceil(imageSize[1] / ol.DEFAULT_TILE_SIZE) - ]; - tierSizeInTiles.push(tiles); + var tierSizeInTiles = []; + var tileSize = ol.DEFAULT_TILE_SIZE; + while (imageWidth > tileSize || imageHeight > tileSize) { + tierSizeInTiles.push([ + Math.ceil(imageWidth / tileSize), + Math.ceil(imageHeight / tileSize) + ]); + tileSize += tileSize; } - + tierSizeInTiles.push([1, 1]); tierSizeInTiles.reverse(); - var numberOfTiers = tierSizeInTiles.length; + var resolutions = [1]; var tileCountUpToTier = [0]; - var i; - for (i = 1; i < numberOfTiers; i++) { - resolutions.unshift(Math.pow(2, i)); + var i, ii; + for (i = 1, ii = tierSizeInTiles.length; i < ii; i++) { + resolutions.push(1 << i); tileCountUpToTier.push( tierSizeInTiles[i - 1][0] * tierSizeInTiles[i - 1][1] + tileCountUpToTier[i - 1] ); } + resolutions.reverse(); var createFromUrl = function(url) { var template = url + '{tileIndex}/{z}-{x}-{y}.jpg'; From 71b91cd16acf02a299b1ab225c8be5edcd204108 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 14:08:25 +0100 Subject: [PATCH 17/26] Tidy up ol.source.Zoomify tile URL calculations --- src/ol/source/zoomifysource.js | 47 +++++++++++++++------------------- 1 file changed, 20 insertions(+), 27 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index d278a1d1f3..9e87adbf40 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -52,38 +52,31 @@ ol.source.Zoomify = function(opt_options) { } resolutions.reverse(); - var createFromUrl = function(url) { - var template = url + '{tileIndex}/{z}-{x}-{y}.jpg'; - return ( - /** - * @this {ol.source.TileImage} - * @param {ol.TileCoord} tileCoord Tile Coordinate. - * @param {ol.proj.Projection} projection Projection. - * @return {string|undefined} Tile URL. - */ - function(tileCoord, projection) { - if (goog.isNull(tileCoord)) { - return undefined; - } else { - var tileIndex = tileCoord.x + - (tileCoord.y * tierSizeInTiles[tileCoord.z][0]) + - tileCountUpToTier[tileCoord.z]; - return template.replace('{tileIndex}', 'TileGroup' + - Math.floor((tileIndex) / ol.DEFAULT_TILE_SIZE)) - .replace('{z}', '' + tileCoord.z) - .replace('{x}', '' + tileCoord.x) - .replace('{y}', '' + tileCoord.y); - } - } - ); - }; - var tileGrid = new ol.tilegrid.Zoomify({ resolutions: resolutions }); + + var url = options.url; var tileUrlFunction = ol.TileUrlFunction.withTileCoordTransform( tileGrid.createTileCoordTransform({extent: [0, 0, size[0], size[1]]}), - createFromUrl(options.url)); + /** + * @this {ol.source.TileImage} + * @param {ol.TileCoord} tileCoord Tile Coordinate. + * @param {ol.proj.Projection} projection Projection. + * @return {string|undefined} Tile URL. + */ + function(tileCoord, projection) { + if (goog.isNull(tileCoord)) { + return undefined; + } else { + var tileIndex = tileCoord.x + + tileCoord.y * tierSizeInTiles[tileCoord.z][0] + + tileCountUpToTier[tileCoord.z]; + var tileGroup = (tileIndex / ol.DEFAULT_TILE_SIZE) | 0; + return url + 'TileGroup' + tileGroup + '/' + + tileCoord.z + '-' + tileCoord.x + '-' + tileCoord.y + '.jpg'; + } + }); goog.base(this, { attributions: options.attributions, From 541fb177732b1cd1b5d893062dc57d09e050ee55 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 15:26:36 +0100 Subject: [PATCH 18/26] Use prettier image in zoomify example --- examples/zoomify.js | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/examples/zoomify.js b/examples/zoomify.js index 8a79e6d889..49a9cecb0c 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -8,13 +8,16 @@ goog.require('ol.proj.Projection'); goog.require('ol.proj.Units'); goog.require('ol.source.Zoomify'); -//var imgWidth = 8001; -//var imgHeight = 6943; -//var url = 'http://mapy.mzk.cz/AA22/0103/' -var imgWidth = 9911; -var imgHeight = 6100; -var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + - '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/'; +var imgWidth = 8001; +var imgHeight = 6943; +var url = 'http://mapy.mzk.cz/AA22/0103/'; +var crossOrigin = undefined; + +//var imgWidth = 9911; +//var imgHeight = 6100; +//var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + +// '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/'; +//var crossOrigin = 'anonymous'; var imgCenter = [imgWidth / 2, - imgHeight / 2]; var proj = new ol.proj.Projection({ @@ -26,7 +29,7 @@ var proj = new ol.proj.Projection({ var source = new ol.source.Zoomify({ url: url, size: [imgWidth, imgHeight], - crossOrigin: 'anonymous' + crossOrigin: crossOrigin }); var map = new ol.Map({ From 969c32a883d53ab5569f7199f28af60029db6134 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 15:34:09 +0100 Subject: [PATCH 19/26] Re-enable checking of Zoomify example --- examples/zoomify.js | 1 - 1 file changed, 1 deletion(-) diff --git a/examples/zoomify.js b/examples/zoomify.js index 49a9cecb0c..ef445a9073 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -1,4 +1,3 @@ -// NOCHECK we can't check this example as it causes CORS violations in PhantomJS goog.require('ol.Map'); goog.require('ol.RendererHint'); goog.require('ol.View2D'); From c85fe457a7d9b02691489ec425c3f75302087a7d Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:39:06 +0100 Subject: [PATCH 20/26] Add tileClass option to ol.source.TileImage --- src/ol/source/tileimagesource.js | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js index 6f63bd21fa..bf7d0982db 100644 --- a/src/ol/source/tileimagesource.js +++ b/src/ol/source/tileimagesource.js @@ -22,6 +22,9 @@ goog.require('ol.tilegrid.TileGrid'); * logo: (string|undefined), * opaque: (boolean|undefined), * projection: ol.proj.ProjectionLike, + * tileClass: (function(new: ol.ImageTile, ol.TileCoord, + * ol.TileState, string, ?string, + * ol.TileLoadFunctionType)|undefined), * tileGrid: (ol.tilegrid.TileGrid|undefined), * tileLoadFunction: (ol.TileLoadFunctionType|undefined), * tileUrlFunction: (ol.TileUrlFunctionType|undefined)}} @@ -76,6 +79,14 @@ ol.source.TileImage = function(options) { this.tileLoadFunction = goog.isDef(options.tileLoadFunction) ? options.tileLoadFunction : ol.source.TileImage.defaultTileLoadFunction; + /** + * @protected + * @type {function(new: ol.ImageTile, ol.TileCoord, ol.TileState, string, + * ?string, ol.TileLoadFunctionType)} + */ + this.tileClass = goog.isDef(options.tileClass) ? + options.tileClass : ol.ImageTile; + }; goog.inherits(ol.source.TileImage, ol.source.Tile); @@ -116,7 +127,7 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, projection) { goog.asserts.assert(projection); var tileCoord = new ol.TileCoord(z, x, y); var tileUrl = this.tileUrlFunction(tileCoord, projection); - var tile = new ol.ImageTile( + var tile = new this.tileClass( tileCoord, goog.isDef(tileUrl) ? ol.TileState.IDLE : ol.TileState.EMPTY, goog.isDef(tileUrl) ? tileUrl : '', From 588846fa442d065548b7b39c7f29643f4ef23034 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 13:39:24 +0100 Subject: [PATCH 21/26] Use tileClass option to ol.source.Zoomify --- src/ol/source/zoomifysource.js | 26 +------------------------- 1 file changed, 1 insertion(+), 25 deletions(-) diff --git a/src/ol/source/zoomifysource.js b/src/ol/source/zoomifysource.js index 9e87adbf40..7e1a372d47 100644 --- a/src/ol/source/zoomifysource.js +++ b/src/ol/source/zoomifysource.js @@ -1,7 +1,6 @@ goog.provide('ol.source.Zoomify'); goog.require('goog.array'); -goog.require('goog.asserts'); goog.require('goog.dom'); goog.require('goog.dom.TagName'); goog.require('ol.ImageTile'); @@ -82,6 +81,7 @@ ol.source.Zoomify = function(opt_options) { attributions: options.attributions, crossOrigin: options.crossOrigin, logo: options.logo, + tileClass: ol.source.ZoomifyTile_, tileGrid: tileGrid, tileUrlFunction: tileUrlFunction }); @@ -90,30 +90,6 @@ ol.source.Zoomify = function(opt_options) { goog.inherits(ol.source.Zoomify, ol.source.TileImage); -/** - * @inheritDoc - */ -ol.source.Zoomify.prototype.getTile = function(z, x, y, projection) { - var tileCoordKey = this.getKeyZXY(z, x, y); - if (this.tileCache.containsKey(tileCoordKey)) { - return /** @type {!ol.source.ZoomifyTile_} */ ( - this.tileCache.get(tileCoordKey)); - } else { - goog.asserts.assert(goog.isDef(projection)); - var tileCoord = new ol.TileCoord(z, x, y); - var tileUrl = this.tileUrlFunction(tileCoord, projection); - var tile = new ol.source.ZoomifyTile_( - tileCoord, - goog.isDef(tileUrl) ? ol.TileState.IDLE : ol.TileState.EMPTY, - goog.isDef(tileUrl) ? tileUrl : '', - this.crossOrigin, - this.tileLoadFunction); - this.tileCache.set(tileCoordKey, tile); - return tile; - } -}; - - /** * @constructor From e99075a4526adf0ab1cad41fb4431576d8faf7b5 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 16:38:52 +0100 Subject: [PATCH 22/26] Use a server that supports CORS in zoomify example --- examples/zoomify.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/examples/zoomify.js b/examples/zoomify.js index ef445a9073..775803d07f 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -7,16 +7,17 @@ goog.require('ol.proj.Projection'); goog.require('ol.proj.Units'); goog.require('ol.source.Zoomify'); -var imgWidth = 8001; -var imgHeight = 6943; -var url = 'http://mapy.mzk.cz/AA22/0103/'; -var crossOrigin = undefined; +// This server does not support CORS, and so is incompatible with WebGL. +//var imgWidth = 8001; +//var imgHeight = 6943; +//var url = 'http://mapy.mzk.cz/AA22/0103/'; +//var crossOrigin = undefined; -//var imgWidth = 9911; -//var imgHeight = 6100; -//var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + -// '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/'; -//var crossOrigin = 'anonymous'; +var imgWidth = 9911; +var imgHeight = 6100; +var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + + '/mnt/MD1/AD00/plan_CHU-4HD-01/FOND.TIF/'; +var crossOrigin = 'anonymous'; var imgCenter = [imgWidth / 2, - imgHeight / 2]; var proj = new ol.proj.Projection({ From b1bc7317c78c31458c62f4ac8d48ea2717df126a Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 16:39:12 +0100 Subject: [PATCH 23/26] Enable WebGL and DOM renderers in zoomify example --- examples/zoomify.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/zoomify.js b/examples/zoomify.js index 775803d07f..6d15c35da2 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -1,5 +1,5 @@ goog.require('ol.Map'); -goog.require('ol.RendererHint'); +goog.require('ol.RendererHints'); goog.require('ol.View2D'); goog.require('ol.layer.Tile'); goog.require('ol.proj'); @@ -38,7 +38,7 @@ var map = new ol.Map({ source: source }) ], - renderer: ol.RendererHint.CANVAS, + renderers: ol.RendererHints.createFromQueryData(), target: 'map', view: new ol.View2D({ projection: proj, From 78504831e661dc51c755069a3e4a0722ccc4ce2a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Thu, 2 Jan 2014 16:40:43 +0100 Subject: [PATCH 24/26] Export ol.Observable This is so on, un and friends appear in the api docs. --- src/ol/observable.exports | 1 + 1 file changed, 1 insertion(+) diff --git a/src/ol/observable.exports b/src/ol/observable.exports index 1d6e1ffcdf..1721abd5bd 100644 --- a/src/ol/observable.exports +++ b/src/ol/observable.exports @@ -1,3 +1,4 @@ +@exportSymbol ol.Observable @exportProperty ol.Observable.prototype.on @exportProperty ol.Observable.prototype.once @exportProperty ol.Observable.prototype.un From 9ea44d10ce387b2544e6abaf1bcebb566ebbf566 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 16:49:08 +0100 Subject: [PATCH 25/26] Use goog.style.getContentBoxSize to calculate map size This takes into account any border. --- src/ol/map.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ol/map.js b/src/ol/map.js index 262cadb2a8..2a3b6e4019 100644 --- a/src/ol/map.js +++ b/src/ol/map.js @@ -1212,7 +1212,7 @@ ol.Map.prototype.updateSize = function() { if (goog.isNull(targetElement)) { this.setSize(undefined); } else { - var size = goog.style.getSize(targetElement); + var size = goog.style.getContentBoxSize(targetElement); this.setSize([size.width, size.height]); } }; From 6006d242320025539fd8fca233ccee426dc054f6 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 2 Jan 2014 17:02:40 +0100 Subject: [PATCH 26/26] Add comment about fake projection in zoomify example --- examples/zoomify.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/examples/zoomify.js b/examples/zoomify.js index 6d15c35da2..4c0e3881ee 100644 --- a/examples/zoomify.js +++ b/examples/zoomify.js @@ -20,6 +20,10 @@ var url = 'http://vips.vtech.fr/cgi-bin/iipsrv.fcgi?zoomify=' + var crossOrigin = 'anonymous'; var imgCenter = [imgWidth / 2, - imgHeight / 2]; + +// Maps always need a projection, but Zoomify layers are not geo-referenced, and +// are only measured in pixels. So, we create a fake projection that the map +// can use to properly display the layer. var proj = new ol.proj.Projection({ code: 'ZOOMIFY', units: ol.proj.Units.PIXELS,