//SET INTERVAL TO TOGGLE THE TABS
var test = window.setInterval("toggle()", 3000);
//TOGGLE FUNCTION
function toggle(){
  var activeTab = jQuery("#articleList ul li.active").attr("id");
  activeTab = activeTab.substring(8);
  if (activeTab < 4) {
    nextTab = parseInt(activeTab) + 1;
  }else{
    nextTab = 1;
  }
  jQuery("#position1, #position2, #position3, #position4").removeClass("active");
  jQuery("#position"+nextTab).addClass("active");
  switchImage(nextTab, '0');
}
//FUNCTION TO SWITCH THE BIG IMAGE
function switchImage(num, timer){
  if (timer == '0') {
    jQuery("#imageBox a").stop(true, true).fadeOut("300", function(){
      jQuery("#imageBox a").css("z-index", "100");
      jQuery("#imageBox a span.infoBox, #imageBox a span.info").hide();
      jQuery("#imageBox a span.infoBox").css("height", "0px");
    });
    jQuery("#imageBox a#image" + num).stop(true, true).fadeIn("300", function(){
      jQuery("#imageBox a").css("z-index", "200");
      jQuery("#imageBox a span.infoBox").animate({
        height: "29px",
        opacity: +0.5
      }, 100, function(){
        jQuery("#imageBox a span.info").fadeIn("200");
      });
    });
    window.clearInterval(test);
    test = window.setInterval("toggle()", 3000);
  } else {
    jQuery("#imageBox a").stop(true, true).fadeOut("300", function(){
      jQuery("#imageBox a").css("z-index", "100");
      jQuery("#imageBox a span.infoBox, #imageBox a span.info").hide();
      jQuery("#imageBox a span.infoBox").css("height", "0px");
    });
    jQuery("#imageBox a#image" + num).stop(true, true).fadeIn("300", function(){
      jQuery("#imageBox a").css("z-index", "200");
      jQuery("#imageBox a span.infoBox").animate({
        height: "29px",
        opacity: 0.5
      }, 100, function(){
        jQuery("#imageBox a span.info").fadeIn("200");
      });
    });
    window.clearInterval(test);
  }
}
jQuery(document).ready(function(){
  //LADE DATEN AUS XML
  jQuery.ajax({
    type: "GET",
    url: "tabs.xml",
    dataType: "xml",
    success: function(xml) {
      var i = 1;
      jQuery(xml).find('tab').each(function(){
        var text = jQuery(this).find('text').text();
        var url = jQuery(this).find('url').text();
        var smallImg = jQuery(this).find('imagesmall').text();
        var image = jQuery(this).find('image').text();
        var info = jQuery(this).find('info').text();
        jQuery("#position"+i+" p").text(text);
        jQuery("#position"+i+" a, #imageBox a#image"+i).attr("href", url);
        jQuery("#position"+i+" a.smallImage img").attr("src", smallImg);
        jQuery("#imageBox a#image"+i+" img").attr("src", image);
        if (info.length > 1) {
          jQuery("#imageBox a#image"+i).append("<span class='infoBox'></span>;")
          jQuery("#imageBox a#image"+i).append("<span class='info'>"+info+"</span>;");
        } else {
          // do nothing
        }
        i++;
      });
    }
  });
  //TAB ON MOUSEOVER
  jQuery("#position1, #position2, #position3, #position4").mouseover(function(){
    if (jQuery(this).attr("class") == "active") {
      window.clearInterval(test);
    } else {
      jQuery("#position1, #position2, #position3, #position4").removeClass("active");
      jQuery(this).addClass("active");
      var num = jQuery("#articleList ul li").index(this) + 1;
      switchImage(num, '1');
    }
  });
  //TAB ON MOUSEOUT
  jQuery("#position1, #position2, #position3, #position4").mouseout(function(){
    window.clearInterval(test);
    test = window.setInterval("toggle()", 10000);
  });
  //TAB ON CLICK
  jQuery("#articleList ul li").click(function(){
    var url = $("a.more", this).attr("href");
    location.href=url;
  });
});