Player Panel

The Player Panel is the primary visualization component for machining simulation playback.

Key Models

• LocalProjectService - Project data service
• UserService - User service

Associated Tool Bars

• Player Tool Bar
• RenderingCanvas Tool Bar
• Player extended RenderingCanvas Tool Bar

Layout Structure

The Player Panel consists of:

• Central Area: RenderingCanvas for 3D visualization
• Vertical Splitter: Draggable bar to resize widths
• Side Panel:
  • Upper: Selected-Step Info Panel
  • Horizontal Splitter: Draggable bar to resize heights
  • Lower: Session Message Panel

Default Panel Configuration

The Player Panel is set as the default panel on the Page Panel when the main window opens. The associated toolbars (Player Tool Bar, RenderingCanvas Tool Bar, Player Extended RenderingCanvas Tool Bar) are also configured accordingly.

Player Extended RenderingCanvas Tool Bar Behavior

The Player Extended RenderingCanvas Tool Bar provides additional controls:

• CL Strip Buttons and Fit View Button - Controls for CL strip display and view fitting
• Project Rendering Items DropDown - Selection of rendering items

The toolbar receives notifications when the project is changed from Main Panel.

Related Preference

• Step Present Preference Page - Controls step presentation settings

RenderingCanvas Behavior

The RenderingCanvas displays the machining project visualization:

1. On initialization, a MachiningProjectDisplayee is created and assigned to RenderingCanvas.DispEngine.Displayee
2. The displayee receives project data from LocalProjectService
3. The RenderingCanvas is disposed when the Player Panel is disposed

Source Code Locations

See HiNC GUI Architecture for git repository links.

WPF Application

• Play/PlayerPanel

Web Application

HiNC-2025-webservice (Quasar CLI SPA):

Core page + toolbars:

• wwwroot-src/src/pages/PlayerPage.vue — routed page at /player. Hosts the top toolbar row, the central <RenderingCanvas>, and the right-hand splitter with step-info + session-message panels.
• wwwroot-src/src/components/player/PlayerToolBar.vue — play / pause / stop / seek controls.
• wwwroot-src/src/components/player/PlayerExtendedToolBar.vue — Display Options ▾ (via the shared DisplayOptionsMenu) + CL-strip fit-view controls + Project Rendering Items dropdown.
• wwwroot-src/src/components/player/PlayerDivisionVisibilityButton.vue — view_quilt icon button that drives the ten O1.1 layout toggles (which strip charts / cycle-line charts / info panels are visible). Persists via /api/preference/player-div-config.
• wwwroot-src/src/components/player/SelectedStepInfoPanel.vue — condensed step-info summary (see Selected-Step Info Panel).
• wwwroot-src/src/components/player/SessionMessagePanel.vue — mission-time message list.

Charts (see the dedicated anatomy pages for details):

• Strip Charts — three uplot-backed strip charts (availability / surface roughness / individual-property) driven by ClStrip.
• Cycle-Line Charts — four uplot-backed cycle-line charts (force / sim spindle moment / sensor spindle moment / dynamometer force).

Shared chart primitives (under components/player/charts/):

• UplotChart.vue — thin uplot wrapper with ResizeObserver + reactive data / series / bands bindings.
• BaseStripChart.vue — strip-chart skeleton that matches PluralStripChart (min / max banded series, header aspect picker, wheel / drag / click pointer handlers).
• BaseCycleLineChart.vue — cycle-line skeleton that takes a fetcher prop and re-fetches on SelectedStepInfoHub updates.

Backends:

• Players/PlayerController.cs — play / pause / stop / seek.
• Players/PlayerStatusHub.cs + Players/PlayerStatusService.cs — session lifecycle broadcasts.
• Players/SessionMessageHub.cs + Players/SessionMessageService.cs — mission-time message stream.
• Players/SelectedStepInfoHub.cs + Players/SelectedStepInfoService.cs — selected-step push notifications (drives step-info panel + cycle-line chart refetches).
• Players/ClStripController.cs + Players/ClStripHub.cs + Players/ClStripBroadcastService.cs — CL-strip range state + zoom / pan / select / enter broadcasts.
• Players/PlayerChartsController.cs — unified strip-chart + cycle-line-chart data endpoints.
• Players/PlayerCanvasHub.cs — rendering-canvas SignalR hub for the central viewer.

Implementation Checklist

Tip

When building a new Player Panel implementation:

1. Create the layout with RenderingCanvas
2. Set up RenderingCanvas behavior
3. Create Player Tool Bar
4. Create Player Extended RenderingCanvas Tool Bar with CL Strip, Fit View, and Rendering Items behaviors
5. Connect to Navigation Menu on Main Panel
6. Set Player Panel as default panel with associated toolbars
7. Build Session Message Panel, Selected-Step Info Panel, and Step Present Preference Page