Gadgets.TabSet (v0.9)

Owned by Mark Halvorson (Deactivated)
Last updated: Oct 05, 2010Version comment

<?xml version="1.0" encoding="utf-8"?>
<html>
NeedsExamples

<div style="float:right; margin: 0 0 10px 10px;">

</div>
<span style="font-size:150%"><strong>gadgets.TabSet</strong></span>

A class gadgets can use to make tabs.

Methods

gadgets.TabSet.addTab

;<code style="color:green">String addTab(tabName, opt_params)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>tabName</td> <td>String</td> <td>Label of the tab to create</td></tr> <tr><td>opt_params</td> <td>Object</td> <td>Optional parameter object</td></tr> </table>

<strong>Returns</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Type</th> <th>Description</th></tr> <tr><td>String</td> <td>DOM id of the tab container</td></tr> </table>

Description
<div style="margin-left:4em;">Adds a new tab based on the name-value pairs specified in opt_params. The following properties are supported in opt_params: <list style="hanging"> <t hangText="contentContainer">An existing HTML element to be used as the tab content container. If omitted, the tabs library creates one.</p> <t hangText="callback">A callback function to be executed when the tab is selected. The callback function will not be called until after the existing callstack has completed execution.</p> <t hangText="tooltip">A tooltip description that pops up when user moves the mouse cursor over the tab.</p> <t hangText="index">The index at which to insert the tab. If omitted, the new tab is appended to the end.</p> </list></div>

gadgets.TabSet.alignTabs

;<code style="color:green">alignTabs(align, opt_offset)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>align</td> <td>String</td> <td>'left', 'center', or 'right'</td></tr> <tr><td>opt_offset</td> <td>Number</td> <td>Optional parameter to set the number of pixels to offset tabs from the left or right edge; the default value is 3px</td></tr> </table>

Description
<div style="margin-left:4em;">Sets the alignment of tabs. Tabs are center-aligned by default.</div>

gadgets.TabSet.displayTabs

;<code style="color:green">displayTabs(display)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>display</td> <td>Boolean</td> <td>True to show tabs; false to hide tabs</td></tr> </table>

Description
<div style="margin-left:4em;">Shows or hides tabs and all associated content.</div>

gadgets.TabSet.getHeaderContainer

;<code style="color:green">HTMLElement getHeaderContainer()</code>

<strong>Returns</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Type</th> <th>Description</th></tr> <tr><td>HTMLElement</td> <td>The tab headers container element</td></tr> </table>

Description
<div style="margin-left:4em;">Returns the tab headers container element.</div>

gadgets.TabSet.getSelectedTab

;<code style="color:green"> gadgets.Tab getSelectedTab()</code>

<strong>Returns</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Type</th> <th>Description</th></tr> <tr><td>gadgets.Tab </td> <td>The currently selected tab object</td></tr> </table>

Description
<div style="margin-left:4em;">Returns the currently selected tab object.</div>

gadgets.TabSet.getTabs

;<code style="color:green">Array.<gadgets.Tab> getTabs()</code>

<strong>Returns</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Type</th> <th>Description</th></tr> <tr><td>Array.<gadgets.Tab></td> <td>Array of all existing tab objects</td></tr> </table>

Description
<div style="margin-left:4em;">Returns an array of all existing tab objects.</div>

gadgets.TabSet.removeTab

;<code style="color:green">removeTab(tabIndex)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>tabIndex</td> <td>Number</td> <td>Index of the tab to remove</td></tr> </table>

Description
<div style="margin-left:4em;">Removes a tab at tabIndex and all of its associated content.</div>

gadgets.TabSet.setSelectedTab

;<code style="color:green">setSelectedTab(tabIndex)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>tabIndex</td> <td>Number</td> <td>Index of the tab to select</td></tr> </table>

Description
<div style="margin-left:4em;">Selects the tab at tabIndex and fires the tab's callback function if it exists. If the tab is already selected, the callback is not fired.</div>

gadgets.TabSet.swapTabs

;<code style="color:green">swapTabs(tabIndex1, tabIndex2)</code>

<strong>Parameters</strong>
<table cellspacing="0" cellpadding="4" border="1"> <tr><th>Name</th> <th>Type</th> <th>Description</th></tr> <tr><td>tabIndex1</td> <td>Number</td> <td>Index of the first tab to swap</td></tr> <tr><td>tabIndex2</td> <td>Number</td> <td>Index of the secnod tab to swap</td></tr> </table>

Description
<div style="margin-left:4em;">Swaps the positions of tabs at tabIndex1 and tabIndex2. The selected tab does not change, and no callback functions are called.</div>

{{ JsApiAlphaList_(v0.9) }}

</html>