Fabtabulous.js

/*
 * Fabtabulous! Simple tabs using Prototype
 * http://tetlaw.id.au/view/blog/fabtabulous-simple-tabs-using-prototype/
 * Andrew Tetlaw
 * version 1.1 2006-05-06
 * http://creativecommons.org/licenses/by-sa/2.5/
 *
 * Note: getInitialTab() method modified for Swellnet
 */
var Fabtabs = Class.create();

Fabtabs.prototype = {
    initialize : function(element) {
        this.element = $(element);
        if (this.element) {
            var options = Object.extend({}, arguments[1] || {});
            this.menu = $A(this.element.getElementsByTagName('a'));
            this.show(this.getInitialTab());
            this.menu.each(this.setupTab.bind(this));
        }
    },
    setupTab : function(elm) {
        Event.observe(elm, 'click', this.activate.bindAsEventListener(this), false)
    },
    activate :  function(ev) {
        var elm = Event.findElement(ev, "a");
        if (elm.hasClassName("nostop")) return;
        if (!elm.hasClassName("anchor")) Event.stop(ev);

        // Hacky way to handle firing off the video for surfcams when the video tab is clicked
        // Unfortunately line 27 seems to stop ALL event propogation

        if (elm.hasClassName("cam-trigger")) {
            play_surfcam();
        }

        this.show(elm);
        this.menu.without(elm).each(this.hide.bind(this));
    },
    hide : function(elm) {
        try {
            $(elm).removeClassName('active-tab');
            $(this.tabID(elm)).removeClassName('active-tab-body');
        } catch(e) {
            // Do nothing here...
        }
    },
    show : function(elm) {
        $(elm).addClassName('active-tab');
        $(this.tabID(elm)).addClassName('active-tab-body');
        Effect.Appear($(this.tabID(elm)))
    },
    tabID : function(elm) {
        return elm.href.match(/#(\w.+)/)[1];
    },
    getInitialTab : function() {
        // 31 March, 2009: Added fix for Swellnet to check if a tab has been preset as the active tab
        if (this.element.getElementsByClassName("active-tab")[0]) {
            return this.element.getElementsByClassName("active-tab")[0];
        } else {
            // The following if else contruct was the original method as at version 1.1
            if (document.location.href.match(/#(\w.+)/)) {
                var loc = RegExp.$1;
                var elm = this.menu.find(function(value) {
                    return value.href.match(/#(\w.+)/)[1] == loc;
                });
                return elm || this.menu.first();
            } else {
                return this.menu.first();
            }
        }
    }
};

document.observe("dom:loaded", function() {
    // Init each tab set if the elements exist in the markup, rather than init'ing all.
    var possible_tabs = ["tabs", "newstabs", "hometabs", "searchtabs", "livebuoytabs"];
    for (var i = 0; i < possible_tabs.length; i++) {
        if ($(possible_tabs[i])) {
            new Fabtabs(possible_tabs[i]);
        }
    }
});