var picBarHeight = 100;
  var largeImageWidth = 680; //CSS property
  var largeImageHeight = 0;
  var largeImageContentHeight = 670; //CSS property
  
  var image_path = "/images/";

  var is_IE = (navigator.userAgent.indexOf('MSIE') >= 0) && !window.opera;
  var is_IE7 = is_IE && ((navigator.userAgent.indexOf('MSIE 7') >= 0) || (navigator.userAgent.indexOf('MSIE 8') >= 0));
  var largeImageVisible = false;
  var xhr_ok = false;
  
  var xhr_picBar;
  var xhr_largeImage;
  
  var ajax_loader;
  var ladebild_node;
  
  function init() {
    
    if (xhr_ok) return;
    
    //Try to create xhrs
    xhr_picBar = getXHR();
    if (!xhr_picBar) return;
    xhr_largeImage = getXHR();
    
    xhr_ok = true;
    window.onresize=processResize;
       
    ajax_loader = new Image();
    ajax_loader.src = image_path + "ajax-loader.gif";
    
    ladebild_node = document.createElement("img");
    ladebild_node.src=ajax_loader.src;
    
    /*if (document.getElementById('picbar')) {
      xhr_picBar.open("GET", "/ajax.php?action=getimgarray", true);
      xhr_picBar.onreadystatechange = processReqChange_XHR_PicBar;
      xhr_picBar.send("");
    }*/
    picBar_startInitializing();
  }
  
  function processResize() {
    
    if (!xhr_ok) return;
  
    if (largeImageVisible) largeImage_resize();
    
    picBar_resize();
    
  }
  
  function processScroll() {
    if (largeImageVisible && is_IE && !is_IE7) {
      info_x = document.getElementById('largeimage');
      info_x.style.top = (( ((-info_x.offsetHeight + (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight))/2) + ( document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
    }
  }
  
  function largeImage_resize() {
    if (!largeImageVisible) return;
    
    info_x = document.getElementById('largeimage');
    info_y = document.getElementById('largeimagecontent');
      
    var bodyWidth = 0;
    var bodyHeight = 0;
     
    if (window.innerHeight) {
        bodyWidth = window.innerWidth;
        bodyHeight = window.innerHeight;
      } else if (document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight )) {
        bodyHeight = document.documentElement.clientHeight;
        bodyWidth = document.documentElement.clientWidth;
      } else {
        bodyWidth = document.body.clientWidth;
        bodyHeight = document.body.clientHeight;
      }
      
      //check whether imagecontainer is too large for window
    if ((bodyWidth-10) < largeImageWidth) {
      info_x.style.width = (bodyWidth-10) + 'px';
    } else if ((bodyWidth+10) > largeImageWidth) {
      info_x.style.width = largeImageWidth + 'px';
    }
    
    if ((bodyHeight-10) < largeImageHeight) {
      info_y.style.height = (bodyHeight-10-(largeImageHeight-largeImageContentHeight)) + 'px';      
    } else if ((bodyHeight+10) > largeImageHeight) {
  		info_y.style.height = largeImageContentHeight + 'px';
    }
    info_x.style.left = ((bodyWidth - info_x.offsetWidth) / 2) + 'px';
    info_x.style.top = ((bodyHeight - info_x.offsetHeight) / 2) + 'px';
    
    if (is_IE && !is_IE7) {
      processScroll();
    }
    
  }
  
  function showImage(id, kategorie) {
    
    if (largeImageVisible) return false;
    if (picBar_enabled) picBar_deactivate();
    
    //Neues bild laden + loader anzeigen
    
    document.getElementById("largeimageimage").firstChild.src=ajax_loader.src;
    document.getElementById("largeimagetext").innerHTML = '';
    document.getElementById("largeimagetext").appendChild(ladebild_node);
    setTimeout('document.getElementById("largeimageimage").firstChild.src=getBildURL(' + id + ',\'' + kategorie + '\');', 250);
    
    //text laden
    if (!is_IE) xhr_largeImage.abort();
    xhr_largeImage.open("GET", "/ajax.php?action=getimgdesc&cat=" + encodeURI(kategorie) + "&id=" + encodeURI(id) , true);
    xhr_largeImage.onreadystatechange = processReqChange_XHR_LargeImage;
    xhr_largeImage.send("");  
    
    if (is_IE7 || window.opera) document.documentElement.style.overflow = 'hidden';
    
    shutter_x = document.getElementById('imageshutter');
    shutter_x.className = "imageshutter";
    shutter_x.style.display = "block";
    shutter_x.onclick = hideShutter;
    info_x = document.getElementById('largeimage');
    info_x.style.display = "block";
    info_x.className = "largeimage";
 
    //reset height
    document.getElementById('largeimagecontent').style.height = largeImageContentHeight + 'px';
    largeImageHeight = info_x.offsetHeight;
    
    largeImageVisible = true;
    largeImage_resize();
    return false;
    
  }
  
  function hideShutter() {
    if (!largeImageVisible) return;
    shutter_x = document.getElementById('imageshutter');
    info_x = document.getElementById('largeimage');
    info_x.className = "";
    info_x.style.display = "none";
    shutter_x.className = "";
    shutter_x.style.display = "none";
    if (is_IE7 || window.opera) document.documentElement.style.overflow = 'auto';
    largeImageVisible = false;
    if (picBar_enabled) picBar_activate();
  }
  
  function getXHR(){
    var newReq = null;
	if(window.XMLHttpRequest) {
      try {
          newReq = new XMLHttpRequest();
      } catch(e) {
        newReq = false;
      }
    } else if(window.ActiveXObject) {
      try {
        newReq = new ActiveXObject("Msxml2.XMLHTTP");
      } catch(e) {
        try {
          newReq = new ActiveXObject("Microsoft.XMLHTTP");
        } catch(e) {
          newReq = false;
        }
      }
    }
    return newReq;
  }
  
  function processReqChange_XHR_LargeImage() {
    if (xhr_largeImage.readyState != 4) return;
    var text="";
    if (xhr_largeImage.status == 200 || xhr_largeImage.status == 0) {
      text=xhr_largeImage.responseText;
    } else {
      text="<i>Beim Empfangen der Bildbeschreibung ist leider ein Fehler aufgetreten.</i>";
    }
    if (text=="") text = "&nbsp;";
    document.getElementById("largeimagetext").innerHTML = text;
  }
  
  function getBildURL(id, cat) {
    return image_path + ((cat == "") ? "nocat" : "cat_" + cat) + "/" + getBildName(id);
  }
  
  function getBildName(id) {
    if (id < 10) {
      return "000" + id + ".jpg";
    } else if (id < 100) {
      return "00" + id + ".jpg";
    } else if (id < 1000) {
      return "0" + id + ".jpg";
    } else {
      return id + ".jpg";
    }
  }
  
/*
====================================================================
========================= SCROLLER START ===========================
====================================================================
*/  


  var picBar_TIMEOUT = 50;
  var picBar_IMG_FAKEWIDTH = 80;
  var picBar_IMG_GAP = 5;  
  var picBar_MOVE_OFFSET = 1;
  
  var picBar_imageList;
  var picBar_imageListPosFirst = -1;
  var picBar_imageListPosLast = -1;
  var picBar_images = new Array();
  var picBar_links = new Array();
  var picBar_width = 0;
  var picBar_active = false;
  var picBar_enabled = false;
  var picBar_div = 0;
  
  
  function picBar_startInitializing() {
    
    if (!document.getElementById('picbar')) return;
    xhr_picBar.open("GET", "/ajax.php?action=getpicbardata", true);
    xhr_picBar.onreadystatechange = picBar_dataLoaded;
    xhr_picBar.send("");
    
    
  }
  
  function picBar_dataLoaded() {
    
    if (xhr_picBar.readyState != 4) return;
    if (xhr_picBar.status != 200 && xhr_picBar.status != 0) return;

    if (picBar_enabled) {
      return;
    }
    
    if (picBar_imageList) return;
        
    var picbarData = eval(xhr_picBar.responseText);
    
    picBar_imageListPosFirst = parseInt(picbarData[0]);
    picBar_imageListPosLast = picBar_imageListPosFirst-1;
    picBar_imageList = picbarData[1];
                  
    if (!is_IE) xhr_picBar.abort();
    
    picBar_start();
    
  }
  
  function picBar_start() {
    
    picBar_div = document.getElementById("picbar");
    
    //document.documentElement.style.paddingBottom = '110px';
    document.getElementsByTagName('body')[0].style.paddingBottom = '110px';
        
    document.getElementById('picbarcontainer').style.visibility = 'visible';
    document.getElementById('picbarcontainer').style.display = 'block';
    
    picBar_enabled = true;
    picBar_resize();
    
    picBar_activate();
    
  }
  
  function picBar_resize() {
    if (!picBar_enabled) return;
    picBar_width = picBar_div.offsetWidth;
  }
  
  function picBar_activate() {
    if (!picBar_enabled) return;
    if (picBar_active) return;
    if (largeImageVisible) return;
    
    picBar_active = true;
    setTimeout(picBar_timer, picBar_TIMEOUT);
    
  }
  
  function picBar_deactivate() {
    if (!picBar_enabled) return;
    if (!picBar_active) return;
    
    picBar_active = false;
    
  }
  
  function picBar_timer() {
    if (!picBar_enabled) return;
    if (!picBar_active) return;
	
    //Scroller_Stuff
    
    //Check if next image is to be loaded
    if (picBar_images.length == 0 || 
        //picBar_getImageLeft(picBar_images.length-1)+picBar_getImageWidth(picBar_images.length-1) < picBar_width+picBar_IMG_GAP) {
        picBar_getImageLeft(picBar_images.length-1) < picBar_width+50) {
      picBar_loadNextImage();
    }
    
    picBar_moveImages();
    
    //Check if first image may be removed
    if (picBar_getImageLeft(0)+picBar_getImageWidth(0) < 0) {
      picBar_removeFirstImage();
    }
	
    setTimeout(picBar_timer, picBar_TIMEOUT);
  }
  
  function picBar_moveImages() {
    
    //First Element
    picBar_links[0].style.left = (picBar_getImageLeft(0) - picBar_MOVE_OFFSET) + 'px';
    
    //Following Elements
    for (var i=1; i < picBar_images.length; i++) {
      imgWidth = picBar_getImageWidth(i-1);
      
      picBar_links[i].style.left = (picBar_getImageLeft(i-1) + imgWidth + picBar_IMG_GAP) + 'px';
      
    }
    
  }
  
  function picBar_loadNextImage() {

    picBar_imageListPosLast++;
    if (picBar_imageListPosLast == picBar_imageList.length) picBar_imageListPosLast = 0;
    
    bildURL = image_path + 'nocat/tbn_' + getBildName(picBar_imageList[picBar_imageListPosLast]);  
    
    newImage = new Image();
    newImage.src=bildURL;
    
    left = 0;
    if (picBar_images.length > 0) left = picBar_getImageLeft(picBar_images.length-1) + picBar_getImageWidth(picBar_images.length-1) + picBar_IMG_GAP;
    
    //newImage.style.left = left + 'px';
    //picBar_images.push(newImage);
    //picBar_div.appendChild(newImage);
    
    newLink = document.createElement("a");
    newLink.style.left = left + 'px';
    //newLink.setAttribute("href","#");
    newLink.setAttribute("href","/image.php?id=" + picBar_imageList[picBar_imageListPosLast]);
    
    newLink.className = "picbarlink";
    newLink.onmouseover = picBar_deactivate;
    newLink.onmouseout = picBar_activate;

    var tmp = picBar_imageList[picBar_imageListPosLast];
    newLink.onclick = function() {showImage(tmp,''); return false;};

    newLink.appendChild(newImage);
    picBar_div.appendChild(newLink);
    
    picBar_images.push(newImage);
    picBar_links.push(newLink)
    
  }
  
  function picBar_removeFirstImage() {
    
    //remove first image from array and from html-container
    //picBar_div.removeChild(picBar_images.shift());
    picBar_div.removeChild(picBar_links.shift());
    picBar_images.shift();
    
    
    //update picBar_imageListPosFirst
    picBar_imageListPosFirst++;
    if (picBar_imageListPosFirst == picBar_imageList.length) picBar_imageListPosFirst = 0;
    
    //send update
    if (!is_IE) xhr_picBar.abort();
    xhr_picBar.open("GET", "/ajax.php?action=setactimg&id=" + picBar_imageListPosFirst, true);
    xhr_picBar.send("");
    
  }
  
  function picBar_getImageWidth(arrayPos) {
    
    if (arrayPos >= picBar_images.length) return 0;
    
    if (picBar_images[arrayPos].complete != true) {
      //alert(picBar_images[arrayPos].complete);
      return picBar_IMG_FAKEWIDTH;
    }
    
    if (picBar_images[arrayPos].style.visibility != 'visible') {
      
      picBar_images[arrayPos].width = Math.floor(90/picBar_images[arrayPos].height*picBar_images[arrayPos].width);
      picBar_images[arrayPos].height = 90;
      picBar_images[arrayPos].style.visibility = 'visible';
    }
    
    return picBar_images[arrayPos].width;
    
  }
  
  function picBar_getImageLeft(arrayPos) {
    
    if (arrayPos >= picBar_links.length) return 0;
    
    //return picBar_links[arrayPos].offsetLeft;
    //return picBar_images[arrayPos].offsetLeft;
    return parseInt(picBar_links[arrayPos].style.left);
    //return parseInt(picBar_images[arrayPos].style.left);
    
  }
  
  /*
   * ==============================================================
   * ==============================================================
   */
   
  function addEvent( obj, type, fn )
  {
    if (obj.addEventListener) {
      obj.addEventListener( type, fn, false );
    } else if (obj.attachEvent) {
      obj["e"+type+fn] = fn;
      obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
      obj.attachEvent( "on"+type, obj[type+fn] );
    }
  }

  function removeEvent( obj, type, fn )
  {
    if (obj.removeEventListener) {
      obj.removeEventListener( type, fn, false );
    } else if (obj.detachEvent) {
      obj.detachEvent( "on"+type, obj[type+fn] );
      obj[type+fn] = null;
      obj["e"+type+fn] = null;
    }
  }
  
  function toggleDivVisibility(element) {

    //alert(element);
    /*if (element.nodeType == 3) { //Text node
      element = element.nextSibling
    }*/
    while (element.nodeType == 3 || element.nodeName != "DIV") {
      element = element.nextSibling;
    } 
    
    if (element.style.display != "block") {
      element.style.display = "block";
    } else {
      element.style.display = "none"
    }
    
    return false;
    
  } 
  
  //window.onload=init;
  //window.addEvent('load',init, false);
  addEvent(window,'load', init);
  
  if (is_IE && !is_IE7) {
	  //window.onscroll=processScroll;
	  addEvent(window,'scroll',processScroll);
  }