@3cr/viewer-browser 0.0.247 → 0.0.292

package/src/services/viewer-3cr.service.ts

@@ -1,7 +1,6 @@
 import { createInstance, executePayload, registerOnPayloadHandler } from '@3cr/sdk-browser';
 import { unref } from 'vue';
 import {
-  AnchorPoint,
   DataOverlaysActions,
   FileManagementActions,
   FrontEndInterfaces,
@@ -11,7 +10,6 @@ import {
   PresetsActions,
   ScanMovementActions,
   ScanOrientationActions,
-  ScanView,
   SlidersActions,
   ViewSelectionActions,
   FrontEndPayload,
@@ -22,29 +20,47 @@ import {
   ObjectColour,
   ObjectInvert,
   ObjectVisibility,
+  NavigationCubeTransform,
+  ColourData,
+  MovementData,
+  RotationValue,
+  FlipValue,
+  InvertTransformData,
+  DataOverlayData,
   ViewToggleData,
-  GraphicType
+  GraphicType,
+  ColourPresetData,
+  GreyscalePresetData,
+  LoadFileData,
+  LocalLoadDataset,
+  LoadSessionState,
+  ObjectInfo,
+  ObjectId,
+  ObjectPosition,
+  ObjectSize,
+  ObjectIcon,
+  ObjectSize2D,
+  ParentPayload,
+  UnparentPayload
 } from '@3cr/types-ts';
-import { LoadViewerPayload } from '@/models/loadViewerPayload';
+import {
+  ActionCallback,
+  InterfaceCallback,
+  Viewer3crPayload,
+  Viewer3crService,
+  ViewerPayload
+} from '@3cr/viewer-types-ts';
 import { currentColourPreset, previousLayout, transactionStarted } from '@/models/scanState';
 import { EventHandlers } from '@/models/eventHandlers';
-import { clamp } from '@/functions/clamp';
-import { LoadSessionState } from '@3cr/types-ts/types/LoadSessionState';
-
-type InterfaceCallback = (
-  message: string,
-  action: string,
-  returnChannel: string,
-  returnTo: string
-) => void | Promise<void>;
-
-type ActionCallback = (message: string, returnChannel: string, returnTo: string) => void | Promise<void>;
 
-export const emptyPayload = { Version: '1.1.0' };
+type ObjectDimensionalVisibility = {
+  Version: string;
+  Id: string;
+  Visibility2d: boolean;
+  Visibility3d: boolean;
+};
 
-type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
-
-export class Viewer3crService {
+export class Viewer3crServiceImpl implements Viewer3crService {
   private interfaceCallbacks = new EventHandlers<string, InterfaceCallback>();
 
   private actionCallbacks = new EventHandlers<string, ActionCallback>();
@@ -71,272 +87,366 @@ export class Viewer3crService {
   }
 
   /**
-   * DO-03: Toggle 2D annotation visibility.
-   * @param value The object visibility
+   * DO-03: Set 2D annotation visibility.
+   * @param payload The object visibility payload.
+   */
+  async setAnnotation2dVisibility(payload: Viewer3crPayload<ObjectVisibility>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do03, payload);
+  }
+
+  /**
+   * DO-04: Set 2D annotation icon size.
+   * @param payload The annotation 2D size payload.
+   */
+  async setAnnotation2dSize(payload: Viewer3crPayload<ObjectSize2D>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do04, payload);
+  }
+
+  /**
+   * DO-05: Set 2D annotation colour.
+   * @param payload The annotation 2D colour payload.
+   */
+  async setAnnotation2dColour(payload: Viewer3crPayload<ObjectColour>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do05, payload);
+  }
+
+  /**
+   * DO-06: Set annotation icon.
+   * @param payload The annotation icon payload.
+   */
+  async setAnnotationIcon(payload: Viewer3crPayload<ObjectIcon>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do06, payload);
+  }
+
+  /**
+   * DO-08: Set 3D annotation size.
+   * @param payload The annotation 3D size payload.
+   */
+  async setAnnotation3dSize(payload: Viewer3crPayload<ObjectSize>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do08, payload);
+  }
+
+  /**
+   * DO-09: Set 3D annotation colour.
+   * @param payload The annotation 3D colour payload.
    */
