Implementing an Application Controller
To implement a custom web application controller, you first need to create a class that implements the interface GeneApplicationController
.
/** * Implementing a GeneApplicationController allows to override some common patterns of the default Platform Web Application * such as the header, menus, sidebar, toolbars and titles. * * Note that GeneApplicationController does not provide extension APIs to override widget behavior. To do so * you have to use GeneWidgetController API. */ export interface GeneApplicationController { /** * When provided, the component will replace the default Gene component for the header bar */ header?: { component?: Type<any>; }, /** * When provided, the component will replace the default Gene component for the sidebar */ sidenav?: { component?: Type<any>; } /** * This method allows to override and add additional Menus in the top bar. * This method is being called by GeneFramework each time current ViewDashboard or GeneContext * change. * * @param view current displayed view * @param context current context */ customizeMenus?: (context: GeneContext, view: ViewDashboard) => Observable<GeneApplicationMenu[]>; /** * This method allows to override and add additional GeneToolbarElement in the current ViewDashboard * toolbar. * This method is being called by GeneFramework each time current ViewDashboard or GeneContext * change. * * @param view current displayed view * @param context current context */ customizeViewDashboardToolbar?: (context: GeneContext, view: ViewDashboard) => Observable<GeneToolbarElement[]>; /** * This method allows to override the View and Dashboard titles. * This method is being called by GeneFramework each time current ViewDashboard or GeneContext * change. * * @param view current displayed view * @param context current context */ customizeViewDashboardTitle?: (context: GeneContext, view: ViewDashboard) => Observable<string>; /** * This method allows to override the Platform default configuration. * This method is being called by GeneFramework each time current ViewDashboard or GeneContext * change. * * Note that it is safe to modify the configuration received as a parameter and return it. * * @param view current displayed view * @param context current context * @param configuration default application configuration * @return Observable of the partial configuration to override */ customizeDefaultConfiguration?: (context: GeneContext, view: ViewDashboard) => Observable<GeneApplicationConfiguration>; }
Here is an example of a custom controller that adds a new Menu in the Header Bar and hides the default Task Menu. Note that this controller is available as a sample:
export class SampleApplicationController implements GeneApplicationController { // Customize Header menu by adding a 'Factory Menu' // With two Menu Items customizeMenus(context: GeneContext, view: ViewDashboard): Observable<GeneApplicationMenu[]> { return of([ { icon: 'factory', id: 'factory-menu', title: 'Factory Menu', menuGroups: [ { title: 'Menu Group 1', menuItems: [ { label: 'Menu Element 1', icon: 'employee', clickHandler: () => alert('Menu Element 1 Clicked !') }, { label: 'Menu Element 2', icon: 'employee', clickHandler: () => alert('Menu Element 2 Clicked !') } ] } ] } ]); } // Customize default Application Configuration // - Hide the Task menu (always) customizeDefaultConfiguration(context: GeneContext, view: ViewDashboard, configuration: GeneApplicationConfiguration): Observable<Partial<GeneApplicationConfiguration>> { return of({ header: { taskMenu: { hide: true } } }); } }