Member Junction
    Preparing search index...

    The LIVE WHITEBOARD canvas surface (mj-realtime-whiteboard): dotted-grid board with pan/zoom, per-tool pointer interactions (select/move with ghost + handles, pan, smoothed freehand pen, drag-create shapes, click-place stickies/text with inline edit, image paste, item→item connectors with floating-point fallback, eraser, dismissible highlights), ownership chips, agent pop-in flash and the input-driven agent presence cursor.

    All mutations go through the shared WhiteboardState engine — the same API the agent's channel tools use — so undo/redo and the perception feed see one history.

    Implements

    • OnInit
    • OnDestroy
    • AfterViewChecked
    Index

    Constructors

    Properties

    AgentName: string = 'Agent'

    Display name of the session's agent ("Sage") — chips, highlight tags, presence label.

    AgentPresence: WhiteboardAgentPresence = null

    Agent presence cursor (pulsing ring + "… is drawing" label), driven by the host.

    ContentApplied: EventEmitter<WhiteboardContentAppliedEventArgs> = ...

    AFTER event: an editor commit applied to the state engine.

    ContentApplying: EventEmitter<WhiteboardContentApplyingEventArgs> = ...

    Cancelable BEFORE event: an in-board editor commit (inline sticky/text/shape edit or the markdown/HTML rich editor's Apply/Done) is about to write to the state engine. Set Cancel = true synchronously to discard the commit; handlers may also rewrite the args' Content / Title.

    ContextMenu: {
        Actions: WhiteboardContextMenuAction[];
        ItemID: string;
        Left: number;
        PageID: string;
        Point: WhiteboardPoint;
        Top: number;
    } = null

    The open right-click context menu (canvas-relative position + model), or null.

    Type Declaration

    • Actions: WhiteboardContextMenuAction[]
    • ItemID: string

      Target item, or null for the empty-canvas / page-chip menus.

    • Left: number
    • PageID: string

      Target page (a right-clicked page chip), or null for item/canvas menus.

    • Point: WhiteboardPoint

      Board-coordinate click point — "add … here" placement target.

    • Top: number
    EditingID: string = null
    Handles: ResizeHandle[] = ...
    Interaction: BoardInteraction = null
    MinimapOpen: boolean = false
    PanX: number = 0
    PanY: number = 0
    PenColor: string = ...

    Selected pen ink color.

    PendingConnector: PendingConnector = null
    PenWidth: number = 4

    Selected pen stroke width.

    PopInIDs: Set<string> = ...

    Agent items that just popped in (drive the .pop-in violet flash).

    ReadOnly: boolean = false

    Read-only mode (artifact viewer / session review): all mutating pointer interactions, paste, and inline editing are disabled; pan + zoom remain available for navigation.

    RichEditor: RichEditorState = null

    The rich-content editor panel state (markdown / html items), or null when closed.

    ShapeKind: WhiteboardShapeKind = 'rect'

    Selected shape kind for drag-create.

    Shared board state engine (owned by the integration layer, passed via the host).

    TextBold: boolean = true

    Selected text bold state for click-placed text (labels render bold by default).

    TextColor: string = null

    Selected text color for click-placed text (null = theme default).

    TextFamily: WhiteboardFontFamily = 'sans'

    Selected text font family for click-placed text.

    TextSize: number = 12

    Selected text font size for click-placed text (curated steps; 12 = CSS default).

    ToolChangeRequest: EventEmitter<WhiteboardTool> = ...

    Requests a tool switch decided by a board gesture (e.g. Esc → select).

    WidgetInteraction: EventEmitter<WhiteboardWidgetInteractionEvent> = ...

    AMBIENT widget telemetry: the injected recorder observed passive form activity (clicks / changes / typing / focus) inside a sandboxed HTML widget — no widget-authored script involved. The batch was validated (marker + tracked source + size cap + shape) and pre-summarized into one compact human line. Integration layers forward it to their agent runtime as low-priority background context (MJ's channel plugin throttles per widget and frames it as a do-not-respond [whiteboard] note).

    WidgetSubmitted: EventEmitter<WhiteboardWidgetSubmitEvent> = ...

    AFTER event: a validated widget submission was accepted (not canceled). Integration layers forward this to their agent/automation runtime — e.g. MJ's realtime channel plugin surfaces it to the live agent as a [whiteboard] context note.

    WidgetSubmitting: EventEmitter<WhiteboardWidgetSubmittingEventArgs> = ...

    Cancelable BEFORE event: a sandboxed HTML widget called MJWhiteboard.submit(data) and the payload passed validation (marker + tracked source window + size cap). Handlers run synchronously — set Cancel = true on the args to drop the submission (WidgetSubmitted then never fires).

    Zoom: number = 0.9

    Accessors

    • get MinimapItems(): {
          Agent: boolean;
          H: number;
          W: number;
          X: number;
          Y: number;
      }[]

      Returns { Agent: boolean; H: number; W: number; X: number; Y: number }[]

    Methods

    • Cancel any in-flight transient gesture (tool switch, Esc) — incl. the rich editor + context menu.

      Returns void

    • Commit the inline editor's value to the edited sticky / text / shape item. Routes through the ContentApplying (cancelable) / ContentApplied event pair; an empty commit on a JUST-PLACED sticky/text abandons the placement instead (the item is removed — that path raises the engine's remove events, not the content pair).

      Parameters

      • value: string

      Returns void

    • Cheap "on-screen-ish" check that gates iframe instantiation for HTML widgets: only widgets within (or near) the current viewport get a live sandboxed frame; the rest render a static placeholder until panned/zoomed into view. Re-entering view re-creates the frame (any internal widget state resets — acceptable for board decorations).

      Parameters

      Returns boolean

    • A callback method that is invoked immediately after the default change detector has completed one change-check cycle for a component's view.

      Returns void

    • A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.

      Returns void

    • A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.

      Returns void

    • Right-click on empty canvas → the "add … here" menu (suppresses the native menu).

      Parameters

      • event: MouseEvent

      Returns void

    • Paste an image from the clipboard onto the board (mockup: pasted-image card).

      Parameters

      • event: ClipboardEvent

      Returns void

    • Esc inside the editor panel closes it; keys must not leak to the board shortcuts.

      Parameters

      • event: KeyboardEvent

      Returns void

    • Markdown editor: flip between the source editor and the rendered preview.

      Parameters

      • preview: boolean

      Returns void

    • Explicit wrap width for a text label (resize / tool w) — null lets the CSS max-width wrap. Honors an in-flight RESIZE transient so the live preview tracks the handle drag (a move transient is deliberately ignored: its W is the rough bounds ESTIMATE, and stamping it inline would re-wrap an unsized label mid-drag).

      Parameters

      Returns number

    • Continuous zoom by a multiplicative factor at the viewport center — the hold-to-zoom tick path (the zoom cluster emits ~3.5% factors every 50 ms while a +/− button is held). Clamped to the same 25%–200% limits as the stepped zoom.

      Parameters

      • factor: number

      Returns void