/*
 * n2tabs 0.2 - Copyright (c) 2007 Cristian Libardo
 *
 * This is free software; you can redistribute it and/or modify it
 * under the terms of the GNU Lesser General Public License as
 * published by the Free Software Foundation; either version 2.1 of
 * the License, or (at your option) any later version.
 *
 * Usage example:
 *
 *	<script type="text/javascript" src="/Js/jquery-1.2.pack.js"></script>
 *	<script type="text/javascript" src="/Js/n2tabs.js"></script>
 * 	<script type="text/javascript">
 *		$(document).ready(function(){
 *			$(".freeTheHTML div").n2tabs(); // the jQuery selection is used to select the tabs
 *		});
 *	</script>
 *
 *	<!-- タブを付けられるタブ内容要素はdiv要素であるかもしれません。 デフォルトで、要素のタイトルはタブテキストとして使用されます。-->
 *	<div class="freeTheHTML">
 *      <div title="One">This is the first tab.</div>
 *      <div title="Two">This is the second tab.</div>
 *      <div title="Four">This is the last tab.</div>
 *	</div>
 *
 *	<!-- 結果として起こるHTML: スクリプトはダイナミックにタブ要素を作成します。 -->
 *	<ul class="tabs">
 *      <li><a href="#tab0" class="selected">One</a></li>
 *      <li><a href="#tab1">Two</a></li>
 *      <li><a href="#tab2">Last</a></li>
 *  </ul>
 *	<div class="freeTheHTML">
 *      <div title="One">This is the first tab.</div>
 *      <div title="Two" style="display:none">This is the second tab.</div>
 *      <div title="Last" style="display:none">This is the last tab.</div>
 *	</div>
 */

// initializes elements in query selection as tabs
$.fn.n2tabs = function(tabGroupName, initial, tabContainer){
    if(this.length>0){
        if(!tabGroupName) tabGroupName = "tab";
        if(!tabContainer) tabContainer = this.n2tabs_createContainer(this.get(0));
        
        // ensure each tab content has an id
        this.each(function(i){
            if(!this.id) this.id = tabGroupName + i;
            this.n2tab = {  index: i,
                            group: tabGroupName};
        });
        
        // ensure there's an initial tab
        if(!initial || initial == "") initial = this.get(0);

        // store information about this tab group
        var tabSettings = {
            query: this,
            container: $(tabContainer),
            current: $(initial),
            tabs: new Array()
        };
        this.n2tabs_groups[tabGroupName] = tabSettings;
        
        this.n2tabs_buildTabs(tabSettings);

        this.addClass("tabContentHidden");
        this.n2tabs_show(tabSettings.current);
    }
    return this;
}

// an array of tab groups (multiple tabs are supported)
$.fn.n2tabs_groups = new Array();

// creates a tab container element
$.fn.n2tabs_createContainer = function(firstContents){
    return $(firstContents).before("<ul class='tabs'></ul>").prev().get(0);
}

// creates a tab element
$.fn.n2tabs_createTab = function(containerQuery, tabContents){
    containerQuery.append("<li><a href='#" + tabContents.id + "'>" + tabContents.title + "</a></li>");
}

// creates tab elements (ul:s and li:s) above the first tab content element
$.fn.n2tabs_buildTabs = function(tabSettings){
    tabSettings.query.each( function(){
        tabSettings.container.n2tabs_createTab(tabSettings.container, this);
    });
    $("a", tabSettings.container).each(function(i){
        tabSettings.tabs[i] = $(this);
    }).click(function(){
        if(this.hash!=location.hash)$.fn.n2tabs_show($(this.hash),$(this));else return false;
    });
}

// gets the settings for the first tab content in query selection
$.fn.n2tab_settings = function(){
    return this.n2tabs_groups[this.get(0).n2tab.group];
}

// gets the tab for the first tab content in query selection
$.fn.n2tab_getTab = function(){
    var t = this.get(0).n2tab;
    return this.n2tabs_groups[t.group].tabs[t.index];
}

// show contents defined by the given expression
$.fn.n2tabs_show = function(contents, tab){
    var tabSettings = contents.n2tab_settings();

    // show tab contents    
    tabSettings.current.addClass("tabContentHidden");
    tabSettings.current = contents;
    contents.removeClass("tabContentHidden");
    
    // select tab
    if(!tab) tab = contents.n2tab_getTab();
    $(".selected", tabSettings.container).removeClass("selected");
    tab.blur().parent().addClass("selected");

    // this prevents page from scrolling (stolen from jquery.tabs)
    var toShowId = contents.attr('id');
    contents.attr('id', '');
    setTimeout(function() {
        contents.attr('id', toShowId); // restore id
    }, 200);
}