@vcmap/core 6.0.7 → 6.1.0-rc.1

package/src/util/mapCollection.ts

@@ -1,5 +1,6 @@
 import { check, maybe, oneOf } from '@vcsuite/check';
 import { getLogger } from '@vcsuite/logger';
+import { v4 as uuidv4 } from 'uuid';
 import VcsEvent from '../vcsEvent.js';
 import Collection from './collection.js';
 import EventHandler from '../interaction/eventHandler.js';
@@ -129,6 +130,13 @@ class MapCollection extends Collection<VcsMap> {
   // eslint-disable-next-line class-methods-use-this
   private _exclusiveMapControlsRemoved: () => void = () => {};
 
+  private _exclusiveMapControlsChanged = new VcsEvent<{
+    options: DisableMapControlOptions;
+    id?: string | symbol;
+  }>();
+
+  private _exclusiveMapControlsId: string | symbol | undefined;
+
   constructor() {
     super();
 
@@ -202,6 +210,23 @@ class MapCollection extends Collection<VcsMap> {
     return this._postRender;
   }
 
+  /**
+   * Event raised when exclusive map controls are changed. If the Id is empty the default map controls have been reinstated
+   */
+  get exclusiveMapControlsChanged(): VcsEvent<{
+    options: DisableMapControlOptions;
+    id?: string | symbol;
+  }> {
+    return this._exclusiveMapControlsChanged;
+  }
+
+  /**
+   * The id of the current exclusive map controls owner.
+   */
+  get exclusiveMapControlsId(): string | symbol | undefined {
+    return this._exclusiveMapControlsId;
+  }
+
   /**
    * Adds a map to the collection. This will set the collections target
    * and the collections  on the map.
@@ -399,30 +424,56 @@ class MapCollection extends Collection<VcsMap> {
    * Manages the disabling of map navigation controls. By calling this function the map navigation controls passed in the options are disabled. The remove function passed by the previous caller is executed.
    * @param options - which of the movement controls should be disabled.
    * @param removed - the callback for when the interaction is forcefully removed.
+   * @param id - an optional id to identify the owner of the exclusive map controls.
    * @returns function to reset map controls.
    */
   requestExclusiveMapControls(
     options: DisableMapControlOptions,
     removed: () => void,
+    id?: string | symbol,
   ): () => void {
     this._exclusiveMapControlsRemoved();
     if (this._activeMap) {
       this._activeMap.disableMovement(options);
     }
 
-    this._exclusiveMapControlsRemoved = removed;
+    if (options.pointerEvents || options.keyEvents || options.apiCalls) {
+      this._exclusiveMapControlsId = id || uuidv4();
+      this._exclusiveMapControlsRemoved = removed;
+    } else {
+      this._exclusiveMapControlsRemoved = (): void => {};
+      this._exclusiveMapControlsId = undefined;
+    }
+
+    this._exclusiveMapControlsChanged.raiseEvent({
+      options,
+      id: this._exclusiveMapControlsId,
+    });
 
     return () => {
       // only reset if this function is called by the current exclusiveMapControls owner.
       if (removed === this._exclusiveMapControlsRemoved) {
-        this._exclusiveMapControlsRemoved = (): void => {};
         if (this._activeMap) {
           this._activeMap.disableMovement(false);
         }
+
+        this._exclusiveMapControlsRemoved = (): void => {};
+        this._exclusiveMapControlsId = undefined;
+
+        this._exclusiveMapControlsChanged.raiseEvent({
+          options: { apiCalls: false, keyEvents: false, pointerEvents: false },
+        });
       }
     };
   }
 
+  resetExclusiveMapControls(): void {
+    this.requestExclusiveMapControls(
+      { keyEvents: false, apiCalls: false, pointerEvents: false },
+      () => {},
+    );
+  }
+
   destroy(): void {
     super.destroy();
     [...this._layerCollection].forEach((l) => {

package/src/util/rotation.ts

@@ -0,0 +1,215 @@
+import {
+  Camera,
+  Cartesian2,
+  Cartesian3,
+  Cartographic,
+  Math as CesiumMath,
+  JulianDate,
+  HeadingPitchRollValues,
+} from '@vcmap-cesium/engine';
+import Viewpoint from './viewpoint.js';
+import VcsApp from '../vcsApp.js';
+import { CesiumMap } from '../../index.js';
+import Projection from './projection.js';
+
+/**
+ * Unique symbol for rotation.
+ * @type {symbol}
+ */
+export const rotationMapControlSymbol: unique symbol = Symbol(
+  'rotationMapControlSymbol',
+);
+
+export type SetViewOptions = {
+  destination: Cartesian3;
+  orientation: HeadingPitchRollValues;
+};
+
+/**
+ * Rotates the camera to a specified viewpoint.
+ * @param {SetViewOptions} options - The options for setting the view.
+ * @param {number} [distance] - The distance to move backward.
+ * @param {CesiumMap} activeMap - The active map instance.
+ */
+function setUpdatedPosition(
+  options: SetViewOptions,
+  distance: number | undefined,
+  activeMap: CesiumMap,
+): void {
+  let cameraPosition: Cartesian3;
+
+  const clonedCamera = new Camera(activeMap.getCesiumWidget()!.scene);
+
+  clonedCamera.setView(options);
+  clonedCamera.moveBackward(distance);
+
+  cameraPosition = clonedCamera.position;
+
+  const cam = activeMap.getCesiumWidget()!.scene.camera;
+  const cameraOptions = {
+    heading: options.orientation.heading,
+    pitch: options.orientation.pitch,
+    roll: options.orientation.roll,
+  };
+  cameraPosition = cameraPosition || null;
+  cam.cancelFlight();
+
+  cam.setView({
+    destination: cameraPosition,
+    orientation: cameraOptions,
+  });
+}
+
+/**
+ * Rotates the center of the map.
+ * @param {number} heading - The current heading of the view.
+ * @param {CesiumMap} activeMap - The current Cesium Map.
+ * @param {number} timePerRotation - The current rotation speed.
+ * @param {JulianDate} [timeLastTick] - The time of the last tick.
+ * @returns {number | undefined} The new heading.
+ */
+export function calculateRotation(
+  heading: number,
+  activeMap: CesiumMap,
+  timePerRotation: number,
+  timeLastTick?: JulianDate,
+): number {
+  let localHeading = heading;
+
+  const { clock } = activeMap.getCesiumWidget()!;
+  let timeDifference = timeLastTick
+    ? clock.currentTime.secondsOfDay - timeLastTick.secondsOfDay
+    : 1 / 60;
+  if (timeDifference <= 0 || timeDifference > 1) {
+    timeDifference = 1 / 60;
+  }
+
+  const timeFactor = timeDifference / (1 / 60);
+  const headingDiff = CesiumMath.TWO_PI / ((timePerRotation * 60) / timeFactor);
+  localHeading += headingDiff;
+  localHeading = CesiumMath.zeroToTwoPi(localHeading);
+  return localHeading;
+}
+
+/**
+ * Starts the rotation of the map.
+ * @param app - The VCS application instance.
+ * @param [viewpoint] - The optional viewpoint to start the rotation from, if no viewpoint is provided the current Viewpoint is used.
+ * @param [timePerRotation=60] - The duration of a single full rotation in seconds.
+ * @returns A function to stop the rotation.
+ */
+export async function startRotation(
+  app: VcsApp,
+  viewpoint?: Viewpoint,
+  timePerRotation = 60,
+): Promise<() => void> {
+  const { activeMap } = app.maps;
+
+  let localViewpoint: Viewpoint | undefined;
+
+  let rotationListener: (() => void) | undefined;
+  let resetMapControls: (() => void) | undefined;
+
+  const stopRotation: () => void = () => {
+    if (rotationListener) {
+      rotationListener();
+      rotationListener = undefined;
+    }
+    if (resetMapControls) {
+      resetMapControls();
+    }
+  };
+
+  if (activeMap instanceof CesiumMap) {
+    const scene = activeMap.getScene();
+    if (scene) {
+      if (!(viewpoint instanceof Viewpoint)) {
+        localViewpoint = activeMap.getViewpointSync() || undefined;
+      } else {
+        localViewpoint = viewpoint.clone();
+      }
+      if (localViewpoint) {
+        if (!localViewpoint.animate) {
+          localViewpoint.animate = true;
+
+          localViewpoint.duration = 0.00000001;
+        }
+        await activeMap.gotoViewpoint(localViewpoint);
+
+        const newCenter = scene.pickPosition(
+          new Cartesian2(scene.canvas.width / 2, scene.canvas.height / 2),
+        );
+        if (newCenter) {
+          const cartographic = Cartographic.fromCartesian(newCenter);
+          localViewpoint.groundPosition = [
+            CesiumMath.toDegrees(cartographic.longitude),
+            CesiumMath.toDegrees(cartographic.latitude),
+            cartographic.height,
+          ];
+          localViewpoint.distance = Cartesian3.distance(
+            newCenter,
+            scene.camera.position,
+          );
+        } else {
+          throw new Error('new ground position could not be determined');
+        }
+
+        const { distance } = localViewpoint;
+        const heading = CesiumMath.toRadians(localViewpoint.heading);
+        const pitch = CesiumMath.toRadians(localViewpoint.pitch);
+        const roll = CesiumMath.toRadians(localViewpoint.roll);
+
+        const groundPositionCoords = localViewpoint.groundPosition;
+        if (!groundPositionCoords[2]) {
+          const positions = await activeMap.getHeightFromTerrain([
+            Projection.wgs84ToMercator(groundPositionCoords),
+          ]);
+          groundPositionCoords[2] = positions[0][2];
+        }
+        const groundPosition = Cartesian3.fromDegrees(
+          groundPositionCoords[0],
+          groundPositionCoords[1],
+          groundPositionCoords[2],
+        );
+
+        const options = {
+          destination: groundPosition,
+          orientation: {
+            heading,
+            pitch,
+            roll,
+          },
+        };
+
+        let timeLastTick: JulianDate | undefined;
+
+        resetMapControls = app.maps.requestExclusiveMapControls(
+          { apiCalls: true, keyEvents: true, pointerEvents: true },
+          stopRotation,
+          rotationMapControlSymbol,
+        );
+
+        rotationListener = activeMap
+          .getCesiumWidget()!
+          .scene.postRender.addEventListener(() => {
+            options.orientation.heading = calculateRotation(
+              options.orientation.heading,
+              activeMap,
+              timePerRotation,
+              timeLastTick,
+            );
+
+            if (options) {
+              setUpdatedPosition(options, distance, activeMap);
+            }
+
+            timeLastTick = activeMap.getCesiumWidget()!.clock.currentTime;
+          });
+      }
+    }
+  }
+
+  return (): void => {
+    stopRotation();
+  };
+}

package/src/util/vcsTemplate.ts

@@ -0,0 +1,373 @@
+import {
+  BooleanType,
+  newParsingContext,
+  StringType,
+  NoneType,
+  LiteralValue,
+} from 'ol/expr/expression.js';
+import { buildExpression, newEvaluationContext } from 'ol/expr/cpu.js';
+import { is } from '@vcsuite/check';
+
+type Block = {
+  opening: RegExpExecArray;
+  closing: RegExpExecArray;
+};
+
+type ConditionalBlock = Block & {
+  elseStatement?: RegExpExecArray;
+  elseIfs: RegExpExecArray[];
+};
+
+/**
+ * @param {string} expressionString
+ * @param {Record<string, unknown>} data
+ * @param {number} evaluationType
+ * @returns {*}
+ */
+function evaluateExpression(
+  expressionString: string,
+  data: Record<string, unknown>,
+  evaluationType: number,
+): LiteralValue {
+  const parsed = expressionString.startsWith('[')
+    ? (JSON.parse(expressionString) as any[])
+    : [
+        'get',
+        ...expressionString
+          .replace(/\[([^\]]+)]/g, '.$1')
+          .split('.')
+          .filter((f) => f),
+      ];
+
+  const compiledExpression = buildExpression(
+    parsed,
+    evaluationType,
+    newParsingContext(),
+  );
+  const evaluationContext = newEvaluationContext();
+  evaluationContext.properties = data;
+  return compiledExpression(evaluationContext);
+}
+
+/**
+ * Replaces template strings by provided attributes, e.g. {{myAttribute}}
+ */
+function replaceAttributes(
+  template: string,
+  data: Record<string, unknown>,
+): string {
+  const pattern = /\{\{([^}]+)}}/g;
+  return template.replace(pattern, (_p, value) => {
+    return (
+      (evaluateExpression(
+        (value as string).trim(),
+        data,
+        StringType,
+      ) as string) ?? ''
+    );
+  });
+}
+
+function regexHits(regexp: RegExp, string: string): RegExpExecArray[] {
+  const hits = [];
+  let hit;
+  // eslint-disable-next-line no-cond-assign
+  while ((hit = regexp.exec(string))) {
+    hits.push(hit);
+  }
+
+  return hits;
+}
+
+function findTopLevelBlock(
+  openings: RegExpExecArray[],
+  closings: RegExpExecArray[],
+  accepted: (b: Block) => void,
+  rejected: (b: Block) => void,
+): void {
+  const localOpenings = openings.slice();
+  const localClosings = closings.slice();
+  while (localOpenings.length > 0) {
+    let matchingClosing;
+    let matchingOpening;
+    while (!matchingClosing && localClosings.length > 0) {
+      const currentClosing = localClosings.shift()!;
+      const openingDistances = localOpenings.map(
+        (o) => currentClosing.index - o.index,
+      );
+      const minDistance = openingDistances.reduce((min, currentDistance) => {
+        if (currentDistance > 0 && currentDistance < min) {
+          return currentDistance;
+        }
+        return min;
+      }, Infinity);
+      const matchingOpeningIndex = openingDistances.indexOf(minDistance);
+      matchingOpening = localOpenings[matchingOpeningIndex];
+
+      if (matchingOpeningIndex === 0) {
+        matchingClosing = currentClosing;
+      } else {
+        rejected({ opening: matchingOpening, closing: currentClosing });
+      }
+      localOpenings.splice(matchingOpeningIndex, 1);
+    }
+
+    if (matchingOpening && matchingClosing) {
+      accepted({ opening: matchingOpening, closing: matchingClosing });
+    }
+  }
+}
+
+function tagWithinBlock(tag: RegExpExecArray, block: Block): boolean {
+  return tag.index > block.opening.index && tag.index < block.closing.index;
+}
+
+function getForEachBlocks(template: string): Block[] {
+  const forEachBlocks = [] as Block[];
+  const forEachOpenings = regexHits(
+    /\s*{{#each\s\(([^.)]+)\)\sin\s([^}]+)}}\s*/g,
+    template,
+  );
+  const forEachClosings = regexHits(/\s*{{\/each}}\s*/g, template);
+
+  if (forEachClosings.length > forEachOpenings.length) {
+    throw new Error(
+      'Template failed to render, missing opening tag for each statements',
+    );
+  } else if (forEachClosings.length < forEachOpenings.length) {
+    throw new Error(
+      'Template failed to render, missing closing tag for each statements',
+    );
+  }
+
+  findTopLevelBlock(
+    forEachOpenings,
+    forEachClosings,
+    (block) => {
+      forEachBlocks.push(block);
+    },
+    () => {},
+  );
+
+  return forEachBlocks;
+}
+
+function getConditionalBlocks(
+  template: string,
+  forEachBlocks: Block[],
+): ConditionalBlock[] {
+  const conditionalBlocks = [] as ConditionalBlock[];
+  let conditionalOpenings = regexHits(/\s*{{#if\s([^}]*)}}\s*/g, template);
+  let conditionalClosings = regexHits(/\s*{{\/if}}\s*/g, template);
+  let elseIfs = regexHits(/\s*{{elseif\s([^}]*)}}\s*/g, template);
+  let elses = regexHits(/\s*{{else}}\s*/g, template);
+
+  const withinForEachBlock = (tag: RegExpExecArray): Block | undefined =>
+    forEachBlocks.find((block) => tagWithinBlock(tag, block));
+
+  // conditionals within a for each blocks are rendered with the for each block, ignore
+  conditionalOpenings = conditionalOpenings.filter(
+    (t) => !withinForEachBlock(t),
+  );
+  conditionalClosings = conditionalClosings.filter(
+    (t) => !withinForEachBlock(t),
+  );
+
+  if (conditionalClosings.length > conditionalOpenings.length) {
+    throw new Error(
+      'Template failed to render, missing closing tag for if statements',
+    );
+  } else if (conditionalClosings.length < conditionalOpenings.length) {
+    throw new Error(
+      'Template failed to render, missing opening tag for if statements',
+    );
+  }
+
+  const filterElseIfElse = (block: Block): void => {
+    elseIfs = elseIfs.filter((tag) => !tagWithinBlock(tag, block));
+    elses = elses.filter((tag) => !tagWithinBlock(tag, block));
+  };
+
+  findTopLevelBlock(
+    conditionalOpenings,
+    conditionalClosings,
+    (block) => {
+      const blockElseIfs = elseIfs.filter((tag) => tagWithinBlock(tag, block));
+      const elseStatement = elses.find((tag) => tagWithinBlock(tag, block));
+      if (
+        elseStatement &&
+        blockElseIfs.length > 0 &&
+        elseStatement.index < blockElseIfs.at(-1)!.index
+      ) {
+        throw new Error('{{else}} must be the last entry in a block');
+      }
+      conditionalBlocks.push({
+        ...block,
+        elseStatement,
+        elseIfs: blockElseIfs,
+      });
+    },
+    (block) => {
+      filterElseIfElse(block);
+    },
+  );
+
+  return conditionalBlocks;
+}
+
+function shouldRemoveWhiteSpace(openingTag: string): boolean {
+  return /\n\s*\{/.test(openingTag) && /}\s*\n/.test(openingTag);
+}
+
+/**
+ * This will extract the block to render separately. This will depend on the white space handling. If the
+ * opening is placed on its own line, whitespace after the opening and before the closing blocks will be removed
+ * from the sub template, up to the first new line feed.
+ */
+function getSubTemplateForBlock(template: string, block: Block): string {
+  const removeWhiteSpace = shouldRemoveWhiteSpace(block.opening[0]);
+  let startIndex = block.opening.index + block.opening[0].indexOf('}') + 2;
+  let endIndex = block.closing.index + block.closing[0].indexOf('{');
+  if (removeWhiteSpace) {
+    startIndex += (/}\s*\n/.exec(block.opening[0])?.[0].length ?? 1) - 1;
+    endIndex -= (/\n\s*\{/.exec(block.closing[0])?.[0].length ?? 2) - 2;
+  }
+
+  return template.substring(startIndex, endIndex);
+}
+
+/**
+ * This will replace a block with a previously extracted blocks rendered template.
+ * This will depend on the white space handling. If the opening is placed on its own line,
+ * whitespace before the opening and after the closing blocks will be removed up to the first new line feed,
+ * from the new template string all together.
+ */
+function replaceBlock(
+  template: string,
+  block: Block,
+  replacement: string,
+): string {
+  const removeWhiteSpace = shouldRemoveWhiteSpace(block.opening[0]);
+  let startIndex = block.opening.index + block.opening[0].indexOf('{');
+  let endIndex = block.closing.index + block.closing[0].indexOf('}') + 2;
+  if (removeWhiteSpace) {
+    startIndex -= (/\n\s*\{/.exec(block.opening[0])?.[0].length ?? 2) - 2;
+    endIndex += (/}\s*\n/.exec(block.closing[0])?.[0].length ?? 1) - 1;
+  }
+
+  return `${template.substring(
+    0,
+    startIndex,
+  )}${replacement}${template.substring(endIndex)}`;
+}
+
+/**
+ * Replaces {{#if }} blocks
+ */
+function expandConditionalsAndLoops(
+  template: string,
+  data: Record<string, unknown>,
+): string {
+  let renderedTemplate = template;
+  const forEachBlocks = getForEachBlocks(template);
+
+  getConditionalBlocks(template, forEachBlocks)
+    .reverse()
+    .forEach(
+      /** @param {ConditionalBlock} block */ (block) => {
+        const partialBlocks = [block.opening];
+        if (block.elseIfs) {
+          partialBlocks.push(...block.elseIfs);
+        }
+        let trueStatementIndex = partialBlocks.findIndex((s) =>
+          evaluateExpression(s[1].trim(), data, BooleanType),
+        );
+        if (trueStatementIndex === -1 && block.elseStatement) {
+          trueStatementIndex = partialBlocks.length;
+        }
+
+        let renderedBlock = '';
+        if (trueStatementIndex > -1) {
+          if (block.elseStatement) {
+            partialBlocks.push(block.elseStatement);
+          }
+          partialBlocks.push(block.closing);
+
+          const blockTemplate = getSubTemplateForBlock(template, {
+            opening: partialBlocks[trueStatementIndex],
+            closing: partialBlocks[trueStatementIndex + 1],
+          });
+
+          renderedBlock = expandConditionalsAndLoops(blockTemplate, data);
+        }
+
+        renderedTemplate = replaceBlock(renderedTemplate, block, renderedBlock);
+      },
+    );
+
+  // only iterate over blocks not removed by conditionals
+  getForEachBlocks(renderedTemplate)
+    .reverse()
+    .forEach((block) => {
+      const obj = evaluateExpression(block.opening[2].trim(), data, NoneType);
+      let keyValuePairs;
+      if (is(obj, Object)) {
+        keyValuePairs = Object.entries(obj);
+      } else if (Array.isArray(obj)) {
+        keyValuePairs = obj.entries();
+      }
+      const renderedBlocks = [];
+      if (keyValuePairs) {
+        let index = 0;
+        const [valueName, keyName, indexName] = block.opening[1]
+          .split(',')
+          .map((e) => e.trim())
+          .slice(0, 3);
+
+        const blockTemplate = getSubTemplateForBlock(renderedTemplate, block);
+        // eslint-disable-next-line no-restricted-syntax
+        for (const args of keyValuePairs) {
+          const forEachData = structuredClone(data);
+          forEachData[valueName] = args[1];
+          if (keyName) {
+            forEachData[keyName] = args[0];
+          }
+          if (indexName) {
+            forEachData[indexName] = index;
+          }
+          const currentBlock = expandConditionalsAndLoops(
+            blockTemplate,
+            forEachData,
+          );
+          renderedBlocks.push(replaceAttributes(currentBlock, forEachData));
+          index += 1;
+        }
+      }
+
+      renderedTemplate = replaceBlock(
+        renderedTemplate,
+        block,
+        renderedBlocks.join(''),
+      );
+    });
+
+  return renderedTemplate;
+}
+
+/**
+ * Renders a template in these steps. See {@link documentation/vcsTemplate.md} for more information.
+ * 1. expand conditional blocks. this will remove any blocks that do not match their expressions and choose from if / elseif / else block which of them to render
+ * 2. expand iterations. this will create new templates for each iteration and re-run the rendering for those blocks
+ * 3. render attributes. this will add the attributes to all the blocks not within each blocks
+ */
+// eslint-disable-next-line import/prefer-default-export
+export function renderTemplate(
+  template: string | string[],
+  data: Record<string, unknown>,
+): string {
+  const templateString = Array.isArray(template)
+    ? template.join('\n')
+    : template;
+  const conditionalTemplate = expandConditionalsAndLoops(templateString, data);
+  return replaceAttributes(conditionalTemplate, data);
+}