@mappedin/mappedin-js 5.11.0 → 5.12.0

package/lib/esm/renderer/index.d.ts

@@ -1,9 +1,9 @@
 // Generated by dts-bundle v0.7.3
 // Dependencies for this module:
+//   ../@mappedin/mvf
 //   ../three
 //   ../@tweenjs/tween.js
 //   ../minisearch
-//   ../@mappedin/mvf
 //   ../stats.js
 
 declare module '@mappedin/mappedin-js' {
@@ -663,6 +663,7 @@ declare module '@mappedin/mappedin-js/get-venue' {
     export type { TLocationType, TNode, TImage, TLogo, TGalleryImage, TPhone, TSocial, TColor, TVortex, TPicture, TOpeningHours, TSiblingGroup, TState, TCategory, TEvent, TGeoReference, TMap, TMapGroup, TBuilding, TLocation, TPolygon, TPolygonRanking, TVenue, TMappedinAPI, } from '@mappedin/mappedin-js/get-venue/Mappedin.API.types';
     export type { TGetVenueOptions } from '@mappedin/mappedin-js/get-venue/Mappedin.types';
     import { MAP_RENDER_MODE } from '@mappedin/mappedin-js/get-venue/Mappedin.types';
+    import { ParsedMVF } from '@mappedin/mvf';
     export type TShowVenueOptions = {
             /**
                 * Sets the initial background color of the map, including while loading.
@@ -748,7 +749,7 @@ declare module '@mappedin/mappedin-js/get-venue' {
     /**
         * @internal
         */
-    export function downloadVenueBundleMVF(options: TGetVenueBundleOptions): Promise<unknown>;
+    export function downloadVenueBundleMVF(options: TGetVenueBundleOptions): Promise<Uint8Array>;
     /**
         * Returns a {@link Mappedin} object hydrated with JSON data.
         * @param {string|Object} mappedinSerializableData A JSON string or object representing a venue.
@@ -756,6 +757,11 @@ declare module '@mappedin/mappedin-js/get-venue' {
         * @returns {Mappedin} A new Mappedin object with data from the mappedinSerializableData parameter.
         */
     export function hydrateVenue(mappedinSerializableData: any, shouldPopulateBundledImagesAsBlobs?: boolean): Promise<Mappedin>;
+    /**
+        * @internal
+        * Returns a {@link Mappedin} object hydrated with MVF data.
+        */
+    export function hydrateVenueMVF(mvfData: ParsedMVF): Promise<Mappedin>;
 }
 
 declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.BlueDot/Mappedin.BlueDot.core' {
@@ -1257,10 +1263,20 @@ declare module '@mappedin/mappedin-js/renderer/MapView.types' {
                 */
             firstMap?: MappedinMap | string;
             /**
+                * @experimental
+                *
                 * Multi-buffer rendering should improve performance but may cause issues on older GPUs/browsers
-                * @default true
+                * @default false
                 */
             multiBufferRendering?: boolean;
+            /**
+                * @experimental
+                *
+                * Journey path will be visible through other objects. Note: this is on by default, but requires the
+                * `multiBufferRendering` option (which is off by default) to be turned on.
+                * @default true
+                */
+            xRayPath?: boolean;
             /**
                 * True if the `opacity` argument to `setBackgroundColor` should be considered.
                 * @default true
@@ -2830,6 +2846,10 @@ declare module '@mappedin/mappedin-js/renderer/internal/outdoor-context/Mappedin
     export type TTileManagerOptions = {
             tileRenderMode?: TILE_RENDER_MODES;
             provider: IOutdoorContextProvider;
+            /**
+                * How many times bigger the bounding box should be than the map's longest side
+                */
+            boundingBoxMultiplier?: number;
     };
     export class TileManager {
             #private;
@@ -2847,6 +2867,9 @@ declare module '@mappedin/mappedin-js/renderer/internal/outdoor-context/Mappedin
             renderVisibleTiles: () => void;
             _renderVisibleTiles(): void;
             cachedZoomLevel: number;
+            visible: boolean;
+            fadeOut(): Promise<any>;
+            fadeIn(): Promise<any>;
             fetchTiles(): void;
             zoomLevelToAltitudeMap: number[][];
             plane: Object3D;
@@ -3336,7 +3359,6 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin.types' {
 
 declare module '@mappedin/mappedin-js/get-venue/Mappedin' {
     import { Navigator } from '@mappedin/mappedin-js/navigator';
-    import { MVFData } from '@mappedin/mappedin-js/get-venue/Mappedin.MVF.types';
     import type { TGetVenueOptions, TGetVenueOptionsInternal } from '@mappedin/mappedin-js/get-venue/Mappedin.types';
     import { MappedinCategory } from '@mappedin/mappedin-js/get-venue/MappedinCategory';
     import { MappedinEvent } from '@mappedin/mappedin-js/get-venue/MappedinEvent';
@@ -3352,6 +3374,7 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin' {
     import { MappedinVenue } from '@mappedin/mappedin-js/get-venue/MappedinVenue';
     import { MappedinVortex } from '@mappedin/mappedin-js/get-venue/MappedinVortex';
     import { IAnalytics } from '@mappedin/mappedin-js/get-venue/Mappedin.CustomerAnalytics';
+    import { ParsedMVF } from '@mappedin/mvf';
     export const defaultOptions: TGetVenueOptionsInternal & TGetVenueOptions;
     export enum MappedinCollectionType {
             CATEGORY = "categories",
@@ -3587,7 +3610,7 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin' {
                 * @hidden
                 * @internal
                 */
-            hydrateFromMVF(mvfData: MVFData): Promise<undefined>;
+            hydrateFromMVF(mvfData: ParsedMVF): Promise<undefined>;
             /**
                 *
                 * @experimental Hydrate the Mappedin instance using a response from either {@link Mappedin.toString}, {@link getVenueBundle} or by downloading the bundle manually
@@ -5050,6 +5073,7 @@ declare module '@mappedin/mappedin-js/renderer/internal' {
     export { default as MapObject } from '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject';
     export { default as CAMERA_LAYER } from '@mappedin/mappedin-js/renderer/internal/Mappedin.CameraLayers';
     export { default as AssetManager } from '@mappedin/mappedin-js/renderer/internal/Mappedin.AssetManager';
+    export { BundleAssetManager } from '@mappedin/mappedin-js/renderer/bundle-asset-manager';
     /**
         * Internal Events and Payloads
         */
@@ -6017,26 +6041,6 @@ declare module '@mappedin/mappedin-js/renderer/private/Core.interface' {
     }
 }
 
-declare module '@mappedin/mappedin-js/get-venue/Mappedin.MVF.types' {
-    import { ManifestCollection, NodeCollection, ObstructionCollection, SpaceCollection, Connections, Maps, EntranceCollection, MapStacks, StyleCollection } from '@mappedin/mvf';
-    export type WithIDs<T> = Map<string, T>;
-    /**
-      * The entire data collection for an MVF, in a single JSON collection.
-      *
-      */
-    export type MVFData = {
-        obstruction: WithIDs<ObstructionCollection>;
-        space: WithIDs<SpaceCollection>;
-        node: WithIDs<NodeCollection>;
-        entrance: WithIDs<EntranceCollection>;
-        connection: Connections;
-        map: Maps;
-        mapstack: MapStacks;
-        manifest: ManifestCollection;
-        style: StyleCollection;
-    };
-}
-
 declare module '@mappedin/mappedin-js/get-venue/MappedinLocationRankings' {
     import type { Mappedin } from '@mappedin/mappedin-js/get-venue/Mappedin';
     import type { TLocation } from '@mappedin/mappedin-js/get-venue/Mappedin.API.types';
@@ -6629,8 +6633,8 @@ declare module '@mappedin/mappedin-js/get-venue/Mappedin.TaskScheduler' {
 
 declare module '@mappedin/mappedin-js/renderer/MapView.SceneManager' {
     import { MappedinMap } from '@mappedin/mappedin-js/get-venue';
-    import type { ICore, TCameraTransform, TCameraAnimationOptions } from '@mappedin/mappedin-js/renderer/internal';
-    import { MapViewScene } from '@mappedin/mappedin-js/renderer/internal';
+    import type { ICore, TCameraAnimationOptions, TFocusOnCameraOptions, TCameraTargets } from '@mappedin/mappedin-js/renderer/internal';
+    import { MapObject, MapViewScene } from '@mappedin/mappedin-js/renderer/internal';
     export type TSceneTransitionOptions = {
             /**
                 * Map to set as active during the transition. This will decide where the camera will be positioned, as well as which
@@ -6638,11 +6642,6 @@ declare module '@mappedin/mappedin-js/renderer/MapView.SceneManager' {
                 */
             activeMap?: MappedinMap;
             verticalDistanceBetweenMaps?: number;
-            /**
-                * Camera options to use when transitioning to the new scene
-                */
-            cameraTransform?: TCameraTransform;
-            cameraAnimationOptions?: TCameraAnimationOptions;
             /**
                 * Whether to auto focus on the active map or leave the camera where it is.
                 * For single building venues, this should look the same way it did with MapManager
@@ -6651,10 +6650,22 @@ declare module '@mappedin/mappedin-js/renderer/MapView.SceneManager' {
                 * @default true
                 */
             autoFocusOnActiveMap?: boolean;
+            /**
+                * Where to focus the camera during transition to Scene. Will focus to fit the map if not provided.
+                * Currently, will discard any targets that are not on the active map.
+                */
+            focusOn?: {
+                    targets?: TCameraTargets;
+                    options?: TFocusOnCameraOptions & TCameraAnimationOptions;
+            };
     };
     class SceneManager {
             #private;
             currentScene: MapViewScene;
+            /**
+                * MapObjects that have been loaded and positioned in the scene
+                */
+            processedMapObjects: Set<MapObject>;
             constructor(core: ICore, startingScene: MapViewScene);
             get currentMap(): MappedinMap;
             renderGrid(): void;
@@ -6711,6 +6722,7 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject' {
             labels: Set<any>;
             tooltips: Set<any>;
             markers: Set<any>;
+            box: any;
             textObjects: any[];
             labelBatchCreator: null;
             imagesToFlip: any[];
@@ -6734,6 +6746,45 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.MapObject' {
             _objLoaded(object: any): any;
             _objLoadedMerged(object: any): Promise<any>;
             enableImageFlipping(polygonId: any, rotation: any): void;
+            fadeIn({ duration, delay, easing, onStart, onUpdate, onComplete, }: {
+                    duration?: number | undefined;
+                    delay?: number | undefined;
+                    easing?: any;
+                    onStart?: (() => void) | undefined;
+                    onUpdate?: (() => void) | undefined;
+                    onComplete?: (() => void) | undefined;
+            }): {
+                    start(core: any): Promise<any>;
+            }[];
+            fadeOut({ duration, delay, easing, onStart, onUpdate, onComplete, }: {
+                    duration?: number | undefined;
+                    delay?: number | undefined;
+                    easing?: any;
+                    onStart?: (() => void) | undefined;
+                    onUpdate?: (() => void) | undefined;
+                    onComplete?: (() => void) | undefined;
+            }): {
+                    start(core: any): Promise<any>;
+            }[];
+            fade({ direction, duration, delay, easing, onStart, onUpdate, onComplete, }: {
+                    direction?: string | undefined;
+                    duration?: number | undefined;
+                    delay?: number | undefined;
+                    easing?: any;
+                    onStart?: (() => void) | undefined;
+                    onUpdate?: (() => void) | undefined;
+                    onComplete?: (() => void) | undefined;
+            }): {
+                    start(core: any): Promise<any>;
+            }[];
+            /**
+                * Sets the opacity of all children (for now) of the map object
+                */
+            setIndoorGeometryOpacity(opacity: any): void;
+            /**
+                * Resets the transparent and opacity values of all children (for now) of the map object
+                */
+            resetIndoorGeometryOpacity(): void;
             elements: any;
             boundingBox: {
                     min: any;
@@ -7664,32 +7715,48 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.HTMLCollider' {
 
 declare module '@mappedin/mappedin-js/renderer/MapView.Scene' {
     import { MappedinMap } from '@mappedin/mappedin-js/get-venue';
-    import type { ICore, TSceneTransitionOptions } from '@mappedin/mappedin-js/renderer/internal';
-    import { MapObject } from '@mappedin/mappedin-js/renderer/internal';
-    export function getPanBoundsForObject(mapObject: MapObject, currentPanBounds: any): {
-        min: any;
-        max: any;
-        margin: any;
-        radius: any;
-        center: any;
-    };
+    import type { ICore, SceneManager, TSceneTransitionOptions } from '@mappedin/mappedin-js/renderer/internal';
+    import { MapObject, CAMERA_EASING_MODE } from '@mappedin/mappedin-js/renderer/internal';
+    export const AUTO_FOCUS_DURATION = 500;
+    export const AUTO_FOCUS_EASING = CAMERA_EASING_MODE.EASE_OUT;
+    export const STARTING_TILT = 0.6;
+    export const STARTING_ROTATION: undefined;
     class MapViewScene {
-        #private;
-        maps: MappedinMap[];
-        object: any;
-        currentMap: MappedinMap;
-        mapObjects: Map<MappedinMap['id'], MapObject>;
-        constructor(maps: MappedinMap[], core: ICore);
-        /**
-          * Determine each maps position and rotation relative to the refernce map
-          */
-        determineMapPositionAndRotation(map: MappedinMap): {
-            position: any[];
-            scale: number[];
-            rotation: number[];
-        };
-        /** Render scene */
-        render(map: MappedinMap, transitionOptions?: TSceneTransitionOptions, isStartingScene?: boolean): Promise<void>;
+            #private;
+            maps: MappedinMap[];
+            mapObjectsArray: MapObject[];
+            transitionOptions: TSceneTransitionOptions | undefined;
+            object: any;
+            verticalPaths: any;
+            currentMap: MappedinMap;
+            mapObjects: Map<MappedinMap['id'], MapObject>;
+            constructor(maps: MappedinMap[], core: ICore);
+            get mapObjectsByMapGroup(): {
+                    [x: string]: MapObject[];
+            };
+            /**
+                * Determine each maps position and rotation relative to the refernce map
+                */
+            determineMapPositionAndRotation(map: MappedinMap): {
+                    position: any[];
+                    scale: number[];
+                    rotation: number[];
+            };
+            /**
+                * Convenience function to initialize scene (for stacked maps)
+                */
+            prepare(sceneManager: SceneManager, transitionOptions?: TSceneTransitionOptions): Promise<void>;
+            /**
+                * Override this method if works need to be done when the window is resized
+                */
+            resize(): void;
+            focusOnCurrentMap(transitionOptions?: TSceneTransitionOptions, isStartingScene?: boolean): Promise<unknown>;
+            preRender(transitionOptions?: TSceneTransitionOptions): Promise<Promise<MapObject>[]>;
+            /**
+                * Override this method when unmounting a scene
+                */
+            unmount(): void;
+            postRender(): void;
     }
     export default MapViewScene;
 }
@@ -7763,7 +7830,7 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.Element' {
         static imagesLoadingInProgress: Map<string, Promise<[any, any]>>;
         _addImage(polygon: MappedinPolygon, mapClass: MappedinMap): void;
         static _normalizeColor(color: any): number;
-        static _getMaterial(color: string, opacity: number): any;
+        static _getMaterial(color: string, opacity: number, map: MappedinMap['id']): any;
         static _clip(vertices: any, offset: any): any;
     }
     export default Element;
@@ -8957,7 +9024,7 @@ let CameraControls = function (camera, canvas, scene, core) {
          *
          * @return {Mappedin.Tween} The tween being used, if you want to do anything to control it manually. Do not overide it's events.
          */
-        this.animateCamera = function (target, duration, curve, callback, options) {
+        this.animateCamera = function (target, duration, curve, callback, cancelledCallback, options) {
                 const _options = { mode: CAMERA_CONTROL_OPTIONS.cancel, ...options };
                 let tweenStart = {};
                 let tweenEnd = {};
@@ -9009,7 +9076,7 @@ let CameraControls = function (camera, canvas, scene, core) {
                 }
                 const zooming = tweenStart.zoom !== tweenEnd.zoom;
                 const rotating = tweenStart.rotation !== tweenEnd.rotation;
-                const tilting = tweenStart.tilting !== tweenEnd.tilting;
+                const tilting = tweenStart.tilt !== tweenEnd.tilt;
                 var tween = new TWEEN.Tween(tweenStart)
                         .to(tweenEnd, process.env.TESTING ? 0 : duration)
                         .onUpdate(function (between) {
@@ -9061,6 +9128,9 @@ let CameraControls = function (camera, canvas, scene, core) {
                         }
                         else {
                                 completeTween(lastTween);
+                                if (typeof cancelledCallback === 'function') {
+                                        cancelledCallback();
+                                }
                                 lastTween = null;
                         }
                 }
@@ -9787,7 +9857,7 @@ let CameraControls = function (camera, canvas, scene, core) {
 };
 export default CameraControls;
 
-import { Color, DepthTexture, Mesh, Vector2, NearestFilter, OrthographicCamera, PlaneBufferGeometry, RGBAFormat, Scene, ShaderMaterial, UnsignedIntType, WebGLRenderTarget, WebGL1Renderer, WebGLRenderer, DepthStencilFormat, sRGBEncoding, } from 'three';
+import { Color, DepthTexture, Mesh, Vector2, NearestFilter, OrthographicCamera, PlaneBufferGeometry, RGBAFormat, Scene, ShaderMaterial, UnsignedIntType, WebGLRenderTarget, WebGL1Renderer, WebGLRenderer, sRGBEncoding, } from 'three';
 import { CAMERA_LAYER, RENDER } from '@mappedin/mappedin-js/renderer/internal';
 import CompositeVertexShader from '@mappedin/mappedin-js/renderer/internal/shaders/Mappedin.Composite.Vertex.glsl';
 import CompositeFragmentShader from '@mappedin/mappedin-js/renderer/internal/shaders/Mappedin.Composite.Fragment.glsl';
@@ -9820,6 +9890,8 @@ export default class Renderer {
             *		The color that will be displayed behind the scene
             *	@param [options.backgroundAlpha=1.0] {number}
             *		The opacity of the background color
+            * 	@param [options.xRayPath=true] {boolean}
+            * 		If true, journey path will be visible through other objects
             *	@param [options.onWebGLContextCreationError=null] {function}
             *		A callback that will be triggered if WebGL context creation fails
             *	@param [options.onWebGLContextLost=null] {function}
@@ -9832,9 +9904,6 @@ export default class Renderer {
         constructor(renderOptions) {
                 renderOptions.multiBufferRendering = renderOptions.multiBufferRendering || false;
                 this.contextLost = false;
-                this.implementation = renderOptions.multiBufferRendering
-                        ? new MultiBufferRenderer(renderOptions)
-                        : new SingleBufferRenderer(renderOptions);
                 this.implementation = this.getRenderer(renderOptions);
                 this.onWebGLContextCreationError = renderOptions.onWebGLContextCreationError;
                 this.onWebGLContextLost = renderOptions.onWebGLContextLost;
@@ -10155,7 +10224,6 @@ class MultiBufferRenderer {
                 try {
                         const options = {
                                 alpha: renderOptions.alpha || false,
-                                antialias: false,
                                 stencil: true,
                                 outputEncoding: sRGBEncoding,
                                 powerPreference: 'high-performance',
@@ -10168,9 +10236,14 @@ class MultiBufferRenderer {
                                 renderOptions.onWebGLRendererError(e);
                         }
                 }
+                this.journeyOpacity = renderOptions.xRayPath ? 0.3 : 0.0;
                 this.backgroundColor = new Color();
                 this.backgroundAlpha = 1.0;
                 this.mapboxOutdoorContext = null;
+                // Antialiasing for WebGLRenderTargets is done through the samples option
+                // Note: this only works for WebGL 2
+                // TODO: For some reason this is breaking path opacity but since antialiasing only affects DPI 1 monitors, we'll just turn it off for multi-buffer
+                const samples = 0; // renderOptions.antialias ? 4 : 0;
                 // The render target (color and depth textures) that will be used to
                 // store the static scene, to composite it with the animated scene.
                 this.staticSceneRenderTarget = new WebGLRenderTarget(this.renderer.width, this.renderer.height);
@@ -10180,9 +10253,9 @@ class MultiBufferRenderer {
                 this.staticSceneRenderTarget.texture.generateMipmaps = false;
                 this.staticSceneRenderTarget.stencilBuffer = true;
                 this.staticSceneRenderTarget.depthBuffer = true;
-                this.staticSceneRenderTarget.depthTexture = new DepthTexture();
+                this.staticSceneRenderTarget.depthTexture = new DepthTexture(this.renderer.width, this.renderer.height);
                 this.staticSceneRenderTarget.depthTexture.type = UnsignedIntType;
-                this.staticSceneRenderTarget.depthTexture.format = DepthStencilFormat;
+                this.staticSceneRenderTarget.samples = samples;
                 // The render target that will be used to store the dynamic scene,
                 // re-rendered once per frame while animated elements exist in the
                 // 3D scene (e.g., paths.)
@@ -10194,9 +10267,9 @@ class MultiBufferRenderer {
                 this.animatedSceneRenderTarget.texture.generateMipmaps = false;
                 this.animatedSceneRenderTarget.stencilBuffer = true;
                 this.animatedSceneRenderTarget.depthBuffer = true;
-                this.animatedSceneRenderTarget.depthTexture = new DepthTexture();
+                this.animatedSceneRenderTarget.depthTexture = new DepthTexture(this.renderer.width, this.renderer.height);
                 this.animatedSceneRenderTarget.depthTexture.type = UnsignedIntType;
-                this.animatedSceneRenderTarget.depthTexture.format = DepthStencilFormat;
+                this.animatedSceneRenderTarget.samples = samples;
                 // The render target that will be used to store the scene whose elements
                 // are always drawn on top of everything else. Rendering is done once per
                 // frame while such elements exist in the 3D scene, just like the animated scene target.
@@ -10213,10 +10286,14 @@ class MultiBufferRenderer {
                 this.alwaysOnTopSceneRenderTarget.texture.generateMipmaps = false;
                 this.alwaysOnTopSceneRenderTarget.stencilBuffer = true;
                 this.alwaysOnTopSceneRenderTarget.depthBuffer = true;
-                this.alwaysOnTopSceneRenderTarget.depthTexture = new DepthTexture();
+                this.alwaysOnTopSceneRenderTarget.depthTexture = new DepthTexture(this.renderer.width, this.renderer.height);
                 this.alwaysOnTopSceneRenderTarget.depthTexture.type = UnsignedIntType;
-                this.alwaysOnTopSceneRenderTarget.depthTexture.format = DepthStencilFormat;
+                this.alwaysOnTopSceneRenderTarget.samples = samples;
                 this.compositeUniforms = {
+                        animatedColorOpacity: {
+                                type: 'f',
+                                value: this.journeyOpacity,
+                        },
                         staticSceneColorTexture: {
                                 type: 't',
                                 value: this.staticSceneRenderTarget.texture,
@@ -10531,6 +10608,18 @@ declare module '@mappedin/mappedin-js/renderer/internal/utils' {
     export function isObject(item: any): any;
     export function cyrb53(str: any, seed?: number): number;
     export function addMarginMultiplierToBoundingBox(bbox: any, multiplier: any): any;
+    export function tweenPromise({ from, to, duration, easing, delay, onUpdate, onStart, onComplete, }: {
+            from: any;
+            to: any;
+            duration?: number | undefined;
+            easing?: any;
+            delay?: number | undefined;
+            onUpdate?: ((_: any) => void) | undefined;
+            onStart?: (() => void) | undefined;
+            onComplete?: (() => void) | undefined;
+    }): {
+            start(core: any): Promise<any>;
+    };
     export function getPrimaryLocationForPolygon(polygon: any, venue: any): any;
     export function determineStartingMap(venue: any, options: any): any;
 }
@@ -11240,73 +11329,6 @@ declare module '@mappedin/mappedin-js/navigator/interfaces/ILocation' {
 
 
 
-precision mediump float;
-
-uniform sampler2D textureLabel;
-
-varying vec2 vUV;
-varying vec3 vColor;
-
-void main() {
-    gl_FragColor = texture2D(textureLabel, vUV);
-    gl_FragColor.rgb = vColor;
-}
-
-attribute vec2 position;
-attribute vec3 origin;
-attribute vec2 size;
-attribute float rotation;
-attribute vec4 uv;
-attribute vec3 color;
-
-uniform mat4 projectionMatrix;
-uniform mat4 viewMatrix;
-uniform mat4 modelMatrix;
-
-varying vec2 vUV;
-varying vec3 vColor;
-
-void main() {
-    vec4 mapDirectionVector = vec4(0, 1, 0, 0) * viewMatrix * modelMatrix;
-    float mapDirection = atan(mapDirectionVector.y, mapDirectionVector.x);
-
-    float cosRotation = cos(rotation);
-    float sinRotation = sin(rotation);
-
-    mat4 rotationMatrix = mat4(
-        vec4(cosRotation, -sinRotation, 0.0, 0.0),
-        vec4(sinRotation, cosRotation, 0.0, 0.0),
-        vec4(0.0, 0.0, 1.0, 0.0),
-        vec4(0.0, 0.0, 0.0, 1.0)
-    );
-
-    mat4 translate = mat4(
-        vec4(1, 0, 0, 0),
-        vec4(0, 1, 0, 0),
-        vec4(0, 0, 1, 0),
-        vec4(origin, 1)
-    );
-
-    gl_Position = projectionMatrix *
-                  viewMatrix *
-                  modelMatrix *
-                  translate *
-                  rotationMatrix *
-                  (vec4(position * size - vec2(0, size.y / 2.0), 0, 1));
-
-
-    vec2 uvStart = uv.xy;
-    vec2 uvSize = uv.zw;
-
-    if (sin(mapDirection + rotation) > 0.0) {
-        vUV = position * uvSize + vec2(uvStart.x, uvStart.y - uvSize.y);
-    } else {
-        vUV = (vec2(1, 1) - position) * uvSize + vec2(uvStart.x, uvStart.y - uvSize.y);		
-    }
-
-    vColor = color;
-}
-
 declare module '@mappedin/mappedin-js/renderer/internal/quad-tree' {
     export function contains(rect1: Rectangle, rect2: Rectangle): boolean;
     export function intersects(rect1: Rectangle, rect2: Rectangle): boolean;
@@ -11455,51 +11477,3 @@ declare module '@mappedin/mappedin-js/renderer/internal/Mappedin.MultiFloorView'
     }
 }
 
-varying vec2 vUv;
-
-void main() {
-    vUv = uv;
-    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
-}
-
-varying vec2 vUv;
-uniform sampler2D staticSceneColorTexture;
-uniform sampler2D staticSceneDepthTexture;
-uniform sampler2D animatedSceneColorTexture;
-uniform sampler2D animatedSceneDepthTexture;
-uniform sampler2D alwaysOnTopSceneColorTexture;
-
-vec4 alphaBlend(vec4 background, vec4 foreground) {
-    vec3 resultColor = (
-        foreground.rgb * foreground.a +
-        background.rgb * background.a * (1.0 - foreground.a)
-    );
-    float resultAlpha = foreground.a + background.a * (1.0 - foreground.a);
-    return vec4(resultColor / resultAlpha, resultAlpha);
-}
-
-vec4 alphaBlendPremultipliedAlpha(vec4 background, vec4 foreground) {
-    return foreground + (background * (1.0 - foreground.a));
-}
-
-void main() {
-    float staticDepth = texture2D(staticSceneDepthTexture, vUv).r;
-    float animatedDepth = texture2D(animatedSceneDepthTexture, vUv).r;
-
-    vec4 staticColor = texture2D(staticSceneColorTexture, vUv).rgba;
-    vec4 animatedColor = texture2D(animatedSceneColorTexture, vUv).rgba;
-
-    if (staticDepth < animatedDepth) {
-        // 19/06/10 Terence Dickson
-        // Spoiler alert! This is to help prepare for CE-1352, where alpha
-        // may be partial instead of zero. Not implementing that as part of
-        // this PR, however.
-        animatedColor.a *= 0.0;
-    }
-
-    vec4 lowerColor = alphaBlend(staticColor, animatedColor);
-    vec4 alwaysOnTopColor = texture2D(alwaysOnTopSceneColorTexture, vUv).rgba;
-
-    gl_FragColor = alphaBlendPremultipliedAlpha(lowerColor, alwaysOnTopColor);
-}
-