Namespace: UIManager

CIQ.UI. UIManager

Self registering global web component that manages the overall UI on the attached div tag.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the web components can be found here: Web Component Interface

This component keeps track of open menus and dialogs and attaches click and tap (onclick or ontouch) events in order to close them.

By default it is attached to the "body", but it can be changed to a different div tag if this behavior is too broad for your particular implementation.

Classes

UIManager

Methods


attachedCallback()

Attach a callback to an individual component as part of the context.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface


<static> UIManager#lift(element)

Lifts a menu to an absolute position on the body, so that it can rise above any overflow: hidden, scroll or iscroll situations.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface

Use cq-lift attribute to indicate that the menu should be lifted when opened

context.lifts is an array that contains all of the current lifts so that they can be restored when the menu is closed

Parameters:
Name Type Description
element HTMLElement

DOM node to be lifted.


closeMenu(menu)

Closes the current active menu and resets the activeMenuStack.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface

Parameters:
Name Type Description
menu HTMLElement

closeTopMenu()

Since:
  • 6.2.0 Added cq-close-top menu attribute to optionally close parent menus.

Example
<cq-dialog>
	<cq-drawing-context>
		<cq-menu cq-close-top="cq-dialog[cq-drawing-context]">
			<div>This is a sub-menu</div>
			<cq-menu-dropdown>
				<cq-item>A stxtap event that bubbles to body will call UIManager#closeTopMenu</cq-item>
				<cq-item>With the cq-close-top attribute above, the dialog will be closed as well</cq-item>
			</cq-menu-dropdown>
		</cq-menu>
	</cq-drawing-context>
</cq-dialog>

detachedCallback()

Removes a callback from a component.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface.


findLifts(menu)

Finds all cq-lift elements for the specified menu, but not lifts that are within nested menus.

Parameters:
Name Type Description
menu HTMLElement

The menu to search for cq-lift elements.

Since:
  • 8.1.0

Returns:

Any found lifts as a jQuery object, if available, or an Faquery object.

Type
object

ifAllClosed()


openMenu(menu, params)

Opens a menu item within the UI.Context.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface

Parameters:
Name Type Description
menu HTMLElement
params Object

restoreLift(element)

Parameters:
Name Type Description
element HTMLElement

topMenu()

Sets the top level menu in the activeMenuStack.

Designed to be used as a helper method for the included WebComponents. A full tutorial on how to work with and customize the WebComponents can be found here: Web Component Interface

Returns:

activeMenuStack