-  async toggle2dAnnotation(value: Optional<ObjectVisibility, 'Version'>): Promise<void> {
-    value.Version ??= '1.1.0';
-    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do03, value);
+  async setAnnotation3dColour(payload: Viewer3crPayload<ObjectColour>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do09, payload);
   }
 
   /**
-   * DO-11: Toggle 3D annotation visibility.
-   * @param value The object visibility
+   * DO-11: Set 3D annotation visibility.
+   * @param payload The object visibility payload.
    */
-  async toggle3dAnnotation(value: Optional<ObjectVisibility, 'Version'>): Promise<void> {
-    value.Version ??= '1.1.0';
-    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do11, value);
+  async setAnnotation3dVisibility(payload: Viewer3crPayload<ObjectVisibility>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.data_overlay, DataOverlaysActions.do11, payload);
   }
 
   /**
    * FM-01: Load scan.
-   * @param options The load scan options.
+   * @param payload The load scan payload.
    */
-  async loadScan(options: LoadViewerPayload): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm01, options);
+  async loadScan(payload: Viewer3crPayload<ViewerPayload>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm01, payload);
   }
 
   /**
    * FM-03: Load previous CurrentScanState values.
-   * @param value The URL to the file.
+   * @param payload The load session payload.
    */
-  async loadScanSession(value: Optional<LoadSessionState, 'Version'>): Promise<void> {
-    value.Version ??= '1.1.0';
-    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm03, value);
+  async loadScanSession(payload: Viewer3crPayload<LoadSessionState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm03, payload);
   }
 
   /**
    * FM-05: Sets the data overlay session with the given session file.
    * This will clear all previously loaded data overlay sessions.
-   * @param value The URL to the file.
+   * @param payload The load session payload.
    */
-  async setDataOverlaySession(value: Optional<LoadSessionState, 'Version'>): Promise<void> {
-    value.Version ??= '1.1.0';
-    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm05, value);
+  async setDataOverlaySession(payload: Viewer3crPayload<LoadSessionState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm05, payload);
   }
 
   /**
    * FM-06: Adds a data overlay session to existing sessions.
-   * @param value The URL to the file.
+   * @param payload The load session payload.
    */
-  async addDataOverlaySession(value: Optional<LoadSessionState, 'Version'>): Promise<void> {
-    value.Version ??= '1.1.0';
-    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm06, value);
+  async addDataOverlaySession(payload: Viewer3crPayload<LoadSessionState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm06, payload);
+  }
+
+  /**
+   * FM-07: Receives URL from external UI for MCAD Object and reads meta-data of each object.
+   * @param payload The load MCAD payload.
+   */
+  async loadExternalMcadObject(payload: Viewer3crPayload<LoadFileData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm07, payload);
+  }
+
+  /**
+   * FM-08: Local File Path for Loading of a MCAD Object.
+   * @param payload The load MCAD payload.
+   */
+  async loadLocalMcadObject(payload: Viewer3crPayload<LocalLoadDataset>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm08, payload);
   }
 
   /**
    * FM-09: Load separate MCAD file from external UI.
-   * @param value The URL to the file.
-   * @param returnChannel The return channel.
-   * @param returnTo The return to id.
-   */
-  async loadMcadObjects(
-    value?: Optional<LoadSessionState, 'Version'>,
-    returnChannel?: string[],
-    returnTo?: string
-  ): Promise<void> {
-    await this.sendPayload(
-      FrontEndInterfaces.file_management,
-      FileManagementActions.fm09,
-      value,
-      returnChannel,
-      returnTo
-    );
+   * @param payload The load session payload.
+   */
+  async loadMcadObjects(payload: Viewer3crPayload<LoadSessionState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.file_management, FileManagementActions.fm09, payload);
   }
 
