$(function(e) {
  var autoLoadInterval = 10000;
  var autoLoadEnabled = true;
  var websiteRoot = "/";
  
  /* use inital image for backstretch */
  var postImage = $('#post img').attr('src');
  $.backstretch(websiteRoot + postImage, {centeredX: true});

  /* when mouseenter some elements start counter again to prevent loading next post in the moment an element was entered */
  $('#next, #prev, #weitclickInfoShow, #weitclickInfo, .likeButton').bind('mouseenter', function(e) {
    autoLoadReinit();
  });

  $('#prev').bind('click', function(e) {
	// don't reload while likebox or weitclickInfo is open
	if($('#post').data('stopReload') == true) {
		return false;
	}
    var actId = $('#post').attr('class').substr(2);

    $.ajax({
      url: websiteRoot + 'slider/getNext/id/' + actId,
      dataType: "json",
      success: function( data ) {
        loadPost(data);
      }
    });
  });

  $('#next').bind('click', function(e) {
	// don't reload while likebox or weitclickInfo is open
	if($('#post').data('stopReload') == true) {
		return false;
	}
    var actId = $('#post').attr('class').substr(2);

    $.ajax({
      url: websiteRoot + 'slider/getPrev/id/' + actId,
      dataType: "json",
      success: function( data ) {
        loadPost(data);
      }
    });
  });

  var autoLoad = setInterval(function() {
    if(autoLoadEnabled) {
      $('#next').click();
    }
  }, autoLoadInterval);

  /**
   * - stop current loaded image (if some)
   * - stop timer
   * - start timer again with initial interval
   */
  function autoLoadReinit()
  {
    stop();
    clearInterval(autoLoad);

    autoLoad = setInterval(function() {
      if(autoLoadEnabled) {
        $('#next').click();
      }
    }, autoLoadInterval);
  }

  function loadPost(data)
  {
	// reinit the timer
	autoLoadReinit();
	  
    var img = new Image();
    img.onload = function() {
      $('#post').fadeOut(200);
      $('#backstretch').fadeOut(200);
      $('#post img').attr('src', data.image);

      $('#post').attr('class', 'id'+data.id);
      $('#post .likeCount').html(data.likecount);

      $('#post .date').html(data.date);
      $('#post .time').html(data.time);
      $('#post .content').html(data.content);
      $('#post img').attr('src', data.image);

      $('#post .likeButton .active').fadeOut(null, function(){
        $('#post .likeButton .default').fadeIn();
      });

      $.backstretch(websiteRoot + data.image, {speed: 150, centeredX: true});
      $('#post').fadeIn(200);
      $('#backstretch').fadeIn(200);

      img.onload = null;
      img = null;
      delete img;
      delete data;
    }
	console.log(data);
    img.src =  websiteRoot + data.image;
	
  }

  $('#weitclickInfoShow').bind('click', function(e) {
	layerIsOpen = true;
	$('#post').data('stopReload', true);
	$(window).resize();
    $('#weitclickInfo').fadeIn();


    $('#weitclickInfo .close').bind('click', function(e) {
      $('#weitclickInfo').fadeOut();
	  $('#post').data('stopReload', false);
	  layerIsOpen = false;
    });
  });

	
/*
  $('#post .likeButton .default').bind('click', function(e) {
    $('#post .likeButton .default').fadeOut(null, function() {
      var actId = $('#post').attr('class').substr(2);
      $('#post .fb-likebox').html('<fb:like href="http://www.weitclick.de?id='+actId+'&amp;source=fb" send="false" layout="standard" width="500" height="24" show_faces="false" action="like" font=""></fb:like>');
      FB.XFBML.parse();
      $('#post .likeButton .active').fadeIn();
    });
    
    $('#post .likeButton .active .close').bind('click', function(e) {
      $('#post .likeButton .active').fadeOut(null, function(){
        $('#post .likeButton .default').fadeIn();
      });
    });
  });
*/
	// animation duration
	var duration = 350;

	$('#post .likeButton').hover(
			function() {
				$('#post .likeButton .default').stop(true, false);
				$('#post .likeButton .active').stop(false, false);

				if($('#post .likeButton .active').is(":visible")) {
					$('#post .likeButton .active').animate({opacity:1}, duration);
				} else {
					$('#post .likeButton .default').animate({opacity:0}, duration , function() {
						$('#post .likeButton .default').hide();
						var actId = $('#post').attr('class').substr(2);
						$('#post .fb-likebox').html('<fb:like href="http://www.weitclick.de?id='+actId+'&amp;source=fb" send="false" layout="standard" width="500" height="24" show_faces="false" action="like" font=""></fb:like>');
						FB.XFBML.parse();
						$('#post .likeButton .active').show();
						$('#post .likeButton .active').animate({opacity:1}, duration);
					});
				}
				$('#post').data('stopReload', true);
			},

			function() {
				$('#post .likeButton .default').stop(false, false);
				$('#post .likeButton .active').stop(true, false);
				
				if($('#post .likeButton .active').is(":visible")) {
					$('#post .likeButton .active').animate({opacity:0}, duration , function() {
						$('#post .likeButton .active').hide();
						$('#post .likeButton .default').show(0, function(){
							$('#post .likeButton .default').animate({opacity:1}, duration);
						});

					});
				} else {
					$('#post .likeButton .default').animate({opacity:1}, duration);
				}
				$('#post').data('stopReload', false);
			}
	);


	$('body').bind('swipeleft', function(e) {
		$('#next').click();
	});

	$('body').bind('swiperight', function(e) {
		$('#prev').click();
	});

	$window = $(window);
    $infoDark = $('.info.dark');
    $infoBright = $('.info.bright');
	$layer = $('#weitclickInfo');
    layerIsOpen = false;

	function checkLayerSize(){
      var diff = 30;
      var width = $window.width();
      var height = $window.height();
      var left = width - (width-diff);
      var top = height - (height-diff);

      $layer.css({
        width: width-diff+'px',
        height: height-diff+'px',
        left: left/2+'px',
        top: top/2+'px'
      }).show();

      var textdiff = $layer.height() - $layer.find('.text').height();
      $layer.find('.text').css('top', textdiff/2+'px');
    }

	function checkPosition() {
      var left = $window.width() - $infoDark.width();
      var top = $window.height() - $infoBright.height();
      $infoDark.css({
        left: (left/2)+'px',
        top: (top/2)+'px'
      });
      $infoBright.css({
        left: left/2+'px',
        top: top/2+'px'
      });
    }

	$(window).resize(function() {
		if (layerIsOpen == true) {
          $layer.hide();
          checkLayerSize();
        }
        checkPosition();
    })

	$(window).resize();

});

$(document).bind("mobileinit", function(){	
	$.mobile.hashListeningEnabled = false;
});