Logo

What are you looking for?

Get help straight from our team...

API's, Frameworks & Databases

Top Menu

Last updated on 13 Mar, 2023

 

Overview

TopMenu panel stays in the top of Admin area interface. It will contains global functionality items like Page Options, Publish, Undo & Redo buttons, etc. It can be look on two different ways based on the current user mode - "admin" and "preview" mode. This user interface gives us the opportunity to manipulate with the menu items - add/remover, show/hide, enable/disable menu item or to change its text label.

 

Methods

The instances of the Top Menu is kept as references in SK.Singletons.top_menu:

  • SK.Singletons.top_menu.admin - This is the "regular" menu, visible in all Admin UI states except "Preview".

  • SK.Singletons.top_menu.preview - This instance is displayed when the user clicks the [Preview] button; it's item configuration includes buttons for changing device preview mode, etc.

 

Name

Description

Parameters

Returns

configure

Configures (& re-draws) Menu. The parameter is hash of items of this type: Item Properties

ObjectHash of items

-

enable

Enables the Menu: sets "enabled" visibility state, all enabled menu items are clickable

-

-

disable

Disables the Menu: sets "disabled" visibility state, all menu items are not clickable

-

-

show

Shows the Menu

-

-

hide

Hides the Menu

-

-

getItem

Returns menu item (instance) by ID

StringItem ID

Object

addItem

Adds new menu item (in case the Menu has not yet been injected in DOM, only registers the item)

Object

StringItem ID

removeItem

Removes existing menu item (in case the Menu has not yet been injected in DOM - just removes it from the configuration)

StringItem ID

-

enableItem

Enables menu item (visually & functionally)

StringItem ID

-

disableItem

Disables menu item (visually & functionally)

StringItem ID

-

showItem

Shows menu item

StringItem ID

-

hideItem

Hides menu item

StringItem ID

-

 

NOTE: Item object properties can be found here: Item Properties
Button styles are set by class name in the item_options['class'] property (see SK.UI.Buttons)
Handlers - each Top Menu (Toolbar) item has a "handler" - constructor, responsible for creating the instance:

  • SK.UI.Buttons (default) Produces buttons

  • SK.UI.Properties.DropdownButton Produces drop-down buttons

  • SK.UI.Text Produces a simple text node

 

 

Examples

 

Add an item to the admin top menu.

 

Remove an item from the admin top menu.

 

Show or hide Menu Item.

 

Updating text label of Text Menu Item.

Did you find this article helpful?
Previous

Left Menu Panels

Next