diff --git a/leaflet-iiif.js b/leaflet-iiif.js index e1cebf2..ca7dca8 100644 --- a/leaflet-iiif.js +++ b/leaflet-iiif.js @@ -52,12 +52,19 @@ L.TileLayer.Iiif = L.TileLayer.extend({ var xDiff = (maxx - minx); var yDiff = (maxy - miny); + // Canonical URI Syntax for v2 + var size = Math.ceil(xDiff / scale) + ','; + if (_this.type === 'ImageService3') { + // Cannonical URI Syntax for v3 + size = size + Math.ceil(yDiff / scale); + } + return L.Util.template(this._baseUrl, L.extend({ format: _this.options.tileFormat, quality: _this.quality, region: [minx, miny, xDiff, yDiff].join(','), rotation: 0, - size: Math.ceil(xDiff / scale) + ',' + size: size }, this.options)); }, onAdd: function(map) { @@ -181,6 +188,7 @@ L.TileLayer.Iiif = L.TileLayer.extend({ }else { _this.profile = data.profile; } + _this.type = data.type; _this._setQuality(); diff --git a/spec/LTileLayerIiifSpec.js b/spec/LTileLayerIiifSpec.js index bf08659..fa3e46a 100644 --- a/spec/LTileLayerIiifSpec.js +++ b/spec/LTileLayerIiifSpec.js @@ -88,7 +88,21 @@ describe('L.TileLayer.Iiif', function() { }); done(); }) - }) + }); + + it('generates a v3 canonical url', function(done) { + var v3Image = L.tileLayer.iiif('http://localhost:9876/base/fixtures/v3/info.json'); + map.addLayer(v3Image); + v3Image.on('load', function() { + var i = 0; + eachImg(v3Image, function (img) { + expect(img.src).toBe('http://localhost:9876/base/fixtures/v3/0,0,2000,1271/500,318/0/default.jpg') + i++; + }); + done(); + }) + }); + }); describe('fitBounds', function() { diff --git a/spec/fixtures/v3/info.json b/spec/fixtures/v3/info.json new file mode 100644 index 0000000..372c5c3 --- /dev/null +++ b/spec/fixtures/v3/info.json @@ -0,0 +1,28 @@ +{ + "@context": "http://iiif.io/api/image/3/context.json", + "extraFormats": [ + "jpg", + "png" + ], + "extraQualities": [ + "default", + "color", + "gray" + ], + "height": 1271, + "id": "http://iiif.io/api/image/3.0/example/reference/421e65be2ce95439b3ad6ef1f2ab87a9-dee-xray", + "profile": "level1", + "protocol": "http://iiif.io/api/image", + "tiles": [ + { + "height": 512, + "scaleFactors": [ + 1, + 2 + ], + "width": 512 + } + ], + "type": "ImageService3", + "width": 2000 +}