mapbox-gl 1.13.2

package/src/source/raster_dem_tile_source.js

@@ -0,0 +1,138 @@
+// @flow
+
+import {getImage, ResourceType} from '../util/ajax';
+import {extend} from '../util/util';
+import {Evented} from '../util/evented';
+import browser from '../util/browser';
+import window from '../util/window';
+import offscreenCanvasSupported from '../util/offscreen_canvas_supported';
+import {OverscaledTileID} from './tile_id';
+import RasterTileSource from './raster_tile_source';
+// ensure DEMData is registered for worker transfer on main thread:
+import '../data/dem_data';
+
+import type {Source} from './source';
+import type Dispatcher from '../util/dispatcher';
+import type Tile from './tile';
+import type {Callback} from '../types/callback';
+import type {RasterDEMSourceSpecification} from '../style-spec/types';
+
+class RasterDEMTileSource extends RasterTileSource implements Source {
+    encoding: "mapbox" | "terrarium";
+
+    constructor(id: string, options: RasterDEMSourceSpecification, dispatcher: Dispatcher, eventedParent: Evented) {
+        super(id, options, dispatcher, eventedParent);
+        this.type = 'raster-dem';
+        this.maxzoom = 22;
+        this._options = extend({type: 'raster-dem'}, options);
+        this.encoding = options.encoding || "mapbox";
+    }
+
+    serialize() {
+        return {
+            type: 'raster-dem',
+            url: this.url,
+            tileSize: this.tileSize,
+            tiles: this.tiles,
+            bounds: this.bounds,
+            encoding: this.encoding
+        };
+    }
+
+    loadTile(tile: Tile, callback: Callback<void>) {
+        const url = this.map._requestManager.normalizeTileURL(tile.tileID.canonical.url(this.tiles, this.scheme), this.tileSize);
+        tile.request = getImage(this.map._requestManager.transformRequest(url, ResourceType.Tile), imageLoaded.bind(this));
+
+        tile.neighboringTiles = this._getNeighboringTiles(tile.tileID);
+        function imageLoaded(err, img) {
+            delete tile.request;
+            if (tile.aborted) {
+                tile.state = 'unloaded';
+                callback(null);
+            } else if (err) {
+                tile.state = 'errored';
+                callback(err);
+            } else if (img) {
+                if (this.map._refreshExpiredTiles) tile.setExpiryData(img);
+                delete (img: any).cacheControl;
+                delete (img: any).expires;
+                const transfer = window.ImageBitmap && img instanceof window.ImageBitmap && offscreenCanvasSupported();
+                const rawImageData = transfer ? img : browser.getImageData(img, 1);
+                const params = {
+                    uid: tile.uid,
+                    coord: tile.tileID,
+                    source: this.id,
+                    rawImageData,
+                    encoding: this.encoding
+                };
+
+                if (!tile.actor || tile.state === 'expired') {
+                    tile.actor = this.dispatcher.getActor();
+                    tile.actor.send('loadDEMTile', params, done.bind(this));
+                }
+            }
+        }
+
+        function done(err, dem) {
+            if (err) {
+                tile.state = 'errored';
+                callback(err);
+            }
+
+            if (dem) {
+                tile.dem = dem;
+                tile.needsHillshadePrepare = true;
+                tile.state = 'loaded';
+                callback(null);
+            }
+        }
+    }
+
+    _getNeighboringTiles(tileID: OverscaledTileID) {
+        const canonical = tileID.canonical;
+        const dim = Math.pow(2, canonical.z);
+
+        const px = (canonical.x - 1 + dim) % dim;
+        const pxw = canonical.x === 0 ? tileID.wrap - 1 : tileID.wrap;
+        const nx = (canonical.x + 1 + dim) % dim;
+        const nxw = canonical.x + 1 === dim ? tileID.wrap + 1 : tileID.wrap;
+
+        const neighboringTiles = {};
+        // add adjacent tiles
+        neighboringTiles[new OverscaledTileID(tileID.overscaledZ, pxw, canonical.z, px, canonical.y).key] = {backfilled: false};
+        neighboringTiles[new OverscaledTileID(tileID.overscaledZ, nxw, canonical.z, nx, canonical.y).key] = {backfilled: false};
+
+        // Add upper neighboringTiles
+        if (canonical.y > 0) {
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, pxw, canonical.z, px, canonical.y - 1).key] = {backfilled: false};
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, tileID.wrap, canonical.z, canonical.x, canonical.y - 1).key] = {backfilled: false};
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, nxw, canonical.z, nx, canonical.y - 1).key] = {backfilled: false};
+        }
+        // Add lower neighboringTiles
+        if (canonical.y + 1 < dim) {
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, pxw, canonical.z, px, canonical.y + 1).key] = {backfilled: false};
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, tileID.wrap, canonical.z, canonical.x, canonical.y + 1).key] = {backfilled: false};
+            neighboringTiles[new OverscaledTileID(tileID.overscaledZ, nxw, canonical.z, nx, canonical.y + 1).key] = {backfilled: false};
+        }
+
+        return neighboringTiles;
+    }
+
+    unloadTile(tile: Tile) {
+        if (tile.demTexture) this.map.painter.saveTileTexture(tile.demTexture);
+        if (tile.fbo) {
+            tile.fbo.destroy();
+            delete tile.fbo;
+        }
+        if (tile.dem) delete tile.dem;
+        delete tile.neighboringTiles;
+
+        tile.state = 'unloaded';
+        if (tile.actor) {
+            tile.actor.send('removeDEMTile', {uid: tile.uid, source: this.id});
+        }
+    }
+
+}
+
+export default RasterDEMTileSource;

