var imageLoaded = false;

// Functions
function cropperSpinner() {
	$("#crop_container").css( { backgroundImage: 'url(styles/images/cropper_spinner.gif)' } );
}

function previewSpinner() {
	$("#preview_container").css( { background: '#DDDDDD url(styles/images/preview_spinner.gif) 10px center no-repeat' } );
}

function showDefaultImage() {
	$("#crop_container").css( { backgroundImage: 'url(styles/images/your_logo_here.png)' } );
}

function generatePreview() {
	var x = parseInt( $("#cropper").css('left') ) - 301;
	var y = parseInt( $("#cropper").css('top') ) - 81;
	var width = parseInt( $("#cropper").css('width') );
	var height = parseInt( $("#cropper").css('height') );
	previewSpinner();
	$("#crop_data").attr('value', x + "," + y + "," + width + "," + height);
	$.post("ajax/create_preview.php", $("#preview_form").serialize(), function(data) {
		if( data != '' ) {
			$("#preview_container").css( { background: '#DDDDDD url(favicons/' + data + ') 10px center no-repeat' } );
			showDownloadLink();
		}
	});
}

function generateIcon() {
	$("#preview_container").html('Generating favicon.ico...');
	setTimeout( showDownloadLink, 1000);
	location.href='ajax/png2ico.php';
}

function showDownloadLink() {
	$("#preview_container").html('<a id="download" href="#">Download Favicon</a>').find('A#download').bind('click', function() { generateIcon(); return false; });
}

$(document).ready( function() {
	
	// Resizable region
	$('#cropper').Resizable( {
		ratio: 1,
		minWidth: 16,
		minHeight: 16,
		maxWidth: 256,
		maxHeight: 256,
		minTop: 81,
		minLeft: 301,
		maxRight: 301 + 256,
		maxBottom: 81 + 256,
		dragHandle: true,
		handlers: {
			se: '#resizeSE',
			e: '#resizeE',
			ne: '#resizeNE',
			n: '#resizeN',
			nw: '#resizeNW',
			w: '#resizeW',
			sw: '#resizeSW',
			s: '#resizeS'
		},
		onResize: function() {
			$("#cropper_interior").css( { width: $(this).css('width'), height: $(this).css('height') } );
		}
	});
	
	// Events
	$("#clear_image_button").click( showDefaultImage );
	
	$(".code_sample").click( function() {
		$(this).select();
	});
	
	$("A.external_link").click( function() {
		window.open($(this).attr('href'));
		return false;
	});
	
	$("#upload_form").submit( function() {
		// Make sure a URL of file has been specified
		if( $("#file").attr('value') == null && $("#url").attr('value') == null ) {
			alert("You have to enter a URL or select a file first");
			return false;
		}
		// Make sure a URL AND file haven't been specified
		if( $("#file").attr('value') != null && $("#url").attr('value') != null ) {
			alert("You can enter a URL or select a file, but not both");
			return false;
		}
		cropperSpinner();
	});
	
	// Cancel each other out on change
	$("#file").change( function() { $("#url").attr('value', ''); });
	$("#url").change( function() { $("#file").attr('value', ''); });
	
	// Handle file uploads
	$("#uploader").load( function() {
		var data = window.frames['uploader'].document.body.innerHTML
		if( data != '' ) {
			$("#crop_container").css( { backgroundImage: 'url(favicons/' + data + ')' } );
			imageLoaded = true;
		} else {
			showDefaultImage();
			// Some kind of error probably occurred
		}
		
	});
	
	// Generate the preview
	$("#preview_form").submit( function() {
		if( imageLoaded ) {
			generatePreview();
		} else {
			alert("You have to select an image before you can generate a preview");
		}
		return false;
	});
	
});