@scoova/mgl 1.0.0

package/src/util/vectortile_to_geojson.ts

@@ -0,0 +1,72 @@
+import type {VectorTileFeature} from '@mapbox/vector-tile';
+import type {LayerSpecification} from '@maplibre/maplibre-gl-style-spec';
+
+/**
+ * A helper for type to omit a property from a type
+ */
+type DistributiveKeys<T> = T extends T ? keyof T : never;
+/**
+ * A helper for type to omit a property from a type
+ */
+type DistributiveOmit<T, K extends DistributiveKeys<T>> = T extends unknown
+    ? Omit<T, K>
+    : never;
+
+/**
+ * An extended geojson feature used by the events to return data to the listener
+ */
+export type MapGeoJSONFeature = GeoJSONFeature & {
+    layer: DistributiveOmit<LayerSpecification, 'source'> & {source: string};
+    source: string;
+    sourceLayer?: string;
+    state: { [key: string]: any };
+}
+
+/**
+ * A geojson feature
+ */
+export class GeoJSONFeature {
+    type: 'Feature';
+    _geometry: GeoJSON.Geometry;
+    properties: { [name: string]: any };
+    id: number | string | undefined;
+
+    _vectorTileFeature: VectorTileFeature;
+
+    constructor(vectorTileFeature: VectorTileFeature, z: number, x: number, y: number, id: string | number | undefined) {
+        this.type = 'Feature';
+
+        this._vectorTileFeature = vectorTileFeature;
+        (vectorTileFeature as any)._z = z;
+        (vectorTileFeature as any)._x = x;
+        (vectorTileFeature as any)._y = y;
+
+        this.properties = vectorTileFeature.properties;
+        this.id = id;
+    }
+
+    get geometry(): GeoJSON.Geometry {
+        if (this._geometry === undefined) {
+            this._geometry = this._vectorTileFeature.toGeoJSON(
+                (this._vectorTileFeature as any)._x,
+                (this._vectorTileFeature as any)._y,
+                (this._vectorTileFeature as any)._z).geometry;
+        }
+        return this._geometry;
+    }
+
+    set geometry(g: GeoJSON.Geometry) {
+        this._geometry = g;
+    }
+
+    toJSON() {
+        const json: any = {
+            geometry: this.geometry
+        };
+        for (const i in this) {
+            if (i === '_geometry' || i === '_vectorTileFeature') continue;
+            json[i] = (this)[i];
+        }
+        return json;
+    }
+}

package/src/util/verticalize_punctuation.ts

@@ -0,0 +1,110 @@
+import {charHasRotatedVerticalOrientation} from './script_detection';
+
+export const verticalizedCharacterMap = {
+    '!': '︕',
+    '#': '＃',
+    '$': '＄',
+    '%': '％',
+    '&': '＆',
+    '(': '︵',
+    ')': '︶',
+    '*': '＊',
+    '+': '＋',
+    ',': '︐',
+    '-': '︲',
+    '.': '・',
+    '/': '／',
+    ':': '︓',
+    ';': '︔',
+    '<': '︿',
+    '=': '＝',
+    '>': '﹀',
+    '?': '︖',
+    '@': '＠',
+    '[': '﹇',
+    '\\': '＼',
+    ']': '﹈',
+    '^': '＾',
+    '_': '︳',
+    '`': '｀',
+    '{': '︷',
+    '|': '―',
+    '}': '︸',
+    '~': '～',
+    '¢': '￠',
+    '£': '￡',
+    '¥': '￥',
+    '¦': '￤',
+    '¬': '￢',
+    '¯': '￣',
+    '–': '︲',
+    '—': '︱',
+    '‘': '﹃',
+    '’': '﹄',
+    '“': '﹁',
+    '”': '﹂',
+    '…': '︙',
+    '‧': '・',
+    '₩': '￦',
+    '、': '︑',
+    '。': '︒',
+    '〈': '︿',
+    '〉': '﹀',
+    '《': '︽',
+    '》': '︾',
+    '「': '﹁',
+    '」': '﹂',
+    '『': '﹃',
+    '』': '﹄',
+    '【': '︻',
+    '】': '︼',
+    '〔': '︹',
+    '〕': '︺',
+    '〖': '︗',
+    '〗': '︘',
+    '！': '︕',
+    '（': '︵',
+    '）': '︶',
+    '，': '︐',
+    '－': '︲',
+    '．': '・',
+    '：': '︓',
+    '；': '︔',
+    '＜': '︿',
+    '＞': '﹀',
+    '？': '︖',
+    '［': '﹇',
+    '］': '﹈',
+    '＿': '︳',
+    '｛': '︷',
+    '｜': '―',
+    '｝': '︸',
+    '｟': '︵',
+    '｠': '︶',
+    '｡': '︒',
+    '｢': '﹁',
+    '｣': '﹂'
+};
+
+export function verticalizePunctuation(input: string) {
+    let output = '';
+
+    for (let i = 0; i < input.length; i++) {
+        const nextCharCode = input.charCodeAt(i + 1) || null;
+        const prevCharCode = input.charCodeAt(i - 1) || null;
+
+        const canReplacePunctuation = (
+            (!nextCharCode || !charHasRotatedVerticalOrientation(nextCharCode) || verticalizedCharacterMap[input[i + 1]]) &&
+            (!prevCharCode || !charHasRotatedVerticalOrientation(prevCharCode) || verticalizedCharacterMap[input[i - 1]])
+        );
+
+        if (canReplacePunctuation && verticalizedCharacterMap[input[i]]) {
+            output += verticalizedCharacterMap[input[i]];
+        } else {
+            output += input[i];
+        }
+    }
+
+    return output;
+}
+

