function initGal() {
  disableClick = true; 
  cacheLoadingImage = new Image(); 
  cacheLoadingImage.src = "img/loading.gif";    
  jQuery('#imgcontainer').children("#imgfwdlnk").map(function(index) {
    jQuery(this).replaceWith(jQuery(this).contents());
  });    
  if($("#fwd").length!=0) {
    bindIMG(); 
    $("#fwd").replaceWith('<img src="img/fwd_0.png" alt="vor" id="fwd" />');
    bindFWD();
    bindkeyFWD();
  }
  if($("#rwd").length!=0) {
    $("#rwd").replaceWith('<img src="img/rwd_0.png" alt="zurück" id="rwd" />');
    bindRWD();
    bindkeyRWD();
  }
  var imag = new Image(); 
  imag.onload = function() {
    disableClick = false;
  }
  imag.src = $("#imgchg").attr("src"); 
}


function navigateFWD() {   
  cacheImage = new Image(); 
  if(disableClick) return;
  if($("#imgchg").is(":animated")) return;       
  disableClick = true;
  setbg = true;
  pic++; 
  $("#imgchg").css("margin-left", "0px");          
   $("#imgchg").animate({"margin-left": "-1600px"}, 400, "easeInBack", function(){ 
    setTimeout(function() { 
      if(setbg) { 
        $("#curimgwrpr").css("background", "#fff url(img/loading.gif) no-repeat 50%");
      } 
    }, 500);    
    $.ajax({
      url: 'bilder/ajax.php',
      data: 'gal='+gal+'&pic='+pic,
      type: 'POST',
      success: function(newPic) { 
        var img = new Image();                                            
        img.onload = function() {
          $("#imgchg").attr("src", newPic);         
          $("#imgchg").css("margin-left", "1600px"); 
          setbg = false;              
          $("#curimgwrpr ").css("background", "#fff");
          checkNavigation();                 
          $("#imgcontainer").css("background", "none"); 
          $("#imgchg").animate({"margin-left": "0px"}, 600, "easeOutBack", function(){          
            disableClick = false;   
          });             
          pic2 = pic + 1;
          $.ajax({
            url: 'bilder/ajax.php',             
            data: 'gal='+gal+'&pic='+pic2,
            type: 'POST',
            success: function(nextPic) {              
              cacheImage.src = nextPic;                                            
            }    
          }); 
          $("#imgchg").unbind('load');         
        };
        img.src = newPic;              
      }    
    });                   
  }); 
}   

function navigateRWD() { 
  cacheImage = new Image(); 
  if(disableClick) return;     
  if($("#imgchg").is(":animated")) return;  
  disableClick = true;
  setbg = true;
  pic--;       
  $("#imgchg").css("margin-left", "0px");              
  $("#imgchg").animate({"margin-left": "1600px"}, 400, "easeInBack", function(){ 
    setTimeout(function() { 
      if(setbg) { 
        $("#curimgwrpr").css("background", "#fff url(img/loading.gif) no-repeat 50%");
      }
    }, 500);           
    $.ajax({
      url: 'bilder/ajax.php',
      data: 'gal='+gal+'&pic='+pic,
      type: 'POST',
      success: function(newPic) {                                                             
        var img = new Image();                                                                        
        img.onload = function() { 
          $("#imgchg").attr("src", newPic);          
          $("#imgchg").css("margin-left", "-1600px"); 
          setbg = false;
          $("#curimgwrpr ").css("background", "#fff");  
          checkNavigation();             
          $("#imgcontainer").css("background", "none"); 
          $("#imgchg").animate({"margin-left": "0px"}, 600, "easeOutBack", function(){
            disableClick = false;     
          });             
          pic2 = pic - 1;
          $.ajax({
            url: 'bilder/ajax.php',             
            data: 'gal='+gal+'&pic='+pic2,
            type: 'POST',
            success: function(nextPic) {               
              cacheImage.src = nextPic;                                            
            }    
          });
          $("#imgchg").unbind('load');                
        };
        img.src = newPic; 
      }    
    });  
  });             
} 

function checkNavigation() {

  if(pic>1) {
    if($("#rwd").length==0) {
      $('<img src="img/rwd_0.png" alt="zurück" id="rwd" />').fadeIn(500).insertBefore("#subtitle");
      bindRWD();
      bindkeyRWD();
      $("#subtitle").css("margin-left", "0px");
    }
  } 
  if(pic>=imagesTotal) {
    if($("#fwd").length!=0) {
      $("#fwd").fadeOut(500, function(){
        $("#fwd").remove();
        unbindkeyFWD();
      });               
    }
    unbindIMG(); 
  }  
  if(pic<imagesTotal) {
    if($("#fwd").length==0) {
      $('<img src="img/fwd_0.png" alt="vor" id="fwd" />').fadeIn(500).insertAfter("#subtitle");
      bindFWD();
      bindkeyFWD();
    }     
    bindIMG();    
  } 
  if(pic<=1) {
    if($("#rwd").length!=0) {
      $("#rwd").fadeOut(500, function() {
        $("#rwd").remove();
        unbindkeyRWD();
        $("#subtitle").css("margin-left", "22px");
      });               
    }
  } 
}

function bindIMG() {
  $("#imgchg").css("cursor", "pointer");              
  $("#imgchg").bind("click", function() { navigateFWD(); });
}

function unbindIMG() {
  $("#imgchg").unbind("click");
  $("#imgchg").css("cursor", "default");  
}

function bindRWD() {
  $("#rwd").css({"margin":"8px 0 0 0", "cursor":"pointer", "float":"left"});
  $("#rwd").bind({
    click: function() { navigateRWD(); },
    mouseover: function() { $(this).attr("src", "img/rwd_1.png"); },
    mouseout: function() { $(this).attr("src", "img/rwd_0.png"); }
  });   
}

function bindFWD() {
  $("#fwd").css({"margin":"8px 0 0 0", "float":"right", "cursor":"pointer"});              
  $("#fwd").bind({
    click: function() { navigateFWD(); },
    mouseover: function() { $(this).attr("src", "img/fwd_1.png"); },
    mouseout: function() { $(this).attr("src", "img/fwd_0.png"); }
  });  
}

function bindkeyFWD() {
  $(document).bind('keyup.fwd', function(e){
    if(e.keyCode == 39) { 
       navigateFWD();
       return false;
    } 
  });
}

function unbindkeyFWD() {   
  $(document).unbind('keyup.fwd'); 
}

function bindkeyRWD() {
  $(document).bind('keyup.rwd', function(e){
    if(e.keyCode == 37) { 
       navigateRWD();
       return false;
    } 
  });
}

function unbindkeyRWD() {   
  $(document).unbind('keyup.rwd'); 
}