Favorites

Description

Large applications may contains a lot of choices in the Tabbed UI's Buttons Pane. Users may only use a handful of options in the menu. Adding favorites gives the user a way to quickly access the tabs they use most.

Discussion

The Tabbed UI Favorites feature adds the ability for users to place buttons in the Tabbed UI menu into a "favorites" section for quick access. When you turn on the Favorites feature, an icon is added to the Tabbed UI menu items that indicates whether or not the item is a favorite.

Menu buttons with a favorites indicator
Menu buttons with a favorites indicator

Clicking the star icon toggles the favorite state of the menu item. Once a menu item has been designated as a favorite, it appears as follows:

Menu button marked as favorite
Menu button marked as favorite

Favorites are stored in the Repository table, which must be configured separately. Favorites are stored separately for each logged in user.

Favorites can either be shown in the Buttons Pane or in a menu bar

Favorites shown in the Buttons Pane
Favorites shown in the Buttons Pane

In this image, the favorites are shown in a menu bar with a Dropdown style.

Favorites shown in the menu bar
Favorites shown in the menu bar

In this image, the favorites are shown in a menu bar with a Horizontal style.

Displaying Favorites as a horizontal menu bar
Displaying Favorites as a horizontal menu bar

To enable the Favorites feature, edit the TabbedUI and on the Properties pane, in the Favorites section check the Enable favorites property.

Favorites properties
Favorites properties

Favorites Properties

hen this Enable favorites properly is checked the following additional properties can be set:

  • Favorites category label

    Specify the label for the Favorites category. (Does not apply if Show favorites in menu bar is checked and Menu bar style is Horizontal).

  • Favorites icon color

    Only applies if you are not using the Alpha web theme (or a web theme that inherits from Alpha). Specified the color for the favorites icon shown next to each button in the Buttons Pane.

  • Show favorites in menu bar

    Specify if the favorites should be shown in a menu bar. If this property is not checked, the favorites are shown at the top of the Buttons Panel.

  • Menu bar id

    The Id of the element where the favorites menu bar should be shown. If favorites are shown in a menu bar, it is common to put an HTML element in the TabbedUI Header text. If the Menu bar id is set to render in an HTML element with the ID element1, the HTML element placed in the Header text could be:

    <span id="element1"></span>
  • Initial state of favorites container

    Can be open or closed. When the TabbedUI is initially shown, if favorites have previously been defined, should the container that shows the favorites be open or closed. If closed, the user will need to click on the container label to open the container. (Does not apply if Show favorites in menu bar is checked)

  • Bubble help - toggle status

    Bubble help for star icon in Tabbed UI buttons

  • Bubble help - turn favorite off

    Bubble help for star icon in Favorites display

  • Menu bar style

    Can be Dropdown or Horizontal - Only applies if Show favorites in menu bar is checked. For Dropdown, a single item appears in the menu bar with a label specified by the Favorites category label. The favorites are shown as a drop-down menu. For Horizontal, all of the favorites appear as a top level, horizontal list of choices.

Client-side Events for Favorites
Client-side Events for Favorites

Client-side events

When you set or un-set a favorite, a client-side event will fire. When the event fires, the id of the button (i.e. the idInternal property) is passed to the event as well as an array of all of the buttons in the TabbedUI. This array indicates the favorite status of each button.

Event
Description
onFavoriteSet

Fires when a menu item is added to favorites.

onFavoriteUnSet

Fires when a menu item is removed from favorites.

Videos

Defining Favorites

In a large TabbedUI component with many buttons, a user might want to designate certain buttons as favorites, so that these buttons are easier to find.

In this video we show how you can define favorites in a TabbedUI component.

2022-06-18