-  async viewSelection(action: ViewSelectionActions) {
-    await this.sendPayload(FrontEndInterfaces.view_selection, action, emptyPayload);
+  /**
+   * IN-01: Enable or disable the mouse input.
+   * @param payload The interactivity state payload.
+   */
+  async setMouseInput(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.interactivity, InteractivityActions.in01, payload);
   }
 
-  async viewSelectionToggleView(payload: Optional<ViewToggleData, 'Version'>) {
-    await this.sendPayload(FrontEndInterfaces.view_selection, ViewSelectionActions.vs07, payload);
+  /**
+   * IN-02: Enable or disable the keyboard input.
+   * @param payload The interactivity state payload.
+   */
+  async setKeyboardInput(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.interactivity, InteractivityActions.in02, payload);
   }
 
-  async sliderHandler(action: SlidersActions, value: number) {
-    if (unref(transactionStarted)) return;
-    await this.slider(action, value);
+  /**
+   * MC-03: Set visibility of MCAD objects.
+   * @param payload The object visibility payload.
+   */
+  async setMcadObjectVisibility(payload: Viewer3crPayload<ObjectVisibility>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc03, payload);
   }
 
-  async scanMovementHandler(action: ScanMovementActions, value: number) {
-    if (unref(transactionStarted)) return;
-    await this.scanMovement(action, value);
+  /**
+   * MC-04: Set colour & opacity of MCAD objects.
+   * @param payload The object colour payload.
+   */
+  async setMcadObjectColour(payload: Viewer3crPayload<ObjectColour>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc04, payload);
   }
 
-  async layouts(action: LayoutActions) {
-    if (action !== LayoutActions.lo01) previousLayout.value = action;
-    await this.sendPayload(FrontEndInterfaces.layout, action, emptyPayload);
+  /**
+   * MC-05: Enables movement of MCAD objects.
+   * @param payload The object state payload.
+   */
+  async moveMcadObject(payload: Viewer3crPayload<ObjectBoolean>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc05, payload);
   }
 
-  async setPreset(action: PresetsActions, preset: any) {
-    await this.sendPayload(FrontEndInterfaces.presets, action, preset);
-    if (action === PresetsActions.pr02) {
-      currentColourPreset.value = preset;
-    }
+  /**
+   * MC-06: Enables rotation of MCAD objects.
+   * @param payload The object state payload.
+   */
+  async rotateMcadObject(payload: Viewer3crPayload<ObjectBoolean>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc06, payload);
   }
 
   /**
-   * MC-03: Set visibility of MCAD objects.
-   * @param value The object visibility value.
+   * MC-09: Lock or unlock MCAD objects.
+   * @param payload The lock payload.
    */
-  async setMcadObjectVisibility(value: Optional<ObjectVisibility, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc03, value);
+  async lockMcad(payload: Viewer3crPayload<ObjectBoolean>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc09, payload);
   }
 
   /**
-   * MC-04: Set colour & opacity of MCAD objects.
-   * @param value The colour & opacity value.
+   * MC-10: Group MCAD objects.
+   * @param payload The group MCAD payload.
    */
-  async setMcadObjectColour(value: Optional<ObjectColour, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc04, value);
+  async groupMcad(payload: Viewer3crPayload<ParentPayload>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc10, payload);
   }
 
   /**
-   * MC-05: Enables movement of MCAD objects.
-   * @param value The movement toggle.
+   * MC-11: Ungroup MCAD objects.
+   * @param payload The ungroup MCAD payload.
    */
-  async moveMcadObject(value: Optional<ObjectBoolean, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc05, value);
+  async ungroupMcad(payload: Viewer3crPayload<UnparentPayload>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc11, payload);
   }
 
   /**
    * MC-16: Invert MCAD objects.
-   * @param value The inversion state.
+   * @param payload The object invert payload.
+   */
+  async invertMcadObject(payload: Viewer3crPayload<ObjectInvert>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc16, payload);
+  }
+
+  /**
+   * MC-17: Remove MCAD objects.
+   * @param payload The remove MCAD object payload.
+   */
+  async removeMcadObject(payload: Viewer3crPayload<ObjectId>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc17, payload);
+  }
+
+  /**
+   * MC-18: Set MCAD object title.
+   * @param payload The MCAD object title payload.
    */
