(function($) {
    var Flexitabs = function(options) {
        this.defaults = {
            //CSS-selectors of target elements in DOM for unobtrusive attaching
            containerSelector: '.flexitabs',
            tabSelector: '.tab',
            contentSelector: '.sidebartabs',
            //CSS classes for indicate active and inactive tabs and contents of tabs
            activeLinkClass: 'active', //also class for marking initial active tab in your HTML
            inactiveLinkClass: 'inactive'
        }
        this.initialize = function() {
            var flexitabs_object = this;
            $(this.containerSelector).each(function() {
                var storage = {};
                storage.object = this;
                //finding tabs and it's contents in DOM
                storage.tabs = $.grep($(this).find(flexitabs_object.tabSelector), function(tab) {
                    if ($(tab).parents(flexitabs_object.containerSelector)[0] == storage.object) 
                        return true;
                });
                storage.contents = $.grep($(this).find(flexitabs_object.contentSelector), function(tab) {
                    if ($(tab).parents(flexitabs_object.containerSelector)[0] == storage.object) 
                        return true;
                });
                if (storage.tabs.length <= storage.contents.length) {//avoiding nonfunctional tabs
                    var active = 0;
                    var container = $(this);
                    $(storage.tabs).each(function(i) {
                        //initializing storage for tabs and contents
                        var tab_storage = {};
                        var content_storage = {};
                        tab_storage.object = content_storage.object = container;
                        tab_storage.index = content_storage.index = i;
                        //bind click handler to tabs
                        $(this).click(function() {
                            flexitabs_object.activate(this);
                        });
                        //preselecting active tab from DOM
                        if ($(this).hasClass(flexitabs_object.activeLinkClass)) 
                            active = i;
                        //storing data in jQuery data-storages, assigned to DOM-elements
                        $(storage.tabs[i]).data('Flexitabs', tab_storage);
                        $(storage.contents[i]).data('Flexitabs', content_storage);
                    });
                    storage.active = active;
                    container.data('Flexitabs', storage); //storing whole tabulator data in container storage
                    flexitabs_object.activate(storage.tabs[active]); //initial tab activation
                }
            });
        }
        this.activate = function(tab) {
            var index = $(tab).data('Flexitabs').index;
            var storage = $(tab).data('Flexitabs').object;
            var tabs_storage = $(storage).data('Flexitabs').tabs;
            var contents_storage = $(storage).data('Flexitabs').contents;
            
            //deactivation of all tabs and contents
            $(tabs_storage).removeClass(this.activeLinkClass).addClass(this.inactiveLinkClass);
            $(contents_storage).removeClass(this.activeLinkClass).addClass(this.inactiveLinkClass);
            
            //activation of current clicked tab
            $(tab).removeClass(this.inactiveLinkClass).addClass(this.activeLinkClass);
            $(contents_storage[index]).removeClass(this.inactiveLinkClass).addClass(this.activeLinkClass);
            storage.active = index;
        }
        $.extend(this, this.defaults, options);
        this.initialize();
    };
    $(function() {
        new Flexitabs();
    })
})(jQuery);