Options
All
  • Public
  • Public/Protected
  • All
Menu

The global action bar displayed at the bottom of the game view. The Hotbar is a UI element at the bottom of the screen which contains Macros as interactive buttons. The Hotbar supports 5 pages of global macros which can be dragged and dropped to organize as you wish.

Left-clicking a Macro button triggers its effect. Right-clicking the button displays a context menu of Macro options. The number keys 1 through 0 activate numbered hotbar slots. Pressing the delete key while hovering over a Macro will remove it from the bar.

see

Macros

see

Macro

Hierarchy

Index

Constructors

  • new Hotbar(options: any): Hotbar

Properties

page: number

The currently viewed macro page

macros: Macro[]

The currently displayed set of macros

_collapsed: boolean

Track collapsed state

_hover: number

Track which hotbar slot is the current hover target, if any

options: any

The options provided to this application upon initialization

appId: number

The application ID is a unique incrementing integer which is used to identify every application window drawn by the VTT

_element: jQuery

An internal reference to the HTML element this application renders

position: any

Track the current position and dimensions of the Application UI

_dragDrop: DragDrop[]

DragDrop workflow handlers which are active for this Application

_tabs: Tabs[]

Tab navigation handlers which are active for this Application

_searchFilters: SearchFilter[]

SearchFilter handlers which are active for this Application

_minimized: boolean

Track whether the Application is currently minimized

_scrollPositions: any

Track the most recent scroll positions for any vertically scrolling containers

_state: number

The current render state of the Application

see

{Application.RENDER_STATES}

_priorState: number

The prior render state of this Application. This allows for rendering logic to understand if the application is being rendered for the first time.

see

{Application.RENDER_STATES}

RENDER_STATES: Readonly<{ CLOSING: -2; CLOSED: -1; NONE: 0; RENDERING: 1; RENDERED: 2; ERROR: 3 }> = ...

The sequence of rendering states that track the Application life-cycle.

