@mapcreator/sdk 0.0.0-opacity.0

package/README.md

@@ -0,0 +1,29 @@
+[Mapcreator](https://mapcreator.io/) JavaScript SDK. Renders Mapcreator projects on a [MapLibre](https://maplibre.org/) interactive map.
+
+## Installation
+
+```
+npm i --save @mapcreator/sdk
+```
+
+## Usage
+
+```javascript
+// Import scripts
+import { initMap } from '@mapcreator/sdk';
+
+// Import styles
+import '@mapcreator/sdk/dist/mapcreator-sdk.css';
+
+// Initialize the map
+const { map } = await initMap({
+  container: '<map container element or its id>',
+  job: '<interactive map id>',
+  accessToken: '<mapcreator access token>',
+});
+
+// map is now an instance of MapLibre GL JS:
+//
+// map.setZoom(10);
+// map.getZoom();
+```

package/dist/HighlightManager.d.ts

@@ -0,0 +1,23 @@
+import { Map } from '@mapcreator/maplibre-gl';
+import { PopupElement } from './Registry';
+export declare class HighlightManager {
+    private map;
+    private popupElements;
+    private markerLayerIds;
+    private resizeObserver?;
+    constructor(map: Map, popupElements: PopupElement[]);
+    highlight(popupElement: PopupElement | undefined): void;
+    private deselect;
+    private highlightGroupedMarker;
+    private fadeOtherMarkers;
+    private repositionMap;
+    private getElementBounds;
+    private flattenCoordinates;
+    private panToElement;
+    private visibleOnGlobe;
+    private lngLatToUnitVector;
+    private rotateVectorAroundAxis;
+    private rotateAroundZ;
+    private cross;
+    private normalize;
+}

package/dist/MCMap.d.ts

@@ -0,0 +1,26 @@
+import { Evented, Map as MapLibre, StyleSpecification } from '@mapcreator/maplibre-gl';
+import { JobObject } from './types/jobObject';
+import { SvgCache } from './utils/svgHelpers';
+import { LayerInfo, Svgs } from './types';
+type SdkEventType = {
+    playstart: VideoEvent;
+    playend: VideoEvent;
+    play: VideoEvent;
+};
+type VideoEvent = {
+    time: number;
+};
+export declare class MCMap extends Evented {
+    map: MapLibre;
+    private video;
+    constructor(map: MapLibre, jobObject: JobObject, svgs: Svgs, svgCache: SvgCache, mapstyle: StyleSpecification, overlays: Map<number, StyleSpecification>, layerInfo: LayerInfo);
+    on<T extends keyof SdkEventType>(type: T, listener: (e: SdkEventType[T]) => void): import('@mapcreator/maplibre-gl').Subscription;
+    once<T extends keyof SdkEventType>(type: T, listener: (e: SdkEventType[T]) => void): Promise<any> | this;
+    off<T extends keyof SdkEventType>(type: T, listener: (e: SdkEventType[T]) => void): this;
+    fire<T extends keyof SdkEventType>(type: T, payload: SdkEventType[T]): this;
+    play(): void;
+    pause(): void;
+    seekTo(time: number): void;
+    frames(): AsyncGenerator<ImageData, void, void>;
+}
+export {};

package/dist/PopupManager.d.ts

@@ -0,0 +1,44 @@
+import { Map as MapLibre, MapGeoJSONFeature, MapLayerMouseEvent, LngLatLike } from '@mapcreator/maplibre-gl';
+import { JobObject, PopupPosition } from './types/jobObject';
+import { PopupElement } from './Registry';
+import { Mode } from './types';
+export declare class PopupManager {
+    private map;
+    private popupPosition;
+    private mapContainer;
+    private popupContainer;
+    private feature;
+    private currentFeatureId;
+    private currentModelId;
+    private popupElements;
+    private language;
+    private promoteIdCache;
+    private publication;
+    private floatingPopup;
+    private registry;
+    private highlightManager;
+    private mode;
+    private restrictMapMovement;
+    private center;
+    constructor(map: MapLibre, mode: Mode);
+    setJobObject(jobObject: JobObject): void;
+    setParams(popupPosition: PopupPosition, language: string, restrictMapMovement: boolean, center: LngLatLike): void;
+    setPublication(publication: string | undefined): void;
+    setpopupElements(): void;
+    setHighlightManager(): void;
+    private onMouseMove;
+    private onClick;
+    getPopupElementFromFeature(feature: MapGeoJSONFeature): PopupElement | undefined;
+    getInteractiveFeature(e: MapLayerMouseEvent): MapGeoJSONFeature | undefined;
+    private addPopup;
+    private addFloatingPopup;
+    private getAnchor;
+    private hidePopup;
+    private getTemplate;
+    private htmlToElement;
+    private addPopupControls;
+    private fillDatalayerTemplate;
+    private getProperty;
+    private getVectorProperty;
+    private cyclePopups;
+}

package/dist/Registry.d.ts

@@ -0,0 +1,23 @@
+import { Position } from './types/geometry';
+import { JobObject, JobObjectArea, JobObjectCircle, JobObjectDot, JobObjectLine, JobObjectMarker, JobObjectPolygon, PopupMedia, JobObjectDataBindings } from './types/jobObject';
+import { LngLat, MapGeoJSONFeature } from '@mapcreator/maplibre-gl';
+type Model = JobObjectArea | JobObjectCircle | JobObjectDot | JobObjectLine | JobObjectMarker | JobObjectPolygon;
+export type PopupElement = {
+    groupId: string;
+    modelId: string;
+    popup: string;
+    lngLat?: LngLat;
+    center?: LngLat;
+    radius?: number;
+    anchorPoints?: Position[][] | Position[];
+    popupMedia: PopupMedia;
+    dataBindings: JobObjectDataBindings;
+};
+export declare class Registry {
+    private data;
+    private customGroupIds;
+    constructor(jobObject: JobObject);
+    getModel(feature: MapGeoJSONFeature): Model | undefined;
+    getPopupElements(): PopupElement[];
+}
+export {};

package/dist/Video.d.ts

@@ -0,0 +1,42 @@
+import { JobObject } from './types/jobObject';
+import { SvgCache } from './utils/svgHelpers';
+import { LayerInfo, Svgs } from './types';
+import { MCMap } from './MCMap';
+import { StyleSpecification } from '@mapcreator/maplibre-gl';
+export declare class Video {
+    private mcMap;
+    private cameraCurve;
+    private jobObject;
+    private svgs;
+    private svgCache;
+    private duration;
+    private mapstyle;
+    private overlays;
+    private layerInfo;
+    private playhead;
+    private playbackContext;
+    constructor(mcMap: MCMap, jobObject: JobObject, svgs: Svgs, svgCache: SvgCache, mapstyle: StyleSpecification, overlays: Map<number, StyleSpecification>, layerInfo: LayerInfo);
+    play(): void;
+    pause(): void;
+    seekTo(time: number): void;
+    frames(): AsyncGenerator<ImageData, void, void>;
+    private captureFrame;
+    private drawAdornments;
+    private playFrame;
+    private setCamera;
+    private applyAnimations;
+    /**
+     * Prepares map for any change during playback (camera movement or animation update):
+     *
+     * 1. Disables center clamping to ground for manual elevation control
+     * 2. Disables paint property transitions
+     *
+     * Initial state is restored 300ms later
+     */
+    private prepareForPlayback;
+    private restoreAfterPlayback;
+    private getGroupAnimations;
+    private getLayerOpacity;
+    private setLayerOpacity;
+    private resetLayerOpacity;
+}

package/dist/adornments/categoricalLegend.d.ts

@@ -0,0 +1,2 @@
+import { JobObjectManualLegend } from '../types/jobObject';
+export declare function getCategoricalLegendSvg(legend: JobObjectManualLegend, defaultFont: string, mapScale: number): string;

package/dist/adornments/connectedLegend.d.ts

@@ -0,0 +1,3 @@
+import { Map as MapLibre } from '@mapcreator/maplibre-gl';
+import { JobObject, JobObjectConnectedLegend } from '../types/jobObject';
+export declare function useConnectedLegend(legend: JobObjectConnectedLegend, jobObject: JobObject, map: MapLibre, vapiUrl: string, accessToken: string, mapScale: number): HTMLElement;

package/dist/adornments/copyright.d.ts

@@ -0,0 +1,3 @@
+import { Map } from '@mapcreator/maplibre-gl';
+import { JobObjectCopyright } from '../types/jobObject';
+export declare function useCopyright(copyright: JobObjectCopyright, map: Map, mapScale: number): HTMLElement;

package/dist/adornments/customAdornment.d.ts

@@ -0,0 +1,2 @@
+import { JobObjectCustomAdornment } from '../types/jobObject';
+export declare function useCustomAdornment(adornment: JobObjectCustomAdornment, mapScale: number): HTMLElement;

package/dist/adornments/heading.d.ts

@@ -0,0 +1,2 @@
+import { JobObjectHeading } from '../types/jobObject';
+export declare function useHeading(heading: JobObjectHeading, vapiUrl: string, accessToken: string, mapScale: number): HTMLElement;

package/dist/adornments/insetMap.d.ts

@@ -0,0 +1,3 @@
+import { Map } from '@mapcreator/maplibre-gl';
+import { JobObjectInsetMap } from '../types/jobObject';
+export declare function useInsetMap(insetMap: JobObjectInsetMap, map: Map, cdnUrl: string, mapScale: number): HTMLElement;

package/dist/adornments/manualLegend.d.ts

@@ -0,0 +1,2 @@
+import { JobObjectManualLegend } from '../types/jobObject';
+export declare function useManualLegend(legend: JobObjectManualLegend, vapiUrl: string, accessToken: string, mapScale: number): HTMLElement;

package/dist/adornments/northArrow.d.ts

@@ -0,0 +1,3 @@
+import { Map } from '@mapcreator/maplibre-gl';
+import { JobObjectNorthArrow } from '../types/jobObject';
+export declare function useNorthArrow(northArrow: JobObjectNorthArrow, map: Map, mapScale: number): HTMLElement;

package/dist/adornments/scalebar.d.ts

@@ -0,0 +1,3 @@
+import { Map } from '@mapcreator/maplibre-gl';
+import { JobObjectScalebar } from '../types/jobObject';
+export declare function useScalebar(scalebar: JobObjectScalebar, map: Map, mapScale: number): HTMLElement;

package/dist/constants/index.d.ts

@@ -0,0 +1,18 @@
+import { AdornmentPosition, PositionOffsets } from '../types/jobObject';
+import { SkySpecification, StyleLayer } from '@mapcreator/maplibre-gl';
+export declare const defaultSky: SkySpecification;
+type PositionConfig = {
+    x: 'left' | 'right' | 'center';
+    y: 'top' | 'bottom' | 'center';
+};
+export declare const defaultPositionOffsets: PositionOffsets;
+export declare const positionConfig: {
+    [position in AdornmentPosition]: PositionConfig;
+};
+export declare const defaultFov = 36.87;
+type OpacityConfig = {
+    props: string[];
+    defaultValue: number;
+};
+export declare const opacityConfigByType: Partial<Record<StyleLayer['type'], OpacityConfig>>;
+export {};

package/dist/controls/controls.d.ts

@@ -0,0 +1,7 @@
+export interface ButtonControl {
+    type: 'button';
+    className: string;
+    content: string;
+    onClick: () => void;
+}
+export declare function useButtonControl(props: ButtonControl): HTMLElement;

package/dist/controls/fullscreenControls.d.ts

@@ -0,0 +1,2 @@
+import { Map } from '@mapcreator/maplibre-gl';
+export declare function useFullScreenButton(map: Map): HTMLElement;

package/dist/controls/geocoderControl.d.ts

@@ -0,0 +1,33 @@
+import { Map } from '@mapcreator/maplibre-gl';
+export declare class GeocoderControl {
+    private map;
+    private mapContainer;
+    private container;
+    private control;
+    private input;
+    private dropdown;
+    private inputWrapper;
+    private button;
+    private isOpen;
+    private geocoder;
+    private suggestions;
+    private items;
+    private index;
+    private debounce?;
+    constructor(map: Map);
+    init(): HTMLElement;
+    private clickOutside;
+    private setMaxSizes;
+    private toggle;
+    private hide;
+    private clearDropdown;
+    private clearAll;
+    private updateVisibility;
+    private onInput;
+    private renderSuggestions;
+    private updateHighlight;
+    private onKeyDown;
+    private onMouseMove;
+    private goToSelection;
+    private adjustScroll;
+}

package/dist/controls/geolocationControls.d.ts

@@ -0,0 +1,2 @@
+import { Map } from '@mapcreator/maplibre-gl';
+export declare function useGeolocationButton(map: Map): HTMLElement;

package/dist/controls/refreshMapControls.d.ts

@@ -0,0 +1,3 @@
+import { InitialPositionInfo } from '../types';
+import { Map } from '@mapcreator/maplibre-gl';
+export declare function useRefreshButton(map: Map, initialPosition: InitialPositionInfo): HTMLElement;

package/dist/controls/webControls.d.ts

@@ -0,0 +1,4 @@
+import { JobObjectWebControls } from '../types/jobObject';
+import { InitialPositionInfo } from '../types';
+import { Map } from '@mapcreator/maplibre-gl';
+export declare function useWebControls(webControls: JobObjectWebControls, map: Map, initialPosition: InitialPositionInfo): HTMLElement;

package/dist/controls/zoomControls.d.ts

@@ -0,0 +1,3 @@
+import { Map } from '@mapcreator/maplibre-gl';
+export declare function useZoomInButton(map: Map): HTMLElement;
+export declare function useZoomOutButton(map: Map): HTMLElement;

package/dist/i18n.d.ts

@@ -0,0 +1,56 @@
+declare const locales: {
+    da_DK: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    de_DE: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    en_GB: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    es_ES: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    fr_FR: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    it_IT: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+    nl_NL: {
+        search: string;
+        videoAlert: string;
+        mobileHelpText: string;
+        windowsHelpText: string;
+        macHelpText: string;
+    };
+};
+type Locale = keyof typeof locales;
+type Key = keyof typeof locales.en_GB;
+export declare const locale: Locale;
+export declare function t(key: Key): string;
+export {};

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+import { setRTLTextPlugin } from '@mapcreator/maplibre-gl';
+import { initMap } from './initMap';
+import { MCMap } from './MCMap';
+export { setRTLTextPlugin, initMap, type MCMap };

package/dist/initMap.d.ts

@@ -0,0 +1,9 @@
+import { MCMap } from './MCMap';
+import { Env, JobObjectAugmented, Mode } from './types';
+export declare function initMap(options: {
+    container: HTMLElement | string;
+    job: JobObjectAugmented | string;
+    accessToken: string;
+    mode?: Mode | undefined;
+    env?: Env | undefined;
+}): Promise<MCMap>;

package/dist/locales/da_DK/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Search",
+  "videoAlert": "The video will only work when you publish the map",
+  "mobileHelpText": "Use two fingers to move the map",
+  "windowsHelpText": "Use Ctrl + scroll to zoom the map",
+  "macHelpText": "Use ⌘ + scroll to zoom the map"
+}
+;
+
+export default _default;

