Class Hub

Creates a hub navigation pattern consisting of sections that can be navigated to. Each section is defined by a HubSection object.

Index

Constructor methods

Properties

Methods

Constructor methods

constructor(element?: HTMLElement, options?: any): Hub

Creates a new Hub control.

constructor

Parameters

  • element?: HTMLElement optional

    The DOM element that will host the Hub control.

  • options?: any optional

    An object that contains one or more property/value pairs to apply to the new control. Each property of the options object corresponds to one of the control's properties or events. Event names must begin with "on". For example, to provide a handler for the contentanimating event, add a property named "oncontentanimating" to the options object and set its value to the event handler.

Returns

Hub

Properties

public element: HTMLElement

Gets the DOM element that hosts the Hub control.

public headerTemplate: any

Gets or sets the Template or templating function that creates the DOM elements for each HubSection header. Your HubSection object should provide strings for HubSection.header property.

public indexOfFirstVisible: number

Gets or sets the index of the first HubSection at least partially in view. This property is useful for animating the visible content in the Hub.

public indexOfLastVisible: number

Gets or sets the index of last HubSection at least partially in view. Used for animating the visible content in the Hub.

public loadingState: string

Gets a value that indicates whether the hub is still loading or whether loading is complete. The value changes to complete after all the sections and content inside them has loaded.

public orientation: Orientation

Gets or sets the orientation of sections within the Hub.

public scrollPosition: number

Gets or sets the distance between the start of the Hub and the current viewable area.

public sectionOnScreen: number

Gets or sets the index of the first visible HubSection.

public sections: List

Gets or sets the List that contains the HubSection objects that belong to this Hub.

public zoomableView: IZoomableView

This API supports the SemanticZoom infrastructure and is not intended to be used directly from your code.

Methods

public addEventListener(eventName: string, eventHandler: Function, useCapture?: boolean)

Registers an event handler for the specified event.

Parameters

  • eventName: string

    The name of the event to handle. Note that you drop the "on" when specifying the event name. For example, instead of specifying "onclick", you specify "click".

  • eventHandler: Function

    The event handler function to associate with the event.

  • useCapture?: boolean optional

    Set to true to register the event handler for the capturing phase; otherwise, set to false to register the event handler for the bubbling phase.

public dispatchEvent(type: string, eventProperties: any): boolean

Raises an event of the specified type and with additional properties.

Parameters

  • type: string

    The type (name) of the event.

  • eventProperties: any

    The set of additional properties to be attached to the event object when the event is raised.

Returns

boolean

true if preventDefault was called on the event, otherwise false.

public dispose()

Releases resources held by this Hub. Call this method when the Hub is no longer needed. After calling this method, the Hub becomes unusable.

public oncontentanimating(eventInfo: CustomEvent)

Raised when the Hub is about to play entrance, content transition, insert, or remove animations.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: detail.type, detail.index, detail.section.

public onheaderinvoked(eventInfo: CustomEvent)

Raised when the user clicks on an interactive header.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: detail.index, detail.section.

public onloadingstatechanged(eventInfo: CustomEvent)

Raised when the Hub control's loadingState changes.

Parameters

  • eventInfo: CustomEvent

    An object that contains information about the event. The detail property of this object contains the following sub-properties: loadingState.

public removeEventListener(eventName: string, eventCallback: Function, useCapture?: boolean)

Removes an event handler that the addEventListener method registered.

Parameters

  • eventName: string

    The name of the event that the event handler is registered for.

  • eventCallback: Function

    The event handler function to remove.

  • useCapture?: boolean optional

    Set to true to remove the capturing phase event handler; set to false to remove the bubbling phase event handler.