Methods

  • getData(options?: {}): { page: number; macros: Macro[]; barClass: string }
  • override

    Parameters

    • options: {} = {}

      Returns { page: number; macros: Macro[]; barClass: string }

      • page: number
      • macros: Macro[]
      • barClass: string
    • collapse(): Promise<any>
    • Collapse the Hotbar, minimizing its display.

      Returns Promise<any>

      A promise which resolves once the collapse animation completes

    • expand(): Promise<any>
    • Expand the Hotbar, displaying it normally.

      Returns Promise<any>

      A promise which resolves once the expand animation completes

    • changePage(page: number): void
    • Change to a specific numbered page from 1 to 5

      Parameters

      • page: number

        The page number to change to.

      Returns void

    • cyclePage(direction: number): void
    • Change the page of the hotbar by cycling up (positive) or down (negative)

      Parameters

      • direction: number

        The direction to cycle

      Returns void

    • activateListeners(html: any): void
    • _contextMenu(html: any): void
    • _canDragStart(selector: any): boolean
    • _onDragStart(event: any): boolean
    • _canDragDrop(selector: any): boolean
    • _onDrop(event: any): Promise<User>
    • render(force?: boolean, options?: { left: number; top: number; width: number; height: number; scale: number; focus: boolean; renderContext: string; renderData: any }): Application
    • Render the Application by evaluating it's HTML template against the object of data provided by the getData method If the Application is rendered as a pop-out window, wrap the contained HTML in an outer frame with window controls

      Parameters

      • force: boolean = false

        Add the rendered application to the DOM if it is not already present. If false, the Application will only be re-rendered if it is already present.

      • options: { left: number; top: number; width: number; height: number; scale: number; focus: boolean; renderContext: string; renderData: any } = {}

        Additional rendering options which are applied to customize the way that the Application is rendered in the DOM.

        • left: number
        • top: number
        • width: number
        • height: number
        • scale: number
        • focus: boolean
        • renderContext: string
        • renderData: any

      Returns Application

      The rendered Application instance

    • activateTab(tabName: string, options?: { group: string; triggerCallback: boolean }): void
    • Change the currently active tab

      Parameters

      • tabName: string

        The target tab name to switch to

      • options: { group: string; triggerCallback: boolean } = {}

        Options which configure changing the tab

        • group: string

          A specific named tab group, useful if multiple sets of tabs are present

        • triggerCallback: boolean

          Whether to trigger tab-change callback functions

      Returns void

    • bringToTop(): void
    • Bring the application to the top of the rendering stack

      Returns void

    • close(options?: any): Promise<void>
    • Close the application and un-register references to it within UI mappings This function returns a Promise which resolves once the window closing animation concludes

      Parameters

      • options: any = {}

      Returns Promise<void>

      A Promise which resolves once the application is closed

    • minimize(): Promise<void>
    • Minimize the pop-out window, collapsing it to a small tab Take no action for applications which are not of the pop-out variety or apps which are already minimized

      Returns Promise<void>

      A Promise which resolves once the minimization action has completed

    • maximize(): Promise<void>
    • Maximize the pop-out window, expanding it to its original size Take no action for applications which are not of the pop-out variety or are already maximized

      Returns Promise<void>

      A Promise which resolves once the maximization action has completed

    • setPosition(position?: { left: number; top: number; width: number; height: string | number; scale: number }): void | { left: number; top: number; width: number; height: number; scale: number }
    • Set the application position and store its new location. Returns the updated position object for the application containing the new values.

      Parameters

      • position: { left: number; top: number; width: number; height: string | number; scale: number } = {}

        Positional data

        • left: number

          The left offset position in pixels

        • top: number

          The top offset position in pixels

        • width: number

          The application width in pixels

        • height: string | number

          The application height in pixels

        • scale: number

          The application scale as a numeric factor where 1.0 is default

      Returns void | { left: number; top: number; width: number; height: number; scale: number }

      |void}

    • _onClickMacro(event: MouseEvent): Promise<any>
    • Handle left-click events to

      Parameters

      • event: MouseEvent

        The originating click event

      Returns Promise<any>

    • _createDocumentSheetToggle(doc: Document): Promise<Macro>
    • Create a Macro document which can be used to toggle display of a Journal Entry.

      Parameters

      • doc: Document

        A Document which should be toggled

      Returns Promise<Macro>

      A created Macro document to add to the bar

    • _render(force?: boolean, options?: any): Promise<void>
    • An asynchronous inner function which handles the rendering of the Application

      Parameters

      • force: boolean = false

        Render and display the application even if it is not currently displayed.

      • options: any = {}

        Additional options which update the current values of the Application#options object

      Returns Promise<void>

      A Promise that resolves to the Application once rendering is complete

    • _saveScrollPositions(html: jQuery): void
    • Persist the scroll positions of containers within the app before re-rendering the content

      Parameters

      • html: jQuery

        The HTML object being traversed

      Returns void

    • _restoreScrollPositions(html: jQuery): void
    • Restore the scroll positions of containers within the app after re-rendering the content

      Parameters

      • html: jQuery

        The HTML object being traversed

      Returns void

    • _renderOuter(): Promise<jQuery>
    • Render the outer application wrapper

      Returns Promise<jQuery>

      A promise resolving to the constructed jQuery object

    • _activateCoreListeners(html: jQuery): void
    • Activate required listeners which must be enabled on every Application. These are internal interactions which should not be overridden by downstream subclasses.

      Parameters

      • html: jQuery

      Returns void

    • _onChangeTab(event: MouseEvent, tabs: Tabs, active: string): void
    • Handle changes to the active tab in a configured Tabs controller

      Parameters

      • event: MouseEvent

        A left click event

      • tabs: Tabs

        The Tabs controller

      • active: string

        The new active tab name

      Returns void

    • _onSearchFilter(event: KeyboardEvent, query: string, rgx: RegExp, html: HTMLElement): void
    • Handle changes to search filtering controllers which are bound to the Application

      Parameters

      • event: KeyboardEvent

        The key-up event from keyboard input

      • query: string

        The raw string input to the search field

      • rgx: RegExp

        The regular expression to test against

      • html: HTMLElement

        The HTML element which should be filtered

      Returns void

    • _onDragOver(event: DragEvent): void
    • Callback actions which occur when a dragged element is over a drop target.

      Parameters

      • event: DragEvent

        The originating DragEvent

      Returns void

    • _getMacrosByPage(page: number): Macro[]
    • Get the Array of Macro (or null) values that should be displayed on a numbered page of the bar

      Parameters

      • page: number

      Returns Macro[]

    • _getEntryContextOptions(): any[]
    • Get the Macro entry context options

      Returns any[]

      The Macro entry context options

    • _onClickPageControl(event: Event): void
    • Handle pagination controls

      Parameters

      • event: Event

        The originating click event

      Returns void

    • _onToggleBar(event: Event): Promise<any>
    • Handle click events to toggle display of the macro bar

      Parameters

      • event: Event

      Returns Promise<any>

    • toggleDocumentSheet(uuid: string): any
    • Handle toggling a document sheet.

      Parameters

      • uuid: string

        The Document UUID to display

      Returns any

    Accessors

    • get id(): string
    • Return the CSS application ID which uniquely references this UI element

      Returns string

    • get element(): jQuery
    • Return the active application element, if it currently exists in the DOM

      Returns jQuery

    • get template(): string
    • The path to the HTML template file which should be used to render the inner content of the app

      Returns string

    • get popOut(): boolean
    • Control the rendering style of the application. If popOut is true, the application is rendered in its own wrapper window, otherwise only the inner app content is rendered

      Returns boolean

    • get rendered(): boolean
    • Return a flag for whether the Application instance is currently rendered

      Returns boolean

    • get title(): string
    • An Application window should define its own title definition logic which may be dynamic depending on its data

      Returns string

    • get defaultOptions(): any
    • override

      Returns any