package/src/util/web_worker.ts

@@ -0,0 +1,16 @@
+import {AddProtocolAction, config} from './config';
+import type {default as MaplibreWorker} from '../source/worker';
+import type {WorkerSourceConstructor} from '../source/worker_source';
+
+export interface WorkerGlobalScopeInterface {
+    importScripts(...urls: Array<string>): void;
+    registerWorkerSource: (sourceName: string, sourceConstructor: WorkerSourceConstructor) => void;
+    registerRTLTextPlugin: (_: any) => void;
+    addProtocol: (customProtocol: string, loadFn: AddProtocolAction) => void;
+    removeProtocol: (customProtocol: string) => void;
+    worker: MaplibreWorker;
+}
+
+export function workerFactory() {
+    return new Worker(config.WORKER_URL);
+}

package/src/util/web_worker_transfer.test.ts

@@ -0,0 +1,153 @@
+import {SerializedObject} from '../../dist/maplibre-gl';
+import {AJAXError} from './ajax';
+import {register, serialize, deserialize} from './web_worker_transfer';
+
+describe('web worker transfer', () => {
+    test('round trip', () => {
+        class SerializableMock {
+            n;
+            buffer;
+            blob;
+            _cached;
+            dataView;
+            imageData;
+            array;
+
+            constructor(n) {
+                this.n = n;
+                this.buffer = new ArrayBuffer(100);
+                this.dataView = new DataView(this.buffer);
+                this.imageData = new ImageData(8, 5);
+                this.blob = new Blob();
+                this.array = [true, 1, 'one', new ArrayBuffer(100)];
+                this.squared();
+            }
+
+            squared() {
+                if (this._cached) {
+                    return this._cached;
+                }
+                this._cached = this.n * this.n;
+                return this._cached;
+            }
+        }
+
+        register('SerializableMock', SerializableMock, {omit: ['_cached']});
+
+        const serializableMock = new SerializableMock(10);
+        const transferables = [];
+        const deserialized = deserialize(serialize(serializableMock, transferables)) as SerializableMock;
+        expect(deserialize(serialize(serializableMock, transferables)) instanceof SerializableMock).toBeTruthy();
+        expect(serializableMock.dataView instanceof DataView).toBeTruthy();
+
+        expect(serializableMock !== deserialized).toBeTruthy();
+        expect(deserialized.constructor === SerializableMock).toBeTruthy();
+        expect(deserialized.n === 10).toBeTruthy();
+        expect(deserialized.buffer === serializableMock.buffer).toBeTruthy();
+        expect(deserialized.blob === serializableMock.blob).toBeTruthy();
+        expect(transferables[0] === serializableMock.buffer).toBeTruthy();
+        expect(transferables[1] === serializableMock.dataView.buffer).toBeTruthy();
+        expect(deserialized._cached === undefined).toBeTruthy();
+        expect(deserialized.squared() === 100).toBeTruthy();
+        expect(deserialized.dataView instanceof DataView).toBeTruthy();
+        expect(deserialized.array).toEqual(serializableMock.array);
+    });
+
+    test('anonymous class', () => {
+        const Klass = (() => (class {}))();
+        expect(!Klass.name).toBeTruthy();
+        register('Anon', Klass);
+        const x = new Klass();
+        const deserialized = deserialize(serialize(x));
+        expect(deserialized instanceof Klass).toBeTruthy();
+    });
+
+    test('custom serialization', () => {
+        class CustomSerialization {
+            id;
+            _deserialized;
+            constructor(id) {
+                this.id = id;
+                this._deserialized = false;
+            }
+
+            static serialize(b) {
+                return {custom: `custom serialization,${b.id}`};
+            }
+
+            static deserialize(input) {
+                const b = new CustomSerialization(input.custom.split(',')[1]);
+                b._deserialized = true;
+                return b;
+            }
+        }
+
+        register('CustomSerialization', CustomSerialization);
+
+        const customSerialization = new CustomSerialization('a');
+        expect(!customSerialization._deserialized).toBeTruthy();
+
+        const deserialized = deserialize(serialize(customSerialization)) as CustomSerialization;
+        expect(deserialize(serialize(customSerialization)) instanceof CustomSerialization).toBeTruthy();
+        expect(deserialized.id).toBe(customSerialization.id);
+        expect(deserialized._deserialized).toBeTruthy();
+    });
+
+    test('AjaxError serialization', () => {
+        const status = 404;
+        const statusText = 'not found';
+        const url = 'https://example.com';
+
+        const ajaxError = new AJAXError(status, statusText, url, new Blob());
+        const serialized = serialize(ajaxError) as SerializedObject;
+        expect(serialized.$name).toBe(ajaxError.constructor.name);
+        const deserialized = deserialize(serialized) as AJAXError;
+        expect(deserialized.status).toBe(404);
+        expect(deserialized.statusText).toBe(statusText);
+        expect(deserialized.url).toBe(url);
+    });
+
+    test('serialize Object has _classRegistryKey', () => {
+        class BadClass {
+            _classRegistryKey: 'foo';
+        }
+        const trySerialize = () => {
+            serialize(new BadClass());
+        };
+        expect(trySerialize).toThrow();
+    });
+    test('serialize can not used reserved property #name', () => {
+        class BadClass {
+            static serialize() {
+                return {
+                    '$name': 'foo'
+                };
+            }
+        }
+        register('BadClass', BadClass);
+        const badObject = new BadClass();
+        expect(() => {
+            serialize(badObject);
+        }).toThrow();
+    });
+    test('deserialize Object has $name', () => {
+        const badObject = {
+            '$name': 'foo'
+        };
+        const tryDeserialize = () => {
+            deserialize(badObject);
+        };
+        expect(tryDeserialize).toThrow();
+    });
+
+    test('some objects can not be serialized', () => {
+        expect(() => {
+            serialize(BigInt(123));
+        }).toThrow();
+    });
+    test('some objects can not be deserialized', () => {
+        expect(() => {
+            deserialize(<SerializedObject><unknown>BigInt(123));
+        }).toThrow();
+    });
+});

