diff options
author | Bharat Mediratta <bharat@menalto.com> | 2009-01-06 08:33:39 +0000 |
---|---|---|
committer | Bharat Mediratta <bharat@menalto.com> | 2009-01-06 08:33:39 +0000 |
commit | a63502b3c69b59b6246f66d6e7a6f8558033546c (patch) | |
tree | c79245d116f28cb18d77a7d3aa81609da02c03c8 | |
parent | 532996d62f7a373d4847f0669dffe21615f98bc5 (diff) |
Refactor the way that dialogs work:
1) Get rid of the resizing behavior; create the dialog in the right
place and then show it.
2) Grab the fieldset legend and put it into the title of the dialog,
so that we don't have to use title="" params in anchors.
3) Stop using fixed buttons and let the form define its own buttons.
4) Stop suppressing all form buttons.
-rw-r--r-- | lib/gallery.dialog.js | 78 | ||||
-rw-r--r-- | themes/default/css/screen.css | 15 |
2 files changed, 45 insertions, 48 deletions
diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js index 10ec412a..70f577c5 100644 --- a/lib/gallery.dialog.js +++ b/lib/gallery.dialog.js @@ -26,63 +26,61 @@ function openDialog(element, on_success) { var eDialog = '<div id="gDialog"></div>'; $("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 (on_success) { - on_success(); - } else if (data.location) { - window.location = data.location; - } else { - window.location.reload(); - } - } - } - }).submit(); - }; - buttons["Reset"] = function() { - $("#gDialog form").resetForm(); - }; - $("#gDialog").dialog({ + autoOpen: false, autoResize: false, draggable: true, - height: $(window).height() - 40, + height: "auto", + width: "auto", modal: true, overlay: { opacity: 0.7, background: "black" }, resizable: true, - title: sTitle, - width: 600, - buttons: buttons, close: function (event, ui) { - $("#gDialog").dialog('destroy').remove(); + $("#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}); + $("#gDialog").html(data); + var parent = $("#gDialog").parent().parent(); + parent.css("opacity", "0.0"); + $("#gDialog").dialog("open"); + $("#ui-dialog-title-gDialog").html($("#gDialog fieldset legend:eq(0)").html()); + if (parent.width() < 400) { + parent.css("width", 400); + } + parent.css({"top": $(window).height() / 2 - parent.height() / 2, + "left": $(window).width() / 2 - parent.width() / 2, + "opacity": "1.0" + }); + + ajaxify_dialog = function() { + $("#gDialog form").ajaxForm({ + dataType: "json", + success: function(data) { + if (data.form) { + $("#gDialog form").replaceWith(data.form); + ajaxify_dialog(); + } + if (data.result == "success") { + $("#gDialog").dialog("close"); + if (on_success) { + on_success(); + } else if (data.location) { + window.location = data.location; + } else { + window.location.reload(); + } + } + } + }); }; + ajaxify_dialog(); }); return false; } diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 57bb3af1..e990571a 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -13,7 +13,7 @@ * 7) Browser hacks * 8) jQuery and jQuery UI * - * @todo Default user icon (user w/ camera) + * @todo Default user icon (user w/ camera) * @todo Apply :hover bg image to #gViewMenu (will clear fix correct this?) * @todo Refactor form layout styles to reserve room for validation messages in default state. This * will eliminate layout shifts when validation messages are displayed. @@ -85,7 +85,7 @@ table { margin: 1em 0; } -caption, +caption, th { text-align: left; } @@ -97,7 +97,7 @@ th { td { } -th, +th, td { border: 1px solid #ccc; padding: .3em; @@ -272,9 +272,9 @@ li.gError select { margin-bottom: .4em; } -.gError, -.gInfo, -.gSuccess, +.gError, +.gInfo, +.gSuccess, .gWarning { background-position: .4em 50%; background-repeat: no-repeat; @@ -782,8 +782,7 @@ li.gError select { border: none; } -#gDialog legend, -#gDialog button.submit { +#gDialog legend { display: none; } |