Live Preview: Do a better job of emulating the edit form submission. Fixes Live Previ...
authorAndrew Garrett <werdna@users.mediawiki.org>
Wed, 21 Apr 2010 13:46:44 +0000 (13:46 +0000)
committerAndrew Garrett <werdna@users.mediawiki.org>
Wed, 21 Apr 2010 13:46:44 +0000 (13:46 +0000)
skins/common/preview.js

index db5633d..ea87655 100644 (file)
@@ -4,14 +4,9 @@
 
 function doLivePreview( e ) {
        e.preventDefault();
-       var previewText = $j('#wpTextbox1').val();
-
-       var editToken = $j( '[name="wpEditToken"]' ).attr( 'value' );
-       var editTime = $j( '[name="wpEdittime"]' ).attr( 'value' );
-       var startTime = $j( '[name="wpStarttime"]' ).attr( 'value' );
-
-       var postData = { 'action' : 'submit', 'wpTextbox1' : previewText, 'wpPreview' : true,
-               'wpEditToken' : editToken, 'wpEdittime': editTime, 'wpStarttime': startTime, 'title' : wgPageName };
+       
+       var postData = $j('#editform').formToArray();
+       postData.push( { 'name' : 'wpPreview', 'value' : '1' } );
        
        // Hide active diff, used templates, old preview if shown
        var copyElements = ['#wikiPreview', '.templatesUsed', '.hiddencats',
@@ -25,8 +20,13 @@ function doLivePreview( e ) {
        $j('#wikiPreview').before( loadSpinner );
        
        var page = $j('<div/>');
-       page.load( wgScript+'?action=submit '+copySelector,
-                               postData,
+       var target = $j('#editform').attr('action');
+       
+       if ( !target ) {
+               target = window.location.href;
+       }
+       
+       page.load( target, postData,
                function() {
                        
                        for( var i=0; i<copyElements.length; ++i) {
@@ -48,6 +48,76 @@ function doLivePreview( e ) {
                } );
 }
 
+// Shamelessly stolen from the jQuery form plugin, which is licensed under the GPL.
+// http://jquery.malsup.com/form/#download
+$j.fn.formToArray = function() {
+       var a = [];
+       if (this.length == 0) return a;
+
+       var form = this[0];
+       var els = form.elements;
+       if (!els) return a;
+       for(var i=0, max=els.length; i < max; i++) {
+               var el = els[i];
+               var n = el.name;
+               if (!n) continue;
+
+               var v = $j.fieldValue(el, true);
+               if (v && v.constructor == Array) {
+                       for(var j=0, jmax=v.length; j < jmax; j++)
+                               a.push({name: n, value: v[j]});
+               }
+               else if (v !== null && typeof v != 'undefined')
+                       a.push({name: n, value: v});
+       }
+
+       if (form.clk) {
+               // input type=='image' are not found in elements array! handle it here
+               var $input = $(form.clk), input = $input[0], n = input.name;
+               if (n && !input.disabled && input.type == 'image') {
+                       a.push({name: n, value: $input.val()});
+                       a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y});
+               }
+       }
+       return a;
+};
+
+/**
+ * Returns the value of the field element.
+ */
+$j.fieldValue = function(el, successful) {
+       var n = el.name, t = el.type, tag = el.tagName.toLowerCase();
+       if (typeof successful == 'undefined') successful = true;
+
+       if (successful && (!n || el.disabled || t == 'reset' || t == 'button' ||
+               (t == 'checkbox' || t == 'radio') && !el.checked ||
+               (t == 'submit' || t == 'image') && el.form && el.form.clk != el ||
+               tag == 'select' && el.selectedIndex == -1))
+                       return null;
+
+       if (tag == 'select') {
+               var index = el.selectedIndex;
+               if (index < 0) return null;
+               var a = [], ops = el.options;
+               var one = (t == 'select-one');
+               var max = (one ? index+1 : ops.length);
+               for(var i=(one ? index : 0); i < max; i++) {
+                       var op = ops[i];
+                       if (op.selected) {
+                               var v = op.value;
+                               if (!v) // extra pain for IE...
+                                       v = (op.attributes && op.attributes['value'] &&
+                                               !(op.attributes['value'].specified))
+                                                       ? op.text : op.value;
+                               if (one) return v;
+                               a.push(v);
+                       }
+               }
+               return a;
+       }
+       return el.value;
+};
+
 $j(document).ready( function() {
        $j('#wpPreview').click( doLivePreview );
 } );