$(function(){

    var step_wraper = 0;

    refreshWraperArrows(step_wraper);

    function showBoxes(){

    var i = 0;
    var boxIMGs = new Array();

    $('#wraper .box a').find('img').each(function() {
      boxIMGs.push({src: $(this).attr('src')});
    });

    $('#wraper').append('<div id="boxLoader"></div>');
    $("#boxLoader").css({
            'height': $(window).height()+'px'
            });

      $('#boxLoader').imageLoader({
      	   images: boxIMGs,
           splashScreenImage: '../img/load.gif',
           enableSplashScreenImage: 1,
           enableSplashScreenText: 0
	}, function(){

          $("#wraper").find('.box').each(function(){
              $(this).delay(i*100).fadeIn('300');
              i++;
          });
          $("#boxLoader").remove();

          //showWraperArrows();
        });

    }

    function startMasonry(){
        $('#wraper').masonry({
            itemSelector : '.box',
            columnWidth : 200,
            isAnimated: true
        });

        $("body").css({
            'height': $(window).height()+'px !important'
            });
    }

    $(window).resize(function() {

        $('#nav-bar').css('width', $(window).width() % 200 + 200);
        $('#wraper').css('margin-left', $(window).width() % 200 + 200);
        $('#shadow-top').css('left', $(window).width() % 200 + 200);
        $('#shadow-bottom').css('left', $(window).width() % 200 + 200);
        $('#article').css('height', $(window).height());
        $("#wraper-move").css({
            'left': $('#nav-bar').width()+($('#wraper').width()/2)-106
            });
            
        $("body").css({
            'height': $(window).height()+'px !important'
            });

        refresh();

        
    }).resize();

    function refresh(){

        step_wraper = 0;
        wraperAnimate(step_wraper);

        refreshWraperArrows(step_wraper);
        showWraperArrows();

    }

    function showWraperArrows(){

          var i = $('#wraper .box').length;

          var wraper_width = $('#wraper').width();
          var vis_rows = Math.floor($(window).height()/150);
          var vis_items =  vis_rows*(wraper_width/200);

          if(i >= vis_items){
            $("#wraper-move").delay(vis_items*100).fadeIn('600');
          }
          else
            $("#wraper-move").hide();

    }

    function itemHover(){
	if (navigator.userAgent.indexOf("MSIE")==-1){
          $('#wraper .box').hover(function(){
            if(!$('#nav li').hasClass('active')){
              $(this).find('.prev-big').fadeToggle('fast');
            }
              $(this).find('.details').fadeToggle('fast');
          });
        }
        else
        {
          $('#wraper .box').hover(function(){
            if(!$('#nav li').hasClass('active')){
              $(this).find('img').toggle();
              $(this).find('.details').toggle();
            }
            else{
              if($(this).hasClass('active')){
                $(this).find('.details').toggle();
              }
            }

          });
       }
    };

    function refreshWraperArrows(s){

        var wraper_width = $('#wraper').width();
        var box_count =  $('#wraper .box').length;

        var rows = Math.ceil(box_count/(wraper_width/200));
        var visible_rows = rows - s;


        if (s > 0)
        {
            $('#wraper-move #top').removeClass('inactive');
        }
        else{
            $('#wraper-move #top').addClass('inactive');
        }

        if ( visible_rows * 150 > $(window).height()-150)
        {
            $('#wraper-move #bottom').removeClass('inactive');
        }
        else{
            $('#wraper-move #bottom').addClass('inactive');
        }

    };

    $('#wraper-move #bottom').click(function(){
		if(!$(this).hasClass('inactive')) {
			step_wraper++;
        	wraperAnimate(step_wraper)
		}
    });

    $('#wraper-move #top').click(function(){
		if (!$(this).hasClass('inactive')) {
			step_wraper--;
	        wraperAnimate(step_wraper)
		}

    });

    function wraperAnimate(step_wraper){
        $('#wraper').animate({
            top: -(step_wraper*150)
        }, 600 , 'swing');
        refreshWraperArrows(step_wraper);
    }

  function menuPage() {

      // Check for hash value in URL
    var hash = window.location.hash.substr(1);
    var href = $('#nav li.menu a').each(function(){
        var href = $(this).attr('href');
        if(hash==href){

            startMasonry();
            resetBoxes();
            $('#category .txt').show();
            //refresh();
            
            $('#wraper-move').remove();
            $('#category-move').remove();

            $('body').append('<span id="load" ></span>');
            $('#load').fadeIn('normal');

            var toLoad = hash;
            
            verClass(toLoad);
            $('#article').empty().css({
            'height': $(window).height()
            });

            loadContent(toLoad);

            $(this).parent('li').addClass('active');

        }
    });

    $('#nav li.menu a').click(function(){

    startMasonry();
    resetBoxes();
    $('#category .txt').show();
    refresh();

    $('#wraper-move').remove();
    $('#category-move').remove();
    
    $(this).parent('li').addClass('active');
    $('#nav li a').not(this).parent('li').removeClass('active');

    var toLoad = $(this).attr('href');

	verClass(toLoad);

    $('#article').empty().css({
            'height': $(window).height()
            });

    $('#load').remove();
    $('#article').append('<span id="load" ></span>');
    $('#load').fadeIn('normal');

    window.location.hash = $(this).attr('href');
	loadContent(toLoad);

    return false;

    });
    
    function verClass(toLoad) {
     
              $('#wraper').removeClass();
            if(toLoad.replace("/frontend_dev.php", "").substr(1,1)=='1'){
              $('#wraper').addClass('text');
              $('#shadow-bottom').hide();
            }
            else{
              $('#wraper').addClass('category');
              $('#shadow-bottom').fadeIn('600');
		}
    }
    
    function loadContent(toLoad) {
	$('#article').load(toLoad,showNewContent());
    }

    function showNewContent() {
        $('#article').fadeIn(500,hideLoader());
    }
    function hideLoader() {
       	$('#load').fadeOut('normal');
    }

    function resetBoxes(){
      $('#wraper .box').removeClass('active').css({
        'opacity': 0.2,
        'z-index':-1
      }).find('.prev-big').css('display', 'none');
      $('a#top,a#bottom').removeClass().hide();
    }
  }

    function projectView() {


      // Check for hash value in URL
    var hash = window.location.hash.substr(1);
    var href = $('#wraper .box a').each(function(){
        var href = $(this).attr('href');
        if(hash==href){

            $('#layer').css('z-index', '998');
            $('#product-view').css('z-index', '999');
            $('#product-view').empty();

            $('#load').remove();
            $('#layer').append('<span id="load" ></span>');
            $('#load').fadeIn('normal');

            var toLoad = hash;

            loadContent(toLoad);

        }
    });

    $('#wraper .box a').click(function(){

    var toLoad = $(this).attr('href');

    $('#layer').css('z-index', '998');
    $('#product-view').css('z-index', '999');
    $('#product-view').empty();

    $('#load').remove();
    $('#layer').append('<span id="load" ></span>');
    $('#load').fadeIn('normal');

    window.location.hash = $(this).attr('href');
	loadContent(toLoad);

    return false;

    });

    function loadContent(toLoad) {

        $('#product-view').load(toLoad,showNewContent());

      /*$.post(toLoad, function(data) {
        showNewContent();
        $('#product-view').html(data);
      });*/

    }

    function showNewContent() {
        $('#product-view').fadeIn(500,hideLoader());
    }
    function hideLoader() {
       	$('#load').fadeOut('normal');
    }
  }

  $('body').keydown(function(e){
      switch(e.keyCode){
        case(37):
          $('.controls .prev').click();
          return false;
        case(39):
          $('.controls .next').click();
          return false;
        case(40):
          $.unblockUI();
          return false;
        case(38):
          $('#photo_show').find('img:visible').click();
          return false;
      }
      });

    projectView();
    menuPage();
    showBoxes();
    startMasonry();
    itemHover();

});