tabbed menu page using YUI3

tabbed menu page

/**
 * This javascript program is used on the Seller Form to create a tabbed menu above a content div.
 * The menu consists of a div for each tab with a link inside to capture the click. The click is used
 * to send an http request for page content that corresponds to the tab.
 */
YUI({

    // we must tell the autoloader to get code from our server as we are using https
    base: 'libraries/js/yui_3.3.0/build/',  timeout: 10000

}).use('io-base', 'event', 'event-base', 'event-hover', 'node', 'node-event-simulate', 'selector-css3', function(Y) {

    var currentTabNode;

	Y.on('domready', setup);

    function setup () {
        tabMouseOverHandler();
        tabSelectHandler();
        var targetNode =  Y.one("#selling_tab_container #address_link");
        targetNode.simulate('click');
    }

    function tabMouseOverHandler () {
        // Use the hover event with delegation (http://developer.yahoo.com/yui/3/event/#hover)
        Y.one("#selling_tab_container").delegate("hover", swapToOverClass, swapToOutClass, "div.tab_button");
    }

    function swapToOverClass(e) {
        //  The node that matched the provided selector is the default 'this' object
        this.addClass('tab_button_over');
    }

    function swapToOutClass(e) {
        //  The node that matched the provided selector is the default 'this' object
        this.removeClass('tab_button_over');
    }

	function tabSelectHandler () {
        Y.delegate("click", requestHTML, "#selling_tab_container", "a.tab");
	}

    function requestHTML() {
        // get the target page name from the user attribute on the link in the tab div
        var linkPageName = this.getAttribute('data-tab_page');
        // get the parent node which is the tab div
        var tabNode = this.get('parentNode');
        // change the tab div class names to move the "active" tab
        if (currentTabNode) {
            currentTabNode.replaceClass('tab_button_over', 'tab_button');
        }
        tabNode.replaceClass('tab_button', 'tab_button_over');
        currentTabNode = tabNode;

        // create the url to get the new html from...
        var url = "option=com_chimneypots&task=selling.getTabPage&pageName=" + linkPageName + "&format=raw";

        // Make the HTTP request for it
        Y.io('index.php', {
            method: 'GET',
            data: url,
            on: {
                success: function (ioId, o) {
                    var target = Y.one('#selling_content_container');
                    if(o.responseText !== undefined){
                        target.set("innerHTML", o.responseText);
                    }
                },
                failure: function (ioId, o){
                    var target = Y.one('#selling_content_container');
                    if(o.responseText !== undefined){
                        var s = "<li>Transaction id: " + ioId + "</li>";
                        s += "<li>HTTP status: " + o.status + "</li>";
                        s += "<li>Status code message: " + o.statusText + "</li>";
                        target.set("innerHTML", s);
                    }
                }
            }
        });

    }

});