-  async invertMcadObject(value: Optional<ObjectInvert, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc16, value);
+  async setMcadObjectTitle(payload: Viewer3crPayload<ObjectInfo>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.mcad, McadActions.mc18, payload);
   }
 
   /**
-   * MU-16: Set 2D/3D visibility of markups.
-   * @param id The markup id.
-   * @param visibility The visibility state.
+   * MU-01: Create a 2d annotation.
+   * @param payload The 2d annotation interaction payload.
    */
-  async setMarkupVisibility(id: string, visibility: boolean): Promise<void> {
-    const payload = { Version: '1.2.1', Id: id, Visibility2d: visibility, Visibility3d: visibility };
-    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu16, [payload]);
+  async createAnnotation2dTool(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu01, payload);
+  }
+
+  /**
+   * MU-02: Create a 3d annotation.
+   * @param payload The 3d annotation interaction payload.
+   */
+  async createAnnotation3dTool(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu02, payload);
+  }
+
+  /**
+   * MU-03: Create Annotation(s) in 2D/3D.
+   * @param payload The create annotation payload.
+   */
+  async createAnnotation(payload: Viewer3crPayload<DataOverlayData[]>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu03, payload);
+  }
+
+  /**
+   * MU-04: Move annotation in 2D view.
+   * @param payload The move annotation payload.
+   */
+  async moveAnnotation2dTool(payload: Viewer3crPayload<ObjectBoolean>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu04, payload);
+  }
+
+  /**
+   * MU-05: Move annotation in 3D view.
+   * @param payload The move annotation payload.
+   */
+  async moveAnnotation3dTool(payload: Viewer3crPayload<ObjectBoolean>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu05, payload);
+  }
+
+  /**
+   * MU-06: Move multiple annotations.
+   * @param payload The move annotations payload.
+   */
+  async moveAnnotation(payload: Viewer3crPayload<ObjectPosition[]>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu06, payload);
+  }
+
+  /**
+   * MU-07: Remove annotation.
+   * @param payload The remove annotation payload.
+   */
+  async removeAnnotation(payload: Viewer3crPayload<ObjectId>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu07, payload);
+  }
+
+  /**
+   * MU-08: Update annotation title.
+   * @param payload The update annotation title payload.
+   */
+  async updateAnnotationTitle(payload: Viewer3crPayload<ObjectInfo>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu08, payload);
+  }
+
+  /**
+   * MU-09: Update annotation description.
+   * @param payload The update annotation description payload.
+   */
+  async updateAnnotationDescription(payload: Viewer3crPayload<ObjectInfo>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu09, payload);
+  }
+
+  /**
+   * MU-10: Update annotation actions.
+   * @param payload The update annotation actions payload.
+   */
+  async updateAnnotationActions(payload: Viewer3crPayload<ObjectInfo>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu10, payload);
+  }
+
+  /**
+   * MU-16: Set 2D/3D visibility of measurements.
+   * @param payload The measurement visibility payload.
+   */
+  async setMeasurementVisibility(payload: Viewer3crPayload<ObjectDimensionalVisibility[]>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu16, payload);
   }
 
   /**
    * MU-20: 2D length tool.
-   * @param value If the length tool should be enabled.
+   * @param payload The tool interactivity payload.
    */
-  async lengthTool(value: Optional<InteractivityState, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu20, value);
+  async lengthTool(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu20, payload);
   }
 
   /**
    * MU-21: 2D polygon tool.
-   * @param value If the polygon tool should be enabled.
+   * @param payload The tool interactivity payload.
    */
-  async polygonTool(value: Optional<InteractivityState, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu21, value);
+  async polygonTool(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu21, payload);
   }
 
   /**
    * MU-22: 2D angle tool.
-   * @param value If the angle tool should be enabled.
+   * @param payload The tool interactivity payload.
    */