package/src/util/web_worker_transfer.ts

@@ -0,0 +1,254 @@
+import {TransferableGridIndex} from './transferable_grid_index';
+import {Color, CompoundExpression, expressions, ResolvedImage, StylePropertyFunction,
+    StyleExpression, ZoomDependentExpression, ZoomConstantExpression} from '@maplibre/maplibre-gl-style-spec';
+import {AJAXError} from './ajax';
+import {isImageBitmap} from './util';
+
+/**
+ * A class that is serialized to and json, that can be constructed back to the original class in the worker or in the main thread
+ */
+type SerializedObject<S extends Serialized = any> = {
+    [_: string]: S;
+};
+
+/**
+ * All the possible values that can be serialized and sent to and from the worker
+ */
+export type Serialized = null | void | boolean | number | string | Boolean | Number | String | Date | RegExp | ArrayBuffer | ArrayBufferView | ImageData | ImageBitmap | Blob | Array<Serialized> | SerializedObject;
+
+type Registry = {
+    [_: string]: {
+        klass: {
+            new (...args: any): any;
+            deserialize?: (input: Serialized) => unknown;
+            serialize?: (input: any, transferables: Transferable[]) => SerializedObject;
+        };
+        omit: ReadonlyArray<string>;
+        shallow: ReadonlyArray<string>;
+    };
+};
+
+/**
+ * Register options
+ */
+type RegisterOptions<T> = {
+    /**
+     * List of properties to omit from serialization (e.g., cached/computed properties)
+     */
+    omit?: ReadonlyArray<keyof T>;
+    /**
+     * List of properties that should be serialized by a simple shallow copy, rather than by a recursive call to serialize().
+     */
+    shallow?: ReadonlyArray<keyof T>;
+};
+
+const registry: Registry = {};
+
+/**
+ * Register the given class as serializable.
+ *
+ * @param options - the registration options
+ */
+export function register<T extends any>(
+    name: string,
+    klass: {
+        new (...args: any): T;
+    },
+    options: RegisterOptions<T> = {}
+) {
+    if (registry[name]) throw new Error(`${name} is already registered.`);
+    ((Object.defineProperty as any))(klass, '_classRegistryKey', {
+        value: name,
+        writeable: false
+    });
+    registry[name] = {
+        klass,
+        omit: options.omit as ReadonlyArray<string> || [],
+        shallow: options.shallow as ReadonlyArray<string> || []
+    };
+}
+
+register('Object', Object);
+register('TransferableGridIndex', TransferableGridIndex);
+
+register('Color', Color);
+register('Error', Error);
+register('AJAXError', AJAXError);
+register('ResolvedImage', ResolvedImage);
+
+register('StylePropertyFunction', StylePropertyFunction);
+register('StyleExpression', StyleExpression, {omit: ['_evaluator']});
+
+register('ZoomDependentExpression', ZoomDependentExpression);
+register('ZoomConstantExpression', ZoomConstantExpression);
+register('CompoundExpression', CompoundExpression, {omit: ['_evaluate']});
+for (const name in expressions) {
+    if ((expressions[name] as any)._classRegistryKey) continue;
+    register(`Expression_${name}`, expressions[name]);
+}
+
+function isArrayBuffer(value: any): value is ArrayBuffer {
+    return value && typeof ArrayBuffer !== 'undefined' &&
+           (value instanceof ArrayBuffer || (value.constructor && value.constructor.name === 'ArrayBuffer'));
+}
+
+function getClassRegistryKey(input: Object|SerializedObject): string {
+    const klass = (input.constructor as any);
+    return (input as SerializedObject).$name || klass._classRegistryKey;
+}
+
+function isRegistered(input: unknown): boolean {
+    if (input === null || typeof input !== 'object') {
+        return false;
+    }
+    const classRegistryKey = getClassRegistryKey(input);
+    if (classRegistryKey && classRegistryKey !== 'Object') {
+        return true;
+    }
+    return false;
+}
+
+function isSerializeHandledByBuiltin(input: unknown) {
+    return (!isRegistered(input) && (
+        input === null ||
+        input === undefined ||
+        typeof input === 'boolean' ||
+        typeof input === 'number' ||
+        typeof input === 'string' ||
+        input instanceof Boolean ||
+        input instanceof Number ||
+        input instanceof String ||
+        input instanceof Date ||
+        input instanceof RegExp ||
+        input instanceof Blob ||
+        input instanceof Error ||
+        isArrayBuffer(input) ||
+        isImageBitmap(input) ||
+        ArrayBuffer.isView(input) ||
+        input instanceof ImageData)
+    );
+}
+
+/**
+ * Serialize the given object for transfer to or from a web worker.
+ *
+ * For non-builtin types, recursively serialize each property (possibly
+ * omitting certain properties - see register()), and package the result along
+ * with the constructor's `name` so that the appropriate constructor can be
+ * looked up in `deserialize()`.
+ *
+ * If a `transferables` array is provided, add any transferable objects (i.e.,
+ * any ArrayBuffers or ArrayBuffer views) to the list. (If a copy is needed,
+ * this should happen in the client code, before using serialize().)
+ */
+export function serialize(input: unknown, transferables?: Array<Transferable> | null): Serialized {
+    if (isSerializeHandledByBuiltin(input)) {
+        if (isArrayBuffer(input) || isImageBitmap(input)) {
+            if (transferables) {
+                transferables.push(input);
+            }
+        }
+        if (ArrayBuffer.isView(input)) {
+            const view = input;
+            if (transferables) {
+                transferables.push(view.buffer);
+            }
+        }
+        if (input instanceof ImageData) {
+            if (transferables) {
+                transferables.push(input.data.buffer);
+            }
+        }
+        return input;
+    }
+
+    if (Array.isArray(input)) {
+        const serialized: Array<Serialized> = [];
+        for (const item of input) {
+            serialized.push(serialize(item, transferables));
+        }
+        return serialized;
+    }
+
+    if (typeof input !== 'object') {
+        throw new Error(`can't serialize object of type ${typeof input}`);
+    }
+    const classRegistryKey = getClassRegistryKey(input);
+    if (!classRegistryKey) {
+        throw new Error(`can't serialize object of unregistered class ${input.constructor.name}`);
+    }
+    if (!registry[classRegistryKey]) throw new Error(`${classRegistryKey} is not registered.`);
+    const {klass} = registry[classRegistryKey];
+    const properties: SerializedObject = klass.serialize ?
+        // (Temporary workaround) allow a class to provide static
+        // `serialize()` and `deserialize()` methods to bypass the generic
+        // approach.
+        // This temporary workaround lets us use the generic serialization
+        // approach for objects whose members include instances of dynamic
+        // StructArray types. Once we refactor StructArray to be static,
+        // we can remove this complexity.
+        (klass.serialize(input, transferables) as SerializedObject) : {};
+
+    if (!klass.serialize) {
+        for (const key in input) {
+            if (!input.hasOwnProperty(key)) continue; // eslint-disable-line no-prototype-builtins
+            if (registry[classRegistryKey].omit.indexOf(key) >= 0) continue;
+            const property = input[key];
+            properties[key] = registry[classRegistryKey].shallow.indexOf(key) >= 0 ?
+                property :
+                serialize(property, transferables);
+        }
+        if (input instanceof Error) {
+            properties.message = input.message;
+        }
+    } else {
+        if (transferables && properties === transferables[transferables.length - 1]) {
+            throw new Error('statically serialized object won\'t survive transfer of $name property');
+        }
+    }
+
+    if (properties.$name) {
+        throw new Error('$name property is reserved for worker serialization logic.');
+    }
+    if (classRegistryKey !== 'Object') {
+        properties.$name = classRegistryKey;
+    }
+
+    return properties;
+}
+
+export function deserialize(input: Serialized): unknown {
+    if (isSerializeHandledByBuiltin(input)) {
+        return input;
+    }
+
+    if (Array.isArray(input)) {
+        return input.map(deserialize);
+    }
+
+    if (typeof input !== 'object') {
+        throw new Error(`can't deserialize object of type ${typeof input}`);
+    }
+    const classRegistryKey = getClassRegistryKey(input) || 'Object';
+    if (!registry[classRegistryKey]) {
+        throw new Error(`can't deserialize unregistered class ${classRegistryKey}`);
+    }
+    const {klass} = registry[classRegistryKey];
+    if (!klass) {
+        throw new Error(`can't deserialize unregistered class ${classRegistryKey}`);
+    }
+
+    if (klass.deserialize) {
+        return klass.deserialize(input);
+    }
+
+    const result = Object.create(klass.prototype);
+
+    for (const key of Object.keys(input)) {
+        if (key === '$name') continue;
+        const value = (input as SerializedObject)[key];
+        result[key] = registry[classRegistryKey].shallow.indexOf(key) >= 0 ? value : deserialize(value);
+    }
+
+    return result;
+}

