
var imgFader = null;

$(function()
{
    //Initialize menu: Hide sublevels, show arrow and attach click listener 
    $('#menu div.sublevel').hide().prev('a').addClass('sublevel_closed').click(function(event){
        $(this.nextSibling).slideToggle();
        $(this).toggleClass('sublevel_open').toggleClass('sublevel_closed');
        return false;
    });
    
    //open menu with active children
    $('div.sublevel:has(a.aktiv)').show().prev('a').toggleClass('sublevel_open').toggleClass('sublevel_closed');
    
    $('#overlayimage').load(function() {
        $('#overlayimage-loader').hide();
        $('#overlayimage').show();
    });
    
    //$("img[rel]").overlay({effect: 'apple'});
    $("a[rel=image] img").overlay({
        mask: '#333333',
        target: 'div#imageoverlay',
        //effect: 'apple',
        fixed: false,
        onBeforeLoad: function()
        {
            $url = this.getTrigger().attr('src').replace(/\/tbn_([0-9]+)\.jpg/, '\/$1\.jpg');
            $id = RegExp.$1;
            if ($('#overlayimage').attr('src') == $url)
                return;
            $cat = '';
            if ($url.match(/\/cat_(.+)\//))
                $cat = RegExp.$1;
            $('#overlayimage-loader').show();
            $('#overlayimage').hide().attr('src', $url);
            $('#overlaytext').text("").load("/ajax.php?action=getimgdesc&id=" + $id + "&cat=" + $cat);
        }
    });
    
    //Open external links in new window and add external class
    $('a, area').filter(function() {
        return this.hostname && (this.hostname).split(":")[0]
          !== (location.hostname).split(":")[0]
        || $(this).attr('rel') == 'external';
    }).not(':has(img, div, mailto)')
      .addClass('external')
      .end()
      .click(function(e) {
        open(this.href);
        e.preventDefault();
      });
    
    //Translation mouse-over effect
    $('#translationtrigger').mouseenter(function()
    {
        $('#translationbar').fadeIn();
    }).mouseleave(function()
    {
        $('#translationbar').fadeOut();
    });
    
    //ImageFader
    //Get necessary data for image fader
    $.getJSON('/ajax.php?action=getimgobj', function(data) {
        imgFader = data;
        imgFader.numPics = $("div#bilder > div").size();
        imgFader.picIndex = 0; //imgFader.actImage % imgFader.numPics;
        imgFader.imageChangeInterval = 10000;
        imgFader.imageFadeDuration = 3000;
        window.setTimeout('imageFader_tick()', imgFader.imageChangeInterval - imgFader.imageFadeDuration);
    });

    //Smooth scroll to top animation.
    $('a[href=#top]').click(function(){
        $('html, body').animate({scrollTop:0}, 'slow');
        return false;
    });

});

function imageFader_tick()
{
    //Check which element to fade
    el = $("div#bilder > div")[imgFader.picIndex];
    var $current = $(el).children("div.current");
    var $next = $(el).children("div.next");
    
    //TODO: pause on mouseover ??
    
    $next.css('opacity', 0).css('display', 'block');
    $next.animate({opacity:1}, imgFader.imageFadeDuration, '', function()
    {
        $(this).removeClass('next').addClass('current');
    });
    $current.animate({opacity:0}, imgFader.imageFadeDuration, '', function()
    {
        $(this).css('display', 'none').removeClass('current').addClass('next');
        
        //load next image
        var nextID = imgFader.imgArray[((imgFader.actImage + imgFader.numPics) % imgFader.imgArray.length)];
        var nextImageName = String("0000" + nextID).slice(-4);
        var href = $(this).find("a").attr("href").replace(/(.+\?id=)(\d+)/, "$1"+nextID);
        $(this).find("a").attr("href", href);
        var src = $(this).find("img").attr("src").replace(/(.+tbn_)(\d+)(\.jpg)/, "$1" + nextImageName + "$3");
        $(this).find("img").attr("src", src);
        
        imgFader.picIndex = (imgFader.picIndex + 1) % imgFader.numPics;
        //TODO: Increment ActImage ans send to server
        imgFader.actImage = (imgFader.actImage + 1) % imgFader.imgArray.length;
        $.get("/ajax.php", {action: "setactimg", id: imgFader.actImage});
    });
    window.setTimeout('imageFader_tick()', imgFader.imageChangeInterval);
}


