Gets the event that is fired when the component's hover-state is changing.
Adds a child component to the container.
the component to add
Configures the component for the supplied Player and UIInstanceManager. This is the place where all the magic happens, where components typically subscribe and react to events (on their DOM element, the Player, or the UIInstanceManager), and basically everything that makes them interactive. This method is called only once, when the UIManager initializes the UI.
Subclasses usually overwrite this method to add their own functionality.
the player which this component controls
the UIInstanceManager that manages this component
Returns the current active / visible page
Gets an array of all child components in this container.
Returns the configuration object of the component.
Return all configured pages
Initializes the component, e.g. by applying config settings. This method must not be called from outside the UI framework.
This method is automatically called by the UIInstanceManager. If the component is an inner component of some component, and thus encapsulated abd managed internally and never directly exposed to the UIManager, this method must be called from the managing component's #initialize method.
Releases all resources and dependencies that the component holds. Player, DOM, and UIManager events are automatically removed during release and do not explicitly need to be removed here. This method is called by the UIManager when it releases the UI.
Subclasses that need to release resources should override this method and call super.release().
Removes a child component from the container.
the component to remove
true if the component has been removed, false if it is not contained in this container
Checks if there are active settings within the root page of the settings panel. An active setting is a setting that is visible and enabled, which the user can interact with.
true if there are active settings, false if the panel is functionally empty to a user
Adds the passed page to the navigation stack and makes it visible. Use popSettingsPanelPage to navigate backwards.
Results in no-op if the target page is the current page.
Sets the
Use setActivePage instead
A panel containing a list of items.
To configure pages just pass them in the components array.
Example: let settingsPanel = new SettingsPanel({ hidden: true, });
let settingsPanelPage = new SettingsPanelPage({ components: […] });
let secondSettingsPanelPage = new SettingsPanelPage({ components: […] });
settingsPanel.addComponent(settingsPanelPage); settingsPanel.addComponent(secondSettingsPanelPage);
For an example how to navigate between pages
See
SettingsPanelPageNavigatorButton