package/src/util/webp_supported.ts

@@ -0,0 +1,63 @@
+export const webpSupported = {
+    supported: false,
+    testSupport
+};
+
+let glForTesting: WebGLRenderingContext|WebGL2RenderingContext;
+let webpCheckComplete = false;
+let webpImgTest;
+let webpImgTestOnloadComplete = false;
+
+if (typeof document !== 'undefined') {
+    webpImgTest = document.createElement('img');
+    webpImgTest.onload = () => {
+        if (glForTesting) testWebpTextureUpload(glForTesting);
+        glForTesting = null;
+        webpImgTestOnloadComplete = true;
+    };
+    webpImgTest.onerror = () => {
+        webpCheckComplete = true;
+        glForTesting = null;
+    };
+    webpImgTest.src = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAQAAAAfQ//73v/+BiOh/AAA=';
+}
+
+function testSupport(gl: WebGLRenderingContext | WebGL2RenderingContext) {
+    if (webpCheckComplete || !webpImgTest) return;
+
+    // HTMLImageElement.complete is set when an image is done loading it's source
+    // regardless of whether the load was successful or not.
+    // It's possible for an error to set HTMLImageElement.complete to true which would trigger
+    // testWebpTextureUpload and mistakenly set exported.supported to true in browsers which don't support webp
+    // To avoid this, we set a flag in the image's onload handler and only call testWebpTextureUpload
+    // after a successful image load event.
+    if (webpImgTestOnloadComplete) {
+        testWebpTextureUpload(gl);
+    } else {
+        glForTesting = gl;
+
+    }
+}
+
+function testWebpTextureUpload(gl: WebGLRenderingContext|WebGL2RenderingContext) {
+    // Edge 18 supports WebP but not uploading a WebP image to a gl texture
+    // Test support for this before allowing WebP images.
+    // https://github.com/mapbox/mapbox-gl-js/issues/7671
+    const texture = gl.createTexture();
+    gl.bindTexture(gl.TEXTURE_2D, texture);
+
+    try {
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, webpImgTest);
+
+        // The error does not get triggered in Edge if the context is lost
+        if (gl.isContextLost()) return;
+
+        webpSupported.supported = true;
+    } catch (e) {
+        // Catch "Unspecified Error." in Edge 18.
+    }
+
+    gl.deleteTexture(texture);
+
+    webpCheckComplete = true;
+}