var config = {
	
	preferences : {
		cookieName : 'dirtymarkup-prefs',
		cookiePath : '/',
		cookieDomain : 'dirtymarkup.com'
	},
	
	indentSpaces : {
		min: 0,
		max: 30,
		start: 4,
		step: 1
	}, 
	
	wrap : {
		min: 20,
		max: 400,
		start: 80,
		step: 5
	}
	
}

$(document).ready( function() {
	
	// Enable the accordion menu
	$("#options DIV.accordion").accordion({ fillSpace: true });
	
	// External links
    $('A[rel="external"]').click( function() {
        window.open( $(this).attr('href') );
        return false;
    });
	
	// UI Hover states
	$("#toolbar INPUT").hover( function() {
		$(this).addClass('ui-state-hover');
	}, function() {
		$(this).removeClass('ui-state-hover');
	});
	
	// Make textarea the same height as the accordion menu
	$("#canvas").height( $("#options").height() + 2 );
	$("#src").height( $("#options").height() - 10 );
	
	// Load saved prefs
	preferences.load();
	
	// Slider: indent-spaces
	$("#slider-indent-spaces").slider({
		value: $("#tidy-indent-spaces").val() > 0 ? $("#tidy-indent-spaces").val() : config.indentSpaces.start,
		min: config.indentSpaces.min,
		max: config.indentSpaces.max,
		step: config.indentSpaces.step,
		animate: true,
		slide: function(event, ui) {
			$("#tidy-indent-spaces").val(ui.value);
		},
		stop: function() {
			$("#tidy-wrap").trigger('change');
		}
	});
	$("#tidy-indent-spaces").change( function() {
		var val = parseInt( $(this).val() );
		if( val < config.indentSpaces.min ) val = config.indentSpaces.min; // min value
		if( val > config.indentSpaces.max ) val = config.indentSpaces.max; // max value
		if( !val ) val = config.indentSpaces.start; // default value
		$(this).val( val );
		$("#slider-indent-spaces").slider('value', parseInt(val));
	});
	
	// Slider: indent-spaces
	$("#slider-wrap").slider({
		value: $("#tidy-wrap").val() > 0 ? $("#tidy-wrap").val() : config.wrap.start,
		min: config.wrap.min,
		max: config.wrap.max,
		step: config.wrap.step,
		animate: true,
		slide: function(event, ui) {
			$("#tidy-wrap").val(ui.value);
		},
		stop: function() {
			$("#tidy-wrap").trigger('change');
		}
	});
	$("#tidy-wrap").change( function() {
		var val = parseInt( $(this).val() );
		if( val < config.wrap.min ) val = config.wrap.min; // min value
		if( val > config.wrap.max ) val = config.wrap.max; // max value
		if( !val ) val = config.wrap.start; // default value
		$(this).val( val );
		$("#slider-wrap").slider('value', parseInt(val));
	});
	
	// Prevent auto-completion
	$("#tidy-form :input").attr('autocomplete', 'off');
	// Disable spell checking
	$("#src").attr('spellcheck', false);
	
	// Reset
	$("#reset").click( function() {
		// Reset form
		$("#tidy-form")[0].reset();
		// Adjust sliders
		$("#slider-indent-spaces").slider('value', $("#tidy-indent-spaces").val());
		$("#slider-wrap").slider('value', $("#tidy-wrap").val());
		// Clear cookie
		$.cookie(config.preferences.cookieName, null, { expires: -1, path: config.preferences.cookiePath, domain: config.preferences.cookieDomain });
		return false;
	});
	
	// Save preferences on change
	$("#tidy-form :input").change( function() {
		preferences.save();
	});
	
	// Handle textarea instructions
	$("#src").focus( function() {
		$(this).removeClass('tip');
	}).blur( function() {
		if( $(this).val() == '' ) $(this).addClass('tip');
	});
	
	// Clean that dirty HTML!
	$("#tidy-form").submit( function() {
		
		spinner.show();
		
		$.post('src/ajax/dirty-markup.ajax.php', $(this).serialize(), function(r) {
			spinner.hide();
			$("#src").val(r.src);
			$("#src").focus().select();
		}, 'json');
		
		return false;
		
	});

});


var spinner = {
	
	// Display the spinner
	show: function() {
		var pos = $('#canvas').offset();
		$('#spinner').css({
			top: pos.top,
			left: pos.left,
			width: $('#canvas').outerWidth(),
			height: $('#canvas').outerHeight()
		}).find('IMG').css({
			marginTop: $('#canvas').outerHeight() / 2 - 25 + 'px'
		}).end().show();
		$('#canvas').addClass('wait').find('TEXTAREA').attr('readonly', true);
	},
	
	// Remove spinner
	hide: function() {
		$('#spinner').hide();
		$('#canvas').removeClass('wait').find('TEXTAREA').attr('readonly', false);
	}
	
}

var preferences = {
	
	load: function() {
		
		if( $.cookie(config.preferences.cookieName) ) {
			
			prefs = $.cookie(config.preferences.cookieName).split('&');
			
			$("#tidy-form :input[id^=tidy]").each( function() {
				
				for( var i = 0; i < prefs.length; i++ ) {
					
					var p = decodeURIComponent(prefs[i]).match(/^options\[(.*?)\]=(.*?)$/);
					
					if( $(this).attr('name') == 'options[' + p[1] + ']' ) {
						
						switch( $(this).attr('tagName').toLowerCase() ) {
							
							case 'input':
								switch( $(this).attr('type') ) {
									
									case 'radio':
										$(this).attr('checked', $(this).val() == p[2] ? true : false)
									break;
									
									case 'checkbox':
										$(this).attr('checked', p[2] == 1 ? true : false);
									break;
									
									default:
										$(this).val(p[2]);
									break;
									
								}
							break;
							
							default: // select, textarea, etc.
								$(this).val(p[2]);
							break;
							
						}
						
					}
					
				}
				
			});
			
		}
		
	},
	
	save: function() {
		var cookie = $("#tidy-form :input[id^=tidy]").serialize();
		$.cookie(config.preferences.cookieName, cookie, { expires: 365, path: config.preferences.cookiePath, domain: config.preferences.cookieDomain });
	}
	
}