package/src/source/raster_dem_tile_worker_source.js

@@ -0,0 +1,62 @@
+// @flow
+
+import DEMData from '../data/dem_data';
+import {RGBAImage} from '../util/image';
+import window from '../util/window';
+
+import type Actor from '../util/actor';
+import type {
+    WorkerDEMTileParameters,
+    WorkerDEMTileCallback,
+    TileParameters
+} from './worker_source';
+const {ImageBitmap} = window;
+
+class RasterDEMTileWorkerSource {
+    actor: Actor;
+    loaded: {[_: string]: DEMData};
+    offscreenCanvas: OffscreenCanvas;
+    offscreenCanvasContext: CanvasRenderingContext2D;
+
+    constructor() {
+        this.loaded = {};
+    }
+
+    loadTile(params: WorkerDEMTileParameters, callback: WorkerDEMTileCallback) {
+        const {uid, encoding, rawImageData} = params;
+        // Main thread will transfer ImageBitmap if offscreen decode with OffscreenCanvas is supported, else it will transfer an already decoded image.
+        const imagePixels = (ImageBitmap && rawImageData instanceof ImageBitmap) ? this.getImageData(rawImageData) : rawImageData;
+        const dem = new DEMData(uid, imagePixels, encoding);
+        this.loaded = this.loaded || {};
+        this.loaded[uid] = dem;
+        callback(null, dem);
+    }
+
+    getImageData(imgBitmap: ImageBitmap): RGBAImage {
+        // Lazily initialize OffscreenCanvas
+        if (!this.offscreenCanvas || !this.offscreenCanvasContext) {
+            // Dem tiles are typically 256x256
+            this.offscreenCanvas = new OffscreenCanvas(imgBitmap.width, imgBitmap.height);
+            this.offscreenCanvasContext = this.offscreenCanvas.getContext('2d');
+        }
+
+        this.offscreenCanvas.width = imgBitmap.width;
+        this.offscreenCanvas.height = imgBitmap.height;
+
+        this.offscreenCanvasContext.drawImage(imgBitmap, 0, 0, imgBitmap.width, imgBitmap.height);
+        // Insert an additional 1px padding around the image to allow backfilling for neighboring data.
+        const imgData = this.offscreenCanvasContext.getImageData(-1, -1, imgBitmap.width + 2, imgBitmap.height + 2);
+        this.offscreenCanvasContext.clearRect(0, 0, this.offscreenCanvas.width, this.offscreenCanvas.height);
+        return new RGBAImage({width: imgData.width, height: imgData.height}, imgData.data);
+    }
+
+    removeTile(params: TileParameters) {
+        const loaded = this.loaded,
+            uid = params.uid;
+        if (loaded && loaded[uid]) {
+            delete loaded[uid];
+        }
+    }
+}
+
+export default RasterDEMTileWorkerSource;

