import Tabs from 'canvas-graph-creator/src/js/ui/tabs.js'

public class | source

Tabs

Class for controlling tabs.

Constructor Summary

Public Constructor
public	constructor(tabContainer: Element, tabList: Element) Constructs a Tabs object.

Member Summary

Public Members
public	tabContainer: *
public	tabList: *

Method Summary

Public Methods
public	addTab(name: string, displayName: string) Add a tab.
public	displayTab(tabName: string, isHiding: boolean) Set whether or not a tab should be displayed.
public	getElementByCallback(className: string, parentElement: Element, callback: function(element: Element): boolean): Element Get the element with the specified class name and parent element that meets the criteria of a filter function.
public	getTabContentElement(tab: string \| Element): Element Get the element associated with the specified tab.
public	hideTab(tabName: string) Hide the tab with the specified name.
public	init() Initialization function to add click event listeners to the tabs.
public	removeTab(name: string) Remove the specified tab.
public	replaceTabs(names: Object<string, string>) Replace all the tabs with new ones.
public	selectElementByAttribute(className: string, toggleClass: string, parentElement: Element, attrName: string, attrVal: string) Toggle selection class for an element (and its siblings) with the specified class, parent element, attribute name, and attribute value.
public	selectElementByCallback(className: string, toggleClass: string, parentElement: Element, callback: function(element: Element): boolean) Toggle selection class for an element (and its siblings) with the specified class, parent element, and callback function.
public	selectElementByTarget(className: string, toggleClass: string, parentElement: Element, targetElement: Element) Toggle selection class for an element (and its siblings) with the specified class, parent element, and target element.
public	selectTab(tab: string \| Element) Select a specific tab.
public	selectTabByName(name: string) Select the tab with the specified name.
public	selectTabByTarget(targetElement: Element) Select the given tab element.
public	setTabContent(tab: string \| Element, content: string) Set a particular tab's content as the given HTML string.
public	setTabScroll(tab: string \| Element, shouldScroll: boolean) Set whether or not the tab should allow scrolling in the tab content element.
public	showTab(tabName: string) Show the tab with the specified name.
public	updateTabListDisplay() Update the display status of the tabList element.

Public Constructors

public constructor(tabContainer: Element, tabList: Element) source

Constructs a Tabs object.

Params:

Name	Type	Attribute	Description
tabContainer	Element		Container element that holds all the tabs and tab content.
tabList	Element		Parent element of all the tabs.

Public Members

public tabContainer: * source

public tabList: * source

Public Methods

public addTab(name: string, displayName: string) source

Add a tab.

Params:

Name	Type	Attribute	Description
name	string		Name of the tab. This is used to refer to the tab.
displayName	string		String that is displayed on the actual tab.

public displayTab(tabName: string, isHiding: boolean) source

Set whether or not a tab should be displayed.

Params:

Name	Type	Attribute	Description
tabName	string		Name of the tab.
isHiding	boolean		Whether or not the tab should be displayed.

public getElementByCallback(className: string, parentElement: Element, callback: function(element: Element): boolean): Element source

Get the element with the specified class name and parent element that meets the criteria of a filter function.

Params:

Name	Type	Attribute	Description
className	string		Name of the element class.
parentElement	Element		Parent element of the element.
callback	function(element: Element): boolean		Callback function that determines whether the element should be returned or not.

Return:

Element (nullable: true)

Element if a matching one is found, null otherwise.

public getTabContentElement(tab: string | Element): Element source

Get the element associated with the specified tab.

Params:

Name	Type	Attribute	Description
tab	string \| Element		Name of tab or tab element.

Return:

Element

The element containing the tab content.

public hideTab(tabName: string) source

Hide the tab with the specified name.

Params:

Name	Type	Attribute	Description
tabName	string		Name of the tab to hide.

public init() source

Initialization function to add click event listeners to the tabs.

public removeTab(name: string) source

Remove the specified tab.

Params:

Name	Type	Attribute	Description
name	string		Name of the tab to remove.

public replaceTabs(names: Object<string, string>) source

Replace all the tabs with new ones.

Params:

Name	Type	Attribute	Description
names	Object<string, string>		Object with a map of tab names to tab display names.

public selectElementByAttribute(className: string, toggleClass: string, parentElement: Element, attrName: string, attrVal: string) source

Toggle selection class for an element (and its siblings) with the specified class, parent element, attribute name, and attribute value. Checks for an element with the specified attribute value for the attribute given.

Params:

Name	Type	Attribute	Description
className	string		Name of the class of the element to select.
toggleClass	string		Class that should be toggled to select the element.
parentElement	Element		Parent element of the element to select.
attrName	string		Name of the attribute to check.
attrVal	string		Value of the attribute to match.

public selectElementByCallback(className: string, toggleClass: string, parentElement: Element, callback: function(element: Element): boolean) source

Toggle selection class for an element (and its siblings) with the specified class, parent element, and callback function. The callback should return true or false to select or deselect the elements.

Params:

Name	Type	Attribute	Description
className	string		Name of the class of the element to select.
toggleClass	string		Class that should be toggled to select the element.
parentElement	Element		Parent element of the element to select.
callback	function(element: Element): boolean		Callback function that determines whether the element is selected or not.

public selectElementByTarget(className: string, toggleClass: string, parentElement: Element, targetElement: Element) source

Toggle selection class for an element (and its siblings) with the specified class, parent element, and target element. Checks for an element that matches the target element.

Params:

Name	Type	Attribute	Description
className	string		Name of the class of the element to select.
toggleClass	string		Class that should be toggled to select the element.
parentElement	Element		Parent element of the element to select.
targetElement	Element		Element to select (if it exists).

public selectTab(tab: string | Element) source

Select a specific tab.

Params:

Name	Type	Attribute	Description
tab	string \| Element		Name of tab or tab element to be selected.

public selectTabByName(name: string) source

Select the tab with the specified name.

Params:

Name	Type	Attribute	Description
name	string		The name of the tab.

public selectTabByTarget(targetElement: Element) source

Select the given tab element.

Params:

Name	Type	Attribute	Description
targetElement	Element		The tab element.

public setTabContent(tab: string | Element, content: string) source

Set a particular tab's content as the given HTML string.

Params:

Name	Type	Attribute	Description
tab	string \| Element		Name of tab or tab element.
content	string		HTML string containing the tab's new content.

public setTabScroll(tab: string | Element, shouldScroll: boolean) source

Set whether or not the tab should allow scrolling in the tab content element.

Params:

Name	Type	Attribute	Description
tab	string \| Element		Name of tab or tab element.
shouldScroll	boolean		Whether or not the tab content element should allow scrolling.

public showTab(tabName: string) source

Show the tab with the specified name.

Params:

Name	Type	Attribute	Description
tabName	string		Name of the tab to show.

public updateTabListDisplay() source

Update the display status of the tabList element. If there are 1 or fewer tabs, the tabList is hidden.