$(function () {

	// Delete link
	$(".link-panel-editor").each(function() {
		bindDeleteHandlers(this);
	});

    // Open Edit Links dialog
    $('.open-modal-dialog-link').click(function () {
        var linkPanelEditorDialog = $(this).parent().find('.link-panel-editor-dialog');
        linkPanelEditorDialog.dialog({
            autoopen: false,
            modal: false,
            closeOnEscape: false,
            title: 'Edit Links',
            width: 430
        })
                    .parent().appendTo($('form:first'))
                    .dialog('open');
    });

    // Close Edit Links dialog
    $('.close-modal-dialog-button').click(function () {
        var linkPanelEditorDialog = $(this).closest('.link-panel-editor-dialog');
        linkPanelEditorDialog.dialog('close');
    });
	
	// Save links
	$(".link-panel-save-button").click(function() {
		var parentLinkPanelEditor = getParentLinkPanelEditor(this);
		var submitInfo = $.map(parentLinkPanelEditor.find(".link-panel-editor-item"), function(ele) {
			return { 
				title: $(ele).find("input:eq(0)").attr("value"),
				url: $(ele).find("input:eq(1)").attr("value")
			};
		});
		var submitInfoEle = parentLinkPanelEditor.find("input[type=hidden]");
		submitInfoEle.val($.toJSON(submitInfo));
		return true;
	});

	// Orderability
	$(".link-panel-editor tbody").sortable({
		cursor: 'move',
		axis: 'y'
	});

	// Add link
	$(".link-panel-editor-add-button").click(function() {
		if (isValidLink($(this).parent().find("input"))) {
			var parentLinkPanelEditor = getParentLinkPanelEditor(this);
			var titleInput = $(this).parent().find("input:eq(0)");
			var urlInput =  $(this).parent().find("input:eq(1)");
			parentLinkPanelEditor.find("tbody").append(
				"<tr class=\"link-panel-editor-item\">" +
					"<td class=\"moveable\">Move</td>" +
					"<td><input type=\"text\" value=\"" + titleInput.val() + "\"/></td>" + 
					"<td><input type=\"text\" value=\"" + urlInput.val() + "\"/></td>" + 
					"<td class=\"link-panel-editor-delete-button clickable\">Delete</td>" +
				"</tr>");
			titleInput.val("").blur();
			urlInput.val("").blur();
			bindDeleteHandlers(parentLinkPanelEditor);
		}
	});

	// Display placeholder text in empty add boxes
	$(".link-panel-editor tfoot input").blur(function() {
		if (!$(this).val()) {
			$(this)
				.val("add a new link")
				.addClass("disabled-input")
				.data("blank", true);
		}
	}).focus(function() {
		if ($(this).data("blank")) {
			$(this)
				.val("")
				.removeClass("disabled-input")
				.data("blank", false);
		}			
	}).blur();

});

function getParentLinkPanelEditor(element) {
	return $(element).closest(".link-panel-editor-dialog");
}

// Unforunately we have to do this as live events appear to be slightly incompatible with .sortable().
function bindDeleteHandlers(parentLinkPanelEditor) {
	$(parentLinkPanelEditor).find(".link-panel-editor-delete-button").each(function() {
		$(this).click(function() {
			$(this).closest(".link-panel-editor-item").remove();
		});
	});
}

function isValidLink(inputs) {
	return !inputs.first().data("blank") && !inputs.last().data("blank");
}