Modified scatter to get access to the Resize event.

dist/iwmlib.js

@@ -2764,7 +2764,6 @@
                 if (found != null) {
                     this.interaction.addTarget(key, found);
                 }
-                console.log(this.target);
             }
             let size = this.interaction.current.size;
             let limit = this.logInteractionsAbove;
@@ -3467,7 +3466,6 @@
         }
 
         close() {
-            console.log('SCATTER WAS CLOSED!');
             this._callCloseCallbacks();
             this._removeCallbacks();
             this._removeSelfFromScatterContainer();
@@ -3493,6 +3491,7 @@
 
         gesture(interaction) {
             let delta = interaction.delta();
+
             if (delta != null) {
                 this.addVelocity(delta);
                 let rotate = delta.rotate;

dist/iwmlib.pixi.js

@@ -6309,7 +6309,6 @@
                 if (found != null) {
                     this.interaction.addTarget(key, found);
                 }
-                console.log(this.target);
             }
             let size = this.interaction.current.size;
             let limit = this.logInteractionsAbove;
@@ -7003,7 +7002,6 @@
         }
 
         close() {
-            console.log('SCATTER WAS CLOSED!');
             this._callCloseCallbacks();
             this._removeCallbacks();
             this._removeSelfFromScatterContainer();
@@ -7029,6 +7027,7 @@
 
         gesture(interaction) {
             let delta = interaction.delta();
+
             if (delta != null) {
                 this.addVelocity(delta);
                 let rotate = delta.rotate;
@@ -11737,6 +11736,7 @@
                 rotation = null,
                 overdoScaling = 1.5,
                 onTransform = null,
+                onResize,
                 onThrowFinished = null
             } = {}
         ) {
@@ -11762,6 +11762,7 @@
                 rotation,
                 onTransform
             });
+            this.onResize = onResize;
             this.displayObject = displayObject;
             this.displayObject.scatter = this;
             this.renderer = renderer;
@@ -11774,6 +11775,7 @@
             if (y != null) this.y = y;
         }
 
+     
         getWorldScatter() {
             return this
         }
@@ -17397,10 +17399,10 @@
             );
             super(displayObject, renderer, opts);
 
-            if (!renderer) {
+            // if (!renderer) {
-                console.error('Renderer was not set!');
+            //     console.error('Renderer was not set!')
-                return
+            //     return
-            }
+            // }
 
             this.cover = opts.cover;
         }
@@ -17477,6 +17479,13 @@
             }
         }
 
