$(document).ready(function() {

  /* Vycentruje a nastavi sirku #contentu podle maximalniho poctu karticek se stejnym odsazenim */
  var contentWidth = Math.floor(($('#huh').width()-20)/200)*200+20;
  var contentMargin = ($('#huh').width()-contentWidth)/2;
  $('#content').css({'width' : contentWidth, 'left' : contentMargin, 'top' : contentMargin, 'margin' : 0, 'position' : 'absolute'});
  if($('#huh').height() > $('#content').height()) {
    $('#content').css({'height' : $('#huh').height()-80})
  }
  $('#content ul').css({'padding-right' : '0'}); 
  
  /* To same, ale po resizu okna s animaci */
  function resize() {
    contentWidth = Math.floor(($('#huh').width()-20)/200)*200+20;
    contentMargin = ($('#huh').width()-contentWidth)/2;
    $('#content').animate({
      left: contentMargin,
      top: contentMargin,
      width: contentWidth
    }, 300);
    $('#content ul').animate({
      paddingRight: '0'
    }, 300);
  }
  
  $(window).bind('resize', resize);
  
  /* Hejba s #contentem podle polohy mysi */
  var mx,my;
  $().mousemove(function(e){
    if($('#huh').height() > $('#content').height()) {
        mx = -Math.ceil((e.pageX-$(window).width()/2)/($('#huh').width()/50))+contentMargin;
        my = -Math.ceil((e.pageY-$(window).height()/2)/($('#huh').height()/50))+contentMargin;
        $('.moveable').css({'left' : mx, 'top' : my});
    } else {
        mx = -Math.ceil((e.pageX-$(window).width()/2)/($('#huh').width()/50))+contentMargin;
        my = -Math.ceil((($('#content').height() + (contentMargin*2.5)) - $('#huh').height()) / ( ($('#huh').height() / e.pageY))) + contentMargin;
        $('.moveable').css({'left' : mx, 'top' : my});
    }
  });

  /* Vycentruje #content po odjezdu mysi z okna */
  $(document).mouseleave(function(){
    $('#content').animate({
      left: contentMargin,
      top: contentMargin
    }, 300);
  });
  
  /*
  var mx,my;
  $('#container').mouseenter(function(e){
  
    $().mousemove(function(e){
      mx = -Math.ceil((e.pageX-$(window).width()/2)/($('#huh').width()/50))+contentMargin;
      my = -Math.ceil((e.pageY-$(window).height()/2)/($('#huh').height()/50))+contentMargin;
      $('.moveable').css({'margin-left' : mx, 'margin-top' : my});
    });
  }).mouseleave(function(){
    $('#content').animate({
      marginLeft: contentMargin,
      marginTop: contentMargin,
      marginRight: 0,
      marginBottom: 0
    }, 300);
  });
  */
  
  /* Hover karticky */
  /* sekaaa se
  $("#content li .thumb").hover(function () {
      $(this).animate({
        height: '120',
        margin: '-5',
        width: '190'
      }, 100);
  
      $('img', this).animate({
        height: '120',
        width: '190'
      }, 100);
  }, function () {
      $(this).animate({
        height: '110',
        margin: '0',
        width: '180'
      }, 100);
  
      $('img', this).animate({
        height: '110',
        width: '180'
      }, 100);
  });
  */
  
  /* Klik na karticku */
  $('#content li a').click(function(e){
    var href = $(this).attr('href');
    var bgColor = $('img', this).attr('style');

    $('#content').animate({left: contentMargin,top: contentMargin}, 300).removeClass('moveable');
    $(this).parent().append('<div id="preDetail" style="'+ bgColor +'"></div>');

    $('#preDetail').animate({
      height: $('#huh').height(),
      width: $('#huh').width(),
      marginLeft: -this.offsetLeft-contentMargin-5,
      marginTop: -this.offsetTop-contentMargin-5
    }, { duration: 'fast', queue: false, complete: function(){
      //$('#container').append('<div id="detail" style="'+ bgColor +'"><a href="" id="detailSound">Sound OFF</a><a href="" id="detailPrev">Prev</a><a href="" id="detailNext">Next</a><div id="detailInfo"><h2>Dílo</h2><p><a href="">Zavřít</a></p></div><a href="#" id="detailImage"><img src="'+ href +'" width="640" height="480" style="margin: -240px 0 0 -320px" /></a></div>');
      //$('#preDetail').remove();

      $('#container').append('<div id="forDetail"></div>');
      $('#forDetail').load(href + ' #detail', function(){

        detailFunctions();

        $('#preDetail').remove();
      });
    }});
  
    return false; 
  });

  /* funkce pro chod detailu */
  function detailFunctions() {

    /* Komiks */
    $('.comics').mousemove(function(e){
      if($('.comics .detailImage img').height() > $('#huh').height()) {
        /*
        my = -Math.ceil((e.pageY-$(window).height()/2)/($('#huh').height()/50));
        */
        my = -Math.ceil((e.pageY*((($('.comics .detailImage img').height()+150)/$('#huh').height())))-e.pageY);
        
        $('.comics .detailImage img').css({'margin-top' : '50px', 'top' : my});
      }
    });

    /* Zvestovani obrazku na full */
    $('.fullImage img').height();
    $('.fullImage img').width();

    $('#huh').height();
    $('#huh').width();

    if($('.fullImage img').width() > $('#huh').width() && $('.fullImage img').height() > $('#huh').height())
    {
      // obe strany jsou vetsi
      var widthRest = $('.fullImage img').width() - $('#huh').width();
      var heightRest = $('.fullImage img').height() - $('#huh').height();
      
      if(widthRest > heightRest)
      {
        var w1 = $('.fullImage img').height() / heightRest;
        var w2 = $('#huh').width() / w1;
        var w3 = $('.fullImage img').width() - w2;
        
        $('.fullImage, .fullImage img').css({'width' : w3, 'height' : $('#huh').height()});
        $('.fullImage img').css({'margin-left' : -w3/2, 'margin-top' : -$('#huh').height()/2});
      }
      else
      {
        var w1 = $('.fullImage img').width() / widthRest;
        var w2 = $('#huh').height() / w1;
        var w3 = $('.fullImage img').height() - w2;
        
        $('.fullImage, .fullImage img').css({'width' : $('#huh').width(), 'height' : w3});
        $('.fullImage img').css({'margin-left' : -$('#huh').width()/2, 'margin-top' : -w3/2});
      }
    }
    else if ($('.fullImage img').width() > $('#huh').width())
    {
      var w1 = $('#huh').height() / $('.fullImage img').height();
      var w2 = $('.fullImage img').height() * w1;
      var w3 = $('.fullImage img').width() * w1;
      
      $('.fullImage, .fullImage img').css({'width' : w3, 'height' : w2});
      $('.fullImage img').css({'margin-left' : -w3/2, 'margin-top' : -w2/2});
    }
    else if ($('.fullImage img').height() > $('#huh').height())
    {
      var w1 = $('#huh').width() / $('.fullImage img').width();
      var w2 = $('.fullImage img').width() * w1;
      var w3 = $('.fullImage img').height() * w1;
      
      $('.fullImage, .fullImage img').css({'width' : w2, 'height' : w3});
      $('.fullImage img').css({'margin-left' : -w2/2, 'margin-top' : -w3/2});
    }
    else
    {
      var widthRest = $('#huh').width() - $('.fullImage img').width(); // 1500
      var heightRest = $('#huh').height() - $('.fullImage img').height(); // 658

      if(widthRest > heightRest)
      {
        var w1 = $('#huh').width() / $('.fullImage img').width();
        var w2 = $('.fullImage img').width() * w1;
        var w3 = $('.fullImage img').height() * w1;
        
        $('.fullImage, .fullImage img').css({'width' : w2, 'height' : w3});
        $('.fullImage img').css({'margin-left' : -w2/2, 'margin-top' : -w3/2});
      }
      else
      {
        var w1 = $('#huh').width() / $('.fullImage img').width();
        var w2 = $('.fullImage img').width() * w1;
        var w3 = $('.fullImage img').height() * w1;
        
        $('.fullImage, .fullImage img').css({'width' : w2, 'height' : w3});
        $('.fullImage img').css({'margin-left' : -w2/2, 'margin-top' : -w3/2});
      }
    }

    /* Klik na detail obrazku */
    $('.detailImage, .likeA').click(function(){
      $('#content').addClass('moveable');
      $('#detail').animate({
        marginLeft: -$('#huh').width()
      }, { complete: function() { $('#forDetail').remove(); } });
      return false;
    });
  
    /* Další */
    $('.detailNext').click(function(){
      var href = $(this).attr('href');
      $('#container').append('<div id="nextDetail"></div>');
      $('#nextDetail').load(href + ' #detail', function(){
        $('#forDetail').animate({left: '-100%'}, 300);
        $('#nextDetail').animate({left: '0'}, 300, function(){ $('#forDetail').remove(); $('#nextDetail').attr('id', 'forDetail'); });
        detailFunctions();
      });
      return false;
    });
  
    /* Předchozí */
    $('.detailPrev').click(function(){
      var href = $(this).attr('href');
      $('#container').append('<div id="prevDetail"></div>');
      $('#prevDetail').load(href + ' #detail', function(){
        $('#forDetail').animate({left: '100%'}, 300);
        $('#prevDetail').animate({marginLeft: '100%'}, 300, function(){ $(this).css('margin-left', '0'); $('#forDetail').remove(); $('#prevDetail').attr('id', 'forDetail'); });
        detailFunctions();
      });
      return false;
    });

  }

  /* Detail informace */
  $('.detailImage img, .likeA').mousemove(function(e){
    $('.detailInfo').css({'left' : e.pageX+30, 'top' : e.pageY, 'display' : 'block'});
  });
  $('.detailImage img, .likeA').mouseleave(function(){
    $('.detailInfo').hide();
  });

  /* Paticka */
  var footerDown = setTimeout("$('#stripe').animate({marginBottom: '-38'}, 350);",3000);
  $('#stripe').hover(function () {
    clearTimeout(footerDown);
    $(this).stop().animate({
      marginBottom: '0'
    }, 250);
  }, function () {
    $(this).stop().animate({
      marginBottom: '-38'
    }, 250);
  });
  $('#stripe ul li').hover(function () {
    $(this).addClass('active');
  }, function () {
    $(this).removeClass('active');
  });

});