package/src/source/raster_tile_source.js

@@ -0,0 +1,169 @@
+// @flow
+
+import {extend, pick} from '../util/util';
+
+import {getImage, ResourceType} from '../util/ajax';
+import {Event, ErrorEvent, Evented} from '../util/evented';
+import loadTileJSON from './load_tilejson';
+import {postTurnstileEvent, postMapLoadEvent} from '../util/mapbox';
+import TileBounds from './tile_bounds';
+import Texture from '../render/texture';
+
+import {cacheEntryPossiblyAdded} from '../util/tile_request_cache';
+
+import type {Source} from './source';
+import type {OverscaledTileID} from './tile_id';
+import type Map from '../ui/map';
+import type Dispatcher from '../util/dispatcher';
+import type Tile from './tile';
+import type {Callback} from '../types/callback';
+import type {Cancelable} from '../types/cancelable';
+import type {
+    RasterSourceSpecification,
+    RasterDEMSourceSpecification
+} from '../style-spec/types';
+
+class RasterTileSource extends Evented implements Source {
+    type: 'raster' | 'raster-dem';
+    id: string;
+    minzoom: number;
+    maxzoom: number;
+    url: string;
+    scheme: string;
+    tileSize: number;
+
+    bounds: ?[number, number, number, number];
+    tileBounds: TileBounds;
+    roundZoom: boolean;
+    dispatcher: Dispatcher;
+    map: Map;
+    tiles: Array<string>;
+
+    _loaded: boolean;
+    _options: RasterSourceSpecification | RasterDEMSourceSpecification;
+    _tileJSONRequest: ?Cancelable;
+
+    constructor(id: string, options: RasterSourceSpecification | RasterDEMSourceSpecification, dispatcher: Dispatcher, eventedParent: Evented) {
+        super();
+        this.id = id;
+        this.dispatcher = dispatcher;
+        this.setEventedParent(eventedParent);
+
+        this.type = 'raster';
+        this.minzoom = 0;
+        this.maxzoom = 22;
+        this.roundZoom = true;
+        this.scheme = 'xyz';
+        this.tileSize = 512;
+        this._loaded = false;
+
+        this._options = extend({type: 'raster'}, options);
+        extend(this, pick(options, ['url', 'scheme', 'tileSize']));
+    }
+
+    load() {
+        this._loaded = false;
+        this.fire(new Event('dataloading', {dataType: 'source'}));
+        this._tileJSONRequest = loadTileJSON(this._options, this.map._requestManager, (err, tileJSON) => {
+            this._tileJSONRequest = null;
+            this._loaded = true;
+            if (err) {
+                this.fire(new ErrorEvent(err));
+            } else if (tileJSON) {
+                extend(this, tileJSON);
+                if (tileJSON.bounds) this.tileBounds = new TileBounds(tileJSON.bounds, this.minzoom, this.maxzoom);
+
+                postTurnstileEvent(tileJSON.tiles);
+                postMapLoadEvent(tileJSON.tiles, this.map._getMapId(), this.map._requestManager._skuToken);
+
+                // `content` is included here to prevent a race condition where `Style#_updateSources` is called
+                // before the TileJSON arrives. this makes sure the tiles needed are loaded once TileJSON arrives
+                // ref: https://github.com/mapbox/mapbox-gl-js/pull/4347#discussion_r104418088
+                this.fire(new Event('data', {dataType: 'source', sourceDataType: 'metadata'}));
+                this.fire(new Event('data', {dataType: 'source', sourceDataType: 'content'}));
+            }
+        });
+    }
+
+    loaded(): boolean {
+        return this._loaded;
+    }
+
+    onAdd(map: Map) {
+        this.map = map;
+        this.load();
+    }
+
+    onRemove() {
+        if (this._tileJSONRequest) {
+            this._tileJSONRequest.cancel();
+            this._tileJSONRequest = null;
+        }
+    }
+
+    serialize() {
+        return extend({}, this._options);
+    }
+
+    hasTile(tileID: OverscaledTileID) {
+        return !this.tileBounds || this.tileBounds.contains(tileID.canonical);
+    }
+
+    loadTile(tile: Tile, callback: Callback<void>) {
+        const url = this.map._requestManager.normalizeTileURL(tile.tileID.canonical.url(this.tiles, this.scheme), this.tileSize);
+        tile.request = getImage(this.map._requestManager.transformRequest(url, ResourceType.Tile), (err, img) => {
+            delete tile.request;
+
+            if (tile.aborted) {
+                tile.state = 'unloaded';
+                callback(null);
+            } else if (err) {
+                tile.state = 'errored';
+                callback(err);
+            } else if (img) {
+                if (this.map._refreshExpiredTiles) tile.setExpiryData(img);
+                delete (img: any).cacheControl;
+                delete (img: any).expires;
+
+                const context = this.map.painter.context;
+                const gl = context.gl;
+                tile.texture = this.map.painter.getTileTexture(img.width);
+                if (tile.texture) {
+                    tile.texture.update(img, {useMipmap: true});
+                } else {
+                    tile.texture = new Texture(context, img, gl.RGBA, {useMipmap: true});
+                    tile.texture.bind(gl.LINEAR, gl.CLAMP_TO_EDGE, gl.LINEAR_MIPMAP_NEAREST);
+
+                    if (context.extTextureFilterAnisotropic) {
+                        gl.texParameterf(gl.TEXTURE_2D, context.extTextureFilterAnisotropic.TEXTURE_MAX_ANISOTROPY_EXT, context.extTextureFilterAnisotropicMax);
+                    }
+                }
+
+                tile.state = 'loaded';
+
+                cacheEntryPossiblyAdded(this.dispatcher);
+
+                callback(null);
+            }
+        });
+    }
+
+    abortTile(tile: Tile, callback: Callback<void>) {
+        if (tile.request) {
+            tile.request.cancel();
+            delete tile.request;
+        }
+        callback();
+    }
+
+    unloadTile(tile: Tile, callback: Callback<void>) {
+        if (tile.texture) this.map.painter.saveTileTexture(tile.texture);
+        callback();
+    }
+
+    hasTransition() {
+        return false;
+    }
+}
+
+export default RasterTileSource;