-  async angleTool(value: Optional<InteractivityState, 'Version'>): Promise<void> {
-    value.Version ??= '1.2.0';
-    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu22, value);
+  async angleTool(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.markups, MarkupsActions.mu22, payload);
   }
 
   /**
    * NC-01: Set Navigation Cube Co-ordinates and Size.
-   * @param anchorPoint The anchor point on the screen.
-   * @param x The x-axis offset.
-   * @param y The y-axis offset.
-   * @param width The navigation cube width.
-   * @param height The navigation cube height.
-   */
-  async setNavCubePositionSize(
-    anchorPoint: AnchorPoint,
-    x: number,
-    y: number,
-    width: number,
-    height: number
-  ): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc01, {
-      Version: '0.0.1',
-      AnchorPoint: anchorPoint,
-      Position: { Version: '0.0.1', X: x, Y: y },
-      Size: { Version: '0.0.1', X: width, Y: height }
-    });
+   * @param payload The navigation cube payload.
+   */
+  async setNavCubePositionSize(payload: Viewer3crPayload<NavigationCubeTransform>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc01, payload);
   }
 
   /**
    * NC-02: Set Navigation Cube Visibility.
-   * @param visibility If the navigation cube is visible.
+   * @param payload The navigation cube visibility payload.
    */
-  async setNavCubeVisibility(visibility: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc02, {
-      Version: '0.0.1',
-      Value: visibility
-    });
+  async setNavCubeVisibility(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc02, payload);
   }
 
   /**
    * NC-03: Set Navigation Cube Interactivity.
-   * @param interactivity If the navigation cube is interactive.
+   * @param payload The navigation cube interactivity payload.
    */
-  async setNavCubeInteractivity(interactivity: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc03, {
-      Version: '0.0.1',
-      Value: interactivity
-    });
-  }
-
-  /**
-   * NC-04: Set Navigation Cube Perspective
-   * @param perspective If perspective shift is removed.
-   */
-  async setNavCubePerspective(perspective: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc04, {
-      Version: '0.0.1',
-      Value: perspective
-    });
+  async setNavCubeInteractivity(payload: Viewer3crPayload<InteractivityState>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc03, payload);
   }
 
   /**
    * NC-05: Set Navigation Cube Colour and Opacity.
-   * All values must be floats between 0 and 255.
-   * @param r Red channel.
-   * @param g Green channel.
-   * @param b Blue channel.
-   * @param a Alpha channel.
+   * All values must be floats between 0 and 1.
+   * @param payload The navigation cube colour payload.
    */
-  async setNavCubeColourOpacity(r: number, g: number, b: number, a: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc05, {
-      Version: '0.0.1',
-      R: clamp(r / 255, 0, 1),
-      G: clamp(g / 255, 0, 1),
-      B: clamp(b / 255, 0, 1),
-      A: clamp(a / 255, 0, 1)
-    });
+  async setNavCubeColourOpacity(payload: Viewer3crPayload<ColourData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc05, payload);
   }
 
   /**
    * NC-07: Set Navigation Cube Highlight Colour and Opacity.
    * All values must be floats between 0 and 255.
-   * @param r Red channel.
-   * @param g Green channel.
-   * @param b Blue channel.
-   * @param a Alpha channel.
+   * @param payload The navigation cube highlight colour payload.
    */
-  async setNavCubeHighlightColourOpacity(r: number, g: number, b: number, a: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc07, {
-      Version: '0.0.1',
-      R: clamp(r / 255, 0, 1),
-      G: clamp(g / 255, 0, 1),
-      B: clamp(b / 255, 0, 1),
-      A: clamp(a / 255, 0, 1)
-    });
+  async setNavCubeHighlightColourOpacity(payload: Viewer3crPayload<ColourData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc07, payload);
   }
 
   /**
@@ -344,198 +454,155 @@ export class Viewer3crService {
    * @param type Face type of cube.
    */
   async setNavCubeGraphics(type: GraphicType): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc08, {
-      Version: '0.0.1',
-      Value: type
-    });
+    const message = { Version: '0.0.1', Value: type };
+    await this.sendPayload(FrontEndInterfaces.navigation_cube, NavigationCubeActions.nc08, { message });
   }
 
   /**
    * SM-13: Pan the selected view to the left.
-   * @param view The view.
-   * @param value The movement in mm.
+   * @param payload The scan movement payload.
    */
