UNPKG

com.phloxui

Version:

PhloxUI Ng2+ Framework

222 lines (221 loc) 10.6 kB
import { OnInit } from '@angular/core'; import { Subject } from 'rxjs/Subject'; import { INavigator } from './INavigator'; import { AbstractNavItem } from './AbstractNavItem'; import { ObservableManager } from '../service/services'; import { AbstractI18NApplicable } from '../share/AbstractI18NApplicable'; /** * <p style="text-indent: 2em;"> * An abstract base class for <code>nav menu</code>. A <code>nav menu</code> may consist of one or more <code>nav item</code>s * ([[AbstractNavItem]]). The only difference between stadard <code>menu</code> ([[AbstractMenu]]) and <code>nav menu</code> is that * the <code>nav menu</code> has a main purpose on <code>navigation</code>. It also automatically publishes an event to the * [[ObservableManager]] on the topic "<code>nav-menu.[sub-topic-name].navigate</code>" when a navigation is performed. Furthermore, * to remotely control the navigation on this <code>nav menu</code> instance at runtime without having direct object reference, * you can use [[ObservableManager]]'s topic "<code>nav-menu.[sub-topic-name].cmd.navigate</code>" to publish a navigation * <code>command</code> to this <code>nav menu</code>. * </p> * * @author shiorin, tee4cute * @see [[AbstractNavItem]] * @see [[INavigator]] * @see [[ObservableManager]] */ export declare abstract class AbstractNavMenu<T extends AbstractNavItem> extends AbstractI18NApplicable implements INavigator<T>, OnInit { static readonly NAVIGATE_TOPIC_NAME: string; static readonly NAVIGATE_CMD_TOPIC_NAME: string; /** * <p style="text-indent: 1em;"> * Get the navigation event topic name with the given <code><b>subTopicName</b></code>. The returning topic name will be prefixed by * [[NAVIGATE_TOPIC_NAME]]. * </p> */ static getNavigateTopicName(subTopicName: string): string; /** * <p style="text-indent: 1em;"> * Get the navigation cmd topic name with the given <code><b>subTopicName</b></code>. The returning topic name will be prefixed by * [[NAVIGATE_CMD_TOPIC_NAME]]. * </p> */ static getNavigateCmdTopicName(subTopicName: string): string; protected items: T[]; protected subTopicName: string; protected navigateSubjects: Subject<any>[]; protected observableMgr: ObservableManager; constructor(subTopicName: string, obsvMgr: ObservableManager); private initNavMenuEventTopics(navigate, navigateCmd); ngOnInit(): void; /** * <p style="text-indent: 1em;"> * Get <code>nav item</code>s ([[AbstractNavItem]]) of this <code>nav menu</code>. * </p> */ getItems(): T[]; /** * <p style="text-indent: 1em;"> * Get [[ObservableManager]]'s sub topic name associated with this <code>nav menu</code>. * </p> */ getSubTopicName(): string; /** * <p style="text-indent: 1em;"> * Get <code>nav item</code>s count in this <code>nav menu</code>. * </p> */ getItemCount(): number; /** * <p style="text-indent: 1em;"> * Get an active <code>nav item</code> index of this <code>nav menu</code>. * </p> * * @return Returns <code>-1</code> if there is no current active item. Otherwise, return the array index of current * active item. */ getActiveIndex(): number; /** * <p style="text-indent: 1em;"> * Get an active <code>nav item</code> of this <code>nav menu</code>. * </p> * * @return Returns <code>null</code> if there is no current active item. */ getActiveItem(): T; /** * <p style="text-indent: 1em;"> * Set <code>nav item</code>s of this <code>nav menu</code>. * </p> */ setItems(items: T[]): void; /** * <p style="text-indent: 1em;"> * Add a new <code>nav item</code> into this <code>nav menu</code>. If there already is the given <code><b>item</b></code> in this * <code>nav menu</code>, this method will do nothing and return <code>false</code>. * </p> * * @param item A new <code>nav item</code> to be added into this <code>nav menu</code>. * * @return Returns <code>true</code> if the given <code><b>item</b></code> is added into this <code>nav menu</code>. Otherwise, returns <code>false</code>. */ addItem(item: T): boolean; /** * <p style="text-indent: 1em;"> * Remove the given <code><b>item</b></code> from this <code>nav menu</code>. If the given <code><b>item</b></code> is not in this <code>nav menu</code>, this method * will do nothing and return <code>false</code>. If the <code><b>item</b></code> being removed is a current active item, this <code>nav menu</code> will be navigated * to the first <code>nav item</code>. * </p> * * @param item A <code>nav item</code> to be removed from this <code>nav menu</code>. * * @return Returns <code>true</code> if the given <code><b>item</b></code> is found and removed from this <code>nav menu</code>. Otherwise, returns <code>false</code>. */ removeItem(item: T): boolean; /** * <p style="text-indent: 1em;"> * To check that the given <code><b>item</b></code> is in this <code>nav menu</code> or not. * </p> * * @param item A <code>nav item</code> to check that it is in this <code>nav menu</code> or not. * * @return Returns <code>true</code> if the given <code><b>item</b></code> is in this <code>nav menu</code>. */ containsItem(item: T): boolean; /** * <p style="text-indent: 1em;"> * Get a <code>nav item</code> ([[AbstractNavItem]]) from the given index (<code><b>idx</b></code>). * </p> * * @param idx The index of <code>nav item</code> to get. * * @return Returns an instance of <code>nav item</code> ([[AbstractNavItem]]) at the specified index (<code><b>idx</b></code>). * Returns <code>null</code> if the given index is out of range. */ getItemByIndex(idx: number): T; /** * <p style="text-indent: 1em;"> * Get a <code>nav item</code> ([[AbstractNavItem]]) by the given <code><b>name</b></code>. * </p> * * @param name The name of a <code>nav item</code> to get. * * @return Returns an instance of <code>nav item</code> ([[AbstractNavItem]]) with the given <code><b>name</b></code>. * Returns <code>null</code> if not found. */ getItemByName(name: string): T; /** * <p style="text-indent: 1em;"> * Get the index of the given <code>nav item</code> (<code><b>item</b></code>). * </p> * * @param item The <code>nav item</code> to find index. * * @return Returns an index of the specified <code><b>item</b></code>. Returns <code>-1</code> if not found. */ getItemIndex(item: T): number; /** * <p style="text-indent: 1em;"> * Get the index of the given item <code><b>name</b></code>. * </p> * * @param name The item name to find index. * * @return Returns an index of <code>nav item</code> having the specified <code><b>name</b></code>. Returns <code>-1</code> if not found. */ getItemIndexByName(name: string): number; /** * <p style="text-indent: 1em;"> * Navigate this <code>nav menu</code> to the specified <code>nav <b>item</b></code>. This method returns <code>Promise</code> to support * asynchronous execution. The <code>result</code> value of returned <code>Promise</code> is a boolean indicating the navigation result. * The result value must be <code>true</code> if the navigation is successful. Otherwise, for example, if the given <code><b>item</b></code> * does not exist, the result value will be <code>false</code>. * </p> * * @param item The <code>nav item</code> to navigate to. * * @return Returns a <code>Promise</code> which will be resolved when the navigation is done. The <code>Promise</code>'s result will be a * boolean value which its value will be <code>true</code> if the navigation is successful. */ navigateTo(item: T): Promise<boolean>; /** * <p style="text-indent: 1em;"> * Navigate this <code>nav menu</code> to the specified index (<code><b>idx</b></code>). This method returns <code>Promise</code> to support * asynchronous execution. The <code>result</code> value of returned <code>Promise</code> is a boolean indicating the navigation result. * The result value must be <code>true</code> if the navigation is successful. Otherwise, the result value will be <code>false</code>. * </p> * * @param idx The item index to navigate to. * * @return Returns a <code>Promise</code> which will be resolved when the navigation is done. The <code>Promise</code>'s result will be a * boolean value which its value will be <code>true</code> if the navigation is successful. */ navigateToIndex(idx: number): Promise<boolean>; /** * <p style="text-indent: 1em;"> * Navigate this <code>nav menu</code> to a <code>nav item</code> having the specified <code><b>name</b></code>. This method returns * <code>Promise</code> to support asynchronous execution. The <code>result</code> value of returned <code>Promise</code> is a boolean indicating * the navigation result. The result value must be <code>true</code> if the navigation is successful. Otherwise, for example, if the given <code><b>item</b></code> * does not exist, the result value will be <code>false</code>. * </p> * * @param name The name of a <code>nav item</code> to navigate to. * * @return Returns a <code>Promise</code> which will be resolved when the navigation is done. The <code>Promise</code>'s result will be a * boolean value which its value will be <code>true</code> if the navigation is successful. */ navigateToName(name: string): Promise<boolean>; /** * <p style="text-indent: 1em;"> * Reset this <code>nav menu</code>. This method simply navigates back to the item at index <code>0</code>. * </p> */ reset(): void; /** * <p style="text-indent: 1em;"> * A method to perform the actual navigation, for example, changing a router's path, etc. * </p> * * @param item A <code>nav item</code> to navigate to. * * @return Returns a <code>Promise</code> which will be resolved when the navigation is done. The <code>Promise</code>'s result will be a * boolean value which its value will be <code>true</code> if the navigation is successful. */ abstract doNavigate(item: T): Promise<boolean>; }