var tabTimeOut=0;
var contentTimeOut=0;

var currentTabMenu = null;
var currentDiv=null;
var currentTab=null;
var currentTabNum=0;
var previousTab=null;
var previousTabNum=0;
var contentCells=13;
var menuTabsDiv;
var menuTabDiv;
var menuContentDiv;

var timeOutClose=0;
var timeOutOpen=0;

var differentTabImages = false;
var overImages = new Array();
var outImages = new Array();
var disabledImages = new Array();

function initializeTabMenu (menutabsdiv,menutabdiv,menucontentdiv,allimages,timeoutopen,timeoutclose) {

   menuTabsDiv = menutabsdiv;
   menuTabDiv = menutabdiv;
   menuContentDiv = menucontentdiv;
   differentTabImages = allimages;
   timeOutClose=timeoutclose;
   timeOutOpen=timeoutopen;

}

function getImages(imagecount) {
  var i = 0;

    for(i=0;i<imagecount;i++) {
      if (differentTabImages) {
          nameIndex = i + 1;
          overImages[i] = 'url(/images/vapaalle/tab_selected_' + nameIndex + '.png)';
          outImages[i] = 'url(/images/vapaalle/tab_active_' + nameIndex + '.png)';
          disabledImages[i] = 'url(/images/vapaalle/tab_inactive_' + nameIndex + '.png)';

      }
      else {
         overImages[i] = 'url(/images/vapaalle/tab_selected.png)';
         outImages[i] = 'url(/images/vapaalle/tab_active.png)';
         disabledImages[i] = 'url(/images/vapaalle/tab_inactive.png)';
      }
    }

}

function mouseoverTab(div) {

    tabTimeOut = setTimeout(openTab,timeOutOpen);
    clearTimeout(contentTimeOut);

    var tabNum = parseInt(div.id.substr(menuTabDiv.length + 1));

    currentTab = div;
    currentTabNum = tabNum;
}

function openTab() {

     if (previousTab!=null) {
         closeTab();
     }

     previousTab = currentTab;
     previousTabNum = currentTabNum;

    //if more content divs used then get menuContentDiv with tab number
    currentDiv = document.getElementById(menuContentDiv);
    currentDiv.style.display = 'block';

    currentTab.style.backgroundImage = overImages[currentTabNum];
    //if (differentTabImages) { currentTab.style.backgroundImage = overImages[currentTabNum]; }
    //else { currentTab.style.backgroundImage = overImages[0]; }

    displayContent(currentTabMenu,currentDiv.id,currentTabNum);

}

function mouseoutTab(div) {
    var tabNum = parseInt(div.id.substr(menuTabDiv.length + 1));

    startCloseTab();
    clearTimeout(tabTimeOut);
 
}

function mouseoverContent() {
    clearTimeout(contentTimeOut);
}

function startCloseTab() {
    contentTimeOut = setTimeout(closeTab,timeOutClose)
}


function closeTab() {
    if (currentDiv!=null) {
       currentDiv.style.display = 'none';
    }   
    if (previousTab!=null) {
      previousTab.style.backgroundImage = outImages[previousTabNum];
      //if (differentTabImages) { previousTab.style.backgroundImage = outImages[previousTabNum]; }
      //else { previousTab.style.backgroundImage = outImages[0]; }
    }
}

function TabMenu() {
  this.id = Math.random();
  this.tabs = new Array();
  this.hideRoot = true;

  this.addTab = function(tab) {
     try {
       this.tabs.push(tab);
     } catch(e) {}
  }

  this.getTabById = function(id) {
    for(var i = 0; i < this.tabs.length; i++) {
      if(this.tabs[i].id == id) {
        return this.tabs[i];
      }
    }
    return null;
  }

  this.addItem = function(id,item) {
    this.getTabById(id).items.push(item);
  }

}

function Tab(id, name) {
  this.id = id;
  this.name = name;
  this.items = new Array();

}

function displayMenu(tabmenu) {

  var result = "";
  var i = 0;
  var tabIndex = 0;

  try {    
  
    getImages(tabmenu.tabs.length);

    for(i = 0; i < tabmenu.tabs.length; i++) {

      if(tabmenu.tabs[i].items.length > 0) {
         // alert('background-image:' + outImages[i] + ';');
        result +=  '<div style="background-image:' + outImages[i] + ';" class="' +  menuTabDiv +   '" id="' + menuTabDiv + '_' + tabmenu.tabs[i].id + '" onmouseover="mouseoverTab(this);" onmouseout="mouseoutTab(this);" >' + tabmenu.tabs[i].name + '</div>' ;
      }
      else {
        result +=  '<div style="background-image:' + disabledImages[i] + ';" class="' + menuTabDiv + '_disabled" id="' + menuTabDiv + tabmenu.tabs[i].id + '">' + tabmenu.tabs[i].name + '</div>' ;
      }

    }

    $(menuTabsDiv).innerHTML = result;


  } catch(err) {}
}

function displayContent(tabmenu,currentdiv,tabnum) {

  var result = "";
  var emptyCells = 0;
  try {    
    tab = tabmenu.getTabById(tabnum);
    result = "<table><tr>";
    for(var i = 0; i < tab.items.length; i++) {
      result += '<td><a href="#" onclick="setSearchValue(\'search_field_area\',\'' + tab.items[i] + '\');closeTab();">'  + tab.items[i] +  '</a></td>';
      if((i+1) % contentCells == 0) {result += "</tr><tr>"}
    }

    //emptyCells = contentCells - ((i) % contentCells);

    //for(i = 0; i < emptyCells; i++) {
    //  result += '<td>&nbsp;</td>';
    //}

    result += "</tr></table>";

    $(currentDiv.id).innerHTML = result;
  } catch(err) {

  }

}

function displayContentAjax(currentdiv,tabnum) {
//  Element.show('spinner');
  new Ajax.Request("/vapaalle/tab_menu_display", {
    asynchronous:true,
    evalScripts:true,
    parameters: { 
       tab_menu_num: tabnum
    },
    onSuccess:function(request){
  //    Element.hide('spinner')

    }
  });
}