package/dist/locales/de_DE/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Suche",
+  "videoAlert": "Das Video ist in der veröffentlichten Karte sichtbar.",
+  "mobileHelpText": "Verwenden Sie zwei Finger um die Karte zu bewegen",
+  "windowsHelpText": "Verwenden Sie Strg + Scroll um in der Karte zu zoomen",
+  "macHelpText": "Verwenden Sie ⌘ + Scroll um in der Karte zu zoomen"
+}
+;
+
+export default _default;

package/dist/locales/en_GB/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Search",
+  "videoAlert": "The video will only work when you publish the map",
+  "mobileHelpText": "Use two fingers to move the map",
+  "windowsHelpText": "Use Ctrl + scroll to zoom the map",
+  "macHelpText": "Use ⌘ + scroll to zoom the map"
+}
+;
+
+export default _default;

package/dist/locales/es_ES/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Buscar",
+  "videoAlert": "The video will only work when you publish the map",
+  "mobileHelpText": "Use dos dedos para mover el mapa",
+  "windowsHelpText": "Use Ctrl + desplazamiento para hacer zoom en el mapa",
+  "macHelpText": "Use ⌘ + desplazamiento para hacer zoom en el mapa"
+}
+;
+
+export default _default;

package/dist/locales/fr_FR/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Rechercher",
+  "videoAlert": "Votre vidéo sera diffusée sur la carte publiée",
+  "mobileHelpText": "Utilisez deux doigts pour déplacer la carte",
+  "windowsHelpText": "Utilisez Ctrl + défilement pour zoomer sur la carte",
+  "macHelpText": "Utilisez ⌘ + défilement pour zoomer sur la carte"
+}
+;
+
+export default _default;

package/dist/locales/it_IT/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Cercare",
+  "videoAlert": "The video will only work when you publish the map",
+  "mobileHelpText": "Usa due dita per muovere la mappa",
+  "windowsHelpText": "Usa Ctrl + Scroll per ingrandire la mappa",
+  "macHelpText": "Usa ⌘ + Scroll per ingrandire la mappa"
+}
+;
+
+export default _default;

package/dist/locales/nl_NL/strings.json.d.ts

@@ -0,0 +1,10 @@
+declare const _default: {
+  "search": "Zoeken",
+  "videoAlert": "The video will only work when you publish the map",
+  "mobileHelpText": "Gebruik twee vingers om de kaart te bewegen",
+  "windowsHelpText": "Gebruik Ctrl + Scroll om de kaart te zoomen",
+  "macHelpText": "Gebruik ⌘ + Scroll om de kaart te zoomen"
+}
+;
+
+export default _default;