@vcmap/ui 5.1.3 → 5.1.5

package/src/manager/collectionManager/editorCollectionComponentClass.js

@@ -13,12 +13,16 @@ import { createListEditAction } from '../../actions/listActions.js';
  *   editor: EditorWindowComponentOptions|function(T):EditorWindowComponentOptions|undefined,
  *   multiEditor?: EditorWindowComponentOptions,
  *   predicate?: import("./collectionManager.js").PredicateFunction<T>,
- *   selectionBased?: boolean
+ *   selectionBased?: boolean,
+ *   editTitle?: string,
+ *   bulkEditTitle?: string
  * }} EditingOptions
  * @property {EditorWindowComponentOptions|function(T)|undefined} editor
  * @property {EditorWindowComponentOptions} [multiEditor]
  * @property {import("./collectionManager.js").PredicateFunction<T>} [predicate=()=>true] - Optional predicate function for editor
  * @property {boolean} [selectionBased=true] - If true, editor windows are coupled to selection and editor windows are exclusive
+ * @property {string} [editTitle="list.editItem"]
+ * @property {string} [bulkEditTitle="list.edit"]
  * @template {Object} T
  */
 
@@ -236,7 +240,7 @@ export function makeEditorCollectionComponentClass(
       });
 
       const editItemAction = {
-        name: 'list.editItem',
+        name: editingOptions.editTitle ?? 'list.editItem',
         async callback() {
           if (selectionBased) {
             closeEditorWindows();
@@ -263,6 +267,7 @@ export function makeEditorCollectionComponentClass(
       app.windowManager,
       editorCollectionComponent.owner,
       getMultiEditorWindowId(),
+      editingOptions.bulkEditTitle,
     );
 
     editorCollectionComponent.addActions([

package/src/manager/contextMenu/contextMenuManager.d.ts

@@ -38,6 +38,16 @@ declare class ContextMenuManager {
      * @private
      */
     private _listeners;
+    /**
+     * An event called when the context menu is closed
+     * @type {VcsEvent<void>}
+     */
+    closed: VcsEvent<void>;
+    /**
+     * @type {() => void}
+     * @private
+     */
+    private _closedListener;
     _ensureInteraction(): void;
     _setupListeners(): void;
     /**
@@ -68,3 +78,4 @@ declare class ContextMenuManager {
     clear(): void;
     destroy(): void;
 }
+import { VcsEvent } from '@vcmap/core';

package/src/manager/contextMenu/contextMenuManager.js

@@ -1,4 +1,4 @@
-import { CesiumMap, BaseOLMap } from '@vcmap/core';
+import { CesiumMap, BaseOLMap, VcsEvent } from '@vcmap/core';
 import { unByKey } from 'ol/Observable.js';
 import { check } from '@vcsuite/check';
 import ContextMenuInteraction from './contextMenuInteraction.js';
@@ -81,6 +81,24 @@ class ContextMenuManager {
      * @private
      */
     this._listeners = [];
+
+    /**
+     * An event called when the context menu is closed
+     * @type {VcsEvent<void>}
+     */
+    this.closed = new VcsEvent();
+
+    /**
+     * @type {() => void}
+     * @private
+     */
+    this._closedListener = this._app.windowManager.removed.addEventListener(
+      (window) => {
+        if (window.id === contextMenuWindowId) {
+          this.closed.raiseEvent();
+        }
+      },
+    );
   }
 
   _ensureInteraction() {
@@ -208,12 +226,15 @@ class ContextMenuManager {
   }
 
   destroy() {
+    this.clear();
     this._interaction.destroy();
     if (this._interactionListener) {
       this._interactionListener();
       this._interactionListener = null;
     }
     this._eventHandlers = [];
+    this._closedListener();
+    this.closed.destroy();
   }
 }
 

package/src/navigation/MapNavigation.vue

@@ -64,7 +64,9 @@
     } else {
       listener = app.maps.mapActivated.addEventListener((map) => {
         defaultViewpoint = map.getViewpointSync();
-        listener();
+        if (defaultViewpoint?.isValid()) {
+          listener();
+        }
       });
     }
 
@@ -88,9 +90,10 @@
       title: 'navigation.homeButton',
       icon: '$vcsHomePoint',
       async callback() {
-        await app.maps.activeMap?.gotoViewpoint(
-          getStartingViewpoint() || defaultViewpoint,
-        );
+        const vp = getStartingViewpoint() || defaultViewpoint;
+        if (app.maps.activeMap && vp?.isValid()) {
+          await app.maps.activeMap.gotoViewpoint(vp);
+        }
       },
     });
 

package/src/navigation/overviewMap.js

@@ -11,6 +11,7 @@ import {
   Extent,
   Viewpoint,
   deserializeLayer,
+  maxZIndex,
 } from '@vcmap/core';
 import Point from 'ol/geom/Point.js';
 import Feature from 'ol/Feature.js';
@@ -454,23 +455,25 @@ class OverviewMap {
    * @private
    */
   _obliqueImageChange(image) {
-    const { source } = this._obliqueImageLayer;
-    if (this._obliqueViewDirection !== image.viewDirection) {
-      this._obliqueViewDirection = image.viewDirection;
-      source.changed();
-    }
-    const activeFeature = source.getFeatureById(image.name);
-    if (activeFeature) {
-      this._obliqueSelectedImageLayer.removeAllFeatures();
-      this._obliqueSelectedImageLayer.addFeatures([activeFeature]);
-      const extent = new Extent({
-        coordinates: activeFeature.getGeometry().getExtent(),
-        projection: mercatorProjection.toJSON(),
-      });
-
-      const vp = Viewpoint.createViewpointFromExtent(extent);
-      vp.distance /= this._obliqueResolutionFactor;
-      this._map.gotoViewpoint(vp);
+    if (image) {
+      const { source } = this._obliqueImageLayer;
+      if (this._obliqueViewDirection !== image.viewDirection) {
+        this._obliqueViewDirection = image.viewDirection;
+        source.changed();
+      }
+      const activeFeature = source.getFeatureById(image.name);
+      if (activeFeature) {
+        this._obliqueSelectedImageLayer.removeAllFeatures();
+        this._obliqueSelectedImageLayer.addFeatures([activeFeature]);
+        const extent = new Extent({
+          coordinates: activeFeature.getGeometry().getExtent(),
+          projection: mercatorProjection.toJSON(),
+        });
+
+        const vp = Viewpoint.createViewpointFromExtent(extent);
+        vp.distance /= this._obliqueResolutionFactor;
+        this._map.gotoViewpoint(vp);
+      }
     }
   }
 
@@ -492,7 +495,7 @@ class OverviewMap {
     this._obliqueTileLayer = new VectorLayer({
       projection: mercatorProjection.toJSON(),
       style: obliqueTileStyle,
-      zIndex: 1,
+      zIndex: maxZIndex - 3,
     });
     this._obliqueTileLayer[overviewMapLayerSymbol] = true;
 
@@ -507,11 +510,13 @@ class OverviewMap {
     this._obliqueImageLayer = new VectorLayer({
       projection: mercatorProjection.toJSON(),
       style: obliqueImageStyle,
+      zIndex: maxZIndex - 2,
     });
     this._obliqueImageLayer[overviewMapLayerSymbol] = true;
     this._obliqueSelectedImageLayer = new VectorLayer({
       projection: mercatorProjection.toJSON(),
       style: this.obliqueSelectedStyle,
+      zIndex: maxZIndex - 1,
     });
     this._obliqueSelectedImageLayer[overviewMapLayerSymbol] = true;
     this._map.layerCollection.add(this._obliqueImageLayer);
@@ -539,7 +544,7 @@ class OverviewMap {
     if (!this._cameraIconLayer) {
       this._cameraIconLayer = new VectorLayer({
         projection: mercatorProjection.toJSON(),
-        zIndex: 50,
+        zIndex: maxZIndex,
       });
       this._cameraIconLayer[overviewMapLayerSymbol] = true;
       this._map.layerCollection.add(this._cameraIconLayer);

package/src/siteConfig.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @param {import("./uiConfig.js").default} uiConfig
+ * @returns {() => void}
+ */
+export default function createSiteConfig(uiConfig: import("./uiConfig.js").default): () => void;

package/src/siteConfig.js

@@ -0,0 +1,93 @@
+import { check } from '@vcsuite/check';
+
+/**
+ * @param {string} src
+ */
+function setFavicon(src) {
+  check(src, String);
+
+  const link = document.createElement('link');
+  link.className = 'vcs-favicon';
+  const oldLinks = document.getElementsByClassName('vcs-favicon');
+  const toRemove = [];
+  for (let i = 0; i < oldLinks.length; i++) {
+    toRemove.push(oldLinks.item(i));
+  }
+  toRemove.forEach((elem) => {
+    document.head.removeChild(elem);
+  });
+  link.id = 'dynamic-favicon';
+  link.rel = 'shortcut icon';
+  link.href = src;
+  document.head.appendChild(link);
+}
+
+/**
+ * @param {string} title
+ */
+function setHeaderTitle(title) {
+  const titleElement = document.createElement('title');
+  titleElement.innerText = title;
+  const oldTitle = document.getElementsByTagName('title').item(0);
+  if (oldTitle) {
+    document.head.removeChild(oldTitle);
+  }
+  document.head.appendChild(titleElement);
+}
+
+const defaultFavicon = './assets/favicon.svg';
+
+const defaultHeaderTitle = 'VC Map';
+
+/**
+ * @param {import("./uiConfig.js").default} uiConfig
+ * @returns {() => void}
+ */
+export default function createSiteConfig(uiConfig) {
+  if (typeof uiConfig.config.value.favicon === 'string') {
+    setFavicon(uiConfig.config.value.favicon);
+  }
+
+  if (typeof uiConfig.config.value.headerTitle === 'string') {
+    setHeaderTitle(uiConfig.config.value.headerTitle);
+  }
+
+  const updateFavicon = () => {
+    if (typeof uiConfig.config.value.favicon === 'string') {
+      setFavicon(uiConfig.config.value.favicon);
+    } else {
+      setFavicon(defaultFavicon);
+    }
+  };
+
+  const updateHeaderTitle = () => {
+    if (typeof uiConfig.config.value.headerTitle === 'string') {
+      setHeaderTitle(uiConfig.config.value.headerTitle);
+    } else {
+      setHeaderTitle(defaultHeaderTitle);
+    }
+  };
+
+  const listeners = [
+    uiConfig.added.addEventListener(({ name }) => {
+      if (name === 'favicon') {
+        updateFavicon();
+      } else if (name === 'headerTitle') {
+        updateHeaderTitle();
+      }
+    }),
+    uiConfig.removed.addEventListener(({ name }) => {
+      if (name === 'favicon') {
+        updateFavicon();
+      } else if (name === 'headerTitle') {
+        updateHeaderTitle();
+      }
+    }),
+  ];
+
+  return () => {
+    listeners.forEach((cb) => {
+      cb();
+    });
+  };
+}

package/src/uiConfig.d.ts

@@ -4,7 +4,7 @@ export type UiConfigurationItem<T> = {
     value: T;
 };
 export type TextPageType = {
-    title: string;
+    title?: string | undefined;
     url?: string | URL | undefined;
     content?: string | undefined;
 };
@@ -38,13 +38,21 @@ export type UiConfigObject = {
      */
     helpBaseUrl?: string | undefined;
     /**
-     * - an option imprint, will show a link in the footer.
+     * - an option imprint, will show a link in the footer. Default title is 'footer.imprint.title'.
      */
     imprint?: TextPageType | undefined;
     /**
-     * - an option dataProtection, will show a link in the footer.
+     * - an option dataProtection, will show a link in the footer. Default title is 'footer.dataProtection.title'.
      */
     dataProtection?: TextPageType | undefined;
+    /**
+     * - the favicon to set
+     */
+    favicon?: string | undefined;
+    /**
+     * - the title to display in the tab of the browser
+     */
+    headerTitle?: string | undefined;
 };
 /**
  * @typedef {{
@@ -55,7 +63,7 @@ export type UiConfigObject = {
  */
 /**
  * @typedef {Object} TextPageType
- * @property {string} title
+ * @property {string} [title]
  * @property {URL|string} [url]
  * @property {string} [content]
  */
@@ -68,8 +76,10 @@ export type UiConfigObject = {
  * @property {boolean} [startingFeatureInfo] - an optional flag whether to activate feature info on startup (default active)
  * @property {string} [positionDisplayEventType] - mouse event, when position display is updated. Either 'click' (default) or 'move'.
  * @property {string} [helpBaseUrl='https://help.vc.systems/'] - an optional URL to a help landing page
- * @property {TextPageType} [imprint] - an option imprint, will show a link in the footer.
- * @property {TextPageType} [dataProtection] - an option dataProtection, will show a link in the footer.
+ * @property {TextPageType} [imprint] - an option imprint, will show a link in the footer. Default title is 'footer.imprint.title'.
+ * @property {TextPageType} [dataProtection] - an option dataProtection, will show a link in the footer. Default title is 'footer.dataProtection.title'.
+ * @property {string} [favicon] - the favicon to set
+ * @property {string} [headerTitle] - the title to display in the tab of the browser
  */
 /**
  * @extends {Collection<UiConfigurationItem<unknown>>}

package/src/uiConfig.js

@@ -11,7 +11,7 @@ import { ref } from 'vue';
 
 /**
  * @typedef {Object} TextPageType
- * @property {string} title
+ * @property {string} [title]
  * @property {URL|string} [url]
  * @property {string} [content]
  */
@@ -25,8 +25,10 @@ import { ref } from 'vue';
  * @property {boolean} [startingFeatureInfo] - an optional flag whether to activate feature info on startup (default active)
  * @property {string} [positionDisplayEventType] - mouse event, when position display is updated. Either 'click' (default) or 'move'.
  * @property {string} [helpBaseUrl='https://help.vc.systems/'] - an optional URL to a help landing page
- * @property {TextPageType} [imprint] - an option imprint, will show a link in the footer.
- * @property {TextPageType} [dataProtection] - an option dataProtection, will show a link in the footer.
+ * @property {TextPageType} [imprint] - an option imprint, will show a link in the footer. Default title is 'footer.imprint.title'.
+ * @property {TextPageType} [dataProtection] - an option dataProtection, will show a link in the footer. Default title is 'footer.dataProtection.title'.
+ * @property {string} [favicon] - the favicon to set
+ * @property {string} [headerTitle] - the title to display in the tab of the browser
  */
 
 /**

package/src/vcsUiApp.d.ts

@@ -188,6 +188,7 @@ declare class VcsUiApp extends VcsApp {
      * @type {import("@vcmap/core").VcsEvent<string>}
      */
     mounted: import("@vcmap/core").VcsEvent<string>;
+    _destroySiteConfig: () => void;
     /**
      * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>>}
      */

package/src/vcsUiApp.js

@@ -42,6 +42,7 @@ import Notifier from './notifier/notifier.js';
 import AbstractFeatureInfoView from './featureInfo/abstractFeatureInfoView.js';
 import { createVueI18n, setupI18n } from './vuePlugins/i18n.js';
 import { callbackClassRegistry } from './callback/vcsCallback.js';
+import createSiteConfig from './siteConfig.js';
 
 /**
  * @typedef {import("@vcmap/core").VcsModuleConfig & {
@@ -330,6 +331,8 @@ class VcsUiApp extends VcsApp {
      * @type {import("@vcmap/core").VcsEvent<string>}
      */
     this.mounted = new VcsEvent();
+
+    this._destroySiteConfig = createSiteConfig(this._uiConfig);
   }
 
   /**
@@ -682,6 +685,7 @@ class VcsUiApp extends VcsApp {
     this._featureInfoClassRegistry.destroy();
     this._featureInfo.destroy();
     this._uiConfig.destroy();
+    this._destroySiteConfig();
     super.destroy();
   }
 }

package/dist/assets/index-0abd9815.js

@@ -1 +0,0 @@
-import{initAppFromAppConfig as p}from"./ui.f85ce1.js";p("#app","app.config.json");