| Index: trunk/phase3/skins/common/preview.js |
| — | — | @@ -1,127 +1,128 @@ |
| 2 | 2 | /** |
| 3 | 3 | * Live preview script for MediaWiki |
| 4 | 4 | */ |
| | 5 | +(function( $ ) { |
| | 6 | + window.doLivePreview = function( e ) { |
| | 7 | + e.preventDefault(); |
| 5 | 8 | |
| 6 | | -window.doLivePreview = function( e ) { |
| 7 | | - e.preventDefault(); |
| | 9 | + $( mw ).trigger( 'LivePreviewPrepare' ); |
| 8 | 10 | |
| 9 | | - $( mw ).trigger( 'LivePreviewPrepare' ); |
| | 11 | + var postData = $('#editform').formToArray(); |
| | 12 | + postData.push( { 'name' : 'wpPreview', 'value' : '1' } ); |
| 10 | 13 | |
| 11 | | - var postData = $('#editform').formToArray(); |
| 12 | | - postData.push( { 'name' : 'wpPreview', 'value' : '1' } ); |
| | 14 | + // Hide active diff, used templates, old preview if shown |
| | 15 | + var copyElements = ['#wikiPreview', '.templatesUsed', '.hiddencats', |
| | 16 | + '#catlinks']; |
| | 17 | + var copySelector = copyElements.join(','); |
| 13 | 18 | |
| 14 | | - // Hide active diff, used templates, old preview if shown |
| 15 | | - var copyElements = ['#wikiPreview', '.templatesUsed', '.hiddencats', |
| 16 | | - '#catlinks']; |
| 17 | | - var copySelector = copyElements.join(','); |
| | 19 | + $.each( copyElements, function(k,v) { $(v).fadeOut('fast'); } ); |
| 18 | 20 | |
| 19 | | - $.each( copyElements, function(k,v) { $(v).fadeOut('fast'); } ); |
| | 21 | + // Display a loading graphic |
| | 22 | + var loadSpinner = $('<div class="mw-ajax-loader"/>'); |
| | 23 | + $('#wikiPreview').before( loadSpinner ); |
| 20 | 24 | |
| 21 | | - // Display a loading graphic |
| 22 | | - var loadSpinner = $('<div class="mw-ajax-loader"/>'); |
| 23 | | - $('#wikiPreview').before( loadSpinner ); |
| | 25 | + var page = $('<div/>'); |
| | 26 | + var target = $('#editform').attr('action'); |
| 24 | 27 | |
| 25 | | - var page = $('<div/>'); |
| 26 | | - var target = $('#editform').attr('action'); |
| | 28 | + if ( !target ) { |
| | 29 | + target = window.location.href; |
| | 30 | + } |
| 27 | 31 | |
| 28 | | - if ( !target ) { |
| 29 | | - target = window.location.href; |
| 30 | | - } |
| | 32 | + page.load( target + ' ' + copySelector, postData, |
| | 33 | + function() { |
| 31 | 34 | |
| 32 | | - page.load( target + ' ' + copySelector, postData, |
| 33 | | - function() { |
| | 35 | + for( var i=0; i<copyElements.length; ++i) { |
| | 36 | + // For all the specified elements, find the elements in the loaded page |
| | 37 | + // and the real page, empty the element in the real page, and fill it |
| | 38 | + // with the content of the loaded page |
| | 39 | + var copyContent = page.find( copyElements[i] ).contents(); |
| | 40 | + $(copyElements[i]).empty().append( copyContent ); |
| | 41 | + var newClasses = page.find( copyElements[i] ).attr('class'); |
| | 42 | + $(copyElements[i]).attr( 'class', newClasses ); |
| | 43 | + } |
| 34 | 44 | |
| 35 | | - for( var i=0; i<copyElements.length; ++i) { |
| 36 | | - // For all the specified elements, find the elements in the loaded page |
| 37 | | - // and the real page, empty the element in the real page, and fill it |
| 38 | | - // with the content of the loaded page |
| 39 | | - var copyContent = page.find( copyElements[i] ).contents(); |
| 40 | | - $(copyElements[i]).empty().append( copyContent ); |
| 41 | | - var newClasses = page.find( copyElements[i] ).attr('class'); |
| 42 | | - $(copyElements[i]).attr( 'class', newClasses ); |
| 43 | | - } |
| | 45 | + $.each( copyElements, function(k,v) { |
| | 46 | + // Don't belligerently show elements that are supposed to be hidden |
| | 47 | + $(v).fadeIn( 'fast', function() { $(this).css('display', ''); } ); |
| | 48 | + } ); |
| 44 | 49 | |
| 45 | | - $.each( copyElements, function(k,v) { |
| 46 | | - // Don't belligerently show elements that are supposed to be hidden |
| 47 | | - $(v).fadeIn( 'fast', function() { $(this).css('display', ''); } ); |
| | 50 | + loadSpinner.remove(); |
| | 51 | + |
| | 52 | + $( mw ).trigger( 'LivePreviewDone', [copyElements] ); |
| 48 | 53 | } ); |
| | 54 | + }; |
| 49 | 55 | |
| 50 | | - loadSpinner.remove(); |
| | 56 | + // Shamelessly stolen from the jQuery form plugin, which is licensed under the GPL. |
| | 57 | + // http://jquery.malsup.com/form/#download |
| | 58 | + $.fn.formToArray = function() { |
| | 59 | + var a = []; |
| | 60 | + if (this.length == 0) return a; |
| 51 | 61 | |
| 52 | | - $( mw ).trigger( 'LivePreviewDone', [copyElements] ); |
| 53 | | - } ); |
| 54 | | -}; |
| | 62 | + var form = this[0]; |
| | 63 | + var els = form.elements; |
| | 64 | + if (!els) return a; |
| | 65 | + for(var i=0, max=els.length; i < max; i++) { |
| | 66 | + var el = els[i]; |
| | 67 | + var n = el.name; |
| | 68 | + if (!n) continue; |
| 55 | 69 | |
| 56 | | -// Shamelessly stolen from the jQuery form plugin, which is licensed under the GPL. |
| 57 | | -// http://jquery.malsup.com/form/#download |
| 58 | | -$.fn.formToArray = function() { |
| 59 | | - var a = []; |
| 60 | | - if (this.length == 0) return a; |
| 61 | | - |
| 62 | | - var form = this[0]; |
| 63 | | - var els = form.elements; |
| 64 | | - if (!els) return a; |
| 65 | | - for(var i=0, max=els.length; i < max; i++) { |
| 66 | | - var el = els[i]; |
| 67 | | - var n = el.name; |
| 68 | | - if (!n) continue; |
| 69 | | - |
| 70 | | - var v = $.fieldValue(el, true); |
| 71 | | - if (v && v.constructor == Array) { |
| 72 | | - for(var j=0, jmax=v.length; j < jmax; j++) |
| 73 | | - a.push({name: n, value: v[j]}); |
| | 70 | + var v = $.fieldValue(el, true); |
| | 71 | + if (v && v.constructor == Array) { |
| | 72 | + for(var j=0, jmax=v.length; j < jmax; j++) |
| | 73 | + a.push({name: n, value: v[j]}); |
| | 74 | + } |
| | 75 | + else if (v !== null && typeof v != 'undefined') |
| | 76 | + a.push({name: n, value: v}); |
| 74 | 77 | } |
| 75 | | - else if (v !== null && typeof v != 'undefined') |
| 76 | | - a.push({name: n, value: v}); |
| 77 | | - } |
| 78 | 78 | |
| 79 | | - if (form.clk) { |
| 80 | | - // input type=='image' are not found in elements array! handle it here |
| 81 | | - var $input = $(form.clk), input = $input[0], n = input.name; |
| 82 | | - if (n && !input.disabled && input.type == 'image') { |
| 83 | | - a.push({name: n, value: $input.val()}); |
| 84 | | - a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y}); |
| | 79 | + if (form.clk) { |
| | 80 | + // input type=='image' are not found in elements array! handle it here |
| | 81 | + var $input = $(form.clk), input = $input[0], n = input.name; |
| | 82 | + if (n && !input.disabled && input.type == 'image') { |
| | 83 | + a.push({name: n, value: $input.val()}); |
| | 84 | + a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y}); |
| | 85 | + } |
| 85 | 86 | } |
| 86 | | - } |
| 87 | | - return a; |
| 88 | | -}; |
| | 87 | + return a; |
| | 88 | + }; |
| 89 | 89 | |
| 90 | | -/** |
| 91 | | - * Returns the value of the field element. |
| 92 | | - */ |
| 93 | | -$.fieldValue = function(el, successful) { |
| 94 | | - var n = el.name, t = el.type, tag = el.tagName.toLowerCase(); |
| 95 | | - if (typeof successful == 'undefined') successful = true; |
| | 90 | + /** |
| | 91 | + * Returns the value of the field element. |
| | 92 | + */ |
| | 93 | + $.fieldValue = function(el, successful) { |
| | 94 | + var n = el.name, t = el.type, tag = el.tagName.toLowerCase(); |
| | 95 | + if (typeof successful == 'undefined') successful = true; |
| 96 | 96 | |
| 97 | | - if (successful && (!n || el.disabled || t == 'reset' || t == 'button' || |
| 98 | | - (t == 'checkbox' || t == 'radio') && !el.checked || |
| 99 | | - (t == 'submit' || t == 'image') && el.form && el.form.clk != el || |
| 100 | | - tag == 'select' && el.selectedIndex == -1)) |
| 101 | | - return null; |
| | 97 | + if (successful && (!n || el.disabled || t == 'reset' || t == 'button' || |
| | 98 | + (t == 'checkbox' || t == 'radio') && !el.checked || |
| | 99 | + (t == 'submit' || t == 'image') && el.form && el.form.clk != el || |
| | 100 | + tag == 'select' && el.selectedIndex == -1)) |
| | 101 | + return null; |
| 102 | 102 | |
| 103 | | - if (tag == 'select') { |
| 104 | | - var index = el.selectedIndex; |
| 105 | | - if (index < 0) return null; |
| 106 | | - var a = [], ops = el.options; |
| 107 | | - var one = (t == 'select-one'); |
| 108 | | - var max = (one ? index+1 : ops.length); |
| 109 | | - for(var i=(one ? index : 0); i < max; i++) { |
| 110 | | - var op = ops[i]; |
| 111 | | - if (op.selected) { |
| 112 | | - var v = op.value; |
| 113 | | - if (!v) // extra pain for IE... |
| 114 | | - v = (op.attributes && op.attributes['value'] && |
| 115 | | - !(op.attributes['value'].specified)) |
| 116 | | - ? op.text : op.value; |
| 117 | | - if (one) return v; |
| 118 | | - a.push(v); |
| | 103 | + if (tag == 'select') { |
| | 104 | + var index = el.selectedIndex; |
| | 105 | + if (index < 0) return null; |
| | 106 | + var a = [], ops = el.options; |
| | 107 | + var one = (t == 'select-one'); |
| | 108 | + var max = (one ? index+1 : ops.length); |
| | 109 | + for(var i=(one ? index : 0); i < max; i++) { |
| | 110 | + var op = ops[i]; |
| | 111 | + if (op.selected) { |
| | 112 | + var v = op.value; |
| | 113 | + if (!v) // extra pain for IE... |
| | 114 | + v = (op.attributes && op.attributes['value'] && |
| | 115 | + !(op.attributes['value'].specified)) |
| | 116 | + ? op.text : op.value; |
| | 117 | + if (one) return v; |
| | 118 | + a.push(v); |
| | 119 | + } |
| 119 | 120 | } |
| | 121 | + return a; |
| 120 | 122 | } |
| 121 | | - return a; |
| 122 | | - } |
| 123 | | - return el.value; |
| 124 | | -}; |
| | 123 | + return el.value; |
| | 124 | + }; |
| 125 | 125 | |
| 126 | | -$(document).ready( function() { |
| 127 | | - $('#wpPreview').click( doLivePreview ); |
| 128 | | -} ); |
| | 126 | + $(document).ready( function() { |
| | 127 | + $('#wpPreview').click( doLivePreview ); |
| | 128 | + } ); |
| | 129 | +}) ( jQuery ); |