$(document).ready(function(){
	
	$("#main").css({
		"width" : "600px",
		"height" : "600px", 
		"border" : "0px solid #000",
		"margin" : "0 auto",
		"position" : "relative",
		"left" : "0px", 
		"top" : "0px"
	});
		
	$("#main").jparallax({mouseActiveOutside: true, triggerResponse: false, triggerExposesEdges: false, frameDuration: 20, xtravel: .25, ytravel: .25});
	
	//////
	
	$(".trigger").hide().show("fast", function calback() {
		
		fdPix = 0;
		pwidth = $(this).attr("pwidth");
		pheight = $(this).attr("pheight");
		totalrows = $(this).attr("totalrows");
		totalcols = $(this).attr("totalcols");		
		
		$("#parallax").css({
			"width" : (pwidth*totalrows)+"px",
			"height" : (pheight*totalcols)+"px", 
			"border" : "0px solid #000",
			"margin" : "0 auto",
			"position" : "relative",
			"left" : "0px", 
			"top" : "0px"
		});
		
		$("#parallax").jparallax({mouseActiveOutside: false, triggerResponse: false, triggerExposesEdges: false, frameDuration: 20});
		
		
		// build array of pix colors
		orgColors = new Array();
		var count = 0;
		for (var col=0;col<totalcols;col++) {    	
    		for (var row=0;row<totalrows;row++) {    			
    			orgColors[count] = $('#px'+count).css("background-color");
    			count++;   			
    		}	
    	}    	
    	
    	// remove scroll bars from browser
    	$("html").css({"overflow" : "hidden"});
    	
    	// remove loading message
    	$('.loading').hide();
    	
		// call fade in loop
		$('#ct0').hide().fadeIn(1, fadeInPix);
				
		
	});
	
	// fades in all pix in img
	fadeInPix = function () {
		fdPix++;
		if (fdPix < totalrows*totalcols) {
			$('#ct'+fdPix).hide().fadeIn(1, fadeInPix);
		} else {
			$('.menu').hide().fadeIn(1000);
		}
	}
	
	$('a.toggleMenu').bind("click", function(){
		$('div.imgmenu').toggle();	
		}
	);
	
	$('a.menuClose').click(		
		function(){
			$('div.imgmenu').show().hide();
			$('a.toggleMenu').unbind("click");
			$('a.toggleMenu').bind("click", function(){
				$('div.imgmenu').toggle();	
				}
			);
		}			
	);
	
	$('a#effect0').toggle(
		function() {
			var count = 0;
			for (var col=0;col<totalcols;col++) {    	
    			for (var row=0;row<totalrows;row++) {    			
    				$('#px'+count).css({"background-color" : "#ccc"});
    				count++;
    			}	
    		}    
		},
		function() {
			var count = 0;
			for (var col=0;col<totalcols;col++) {    	
    			for (var row=0;row<totalrows;row++) {    			
    				$('#px'+count).css({"background-color" : orgColors[count]});
    				count++;
    			}	
    		}  
		}
	
	);
	
	
	$('a#effect1').toggle(
		function() {
			var count = 0;
			for (var col=0;col<totalcols;col++) {    	
    			for (var row=0;row<totalrows;row++) {    			
    				$('#px'+count).css({"border" : "0px solid #666"});
    				count++;
    			}	
    		}     
		},
		function() {
			var count = 0;
			for (var col=0;col<totalcols;col++) {    	
    			for (var row=0;row<totalrows;row++) {    			
    				$('#px'+count).css({"border" : "1px solid #666"});
    				count++;
    			}	
    		}  
		}
	
	);
	
	
});