$(document).ready(function(){

  $('div.entry img.thumb').live('click', function(){
    pauseFlash();
    var bigImage = $(this).attr("rel");
    var prevNum = $('div.panel.active div.thumb-active').nextAll('div.thumb').length;

    $(this).parents("div.entry").children("div.thumb").each(function(){
      $(this).removeClass("thumb-active");
    });
    var thumbNum = $(this).parent().nextAll("div.thumb").length;
    $(this).parent("div").addClass("thumb-active");
    
    
    if ($('div.panel.active div.video-'+thumbNum).length) {
      /* Zum Video */
      $('div.panel.active div.video-'+thumbNum).css({opacity: 0, display: 'block', zIndex: 4}).animate({opacity: 1}, 500, 'swing', function(){

        if ($('div.panel.active div.video-'+prevNum).length) {
          $('div.panel.active div.video-'+prevNum).css('display', 'none');
        }
        $(this).css('z-index', 3);
        $('div.panel.active').find("div.hotspots-container").each(function(i){
          if(i == thumbNum){
            $(this).css("display", "block");
          }
          else{
            $(this).css("display", "none");
          }
        });
        $('#big-image-change').remove();

      });
    } else if ($('div.panel.active div.video-'+prevNum).length) { 
      /* Vom Video */
      $('div.panel.active div.big-image').css({backgroundImage: 'url(' + bigImage + ')'});
      $('div.panel.active div.video-'+prevNum).animate({opacity: 0}, 500, 'swing', function(){
        $(this).css('display', 'none');

        $('div.panel.active').find("div.hotspots-container").each(function(i){
          if(i == thumbNum){
            $(this).css("display", "block");
          }
          else{
            $(this).css("display", "none");
          }
        });
        $('#big-image-change').remove();
      });

    } else {
      /* Bild zu Bild */
      $('div.panel.active div.big-image').append('<img id="big-image-change" src="' + bigImage + '"/>');


      $('#big-image-change').css({opacity: 0}).animate({opacity: 1.0}, 500, 'swing', function(){
        $('div.panel.active div.big-image').css({backgroundImage: 'url(' + bigImage + ')'});
        $('div.panel.active div.video').css('display', 'none');
        $(this).parents(".panel").find("div.hotspots-container").each(function(i){
          if(i == thumbNum){
            $(this).css("display", "block");
          }
          else{
            $(this).css("display", "none");
          }
        });

        $('#big-image-change').remove();
      });
    }
  });
});