// global variable for the currently displayed content
var currentContent = "";

// Finds all the content tab buttons, and assigns event handlers
function assignTabs() {
	// set the current content var to overview
	currentContent = "content_accessories";
	
    // find the tab buttons, and assign event handlers to them
    var btnAccessories2 = document.getElementById("btn_accessories2");
    var btnAccessories3 = document.getElementById("btn_accessories3");
    var btnOverview1 = document.getElementById("btn_overview1");
    var btnOverview3 = document.getElementById("btn_overview3");
    var btnSpecs1 = document.getElementById("btn_specs1");
    var btnSpecs2 = document.getElementById("btn_specs2");

    // Assign event handlers to each of the buttons	
    btnAccessories2.onclick = clickTab;
    btnAccessories3.onclick = clickTab;
    btnOverview1.onclick = clickTab;
    btnOverview3.onclick = clickTab;
    btnSpecs1.onclick = clickTab;
    btnSpecs2.onclick = clickTab;
}

// Event handler for clicking a tab
function clickTab(e) {
	// Get the event object
	if (!e) var e = window.event;
	
	// which link is this?
	var thisId = (e.target) ? e.target.id : e.srcElement.id;
    var thisLink = (e.target) ? e.target : e.srcElement;

    // Hide the link we just clicked, and show the other one
    thisLink.parentNode.style.display = "none";
    
    // hide the current feature list
	document.getElementById(currentContent).style.display = "none";	
    
    if ((thisId == "btn_accessories2") || (thisId == "btn_accessories3")) {
        var btnOverview = document.getElementById("btn_overview1");
        btnOverview.parentNode.style.display = "block";
        
        // show the accessories content
	    document.getElementById("content_accessories").style.display = "block";
	    currentContent = "content_accessories";
	    
	} else if ((thisId == "btn_overview1") || (thisId == "btn_overview3")) {
        var btnAccessories = document.getElementById("btn_accessories2");
        btnAccessories.parentNode.style.display = "block";

        // show the overview content
	    document.getElementById("content_overview").style.display = "block";
	    currentContent = "content_overview";

    } else if ((thisId == "btn_specs1") || (thisId == "btn_specs2")) {
        var btnAccessories = document.getElementById("btn_accessories3");
        btnAccessories.parentNode.style.display = "block";
        
        // show the specs content
        document.getElementById("content_specs").style.display = "block";
	    currentContent = "content_specs";

    }
    return false;
}

if (window.addEventListener) //DOM method for binding an event
window.addEventListener("load", assignTabs, false);
else if (window.attachEvent) //IE exclusive method for binding an event
window.attachEvent("onload", assignTabs);
else if (document.getElementById) //support older modern browsers
window.onload= assignTabs;