Fluid UI | Using Left Navigation with PT_SIDE_PAGETABS

Fluid UI provides an option to override the default 'Classic' look and feel of the page tabs located at the top of the page by using Left Navigation with PT_SIDE_PAGETABS. PT_SIDE_PAGETABS is nothing but a page definition (Type: Side Page 1) which needs to be included in the component page list. That's it!

If we include PT_SIDE_PAGETABS in the component, the page tabs which is usually located at the top will automatically transform to a Left Navigation. This Left Navigation can be expanded and collapsed by the users.

Demo

For this demo, I am using the same component which used in one of my previous posts.

Project: https://github.com/SasankVemana/Fluid-UI-Grid-Demos

As we can see in the demonstration, the Left Navigation is always collapsed by default and the users will need to slide out the Left Navigation every time they want to tab to a different page.

What if we want to programmatically control the Left Navigation default behavior?

Particularly for larger form factor devices (laptops, desktops, etc.), it would save several clicks if the Left Navigation was expanded by default and fixed.

This can be achieved using the PT_PAGE_UTILS API - PanelController App Class.

In the following code, I initialized the Left Navigation (Side1) mode to fixed only for Extra Large Form Factor devices using the PanelController Class SetSide1ModeFixed method.

Demo

PeopleTools 8.55+ Branding | Conditionally Display Header Icons

The PeopleTools New User Interface (NUI) and Branding has been available for a while and it should not be news to anyone that the system level header appears as shown below.

As we can see, the Branding header provides icons such as Home, Search, Notifications, Actions Menu and Navigator. This is a system wide setting controlled by the application branding configuration/setup. That means these icons will appear on any page/component we navigate to. For example:

What if we want to disable some or all of these icons at a component level?

There is a configuration in the Component - Fluid Properties - Header Toolbar Actions which allows us to disable some or all of these icons.

What if we want to programmatically/conditionally control the visibility of these header icons?

Someone asked me this question in one of posts here. I found that this is very much possible using the delivered (8.55+) PT_PAGE_UTILS API (App Package).

We can simply use the Banner App Class available in the PT_PAGE_UTILS App Package to control the visibility of the header icons in PeopleCode at the page/component level.

PeopleBooks Reference:
Fluid Page Utilities Classes
Banner Class

For example:

Results:

We can see that the 'Home' icon is disabled using PeopleCode on this particular page.

Similarly we can use the following Banner class methods to disable other Branding header icons:
SetVisibilityActionList
SetVisibilityAddto
SetVisibilityHelp
SetVisibilityMyPreferences
SetVisibilityNavbar
SetVisibilityNotifications
SetVisibilitySearch
SetVisibilitySignout

Further, some of these options (Search) are not available via Component - Fluid Properties.

PeopleCode for reference: