$().ready(function() { 
	
	/* use livequery to bind events to stuff that wont see the dom */
	
	$("#xbody").livequery(function() {

		/* choose a type page 
		here we are showing and hiding some divs, resetting checked inputs and enabling the next button if the requirements are ment
		*/

		$('input#picklogo').click(function() {
				$('#xchoosepatch, #xchoosetext').hide();
				$('#xchooselogo').fadeIn();
				$("#xchoosetext input, #xchooselogo input, #xchoosepatch input").removeAttr("checked", "true");
				$('#xfooter #xbuttontoggle').removeClass("enabled").removeClass("disabled").addClass("disabled");
				$('input#step1').removeClass('error');
			});

		$('input#picktext').click(function() {
				$('#xchoosepatch, #xchooselogo').hide();
				$('#xchoosetext').fadeIn();
				$("#xchoosetext input, #xchooselogo input, #xchoosepatch input").removeAttr("checked", "true");
				$('#xfooter #xbuttontoggle').removeClass("enabled").removeClass("disabled").addClass("disabled");
		});

		$('input#pickback').click(function() {
				$('#xchoosepatch, #xchoosetext, #xchooselogo').hide();
				$("#xchoosetext input, #xchooselogo input, #xchoosepatch input").removeAttr("checked", "true");
				$('#xfooter #xbuttontoggle').addClass("enabled").removeClass("disabled");
			});

		$('#xchooselogo input, #xchoosetext input').click(function() {
			$('#xchoosepatch').fadeIn();
			$('#xfooter #xbuttontoggle').addClass("enabled").removeClass("disabled");
		});

		/* validation for simpler pages that only need one radio item checked */
		
		$('#xlogos input, #xlocations input, .xsaved input').click(function() { 
			$('#xfooter #xbuttontoggle').addClass("enabled").removeClass("disabled");
		});
		/* flag the error message */

		$("#xfooter .disabled input").click(function() {
			$('#error').fadeIn('slow').animate({opacity: 1.0}, 3000).fadeOut('slow', function() {
				$(this).remove();
			});
		});		
				
		/* ajax in the next step when you hit the proceed button in the modal footer, 
		we dont want to leave the modal because you'll loose your session */

		$("#xfooter .enabled input#step1").click(function() {
			$("#wizard").load("includes/logo.php?step=2");
		});	

		$('#applysaved').click(function() {
			$("#wizard").load("includes/saved.php?step=1");
		});

		$("#xfooter .enabled input#step2").click(function() {
			$("#wizard").load("includes/locations.php?step=3");
		});	

		$("#xfooter .enabled input#step3").click(function() {
			$("#wizard").load("includes/logo.php?step=4");
		});	

		$("#xfooter .enabled input#step4").click(function() {
			$("#wizard").load("includes/logo.php?step=1");
		});

		/* ajax in the table for the customizations you already applied */
		
		$("#xtablecustomized").load("includes/table-for-customizations.php?offset=0");

		/* fade in the items left on the custom text page, the animation makes it stand out a little more */
		
		$("#itemsleft").fadeIn('slow');
		
		/* count down the charachters on text inputs */
		
		$("#xapplytext input.text").counter();
		
		/* fix the close link when they're ajax'd in */
		
		$("#xfooter a").click(function(){
			$("#wizard, .jqmOverlay").hide();			
		});
		
		/* Clear text input on focus/click and then replace it if the user doesnt enter any text */
		
		$("input.text").click(function() {
			if( this.value == this.defaultValue ) {
				this.value = "";
			}
		}).focus(function() {
			if( this.value == this.defaultValue ) {
				this.value = "";
			}
		}).blur(function() {
			if( !this.value.length ) {
				this.value = this.defaultValue;
			}
		});
	
		/* color window modals */
		
		$('#xpicker1').jqm({ajax: 'includes/colorpicker.php', overlay: 0, trigger: '.xpicker1', modal:true});
		$('#xpicker2').jqm({ajax: 'includes/colorpicker.php', overlay: 0, trigger: '.xpicker2', modal:true});
		$('#xpicker3').jqm({ajax: 'includes/colorpicker.php', overlay: 0, trigger: '.xpicker3', modal:true});
		
	});
			
});