-  async panLeft(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm13, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async panLeft(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm13, payload);
   }
 
   /**
    * SM-14: Pan the selected view to the right.
-   * @param view The view.
-   * @param value The movement in mm.
+   * @param payload The scan movement payload.
    */
-  async panRight(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm14, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async panRight(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm14, payload);
   }
 
   /**
    * SM-15: Pan the selected view upwards.
-   * @param view The view.
-   * @param value The movement in mm.
+   * @param payload The scan movement payload.
    */
-  async panUp(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm15, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async panUp(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm15, payload);
   }
 
   /**
    * SM-16: Pan the selected view downwards.
-   * @param view The view.
-   * @param value The movement in mm.
+   * @param payload The scan movement payload.
    */
-  async panDown(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm16, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async panDown(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm16, payload);
   }
 
   /**
    * SM-17: Zoom In.
-   * @param view The view.
-   * @param value The amount to zoom in.
+   * @param payload The scan zoom payload.
    */
-  async zoomIn(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm17, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async zoomIn(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm17, payload);
   }
 
   /**
    * SM-18: Zoom out.
-   * @param view The view.
-   * @param value The amount to zoom out.
+   * @param payload The scan zoom payload.
    */
-  async zoomOut(view: ScanView, value: number): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm18, {
-      Version: '0.0.1',
-      View: view,
-      Movement: value
-    });
+  async zoomOut(payload: Viewer3crPayload<MovementData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm18, payload);
+  }
+
+  /**
+   * SM-26: Pan view.
+   * @param payload The pan payload.
+   */
+  async pan(payload: Viewer3crPayload<ViewToggleData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_movement, ScanMovementActions.sm26, payload);
   }
 
   /**
    * SO-01: Rotate 2D view by up to +-XXX degrees.
-   * @param view The 2D view.
-   * @param deg The degrees.
+   * @param payload The scan movement payload.
    */
-  async rotateByDeg(view: ScanView, deg: number) {
-    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so01, {
-      Version: '0.0.1',
-      View: view,
-      Angle: deg
-    });
+  async rotateByDeg(payload: Viewer3crPayload<RotationValue>) {
+    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so01, payload);
   }
 
   /**
    * SO-02: Flip 2D View Horizontally.
-   * @param view The scan view.
-   * @param flipped Whether to enable horizontal flip.
+   * @param payload The scan flip payload.
    */
-  async flipHorizontally(view: ScanView, flipped: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so02, {
-      Version: '0.0.1',
-      View: view,
-      Flipped: flipped
-    });
+  async flipHorizontally(payload: Viewer3crPayload<FlipValue>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so02, payload);
   }
 
   /**
    * SO-03: Flip 2D View Vertically.
-   * @param view The scan view.
-   * @param flipped Whether to enable vertical flip.
+   * @param payload The scan flip payload.
    */
-  async flipVertically(view: ScanView, flipped: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so03, {
-      Version: '0.0.1',
-      View: view,
-      Flipped: flipped
-    });
+  async flipVertically(payload: Viewer3crPayload<FlipValue>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so03, payload);
   }
 
   /**
    * SO-04: Invert Volume Rendering
-   * @param sagittal If the Sagittal axis is inverted.
-   * @param coronal If the Coronal axis is inverted.
-   * @param transverse If the Transverse axis is inverted.
+   * @param payload The invert volume payload.
    */
-  async invertTransform(sagittal: boolean, coronal: boolean, transverse: boolean): Promise<void> {
-    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so04, {
-      Version: '0.0.1',
-      InvertedSagittal: sagittal,
-      InvertedCoronal: coronal,
-      InvertedTransverse: transverse
-    });
+  async invertTransform(payload: Viewer3crPayload<InvertTransformData>): Promise<void> {
+    await this.sendPayload(FrontEndInterfaces.scan_orientation, ScanOrientationActions.so04, payload);
   }
 
