/* random position number */

function randomNumber(num) {
	return Math.floor(Math.random()*num);			
}

/* browser window width and height */

function getWindowWidth() {
	return document.body.clientWidth;
}

function getWindowHeight() {
    var windowHeight = 0;
    if (typeof(window.innerHeight) == 'number') {
        windowHeight = window.innerHeight;
    } else {
        if (document.documentElement && document.documentElement.clientHeight) {
            windowHeight = document.documentElement.clientHeight;
        } else {
	if (document.body && document.body.clientHeight) {
	    windowHeight = document.body.clientHeight;
	}
         }
    }
    return windowHeight;
}		

/* close screen from flash */

function closeScreen(obj) {
    document.getElementById(obj).style.display = 'none';
};

$(function() {

    /* calculate and assign positions */
	  
	var zIndex = 100;
		
	var amountTop = getWindowHeight() * 0.25;
	var amountLeft = getWindowWidth() * 0.21;

	var startTop  = randomNumber(amountTop);
	var startLeft = randomNumber(amountLeft);

	var i = 1;
	$('#items .box').each(function() {
		switch (i) {
			case 1:
				startTop = randomNumber(amountTop) + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft;
			break;
			case 2:
				startTop = randomNumber(amountTop);
				startLeft = randomNumber(amountLeft) + amountLeft;
			break;
			case 3:
				startTop = randomNumber(amountTop);
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft;
			break;
			case 4:
				startTop = randomNumber(amountTop) + amountTop;
				startLeft = randomNumber(amountLeft);
			break;				
			case 5:
				startTop = randomNumber(amountTop);
				startLeft = randomNumber(amountLeft);
			break;
			case 6:
				startTop = randomNumber(amountTop) + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft;
			break;
			case 7:
				startTop = randomNumber(amountTop) + amountTop + amountTop;
				startLeft = randomNumber(amountLeft);
			break;				
			case 8:
				startTop = randomNumber(amountTop) + amountTop + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft;
			break;
			case 9:
				startTop = randomNumber(amountTop) + amountTop + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft;
			break;
			case 10:
				startTop = randomNumber(amountTop);
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft + amountLeft;
			break;
			case 11:
				startTop = randomNumber(amountTop) + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft + amountLeft;
			break;
			case 12:
				startTop = randomNumber(amountTop) + amountTop + amountTop;
				startLeft = randomNumber(amountLeft) + amountLeft + amountLeft + amountLeft;
			break;		
			case 13:
		        startTop = randomNumber(60);
		        startLeft = randomNumber(60);
			break;	
			/* language buttons */
			case 14:
		        startTop = 15;
    		    startLeft = getWindowWidth() - 180;
			break;		
			case 15:
        		startTop = 15;
	    	    startLeft += 50;
			break;																														
			/* for the order / chaos button */
			case 16:
        		startTop = 15;
	    	    startLeft += 50;
			break;

		}
	
		$(this).css('top', startTop);
	    $(this).css('left', startLeft);		
		i++;
	});	
	

	/* put navigation on top */
	
	$('.showOnTop').css('zIndex', 40);


	/* deeplinks */

	var location = document.location.href;

	if (location.match("about") != null) {
		$('.showreelContent').hide();
		$('.contactContent').hide();			
		$('.aboutContent').toggle();
		$('.about').toggleClass('active', 1000);	
		$('.showreel').removeClass('active');
		$('.contact').removeClass('active');	
	} else if (location.match("showcase") != null) {
		$('.aboutContent').hide();
		$('.contactContent').hide();
		$('.showreelContent').toggle();
		$('.showreel').toggleClass('active', 1000);		
		$('.contact').removeClass('active');
		$('.about').removeClass('active');
	} else if (location.match("contact") != null) {
		$('.aboutContent').hide();
		$('.showreelContent').hide();
		$('.contactContent').toggle();							
		$('.contact').toggleClass('active', 1000);		
		$('.showreel').removeClass('active');
		$('.about').removeClass('active');	
	}

	
	/* Toggle main menu */	

	$('.about').click(function() {
		$('.showreelContent').hide();
		$('.contactContent').hide();			
		$('.aboutContent').toggle();
		$('.about').toggleClass('active', 1000);	
		$('.showreel').removeClass('active');
		$('.contact').removeClass('active');
	});
	
	$('.showreel').click(function() {
		$('.aboutContent').hide();
		$('.contactContent').hide();
		$('.showreelContent').toggle();
		$('.showreel').toggleClass('active', 1000);		
		$('.contact').removeClass('active');
		$('.about').removeClass('active');
	});			
	
	$('.contact').click(function() {
		$('.aboutContent').hide();
		$('.showreelContent').hide();
		$('.contactContent').toggle();							
		$('.contact').toggleClass('active', 1000);		
		$('.showreel').removeClass('active');
		$('.about').removeClass('active');
	});	
	
	
	/* Dutch bigger and smaller */
	
	$('#p1 .small').click(function() {
	
		var width1 = $('.object1_l img:first').width();
		var checkWidth = $('.object1 img').width();    
	    var width = $('.object1_l').width();
	    
	    if (width > checkWidth + 150) {
	        $('.object1_l img:first').css('width', width1 - 100 + 'px');	
	        var width = $('.object1_l').width();	
	        $('.object1_l').css('width', width - 100 + 'px'); 
	    }
	    
	});
		
	$('#p1 .large').click(function() {
	
		var width = $('.object1_l img:first').width();
		$('.object1_l img:first').css('width', width + 100 + 'px');		      
		
		var width = $('.object1_l').width();		
        $('.object1_l').css('width', width + 100 + 'px'); 
        
	});
	
	$('#p2 .small').click(function() {
		
		var width1 = $('.object5_l img:first').width();
	    var checkWidth = $('.object5 img').width();    
		var width = $('.object5_l').width();
		
		if (width > checkWidth + 150) {
	        $('.object5_l img:first').css('width', width1 - 100 + 'px');	 
	        var width = $('.object5_l').width();			
	        $('.object5_l').css('width', width - 100 + 'px'); 	        
	    }
	    
	});	
	
	$('#p2 .large').click(function() {
	
		var width = $('.object5_l img:first').width();
		$('.object5_l img:first').css('width', width + 100 + 'px');
		      
		var width = $('.object5_l').width();
        $('.object5_l').css('width', width + 100 + 'px'); 
        
	});
	
    $('#p3 .small').click(function() {
		
		var width1 = $('.object8_l img:first').width();
	    var checkWidth = $('.object8 img').width();    
		var width = $('.object8_l').width();
		
		if (width > checkWidth + 150) {
	        $('.object8_l img:first').css('width', width1 - 100 + 'px');	 
	        var width = $('.object8_l').width();			
	        $('.object8_l').css('width', width - 100 + 'px'); 	        
	    }
	    
	});	
	
	$('#p3 .large').click(function() {
	
		var width = $('.object8_l img:first').width();
		$('.object8_l img:first').css('width', width + 100 + 'px');
		      
		var width = $('.object8_l').width();
        $('.object8_l').css('width', width + 100 + 'px'); 
        
	});
	
	
	/* English bigger and smaller */
	
	$('#p1 .small_en').click(function() {
	
		var width1 = $('.object1_l img:first').width();
		var checkWidth = $('.object1 img').width();    
	    var width = $('.object1_l').width();
    
    	if (width > checkWidth + 150) {
        	$('.object1_l img:first').css('width', width1 - 100 + 'px');
	        var width = $('.object1_l').width();
    	    $('.object1_l').css('width', width - 100 + 'px'); 
	    }
	    
	});
		
	$('#p1 .large_en').click(function() {
		
		var width = $('.object1_l img:first').width();
		$('.object1_l img:first').css('width', width + 100 + 'px');
		      
		var width = $('.object1_l').width();		
        $('.object1_l').css('width', width + 100 + 'px'); 
        
	});
	
	$('#p2 .small_en').click(function() {
		
		var width1 = $('.object5_l img:first').width();
		var checkWidth = $('.object5 img').width();    
		var width = $('.object5_l').width();
		
		if (width > checkWidth + 150) {
        	$('.object5_l img:first').css('width', width1 - 100 + 'px'); 
	        var width = $('.object5_l').width();		
	        $('.object5_l').css('width', width - 100 + 'px');         
	    }
	    
	});
	
	$('#p2 .large_en').click(function() {
		
		var width = $('.object5_l img:first').width();
		$('.object5_l img:first').css('width', width + 100 + 'px');		
		      
		var width = $('.object5_l').width();		
        $('.object5_l').css('width', width + 100 + 'px'); 
        
	});	
	
	$('#p3 .small_en').click(function() {
		
		var width1 = $('.object8_l img:first').width();
		var checkWidth = $('.object8 img').width();    
		var width = $('.object8_l').width();
		
		if (width > checkWidth + 150) {
        	$('.object8_l img:first').css('width', width1 - 100 + 'px'); 
	        var width = $('.object8_l').width();		
	        $('.object8_l').css('width', width - 100 + 'px');         
	    }
	    
	});
	
	$('#p3 .large_en').click(function() {
		
		var width = $('.object8_l img:first').width();
		$('.object8_l img:first').css('width', width + 100 + 'px');		
		      
		var width = $('.object8_l').width();		
        $('.object8_l').css('width', width + 100 + 'px'); 
        
	});	
	
	/* random image size */
	
	for (i = 1; i <= 12; i++) {
		$('.object' + i).find('img').css('width', 120+randomNumber(100) + 'px');
	}						
	
	/* background images */
	
	var windowWidth = getWindowWidth();
	var windowHeight = getWindowHeight();
	
	if (windowWidth <= 1200 && windowHeight <= 675) {
		var url = 'bg';
	} else if (windowWidth >= 1200 || windowHeight >= 675) {
		if (windowWidth <= 1600 && windowHeight <= 900) {
			var url = 'bg/medium';		
		} else {
			var url = 'bg/groot';
		}		
	} else {
		var url = 'bg/groot';
	}
	
	$('body').css('backgroundImage', 'url(assets/gfx/' + url + '/14.jpg)');
	
/*
	setInterval(function() {
		$('body').css('backgroundImage', 'url(assets/gfx/' + url + '/' + randomNumber(15) + '.jpg)');
	}, 30000);
*/	


	/* box movement */
	
	var canItMove   = true;
	var cameFromBox = false;
	
	$('.open_shadow').hover(function() {
    	canItMove = false;
         
	    var getParent = $(this).parent();
    	var offset = getParent.offset();
    	
	    $(this).parent().css('top', offset['top'] + 4);
    	$(this).parent().css('left', offset['left'] + 4); 
    
	}, function() {
	    canItMove = false;
	});

	$('.open_shadow').click(function() {
	    var getParent = $(this).parent();
	    var offset = getParent.offset();
	
	    $(this).parent().css('top', offset['top'] - 4);
	    $(this).parent().css('left', offset['left'] - 4); 
	});

	$('.item').hover(function(){		
        $(this).addClass('boxHover');
      
        var offset = $(this).offset();	
        
        $(this).css('top', offset['top'] - 4);
        $(this).css('left', offset['left'] - 4);
        
        canItMove = true;
	}, function() {	
	    if (canItMove == true) {
      		$(this).removeClass('boxHover');
  
      		var offset = $(this).offset();
   			
   			$(this).css('top', offset['top'] + 4);
		    $(this).css('left', offset['left'] + 4);
	    }
	});
  
	$('.item').mousedown(function(){
		$(this).addClass('boxHover');	
		
		canItMove = false;	
	});
	
	$('.item').mouseup(function(){
		$(this).removeClass('boxHover');
		
        var offset = $(this).offset();
        
        $(this).css('top', offset['top'] + 4);
        $(this).css('left', offset['left'] + 4);		
	});			
	

	$('.box').mousedown(function(){		
		$(this).css('zIndex', zIndex);
		zIndex++;	
	});	

	/* Draggable code */
	
	$(".box").draggable({
		cancel: "div.cancelDrag",
		/* need to fix
		containment: [-500, -500, getWindowWidth() - 95, getWindowHeight() - 95],		
		*/
		stack: {
			group: '.box', min: 20
		}
	});	
	
	/* open and close items */
	    
    /* 1 */
    
      $('.object1').mousedown(function() {
        var offset = $(this).offset();
        object1Toff = offset['top'];
        object1Loff = offset['left'];
      });
    
      $('.object1').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object1Toff && off['left'] == object1Loff) {
          $('.object1_l').toggle();			
          var width = $('.object1_l').width();      
          $('.object1_l').css('width', width + 'px');  
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                      
        }							
      }); 
      
      $('.object1_x').click(function() {
        $('.object1_l').toggle();											
      });	
    
    
    /* 2 */
    
      $('.object2').mousedown(function() {
        var offset = $(this).offset();
        object2Toff = offset['top'];
        object2Loff = offset['left'];
      });
    
      $('.object2').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object2Toff && off['left'] == object2Loff) {
          $('.object2_l').toggle();		
          var width = $('.object2_l').width();     
          $('.object2_l').css('width', width + 'px');    
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                 	
        }							
      }); 
      
      $('.object2_x').click(function() {
        $('.object2_l').toggle();											
      });	 
      
    /* 3 */
      
      $('.object3').mousedown(function() {
        var offset = $(this).offset();
        object3Toff = offset['top'];
        object3Loff = offset['left'];
      });
    
      $('.object3').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object3Toff && off['left'] == object3Loff) {
          $('.object3_l').toggle();		
          var width = $('.object3_l').width();     
          $('.object3_l').css('width', width + 'px');  
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                     	
        }							
      }); 
      
      $('.object3_x').click(function() {
        $('.object3_l').toggle();											
      });  
    
    /* 4 */
    
      $('.object4').mousedown(function() {
        var offset = $(this).offset();
        object4Toff = offset['top'];
        object4Loff = offset['left'];
      });
    
      $('.object4').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object4Toff && off['left'] == object4Loff) {
          $('.object4_l').toggle();	
          var width = $('.object4_l').width();     
          $('.object4_l').css('width', width + 'px');    
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                 		
        }							
      }); 
      
      $('.object4_x').click(function() {
        $('.object4_l').toggle();											
      }); 
            
    /* 5 */
      
      $('.object5').mousedown(function() {
        var offset = $(this).offset();
        object5Toff = offset['top'];
        object5Loff = offset['left'];
      });
    
      $('.object5').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object5Toff && off['left'] == object5Loff) {
          $('.object5_l').toggle();			
          var width = $('.object5_l').width();      
          $('.object5_l').css('width', width + 'px');          
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                   
        }							
      }); 
      
      $('.object5_x').click(function() {
        $('.object5_l').toggle();											
      });      
      
    /* 6 */
      
      $('.object6').mousedown(function() {
        var offset = $(this).offset();
        object6Toff = offset['top'];
        object6Loff = offset['left'];
      });
    
      $('.object6').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object6Toff && off['left'] == object6Loff) {
          $('.object6_l').toggle();			
          var width = $('.object6_l').width();     
          $('.object6_l').css('width', width + 'px');    
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                 
        }							
      }); 
      
      $('.object6_x').click(function() {
        $('.object6_l').toggle();											
      });   
    
    /* 7 */
      
      $('.object7').mousedown(function() {
        var offset = $(this).offset();
        object7Toff = offset['top'];
        object7Loff = offset['left'];
      });
    
      $('.object7').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object7Toff && off['left'] == object7Loff) {
          $('.object7_l').toggle();	
          var width = $('.object7_l').width();     
          $('.object7_l').css('width', width + 'px');   
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }
                            		
        }							
      }); 
      
      $('.object7_x').click(function() {
        $('.object7_l').toggle();											
      });   
      
      
    /* 8 */
      
      $('.object8').mousedown(function() {
        var offset = $(this).offset();
        object8Toff = offset['top'];
        object8Loff = offset['left'];
      });
    
      $('.object8').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object8Toff && off['left'] == object8Loff) {
          $('.object8_l').toggle();	
          var width = $('.object8_l').width();     
          $('.object8_l').css('width', width + 'px');    
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                 		
        }							
      }); 
      
      $('.object8_x').click(function() {
        $('.object8_l').toggle();											
      });             
    
    /* 9 */
      
      $('.object9').mousedown(function() {
        var offset = $(this).offset();
        object9Toff = offset['top'];
        object9Loff = offset['left'];
      });
    
      $('.object9').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object9Toff && off['left'] == object9Loff) {
          $('.object9_l').toggle();		
          var width = $('.object9_l').width();     
          $('.object9_l').css('width', width + 'px'); 
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                    	
        }							
      }); 
      
      $('.object9_x').click(function() {
        $('.object9_l').toggle();											
      });             
        
        
    /* 10 */
      
      $('.object10').mousedown(function() {
        var offset = $(this).offset();
        object10Toff = offset['top'];
        object10Loff = offset['left'];
      });
    
      $('.object10').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object10Toff && off['left'] == object10Loff) {
          $('.object10_l').toggle();	
          var width = $('.object10_l').width();     
          $('.object10_l').css('width', width + 'px');    
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                 		
        }							
      }); 
      
      $('.object10_x').click(function() {
        $('.object10_l').toggle();											
      });  
             
   
    /* 11 */
      
      $('.object11').mousedown(function() {
        var offset = $(this).offset();
        object11Toff = offset['top'];
        object11Loff = offset['left'];
      });
    
      $('.object11').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object11Toff && off['left'] == object11Loff) {
          $('.object11_l').toggle();	
          var width = $('.object11_l').width();     
          $('.object11_l').css('width', width + 'px');  
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                   		
        }							
      }); 
      
      $('.object11_x').click(function() {
        $('.object11_l').toggle();											
      });  
      
      
    /* 12 */
      
      $('.object12').mousedown(function() {
        var offset = $(this).offset();
        object12Toff = offset['top'];
        object12Loff = offset['left'];
      });
    
      $('.object12').mouseup(function() {
        var off = $(this).offset();
        if (off['top'] == object12Toff && off['left'] == object12Loff) {
          $('.object12_l').toggle();	
          var width = $('.object12_l').width();     
          $('.object12_l').css('width', width + 'px');   
          
          var diff = getWindowHeight() - off['top'];

          if (diff < 350) {
            var newTop = off['top'] - 350;
            $(this).parent().css('top', newTop);
          }                  		
        }							
      }); 
      
      $('.object12_x').click(function() {
        $('.object12_l').toggle();											
      });  
  
});