Full pass over all the JSON encoding and JS dialog code. We now abide

by the following rules:

1) An initial dialog or panel load can take either HTML or JSON, but
   the mime type must accurately reflect its payload.

2) dialog form submits can handle a pure HTML response, but the mime
   type must also be correct.  This properly resolves the problem
   where the reauth code gets a JSON response first from the reauth
   code, and then an HTML response when you reauth and continue on to
   a given form -- try it out with Admin > Settings > Advanced.

3) All JSON replies must set the mime type correctly.  The json::reply
   convenience function does this for us.

4) By default, any HTML content sent back in the JSON response should be
   in the "html" field, no longer the "form" field.

The combination of these allows us to stop doing boilerplate code like
this in our controllers:

  // Print our view, JSON encoded
  json::reply(array("form" => (string) $view));

instead, controllers can just return HTML, eg:

  // Print our view
  print $view;

That's much more intuitive for developers.

2 files changed, 34 insertions, 9 deletions

diff --git a/lib/gallery.dialog.js b/lib/gallery.dialog.js
index 555e6f47..f1d146ab 100644
--- a/lib/gallery.dialog.js
+++ b/lib/gallery.dialog.js
@@ -31,8 +31,8 @@
          url: sHref,
          type: "GET",
          beforeSend: function(xhr) {
-           // Until we convert to jquery 1.4, we need to save the
-           // XMLHttpRequest object
+           // Until we convert to jquery 1.4, we need to save the XMLHttpRequest object so that we
+	   // can detect the mime type of the reply
            this.xhrData = xhr;
          },
          success: function(data, textStatus, xhr) {
@@ -122,17 +122,42 @@
      _ajaxify_dialog: function() {
        var self = this;
        $("#g-dialog form").ajaxForm({
-         dataType: "json",
          beforeSubmit: function(formData, form, options) {
            form.find(":submit")
              .addClass("ui-state-disabled")
              .attr("disabled", "disabled");
            return true;
          },
+         beforeSend: function(xhr) {
+           // Until we convert to jquery 1.4, we need to save the XMLHttpRequest object so that we
+	   // can detect the mime type of the reply
+           this.xhrData = xhr;
+         },
          success: function(data) {
-           if (data.form) {
-             var formData = unescape(data.form);
-	     $("#g-dialog").html(formData);
+           // Pre jquery 1.4, get the saved XMLHttpRequest object
+           xhr = this.xhrData;
+	   if (xhr) {
+	     var mimeType = /^(\w+\/\w+)\;?/.exec(xhr.getResponseHeader("Content-Type"));
+
+	     var content = "";
+	     if (mimeType[1] == "application/json") {
+	       data = JSON.parse(data);
+	     } else {
+	       data = {"html": escape(data)};
+	     }
+	   } else {
+	     // Uploading files (eg: watermark) uses a fake xhr in jquery.form.js so
+	     // all we have is in the data field, which should be some very simple JSON.
+	     // Weirdly enough in Chrome the result gets wrapped in a <pre> element and
+	     // looks like this:
+	     //   <pre style="word-wrap: break-word; white-space: pre-wrap;">{"result":"success",
+	     //   "location":"\/~bharat\/gallery3\/index.php\/admin\/watermarks"}</pre>
+	     // bizarre.  Strip that off before parsing.
+	     data = JSON.parse(data.match("({.*})")[0]);
+	   }
+
+           if (data.html) {
+             $("#g-dialog").html(unescape(data.html));
              $("#g-dialog").dialog("option", "position", "center");
              $("#g-dialog form :submit").removeClass("ui-state-disabled")
                .attr("disabled", null);
diff --git a/lib/gallery.panel.js b/lib/gallery.panel.js
index aee7185d..e0605ca3 100644
--- a/lib/gallery.panel.js
+++ b/lib/gallery.panel.js
@@ -48,7 +48,7 @@
                var content = "";
                if (mimeType[1] == "application/json") {
                  data = JSON.parse(data);
-                 content = unescape(data.form);
+                 content = unescape(data.html);
                } else {
                  content = data;
                }
@@ -79,8 +79,8 @@
            return true;
          },
          success: function(data) {
-           if (data.form) {
-             $("#g-panel td").html(data.form);
+           if (data.html) {
+             $("#g-panel td").html(data.html);
              self._ajaxify_panel();
            }
            if (data.result == "success") {