$(document).ready(function() {
	$('#editactions button[type=submit], .deletelinkbutton, #uploadpicturebutton, #sideLeft button, #showhelpvideos').button();
	
	$('.edit textarea').autoResize({
		animateDuration: 50,
		extraSpace: 0,
		limit: 10000
	});
	$('.edit textarea').trigger('keydown');
	
	$('#EditWebpageForm').submit(function() {
		var linkorder = [];
		$.each($('.links li'), function(index, li) { linkorder[index] = $(li).attr('keyword') + '=' + index; } );
		$('#HiddenLinkorder').val(linkorder.join('&'));
		$('#HiddenWebpageLinktitle').val($('#WebpageLinktitle').val());
		$('#HiddenWebpageBody').val($('#WebpageBody').val());
		return true;
	});
	
	$(window).scroll(function() {
		$('.edit #editactions').css('top', $(this).scrollTop() + 'px');
	});

	$('#pickcolorlink').ColorPicker({
		color: $('#WebsiteColor1').val(),
		onShow: function (picker) {
			$(picker).fadeIn(100);
			return false;
		},
		onHide: function (picker) {
			$(picker).fadeOut(100);
			return false;
		},
		onChange: function (hsb, hex, rgb) {
			$('#pickcolorlink, #header, #sideLeft, #footer').css('backgroundColor', '#' + hex);
			$('#middle').css('borderLeftColor', '#' + hex);
			$('#WebsiteColor1').val('#' + hex);
		}
	});
	
	$('.edit .links').sortable({
		axis: 'x',
		cursor: 'move',
		start: function(event, ui) {
			$('.deletelinkbutton').css('visibility', 'hidden');
		},
		stop: function(event, ui) {
			$('.deletelinkbutton').css('visibility', '');
			$(ui.item).trigger('mouseover');
		}
	}).hover(function() { $('#edittip').html('Click for options, click and drag to reorder links.'); }, function() { $('#edittip').html(''); });
	
	$('.edit .links li').hover(function() {
		if($(this).attr('keyword') == 'home') return false;
		var liposition = $(this).position();
		var deletebutton = $(this).find('.deletelinkbutton');
		deletebutton.css({'position': 'absolute', 'left': liposition.left + 4 + 'px', 'top': (liposition.top-deletebutton.height()-2) + 'px'}).show();
	}, function() {
		$(this).find('.deletelinkbutton').hide();
	});

	$('.edit .links li .deletelinkbutton').click(function() {
		var keyword = $(this).parents('li').attr('keyword');
		var linktitle = $(this).parents('li').find('a').text();
		$('<div>Are you sure you want to delete the page <strong>' + linktitle + '</strong>?</div>').dialog({
			title: 'Delete Page',
			resizable: false,
			buttons: {
				'Delete': function() {
					window.location.href='/webpages/delete/' + keyword;
				},
				'Cancel': function() {
					$(this).dialog('close');
					$(this).parents('div.ui-dialog').children('div.dialogform').remove();
				}
			}
		});
	});

	$('#uploadimagedialog').dialog({autoOpen: false, width:'400px', title: 'Change Header Image'});
	$('#uploadpicturebutton').click(function() {
		$('#uploadimagedialog').dialog('open');
	});

	$('#adddialog').dialog({autoOpen: false, width: '400px', title: 'Add Page'});
	$('#newpagebutton').click(function() {
		$('#adddialog').dialog('open');
	});

	$('#showhelpvideos').click(function() { $('#helpvideos').dialog('open'); });
	$('#helpvideos').dialog({autoOpen: false, width: '600px', title: 'Video Tutorials'});

	$('#logindialog').dialog({autoOpen: false, width: '320px', modal: true, resizable: false, draggable: false, title: 'Login'});
	$('#editlink.notloggedin').click(function(evt) {
		$('#logindialog').dialog('open');
		evt.preventDefault();
	});
	
	$('#ziplookupfield').keyup(function() { if($(this).val().length == 5) $(this).parents('form').submit(); });
});