Provide ResourceType hint to Map.transformRequest callbacks

mapbox · Jul 24, 2017 · 5cf7788 · 5cf7788
1 parent 24f83c3
commit 5cf7788
Show file tree

Hide file tree

Showing 13 changed files with 45 additions and 35 deletions.
diff --git a/src/source/image_source.js b/src/source/image_source.js
@@ -91,7 +91,7 @@ class ImageSource extends Evented implements Source {
 
  this.url = this.options.url;
 
- ajax.getImage(this.map._transformRequest(this.url), (err, image) => {
+ ajax.getImage(this.map._transformRequest(this.url, ajax.ResourceType.Image), (err, image) => {
  if (err) {
  this.fire('error', {error: err});
  } else if (image) {

diff --git a/src/source/raster_tile_source.js b/src/source/raster_tile_source.js
@@ -52,7 +52,7 @@ class RasterTileSource extends Evented implements Source {
 
  load() {
  this.fire('dataloading', {dataType: 'source'});
- loadTileJSON(this._options, (url) => { return this.map._transformRequest(url); }, (err, tileJSON) => {
+ loadTileJSON(this._options, (url) => { return this.map._transformRequest(url, ajax.ResourceType.Source); }, (err, tileJSON) => {
  if (err) {
  this.fire('error', err);
  } else if (tileJSON) {
@@ -91,7 +91,7 @@ class RasterTileSource extends Evented implements Source {
  loadTile(tile: Tile, callback: Callback<void>) {
  const url = normalizeURL(tile.coord.url(this.tiles, null, this.scheme), this.url, this.tileSize);
 
- tile.request = ajax.getImage(this.map._transformRequest(url), (err, img) => {
+ tile.request = ajax.getImage(this.map._transformRequest(url, ajax.ResourceType.Tile), (err, img) => {
  delete tile.request;
 
  if (tile.aborted) {

diff --git a/src/source/vector_tile_source.js b/src/source/vector_tile_source.js
@@ -5,6 +5,7 @@ const util = require('../util/util');
 const loadTileJSON = require('./load_tilejson');
 const normalizeURL = require('../util/mapbox').normalizeTileURL;
 const TileBounds = require('./tile_bounds');
+const ResourceType = require('../util/ajax').ResourceType;
 
 import type {Source} from './source';
 import type TileCoord from './tile_coord';
@@ -56,7 +57,7 @@ class VectorTileSource extends Evented implements Source {
  load() {
  this.fire('dataloading', {dataType: 'source'});
 
- loadTileJSON(this._options, (url) => { return this.map._transformRequest(url); }, (err, tileJSON) => {
+ loadTileJSON(this._options, (url) => { return this.map._transformRequest(url, ResourceType.Source); }, (err, tileJSON) => {
  if (err) {
  this.fire('error', err);
  } else if (tileJSON) {
@@ -96,7 +97,7 @@ class VectorTileSource extends Evented implements Source {
  const overscaling = tile.coord.z > this.maxzoom ? Math.pow(2, tile.coord.z - this.maxzoom) : 1;
  const url = normalizeURL(tile.coord.url(this.tiles, this.maxzoom, this.scheme), this.url);
  const params = {
- request: this.map._transformRequest(url),
+ request: this.map._transformRequest(url, ResourceType.Tile),
  uid: tile.uid,
  coord: tile.coord,
  zoom: tile.coord.z,

diff --git a/src/style/image_sprite.js b/src/style/image_sprite.js
@@ -39,7 +39,7 @@ class ImageSprite extends Evented {
 
  const format = this.retina ? '@2x' : '';
  let url = normalizeURL(base, format, '.json');
- const jsonRequest = transformRequestCallback ? transformRequestCallback(url) : { url: url};
+ const jsonRequest = transformRequestCallback ? transformRequestCallback(url, ajax.ResourceType.SpriteJSON) : { url: url};
  ajax.getJSON(jsonRequest, (err, data) => {
  if (err) {
  this.fire('error', {error: err});
@@ -49,7 +49,7 @@ class ImageSprite extends Evented {
  }
  });
  url = normalizeURL(base, format, '.png');
- const imageRequest = transformRequestCallback ? transformRequestCallback(url) : { url: url};
+ const imageRequest = transformRequestCallback ? transformRequestCallback(url, ajax.ResourceType.SpriteImage) : { url: url};
  ajax.getImage(imageRequest, (err, img) => {
  if (err) {
  this.fire('error', {error: err});

diff --git a/src/style/style.js b/src/style/style.js
@@ -85,8 +85,8 @@ class Style extends Evented {
  }
  });
 
- const transformRequest = (url) => {
- return this.map ? this.map._transformRequest(url) : { url: url};
+ const transformRequest = (url, resourceType) => {
+ return this.map ? this.map._transformRequest(url, resourceType) : { url: url};
  };
 
  const stylesheetLoaded = (err, stylesheet) => {
@@ -117,7 +117,7 @@ class Style extends Evented {
  };
 
  if (typeof stylesheet === 'string') {
- ajax.getJSON(transformRequest(mapbox.normalizeStyleURL(stylesheet)), stylesheetLoaded);
+ ajax.getJSON(transformRequest(mapbox.normalizeStyleURL(stylesheet), ajax.ResourceType.Style), stylesheetLoaded);
  } else {
  browser.frame(stylesheetLoaded.bind(this, null, stylesheet));
  }

diff --git a/src/symbol/glyph_source.js b/src/symbol/glyph_source.js
@@ -149,7 +149,7 @@ class GlyphSource extends Evented {
  }
 
  loadPBF(url, callback) {
- const request = this.transformRequestCallback ? this.transformRequestCallback(url) : { url: url };
+ const request = this.transformRequestCallback ? this.transformRequestCallback(url, ajax.ResourceType.Glyphs) : { url: url };
  ajax.getArrayBuffer(request, callback);
  }
 

diff --git a/src/ui/map.js b/src/ui/map.js
@@ -34,6 +34,8 @@ type IControl = {
 }
 /* eslint-enable no-use-before-define */
 
+type ResourceTypeEnum = $Keys<typeof ajax.ResourceType>;
+
 type MapOptions = {
  hash?: boolean,
  interactive?: boolean,
@@ -608,7 +610,7 @@ class Map extends Camera {
  /**
  * @private
  */
- _transformRequest(url: string): RequestParameters {
+ _transformRequest(url: string, resourceType?: ResourceTypeEnum): RequestParameters {
  let requestParameters: RequestParameters = {
  url: url,
  headers: {}
@@ -618,7 +620,7 @@ class Map extends Camera {
  return requestParameters;
  }
 
- requestParameters = this._transformRequestCallback(url) || requestParameters;
+ requestParameters = this._transformRequestCallback(url, resourceType || ajax.ResourceType.Unknown) || requestParameters;
  return requestParameters;
  }
 
@@ -629,8 +631,8 @@ class Map extends Camera {
  * @function setRequestTransform
  * @param {Function} callback Callback function called with the requested URL. Return an object with a transformed URL and headers (optional)
  * @example
- * Map.setRequestTransform( (url)=> {
- * if(url.startsWith('http://myHost') {
+ * Map.setRequestTransform( (url, resourceType)=> {
+ * if(resourceType == 'Source' && url.startsWith('http://myHost') {
  * return {
  * url: url.replace('http', 'https'),
  * headers: { 'withCredentials': true}
@@ -1180,7 +1182,7 @@ class Map extends Camera {
  * @see [Add an icon to the map](https://www.mapbox.com/mapbox-gl-js/example/add-image/)
  */
  loadImage(url: string, callback: Function) {
- ajax.getImage(this._transformRequest(url), callback);
+ ajax.getImage(this._transformRequest(url, ajax.ResourceType.Image), callback);
  }
 
  /**

diff --git a/src/util/ajax.js b/src/util/ajax.js
@@ -5,18 +5,17 @@ const window = require('./window');
 /**
  * The type of a resource.
  */
-// type ResourceType = "Unknown" | "Style" | "Source" | "Tile" | "Glyphs" | "SpriteImage" | "SpriteJSON" | "Image";
-// TODO: AHM:
 const ResourceType = {
- Unknown: Symbol('Unknown'),
- Style: Symbol('Style'),
- Source: Symbol('Source'),
- Tile: Symbol('Tile'),
- Glyphs: Symbol('Glyphs'),
- SpriteImage: Symbol('SpriteImage'),
- SpriteJSON: Symbol('SpriteJSON'),
- Image: Symbol('Image')
+ Unknown: 'Unknown',
+ Style: 'Style',
+ Source: 'Source',
+ Tile: 'Tile',
+ Glyphs: 'Glyphs',
+ SpriteImage: 'SpriteImage',
+ SpriteJSON: 'SpriteJSON',
+ Image: 'Image'
 };
+exports.ResourceType = ResourceType;
 
 if (typeof Object.freeze == 'function') {
  Object.freeze(ResourceType);
@@ -27,12 +26,10 @@ if (typeof Object.freeze == 'function') {
  * @typedef {Object} RequestParameters
  * @property {string} url The URL to be requested.
  * @property {Object} headers The headers to be sent with the request.
- * @property {Boolean} withCredentials Whether cross-site requests should be made with cookies.
+ * @property {boolean} withCredentials Whether cross-site requests should be made with cookies.
  */
 export type RequestParameters = {
  url: string,
- // TODO: AHM:
- // resourceType?: ResourceType,
  headers?: Object,
  withCredentials? : Boolean
 };

diff --git a/test/unit/source/image_source.test.js b/test/unit/source/image_source.test.js
@@ -56,6 +56,7 @@ test('ImageSource', (t) => {
  source.onAdd(map);
  t.ok(spy.calledOnce);
  t.equal(spy.getCall(0).args[0], '/image.png');
+ t.equal(spy.getCall(0).args[1], 'Image');
  t.end();
  });
 

diff --git a/test/unit/source/raster_tile_source.test.js b/test/unit/source/raster_tile_source.test.js
@@ -37,14 +37,15 @@ test('RasterTileSource', (t) => {
  tiles: ["http://example.com/{z}/{x}/{y}.png"],
  bounds: [-47, -7, -45, -5]
  }));
- const spy = t.spy((e) => {
+ const transformSpy = t.spy((e) => {
  return { url: e };
  });
 
- createSource({ url: "/source.json" }, spy);
+ createSource({ url: "/source.json" }, transformSpy);
  window.server.respond();
 
- t.ok(spy.calledWith('/source.json'));
+ t.equal(transformSpy.getCall(0).args[0], '/source.json');
+ t.equal(transformSpy.getCall(0).args[1], 'Source');
  t.end();
  });
 
@@ -114,6 +115,7 @@ test('RasterTileSource', (t) => {
  source.loadTile(tile, () => {});
  t.ok(transformSpy.calledOnce);
  t.equal(transformSpy.getCall(0).args[0], 'http://example.com/10/5/5.png');
+ t.equal(transformSpy.getCall(0).args[1], 'Tile');
  t.end();
  }
  });

diff --git a/test/unit/source/vector_tile_source.test.js b/test/unit/source/vector_tile_source.test.js
@@ -77,7 +77,8 @@ test('VectorTileSource', (t) => {
 
  createSource({ url: "/source.json" }, transformSpy);
  window.server.respond();
- t.ok(transformSpy.calledWith('/source.json'));
+ t.equal(transformSpy.getCall(0).args[0], '/source.json');
+ t.equal(transformSpy.getCall(0).args[1], 'Source');
  t.end();
  });
 
@@ -176,6 +177,7 @@ test('VectorTileSource', (t) => {
  source.loadTile(tile, () => {});
  t.ok(transformSpy.calledOnce);
  t.equal(transformSpy.getCall(0).args[0], 'http://example.com/10/5/5.png');
+ t.equal(transformSpy.getCall(0).args[1], 'Tile');
  t.end();
  }
  });

diff --git a/test/unit/style/style.test.js b/test/unit/style/style.test.js
@@ -126,6 +126,7 @@ test('Style', (t) => {
  // window.server.respond();
  t.ok(transformSpy.calledOnce);
  t.equal(transformSpy.getCall(0).args[0], '/style.json');
+ t.equal(transformSpy.getCall(0).args[1], 'Style');
  t.end();
  });
 
@@ -154,7 +155,9 @@ test('Style', (t) => {
  style.on('style.load', () => {
  t.equal(transformSpy.callCount, 2);
  t.equal(transformSpy.getCall(0).args[0], 'http://example.com/sprites/bright-v8.json');
+ t.equal(transformSpy.getCall(0).args[1], 'SpriteJSON');
  t.equal(transformSpy.getCall(1).args[0], 'http://example.com/sprites/bright-v8.png');
+ t.equal(transformSpy.getCall(1).args[1], 'SpriteImage');
  t.end();
  });
 

diff --git a/test/unit/symbol/glyph_source.test.js b/test/unit/symbol/glyph_source.test.js
@@ -1,6 +1,7 @@
 'use strict';
 
 const test = require('mapbox-gl-js-test').test;
+const ajax = require('../../../src/util/ajax');
 const GlyphSource = require('../../../src/symbol/glyph_source');
 const fs = require('fs');
 
@@ -35,10 +36,11 @@ test('GlyphSource', (t) => {
  });
 
  t.test('transforms glyph URL before request', (t) => {
+ t.stub(ajax, 'getArrayBuffer').callsFake((url, cb) => cb());
  const transformSpy = t.stub().callsFake((url) => { return { url: url }; });
- const source = new GlyphSource("https://localhost/fonts/v1/{fontstack}/{range}.pbf", false, transformSpy);
+ const source = new GlyphSource("https://localhost/fonts/v1/{fontstack}/{range}.pbf", false, null, transformSpy);
 
- source.getSimpleGlyphs("Arial Unicode MS", [55], 0, () => {
+ source.loadPBF("https://localhost/fonts/v1/Arial Unicode MS/0-255.pbf", () => {
  t.ok(transformSpy.calledOnce);
  t.equal(transformSpy.getCall(0).args[0], "https://localhost/fonts/v1/Arial Unicode MS/0-255.pbf");
  t.end();