package/src/source/rtl_text_plugin.js

@@ -0,0 +1,143 @@
+// @flow
+
+import {Event, Evented} from '../util/evented';
+import {getArrayBuffer} from '../util/ajax';
+import browser from '../util/browser';
+import assert from 'assert';
+import {isWorker} from '../util/util';
+
+const status = {
+    unavailable: 'unavailable', // Not loaded
+    deferred: 'deferred', // The plugin URL has been specified, but loading has been deferred
+    loading: 'loading', // request in-flight
+    loaded: 'loaded',
+    error: 'error'
+};
+
+export type PluginState = {
+    pluginStatus: $Values<typeof status>;
+    pluginURL: ?string
+};
+
+type ErrorCallback = (error: ?Error) => void;
+type PluginStateSyncCallback = (state: PluginState) => void;
+let _completionCallback = null;
+
+//Variables defining the current state of the plugin
+let pluginStatus = status.unavailable;
+let pluginURL = null;
+
+export const triggerPluginCompletionEvent = function(error: ?Error) {
+    // NetworkError's are not correctly reflected by the plugin status which prevents reloading plugin
+    if (error && typeof error === 'string' && error.indexOf('NetworkError') > -1) {
+        pluginStatus = status.error;
+    }
+
+    if (_completionCallback) {
+        _completionCallback(error);
+    }
+};
+
+function sendPluginStateToWorker() {
+    evented.fire(new Event('pluginStateChange', {pluginStatus, pluginURL}));
+}
+
+export const evented = new Evented();
+
+export const getRTLTextPluginStatus = function () {
+    return pluginStatus;
+};
+
+export const registerForPluginStateChange = function(callback: PluginStateSyncCallback) {
+    // Do an initial sync of the state
+    callback({pluginStatus, pluginURL});
+    // Listen for all future state changes
+    evented.on('pluginStateChange', callback);
+    return callback;
+};
+
+export const clearRTLTextPlugin = function() {
+    pluginStatus = status.unavailable;
+    pluginURL = null;
+};
+
+export const setRTLTextPlugin = function(url: string, callback: ?ErrorCallback, deferred: boolean = false) {
+    if (pluginStatus === status.deferred || pluginStatus === status.loading || pluginStatus === status.loaded) {
+        throw new Error('setRTLTextPlugin cannot be called multiple times.');
+    }
+    pluginURL = browser.resolveURL(url);
+    pluginStatus = status.deferred;
+    _completionCallback = callback;
+    sendPluginStateToWorker();
+
+    //Start downloading the plugin immediately if not intending to lazy-load
+    if (!deferred) {
+        downloadRTLTextPlugin();
+    }
+};
+
+export const downloadRTLTextPlugin = function() {
+    if (pluginStatus !== status.deferred || !pluginURL) {
+        throw new Error('rtl-text-plugin cannot be downloaded unless a pluginURL is specified');
+    }
+    pluginStatus = status.loading;
+    sendPluginStateToWorker();
+    if (pluginURL) {
+        getArrayBuffer({url: pluginURL}, (error) => {
+            if (error) {
+                triggerPluginCompletionEvent(error);
+            } else {
+                pluginStatus = status.loaded;
+                sendPluginStateToWorker();
+            }
+        });
+    }
+};
+
+export const plugin: {
+    applyArabicShaping: ?Function,
+    processBidirectionalText: ?(string, Array<number>) => Array<string>,
+    processStyledBidirectionalText: ?(string, Array<number>, Array<number>) => Array<[string, Array<number>]>,
+    isLoaded: () => boolean,
+    isLoading: () => boolean,
+    setState: (state: PluginState) => void,
+    isParsed: () => boolean,
+    getPluginURL: () => ?string
+} = {
+    applyArabicShaping: null,
+    processBidirectionalText: null,
+    processStyledBidirectionalText: null,
+    isLoaded() {
+        return pluginStatus === status.loaded || // Main Thread: loaded if the completion callback returned successfully
+            plugin.applyArabicShaping != null; // Web-worker: loaded if the plugin functions have been compiled
+    },
+    isLoading() { // Main Thread Only: query the loading status, this function does not return the correct value in the worker context.
+        return pluginStatus === status.loading;
+    },
+    setState(state: PluginState) { // Worker thread only: this tells the worker threads that the plugin is available on the Main thread
+        assert(isWorker(), 'Cannot set the state of the rtl-text-plugin when not in the web-worker context');
+
+        pluginStatus = state.pluginStatus;
+        pluginURL = state.pluginURL;
+    },
+    isParsed(): boolean {
+        assert(isWorker(), 'rtl-text-plugin is only parsed on the worker-threads');
+
+        return plugin.applyArabicShaping != null &&
+            plugin.processBidirectionalText != null &&
+            plugin.processStyledBidirectionalText != null;
+    },
+    getPluginURL(): ?string {
+        assert(isWorker(), 'rtl-text-plugin url can only be queried from the worker threads');
+        return pluginURL;
+    }
+};
+
+export const lazyLoadRTLTextPlugin = function() {
+    if (!plugin.isLoading() &&
+        !plugin.isLoaded() &&
+        getRTLTextPluginStatus() === 'deferred'
+    ) {
+        downloadRTLTextPlugin();
+    }
+};

