From 11d2788af8111a036d2279563fe6a21f374b5b9c Mon Sep 17 00:00:00 2001 From: Bharat Mediratta Date: Thu, 1 Jan 2009 00:06:52 +0000 Subject: Refactor common dialog JS code out into lib/gallery.dialog.js --- lib/gallery.dialog.js | 104 ++++++++++++++++++++++++++++ themes/admin_default/js/ui.init.js | 108 ------------------------------ themes/admin_default/views/admin.html.php | 3 +- themes/default/js/ui.init.js | 104 ---------------------------- themes/default/views/page.html.php | 5 +- 5 files changed, 109 insertions(+), 215 deletions(-) create mode 100644 lib/gallery.dialog.js diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js new file mode 100644 index 00000000..0da04757 --- /dev/null +++ b/lib/gallery.dialog.js @@ -0,0 +1,104 @@ +/** + * Fire openDialog() and prevent links from opening + * + * @see openDialog() + */ +function handleDialogEvent(event) { + openDialog(event.data.element); + event.preventDefault(); +} + +/** + * Display modal dialogs, populate dialog with trigger link's title and href + * + * @requires ui.core + * @requires ui.draggable + * @requires ui.resizable + * @requires ui.dialog + * @see handleDialogEvent() + * + * @todo Set ui-dialog-buttonpane button values equal to the original form button value + * @todo Display loading animation on form submit + */ +function openDialog(element) { + var sHref = $(element).attr("href"); + var sTitle = $(element).attr("title"); + var eDialog = '
'; + + $("body").append(eDialog); + var buttons = {}; + buttons["Submit"] = function() { + $("#gDialog form").ajaxForm({ + dataType: "json", + success: function(data) { + if (data.form) { + $("#gDialog form").replaceWith(data.form); + } + if (data.result == "success") { + $("#gDialog").dialog("close"); + if (data.location) { + window.location = data.location; + } else { + window.location.reload(); + } + } + } + }).submit(); + }; + buttons["Reset"] = function() { + $("#gDialog form").resetForm(); + }; + + $("#gDialog").dialog({ + autoResize: false, + draggable: true, + height: $(window).height() - 40, + modal: true, + overlay: { + opacity: 0.7, + background: "black" + }, + resizable: true, + title: sTitle, + width: 600, + buttons: buttons, + close: function (event, ui) { + $("#gDialog").dialog('destroy').remove(); + } + }); + loading("#gDialog"); + $(".ui-dialog-content").height(400); + $("#gDialog").html(sHref); + $.get(sHref, function(data) { + loading("#gDialog"); + $("#gDialog").html(data).hide().fadeIn(); + // Get dialog and it's contents' height + var contentHt = $(".ui-dialog-titlebar").height() + + $(".ui-dialog-content form").height() + + $(".ui-dialog-buttonpane").height() + + 60; + // Resize height if content's shorter than dialog + if (contentHt < $("#gDialog").data("height.dialog")) { + $(".ui-dialog").animate({height: contentHt}); + }; + }); + return false; +} + +/** + * Toggle the processing indicator, both large and small + * + * @param element ID to which to apply the loading class, including # + */ +function loading(element) { + var size; + switch (element) { + case "#gDialog": + size = "Large"; + break; + default: + size = "Small"; + break; + } + $(element).toggleClass("gLoading" + size); +} diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index 748fde7f..49a18669 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -22,111 +22,3 @@ $(document).ready(function(){ $(dialogLinks[i]).bind("click", {element: dialogLinks[i]}, handleDialogEvent); }; }); - -/** - * Fire openDialog() and prevent links from opening - * - * @see openDialog() - */ -function handleDialogEvent(event) { - openDialog(event.data.element); - event.preventDefault(); -} - -/** - * Display modal dialogs, populate dialog with trigger link's title and href - * - * @requires ui.core - * @requires ui.draggable - * @requires ui.resizable - * @requires ui.dialog - * @see handleDialogEvent() - * - * @todo Set dialog attributes dynamically (width, height, drag, resize) - * @todo Set ui-dialog-buttonpane button values equal to the original form button value - * @todo Display loading animation on form submit - */ -function openDialog(element) { - var sHref = $(element).attr("href"); - var sTitle = $(element).attr("title"); - var eDialog = '
'; - - $("body").append(eDialog); - var buttons = {}; - buttons["Submit"] = function() { - $("#gDialog form").ajaxForm({ - dataType: "json", - success: function(data) { - if (data.form) { - $("#gDialog form").replaceWith(data.form); - } - if (data.result == "success") { - $("#gDialog").dialog("close"); - if (data.location) { - window.location = data.location; - } else { - window.location.reload(); - } - } - } - }).submit(); - }; - buttons["Reset"] = function() { - $("#gDialog form").resetForm(); - }; - - $("#gDialog").dialog({ - autoResize: false, - draggable: true, - height: $(window).height() - 40, - modal: true, - overlay: { - opacity: 0.7, - background: "black" - }, - resizable: true, - title: sTitle, - width: 600, - buttons: buttons, - close: function (event, ui) { - $("#gDialog").dialog('destroy').remove(); - } - }); - loading("#gDialog"); - $(".ui-dialog-content").height(400); - $("#gDialog").html(sHref); - $.get(sHref, function(data) { - loading("#gDialog"); - $("#gDialog").html(data).hide().fadeIn(); - // Get dialog and it's contents' height - var contentHt = $(".ui-dialog-titlebar").height() - + $(".ui-dialog-content form").height() - + $(".ui-dialog-buttonpane").height() - + 60; - // Resize height if content's shorter than dialog - if (contentHt < $("#gDialog").data("height.dialog")) { - $(".ui-dialog").animate({height: contentHt}); - }; - }); - return false; -} - - -/** - * Toggle the processing indicator, both large and small - * - * @param element ID to which to apply the loading class, including # - * @param size Either Large or Small - */ -function loading(element) { - var size; - switch (element) { - case "#gDialog": - size = "Large"; - break; - default: - size = "Small"; - break; - } - $(element).toggleClass("gLoading" + size); -} diff --git a/themes/admin_default/views/admin.html.php b/themes/admin_default/views/admin.html.php index a6311a31..541d4e35 100644 --- a/themes/admin_default/views/admin.html.php +++ b/themes/admin_default/views/admin.html.php @@ -18,9 +18,10 @@ + - admin_head() ?> + admin_head() ?> diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index d64db1ee..32ee0979 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -75,93 +75,6 @@ function sizedImage() { } } -/** - * Fire openDialog() and prevent links from opening - * - * @see openDialog() - */ -function handleDialogEvent(event) { - openDialog(event.data.element); - event.preventDefault(); -} - -/** - * Display modal dialogs, populate dialog with trigger link's title and href - * - * @requires ui.core - * @requires ui.draggable - * @requires ui.resizable - * @requires ui.dialog - * @see handleDialogEvent() - * - * @todo Set ui-dialog-buttonpane button values equal to the original form button value - * @todo Display loading animation on form submit - */ -function openDialog(element) { - var sHref = $(element).attr("href"); - var sTitle = $(element).attr("title"); - var eDialog = '
'; - - $("body").append(eDialog); - var buttons = {}; - buttons["Submit"] = function() { - $("#gDialog form").ajaxForm({ - dataType: "json", - success: function(data) { - if (data.form) { - $("#gDialog form").replaceWith(data.form); - } - if (data.result == "success") { - $("#gDialog").dialog("close"); - if (data.location) { - window.location = data.location; - } else { - window.location.reload(); - } - } - } - }).submit(); - }; - buttons["Reset"] = function() { - $("#gDialog form").resetForm(); - }; - - $("#gDialog").dialog({ - autoResize: false, - draggable: true, - height: $(window).height() - 40, - modal: true, - overlay: { - opacity: 0.7, - background: "black" - }, - resizable: true, - title: sTitle, - width: 600, - buttons: buttons, - close: function (event, ui) { - $("#gDialog").dialog('destroy').remove(); - } - }); - loading("#gDialog"); - $(".ui-dialog-content").height(400); - $("#gDialog").html(sHref); - $.get(sHref, function(data) { - loading("#gDialog"); - $("#gDialog").html(data).hide().fadeIn(); - // Get dialog and it's contents' height - var contentHt = $(".ui-dialog-titlebar").height() - + $(".ui-dialog-content form").height() - + $(".ui-dialog-buttonpane").height() - + 60; - // Resize height if content's shorter than dialog - if (contentHt < $("#gDialog").data("height.dialog")) { - $(".ui-dialog").animate({height: contentHt}); - }; - }); - return false; -} - /** * Handle initialization of all short forms * @@ -201,20 +114,3 @@ function shortFormInit(formID) { }); } -/** - * Toggle the processing indicator, both large and small - * - * @param element ID to which to apply the loading class, including # - */ -function loading(element) { - var size; - switch (element) { - case "#gDialog": - size = "Large"; - break; - default: - size = "Small"; - break; - } - $(element).toggleClass("gLoading" + size); -} diff --git a/themes/default/views/page.html.php b/themes/default/views/page.html.php index 86b1e922..cab2df92 100644 --- a/themes/default/views/page.html.php +++ b/themes/default/views/page.html.php @@ -24,10 +24,11 @@ + + - head() ?> - + head() ?> -- cgit v1.2.3