Tabs

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Tabs" summary="" description="" author="" author_email="" thumbnail="" screenshot="" height="380">
   <Require feature="opensocial-0.7"/>
   	<Require feature="tabs" />
</ModulePrefs>
<Content type="html">
<![CDATA[
<script type="text/javascript">
	var tabSet = '';
	function init() {
		// Add a new tabset to the div with id "tabContainer"
		tabSet = new gadgets.TabSet(null,null,document.getElementById("tabContainer"));
		// Add 3 tabs to the specified div's with the callback function callback_tab
		tabSet.addTab("Tab 1", {contentContainer: document.getElementById("tabContentContainer1"),tooltip: "Tab 1",callback: callback_tab});
		tabSet.addTab("Tab 2", {contentContainer: document.getElementById("tabContentContainer2"),tooltip: "Tab 2",callback: callback_tab});
		tabSet.addTab("Tab 3", {contentContainer: document.getElementById("tabContentContainer3"),tooltip: "Tab 3",callback: callback_tab});		
		// Align the tabs to the left
		tabSet.alignTabs('left');
	}
	function callback_tab() {
		// to printout some information this example uses Firebug within the browser Firefox
		if (window.console && window.console.firebug) {
			//get the selected tab 
			var oSelectedTab = tabSet.getSelectedTab();
			console.log('getName: ' + oSelectedTab.getName());
			console.log('getIndex: ' + oSelectedTab.getIndex());
			console.log('getNameContainer: ');
			console.log(oSelectedTab.getNameContainer());			
			console.log('getContentContainer: ');
			console.log(oSelectedTab.getContentContainer());			
		}
	}
    gadgets.util.registerOnLoadHandler(init);			
</script>
	<div id="tabContainer"></div>
	<div id="tabContentContainer1">Content tab 1</div>
	<div id="tabContentContainer2">Content tab 2</div>
	<div id="tabContentContainer3">Content tab 3</div>
]]>
</Content>
</Module>