-  /**
-   * IN-01, IN-02: Enable/Disable Unity input interactions.
-   * @param isHovering If the inputs should be enabled.
-   */
-  async hoverOverCanvas(isHovering: boolean) {
-    await this.sendPayload(FrontEndInterfaces.interactivity, InteractivityActions.in01, {
-      Version: '0.0.1',
-      Value: isHovering
-    });
-    await this.sendPayload(FrontEndInterfaces.interactivity, InteractivityActions.in02, {
-      Version: '0.0.1',
-      Value: isHovering
-    });
+  async viewSelection(action: ViewSelectionActions) {
+    const payload = { message: { Version: '1.0.0' } };
+    await this.sendPayload(FrontEndInterfaces.view_selection, action, payload);
+  }
+
+  async viewSelectionToggleView(payload: Viewer3crPayload<ViewToggleData>) {
+    await this.sendPayload(FrontEndInterfaces.view_selection, ViewSelectionActions.vs07, payload);
+  }
+
+  async sliderHandler(action: SlidersActions, value: number) {
+    if (unref(transactionStarted)) return;
+    await this.slider(action, value);
+  }
+
+  async scanMovementHandler(action: ScanMovementActions, value: number) {
+    if (unref(transactionStarted)) return;
+    await this.scanMovement(action, value);
+  }
+
+  async layouts(action: LayoutActions) {
+    if (action !== LayoutActions.lo01) previousLayout.value = action;
+    const payload = { message: { Version: '1.0.0' } };
+    await this.sendPayload(FrontEndInterfaces.layout, action, payload);
+  }
+
+  async setPreset(action: PresetsActions, preset: ColourPresetData | GreyscalePresetData) {
+    const payload = { message: preset };
+    await this.sendPayload(FrontEndInterfaces.presets, action, payload);
+    if (action === PresetsActions.pr02) {
+      currentColourPreset.value = preset as ColourPresetData;
+    }
   }
 
   private async scanMovement(action: ScanMovementActions, value: number) {
-    await this.sendPayload(FrontEndInterfaces.scan_movement, action, {
-      Version: '0.0.1',
-      Value: value
-    });
+    const payload = { message: { Version: '0.0.1', Value: value } };
+    await this.sendPayload(FrontEndInterfaces.scan_movement, action, payload);
   }
 
   private async slider(action: SlidersActions, value: number) {
-    await this.sendPayload(FrontEndInterfaces.sliders, action, {
-      Version: '0.0.1',
-      Value: value
-    });
+    const payload = { message: { Version: '0.0.1', Value: value } };
+    await this.sendPayload(FrontEndInterfaces.sliders, action, payload);
   }
 
-  async sendPayload(
-    iface: string,
-    action: string,
-    message: any,
-    returnChannel?: string[],
-    returnTo?: string
-  ): Promise<void> {
+  async sendPayload(iface: string, action: string, payload: Viewer3crPayload<unknown>): Promise<void> {
     await executePayload({
       Version: '0.0.1',
       Interface: iface as any,
       Action: action as any,
-      ReturnChannel: returnChannel ? JSON.stringify(returnChannel) : null,
-      ReturnTo: returnTo ?? null,
-      Message: JSON.stringify(message)
+      Message: payload.message ? JSON.stringify(payload.message) : null,
+      ReturnChannel: payload.returnChannel ? JSON.stringify(payload.returnChannel) : null,
+      ReturnTo: payload.returnTo ?? null
     });
   }
 
   async onPayload(payload: FrontEndPayload): Promise<void> {
-    await this.interfaceCallbacks.call(
-      payload.Interface,
-      payload.Message,
-      payload.Action,
-      payload.ReturnChannel,
-      payload.ReturnTo
-    );
-    await this.actionCallbacks.call(payload.Action, payload.Message, payload.ReturnChannel, payload.ReturnTo);
+    const { Interface, Message, Action, ReturnChannel, ReturnTo } = payload;
+    await this.interfaceCallbacks.call(Interface, Message, Action, ReturnChannel, ReturnTo);
+    await this.actionCallbacks.call(Action, Message, ReturnChannel, ReturnTo);
   }
 }