$(document).ready(function() {
    var lefta = 0; 
    var topa = 0;
    var title_left = 0;
    var title_top = 0;
    var offset = {};
    var open = false;
    var title;
    var width = 360;
    var height = 240;
    var w2 = width / 2;
    var h2 = height / 2;
    var bor = 20;
    var img;
    var spinner = new Image();
    
    $(spinner).attr('src', 'images/spinner.gif');
    
    /*** reakce na klik na TN => otevreni fotky ***/
    $('.gal a').click(function() {
      if(!open) {
      
      var i=this.href;
      title = $(this).children().attr('title');
      
      $(this).offset({ scroll: false, border: true }, offset);
      lefta=offset.left-(w2-bor);
      topa=offset.top-(h2-bor);
      title_left=lefta+bor;
      title_top=topa+bor;    
      
      $('#galshow').css("top", offset.top);
      $('#galshow').css("left", offset.left);
      
      $('#galshow')
        .animate({height: height+bor*2, top: topa, opacity: 0.8}, 200)
        .animate({width: width+bor*2, left: lefta, opacity: 1}, 250,
        function() {
          img = new Image();
          $(this).toggleClass("loading");
  
          $(img).load(function () { 
              $(this).hide();           
              $('#galshow_title').css("top", title_top);
              $('#galshow_title').css("left", title_left);
              $('#title').css("top", topa-8);
              $('#title').css("left", title_left);
              $('#title').html(title);
              $('#galshow').append(this);
              $('#galshow img').fadeIn('normal', function () {
                $('#galshow').toggleClass("loading");
                $('#galshow_title')
                .animate({height: 30, opacity: 0.66}, 200, function () {
                  $('#title').show();
                  $('#title').animate({top : title_top}, 150);
            });            
          });
          }).attr('src', i);
                    
          open=true;
          return false;
        });
      }
      return false;
    });
    
    /*** reakce na prejeti mysi nad TN => oznaceni (zatemneni) TN ***/
    $('.gal a img').hover(function() {
      $(this).fadeTo('fast', 0.6);
    },
    function() {
      $(this).fadeTo('fast', 1);
    });
    
    /*** reakce na prejeti mysi nad TITLE => zvyrazneni krizku***/
    $('#title').hover(function() {
      $('#galshow_title').toggleClass('bgr_sel');
    },
      function() {
      $('#galshow_title').toggleClass('bgr_sel');    
    });
    
    /*** reakce na klik na title_bar => uzavreni fotky ***/
    $('#title').click(function() {
      $('#title').hide();
      $('#galshow_title')
            .animate({height: 0, opacity: 1}, 'fast', function () {
              $(this).hide();
              $(this).empty();
              $('#galshow img').fadeOut(250, function() {
                $('#galshow')
                .animate({height: 60, top: offset.top, opacity: 0.8}, 300)
                .animate({width: 90, left: offset.left, opacity: 0.4}, 250)
                .fadeOut('normal');
                delete img;
                $('#galshow').empty();
                open=false;
                return false;
              });
            });
      return false;
    });
  });