package/src/source/source.js

@@ -0,0 +1,137 @@
+// @flow
+
+import {bindAll} from '../util/util';
+
+import type Dispatcher from '../util/dispatcher';
+import type {Event, Evented} from '../util/evented';
+import type Map from '../ui/map';
+import type Tile from './tile';
+import type {OverscaledTileID} from './tile_id';
+import type {Callback} from '../types/callback';
+import {CanonicalTileID} from './tile_id';
+
+/**
+ * The `Source` interface must be implemented by each source type, including "core" types (`vector`, `raster`,
+ * `video`, etc.) and all custom, third-party types.
+ *
+ * @private
+ *
+ * @param {string} id The id for the source. Must not be used by any existing source.
+ * @param {Object} options Source options, specific to the source type (except for `options.type`, which is always
+ * required).
+ * @param {string} options.type The source type, matching the value of `name` used in {@link Style#addSourceType}.
+ * @param {Dispatcher} dispatcher A {@link Dispatcher} instance, which can be used to send messages to the workers.
+ *
+ * @fires data with `{dataType: 'source', sourceDataType: 'metadata'}` to indicate that any necessary metadata
+ * has been loaded so that it's okay to call `loadTile`; and with `{dataType: 'source', sourceDataType: 'content'}`
+ * to indicate that the source data has changed, so that any current caches should be flushed.
+ * @property {string} id The id for the source.  Must match the id passed to the constructor.
+ * @property {number} minzoom
+ * @property {number} maxzoom
+ * @property {boolean} isTileClipped `false` if tiles can be drawn outside their boundaries, `true` if they cannot.
+ * @property {boolean} reparseOverscaled `true` if tiles should be sent back to the worker for each overzoomed zoom
+ * level, `false` if not.
+ * @property {boolean} roundZoom `true` if zoom levels are rounded to the nearest integer in the source data, `false`
+ * if they are floor-ed to the nearest integer.
+ */
+export interface Source {
+    +type: string;
+    id: string;
+    minzoom: number,
+    maxzoom: number,
+    tileSize: number,
+    attribution?: string,
+
+    roundZoom?: boolean,
+    isTileClipped?: boolean,
+    mapbox_logo?: boolean,
+    tileID?: CanonicalTileID;
+    reparseOverscaled?: boolean,
+    vectorLayerIds?: Array<string>,
+
+    hasTransition(): boolean;
+    loaded(): boolean;
+
+    fire(event: Event): mixed;
+
+    +onAdd?: (map: Map) => void;
+    +onRemove?: (map: Map) => void;
+
+    loadTile(tile: Tile, callback: Callback<void>): void;
+    +hasTile?: (tileID: OverscaledTileID) => boolean;
+    +abortTile?: (tile: Tile, callback: Callback<void>) => void;
+    +unloadTile?: (tile: Tile, callback: Callback<void>) => void;
+
+    /**
+     * @returns A plain (stringifiable) JS object representing the current state of the source.
+     * Creating a source using the returned object as the `options` should result in a Source that is
+     * equivalent to this one.
+     * @private
+     */
+    serialize(): Object;
+
+    +prepare?: () => void;
+}
+
+type SourceStatics = {
+    /*
+     * An optional URL to a script which, when run by a Worker, registers a {@link WorkerSource}
+     * implementation for this Source type by calling `self.registerWorkerSource(workerSource: WorkerSource)`.
+     */
+    workerSourceURL?: URL;
+};
+
+export type SourceClass = Class<Source> & SourceStatics;
+
+import vector from '../source/vector_tile_source';
+import raster from '../source/raster_tile_source';
+import rasterDem from '../source/raster_dem_tile_source';
+import geojson from '../source/geojson_source';
+import video from '../source/video_source';
+import image from '../source/image_source';
+import canvas from '../source/canvas_source';
+
+import type {SourceSpecification} from '../style-spec/types';
+
+const sourceTypes = {
+    vector,
+    raster,
+    'raster-dem': rasterDem,
+    geojson,
+    video,
+    image,
+    canvas
+};
+
+/*
+ * Creates a tiled data source instance given an options object.
+ *
+ * @param id
+ * @param {Object} source A source definition object compliant with
+ * [`mapbox-gl-style-spec`](https://www.mapbox.com/mapbox-gl-style-spec/#sources) or, for a third-party source type,
+  * with that type's requirements.
+ * @param {Dispatcher} dispatcher
+ * @returns {Source}
+ */
+export const create = function(id: string, specification: SourceSpecification, dispatcher: Dispatcher, eventedParent: Evented) {
+    const source = new sourceTypes[specification.type](id, (specification: any), dispatcher, eventedParent);
+
+    if (source.id !== id) {
+        throw new Error(`Expected Source id to be ${id} instead of ${source.id}`);
+    }
+
+    bindAll(['load', 'abort', 'unload', 'serialize', 'prepare'], source);
+    return source;
+};
+
+export const getType = function (name: string) {
+    return sourceTypes[name];
+};
+
+export const setType = function (name: string, type: Class<Source>) {
+    sourceTypes[name] = type;
+};
+
+export interface Actor {
+    send(type: string, data: Object, callback: Callback<any>): void;
+}