+        /**
+         * Transforms a pixel point on the map to a geographical coordinate.
+         *
+         * @param {{x,y} | PIXI.Point} point - A pixel position on the map.
+         * @returns {{x,y} | PIXI.Point} - A geographical coordinate.
+         * @memberof MapData
+         */
         toCoordinates(point) {
             if (this.opts.clip) {
                 let min = this.clipExt.point.min;
@@ -17502,6 +17511,13 @@
             return coordinates
         }
 
+        /**
+         * Transform a geographical coordinate to a pixel point on the map.
+         *
+         * @param {{x,y} | PIXI.Point} coordinates - A point in the form of {x:lat,y:lng}.
+         * @returns {{x,y} | PIXI.Point} point - A pixel position on the map.
+         * @memberof MapData
+         */
         toPixel(coordinates) {
             let coords = { x: coordinates.x, y: coordinates.y };
             if (this.opts.translate) {
@@ -17565,7 +17581,6 @@
 
     class DeepZoomMapData extends MapData {
         constructor(projection, tilesConfig, opts = {}) {
-            if (!opts.app) console.error('Deepzoom Mapdata needs an app set in the options.');
             if (tilesConfig.clip) {
                 opts.clip = {
                     min: {
@@ -17579,8 +17594,6 @@
                 };
             }
 
-            console.log(tilesConfig, opts);
-
             super(projection, opts);
             this.app = opts.app;
         }
@@ -17724,8 +17737,6 @@
             this.cover = cover;
             this.debug = debug;
 
-
-
             //TODO discuss if this is required here.
             // Those are just scatter options and the information
             // is redundant in the map class and the scatter.
@@ -18054,7 +18065,6 @@
             let maps = {};
             if (GeoMap._validateJson(json, error)) {
                 for (let [mapname, data] of Object.entries(json)) {
-                    console.log(data.tiles, data.tiles.path, root + data.tiles.path);
                     data.tiles.path = root + data.tiles.path;
                     maps[mapname] = GeoMap._createMap(data);
                     maps[mapname].name = mapname;
@@ -18192,7 +18202,6 @@
          * @param {object} opts - Additional options to specify the behaviour of the deep zoom image.
          */
         constructor(mapdata, tilesConfig, opts = {}) {
-            if (!tilesConfig.app) console.error('App was not set in the tilesConfig.');
             opts = Object.assign(
                 {
                     maxScale: Math.min(tilesConfig.width, tilesConfig.height) / tilesConfig.tileSize,
@@ -18212,9 +18221,7 @@
             if (!(this.mapdata instanceof MapData)) {
                 console.error('Use the MapData object for creating maps!');
             } else {
-                if (this.mapdata instanceof DeepZoomMapData) {
+                if (!(this.mapdata instanceof DeepZoomMapData)) {
-                    if (!this.mapdata.app) console.error('No app was set on the mapdata!');
-                } else {
                     console.error('Use the DeepZoomMapData object.');
                 }
             }
@@ -18226,6 +18233,7 @@
          * @private
          */
         load(container = null, scatter = null) {
+            if (!this.mapdata.app) console.error('App was not set in the mapdata.');
             this.info = new DeepZoomInfo(this.tilesConfig);
             let image = new DeepZoomImage(this.info, {
                 app: this.mapdata.app,
@@ -18236,7 +18244,6 @@
 
             super.load(image, container, scatter);
 
-            console.log('LOADED: ', this.image);
             if (this.debug) console.log('Loaded image: ', image, 'With options: ', this.info);
         }
 
@@ -19688,7 +19695,6 @@
             let idx = keys.indexOf(this.active);
 
             let next = idx + 1 < keys.length ? keys[idx + 1] : keys[0];
-            console.log(keys, idx, next);
             return next
         }
 
@@ -19783,7 +19789,6 @@
 
         set visibility(value) {
             let { min = 0, max = Infinity } = value;
-            console.log(min);
             this._visibility = { min, max };
         }
 
@@ -19962,12 +19967,10 @@
             });
         }
 
-        // placeLayer(layer) {
+
-        //     super.placeLayer(layer)
+        focus(coordinates, zoom) {
-        //     if (layer instanceof GeoLayer && this.map) {
+            this.mapview.updateFocusPoint(this.map);
-        //         layer.adapt(this.map)
+        }
-        //     }
-        // }
 
         transformed(e) {
             this.mapview.transformed(this.map);
@@ -20014,7 +20017,7 @@
             /* map ,
             useScatterAsContainer = true // If set to false, the normal container is used. This is necessary when using submaps and the container need to be a RigidContainer.*/
         ) {
-            console.log('Change map to: ', name);
+            console.log('🗺️ Change map to: ', name);
             let oldMap = this.map;
 
             this.mapList.select(name);
@@ -20026,10 +20029,8 @@
 
             let map = this.map;
             if (map) {
-                console.log('Load Map');
                 map.load();
 
-                console.log(this, this.scatterContainer);
                 this.scatterContainer.addChild(map.image);
 
                 this.mapview.apply(map);
@@ -20101,6 +20102,10 @@
             }*/
         }
 
+        refocus() {
+            this.mapview.apply(this.map);
+        }
+
         get map() {
             return this.mapList.map
         }
@@ -20202,6 +20207,13 @@
             this._setupKeyboardUtils();
         }
 
+        /**
+         * Log boundaries for a shown map.
+         * This is for development purposes only, if you want
+         * to find the boundaries of a shown map.
+         *
+         * @memberof MapApp
+         */
         logMapBoundaries() {
             let map = this.mapLayer.map;
 
@@ -20215,16 +20227,12 @@
 
         _setupMapLayer() {
             this.mapContainer = new PIXI.Container();
-            console.log(this.mapList);
             this.mapLayer = new MapLayer(this.mapList, this.scene, this.mapContainer, {
                 name: 'Root Map Layer',
                 focus: this.focus,
-                zoom: this.zoom
+                zoom: this.zoom,
+                onChange: this._mapChanged.bind(this)
             });
-
-            this.mapLayer.changeHandler.add(this._mapChanged.bind(this));
-
-            if (this.mapList.map) this.mapLayer.changeMap(this.mapList.map);
         }
 
         setup() {

lib/pixi/maps/geolayer.js

@@ -264,12 +264,10 @@ export class MapLayer extends GeoLayer {
         })
     }
 
-    // placeLayer(layer) {
+
-    //     super.placeLayer(layer)
+    focus(coordinates, zoom) {
-    //     if (layer instanceof GeoLayer && this.map) {
+        this.mapview.updateFocusPoint(this.map)
-    //         layer.adapt(this.map)
+    }
-    //     }
-    // }
 
     transformed(e) {
         this.mapview.transformed(this.map)
@@ -401,6 +399,10 @@ export class MapLayer extends GeoLayer {
         }*/
     }
 
+    refocus() {
+        this.mapview.apply(this.map)
+    }
+
     get map() {
         return this.mapList.map
     }

lib/pixi/maps/scatter.js

@@ -267,10 +267,20 @@ export class SubmapScatter extends DisplayObjectScatter {
             maxScale: 1,
             startScale: 1,
             overdoScaling: 1,
-            scalable: false
+            scalable: false,
+            resizable: true
         })
 
         super(displayObject, renderer, opts)
+
+        console.log('onResize', opts.onResize)
+        this.onResize = opts.onResize
+    }
+
+    gesture(interaction) {
+        super.gesture(interaction)
+
+        if (this.onResize) this.onResize(interaction)
     }
 
     get width() {

lib/pixi/scatter.js

@@ -276,6 +276,7 @@ export class DisplayObjectScatter extends AbstractScatter {
             rotation = null,
             overdoScaling = 1.5,
             onTransform = null,
+            onResize,
             onThrowFinished = null
         } = {}
     ) {
@@ -301,6 +302,7 @@ export class DisplayObjectScatter extends AbstractScatter {
             rotation,
             onTransform
         })
+        this.onResize = onResize
         this.displayObject = displayObject
         this.displayObject.scatter = this
         this.renderer = renderer
@@ -313,6 +315,7 @@ export class DisplayObjectScatter extends AbstractScatter {
         if (y != null) this.y = y
     }
 
+ 
     getWorldScatter() {
         return this
     }

lib/scatter.js

@@ -351,7 +351,6 @@ export class AbstractScatter extends Throwable {
     }
 
     close() {
-        console.log('SCATTER WAS CLOSED!')
         this._callCloseCallbacks()
         this._removeCallbacks()
         this._removeSelfFromScatterContainer()
@@ -377,6 +376,7 @@ export class AbstractScatter extends Throwable {
 
     gesture(interaction) {
         let delta = interaction.delta()
+
         if (delta != null) {
             this.addVelocity(delta)
             let rotate = delta.rotate