Split the 'mediawiki.htmlform' module code into multiple files
authorBartosz Dziewoński <matma.rex@gmail.com>
Sat, 30 Jul 2016 23:15:07 +0000 (01:15 +0200)
committerBartosz Dziewoński <matma.rex@gmail.com>
Fri, 19 Aug 2016 01:25:46 +0000 (01:25 +0000)
This module implements several related, but separate enhancements to
HTMLForm. While it makes sense to use a single ResourceLoader module
to serve this code, it doesn't make sense to keep all of it in a
single file. It was approaching 500 lines of code, and pieces of the
separate features were mixed together.

This commit mostly shuffles code around, only tweaking some
indentation, 'var' statements and function wrappers.

There is one small functional change: the enhancements now use the
'htmlform.enhance' mw.hook, which is fired on document-ready and when
new fields are added dynamically. Previously it was only used to allow
extensions to define their own HTMLForm enhancements.

(Also moved HTMLForm styles into the same directory as the newly-split
scripts.)

Change-Id: I22054b39868239ddb59317dadfaaa067653f8804

18 files changed:
resources/Resources.php
resources/src/mediawiki/htmlform/autocomplete.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/checkmatrix.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/cloner.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/hide-if.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/htmlform.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/images/question.png [new file with mode: 0644]
resources/src/mediawiki/htmlform/images/question.svg [new file with mode: 0644]
resources/src/mediawiki/htmlform/multiselect.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/ooui.styles.css [new file with mode: 0644]
resources/src/mediawiki/htmlform/selectandother.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/selectorother.js [new file with mode: 0644]
resources/src/mediawiki/htmlform/styles.css [new file with mode: 0644]
resources/src/mediawiki/images/question.png [deleted file]
resources/src/mediawiki/images/question.svg [deleted file]
resources/src/mediawiki/mediawiki.htmlform.css [deleted file]
resources/src/mediawiki/mediawiki.htmlform.js [deleted file]
resources/src/mediawiki/mediawiki.htmlform.ooui.css [deleted file]

index d2ee1cd..1372a8e 100644 (file)
@@ -1068,7 +1068,16 @@ return [
                'styles' => 'resources/src/mediawiki/mediawiki.hlist.css',
        ],
        'mediawiki.htmlform' => [
-               'scripts' => 'resources/src/mediawiki/mediawiki.htmlform.js',
+               'scripts' => [
+                       'resources/src/mediawiki/htmlform/htmlform.js',
+                       'resources/src/mediawiki/htmlform/autocomplete.js',
+                       'resources/src/mediawiki/htmlform/checkmatrix.js',
+                       'resources/src/mediawiki/htmlform/cloner.js',
+                       'resources/src/mediawiki/htmlform/hide-if.js',
+                       'resources/src/mediawiki/htmlform/multiselect.js',
+                       'resources/src/mediawiki/htmlform/selectandother.js',
+                       'resources/src/mediawiki/htmlform/selectorother.js',
+               ],
                'dependencies' => [
                        'mediawiki.RegExp',
                        'jquery.byteLimit',
@@ -1081,12 +1090,12 @@ return [
                'targets' => [ 'desktop', 'mobile' ],
        ],
        'mediawiki.htmlform.styles' => [
-               'styles' => 'resources/src/mediawiki/mediawiki.htmlform.css',
+               'styles' => 'resources/src/mediawiki/htmlform/styles.css',
                'position' => 'top',
                'targets' => [ 'desktop', 'mobile' ],
        ],
        'mediawiki.htmlform.ooui.styles' => [
-               'styles' => 'resources/src/mediawiki/mediawiki.htmlform.ooui.css',
+               'styles' => 'resources/src/mediawiki/htmlform/ooui.styles.css',
                'position' => 'top',
                'targets' => [ 'desktop', 'mobile' ],
        ],
diff --git a/resources/src/mediawiki/htmlform/autocomplete.js b/resources/src/mediawiki/htmlform/autocomplete.js
new file mode 100644 (file)
index 0000000..8157975
--- /dev/null
@@ -0,0 +1,25 @@
+/*
+ * HTMLForm enhancements:
+ * Set up autocomplete fields.
+ */
+( function ( mw, $ ) {
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               var $autocomplete = $root.find( '.mw-htmlform-autocomplete' );
+               if ( $autocomplete.length ) {
+                       mw.loader.using( 'jquery.suggestions', function () {
+                               $autocomplete.suggestions( {
+                                       fetch: function ( val ) {
+                                               var $el = $( this );
+                                               $el.suggestions( 'suggestions',
+                                                       $.grep( $el.data( 'autocomplete' ), function ( v ) {
+                                                               return v.indexOf( val ) === 0;
+                                                       } )
+                                               );
+                                       }
+                               } );
+                       } );
+               }
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/checkmatrix.js b/resources/src/mediawiki/htmlform/checkmatrix.js
new file mode 100644 (file)
index 0000000..b825f12
--- /dev/null
@@ -0,0 +1,16 @@
+/*
+ * HTMLForm enhancements:
+ * Show fancy tooltips for checkmatrix fields.
+ */
+( function ( mw ) {
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               var $matrixTooltips = $root.find( '.mw-htmlform-matrix .mw-htmlform-tooltip' );
+               if ( $matrixTooltips.length ) {
+                       mw.loader.using( 'jquery.tipsy', function () {
+                               $matrixTooltips.tipsy( { gravity: 's' } );
+                       } );
+               }
+       } );
+
+}( mediaWiki ) );
diff --git a/resources/src/mediawiki/htmlform/cloner.js b/resources/src/mediawiki/htmlform/cloner.js
new file mode 100644 (file)
index 0000000..ab81580
--- /dev/null
@@ -0,0 +1,36 @@
+/*
+ * HTMLForm enhancements:
+ * Add/remove cloner clones without having to resubmit the form.
+ */
+( function ( mw, $ ) {
+
+       var cloneCounter = 0;
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               $root.find( '.mw-htmlform-cloner-delete-button' ).filter( ':input' ).click( function ( ev ) {
+                       ev.preventDefault();
+                       $( this ).closest( 'li.mw-htmlform-cloner-li' ).remove();
+               } );
+
+               $root.find( '.mw-htmlform-cloner-create-button' ).filter( ':input' ).click( function ( ev ) {
+                       var $ul, $li, html;
+
+                       ev.preventDefault();
+
+                       $ul = $( this ).prev( 'ul.mw-htmlform-cloner-ul' );
+
+                       html = $ul.data( 'template' ).replace(
+                               new RegExp( mw.RegExp.escape( $ul.data( 'uniqueId' ) ), 'g' ),
+                               'clone' + ( ++cloneCounter )
+                       );
+
+                       $li = $( '<li>' )
+                               .addClass( 'mw-htmlform-cloner-li' )
+                               .html( html )
+                               .appendTo( $ul );
+
+                       mw.hook( 'htmlform.enhance' ).fire( $li );
+               } );
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/hide-if.js b/resources/src/mediawiki/htmlform/hide-if.js
new file mode 100644 (file)
index 0000000..f739746
--- /dev/null
@@ -0,0 +1,212 @@
+/*
+ * HTMLForm enhancements:
+ * Set up 'hide-if' behaviors for form fields that have them.
+ */
+( function ( mw, $ ) {
+
+       /**
+        * Helper function for hide-if to find the nearby form field.
+        *
+        * Find the closest match for the given name, "closest" being the minimum
+        * level of parents to go to find a form field matching the given name or
+        * ending in array keys matching the given name (e.g. "baz" matches
+        * "foo[bar][baz]").
+        *
+        * @ignore
+        * @private
+        * @param {jQuery} $el
+        * @param {string} name
+        * @return {jQuery|null}
+        */
+       function hideIfGetField( $el, name ) {
+               var $found, $p,
+                       suffix = name.replace( /^([^\[]+)/, '[$1]' );
+
+               function nameFilter() {
+                       return this.name === name ||
+                               ( this.name === ( 'wp' + name ) ) ||
+                               this.name.slice( -suffix.length ) === suffix;
+               }
+
+               for ( $p = $el.parent(); $p.length > 0; $p = $p.parent() ) {
+                       $found = $p.find( '[name]' ).filter( nameFilter );
+                       if ( $found.length ) {
+                               return $found;
+                       }
+               }
+               return null;
+       }
+
+       /**
+        * Helper function for hide-if to return a test function and list of
+        * dependent fields for a hide-if specification.
+        *
+        * @ignore
+        * @private
+        * @param {jQuery} $el
+        * @param {Array} spec
+        * @return {Array}
+        * @return {jQuery} return.0 Dependent fields
+        * @return {Function} return.1 Test function
+        */
+       function hideIfParse( $el, spec ) {
+               var op, i, l, v, $field, $fields, fields, func, funcs, getVal;
+
+               op = spec[ 0 ];
+               l = spec.length;
+               switch ( op ) {
+                       case 'AND':
+                       case 'OR':
+                       case 'NAND':
+                       case 'NOR':
+                               funcs = [];
+                               fields = [];
+                               for ( i = 1; i < l; i++ ) {
+                                       if ( !$.isArray( spec[ i ] ) ) {
+                                               throw new Error( op + ' parameters must be arrays' );
+                                       }
+                                       v = hideIfParse( $el, spec[ i ] );
+                                       fields = fields.concat( v[ 0 ].toArray() );
+                                       funcs.push( v[ 1 ] );
+                               }
+                               $fields = $( fields );
+
+                               l = funcs.length;
+                               switch ( op ) {
+                                       case 'AND':
+                                               func = function () {
+                                                       var i;
+                                                       for ( i = 0; i < l; i++ ) {
+                                                               if ( !funcs[ i ]() ) {
+                                                                       return false;
+                                                               }
+                                                       }
+                                                       return true;
+                                               };
+                                               break;
+
+                                       case 'OR':
+                                               func = function () {
+                                                       var i;
+                                                       for ( i = 0; i < l; i++ ) {
+                                                               if ( funcs[ i ]() ) {
+                                                                       return true;
+                                                               }
+                                                       }
+                                                       return false;
+                                               };
+                                               break;
+
+                                       case 'NAND':
+                                               func = function () {
+                                                       var i;
+                                                       for ( i = 0; i < l; i++ ) {
+                                                               if ( !funcs[ i ]() ) {
+                                                                       return true;
+                                                               }
+                                                       }
+                                                       return false;
+                                               };
+                                               break;
+
+                                       case 'NOR':
+                                               func = function () {
+                                                       var i;
+                                                       for ( i = 0; i < l; i++ ) {
+                                                               if ( funcs[ i ]() ) {
+                                                                       return false;
+                                                               }
+                                                       }
+                                                       return true;
+                                               };
+                                               break;
+                               }
+
+                               return [ $fields, func ];
+
+                       case 'NOT':
+                               if ( l !== 2 ) {
+                                       throw new Error( 'NOT takes exactly one parameter' );
+                               }
+                               if ( !$.isArray( spec[ 1 ] ) ) {
+                                       throw new Error( 'NOT parameters must be arrays' );
+                               }
+                               v = hideIfParse( $el, spec[ 1 ] );
+                               $fields = v[ 0 ];
+                               func = v[ 1 ];
+                               return [ $fields, function () {
+                                       return !func();
+                               } ];
+
+                       case '===':
+                       case '!==':
+                               if ( l !== 3 ) {
+                                       throw new Error( op + ' takes exactly two parameters' );
+                               }
+                               $field = hideIfGetField( $el, spec[ 1 ] );
+                               if ( !$field ) {
+                                       return [ $(), function () {
+                                               return false;
+                                       } ];
+                               }
+                               v = spec[ 2 ];
+
+                               if ( $field.first().prop( 'type' ) === 'radio' ||
+                                       $field.first().prop( 'type' ) === 'checkbox'
+                               ) {
+                                       getVal = function () {
+                                               var $selected = $field.filter( ':checked' );
+                                               return $selected.length ? $selected.val() : '';
+                                       };
+                               } else {
+                                       getVal = function () {
+                                               return $field.val();
+                                       };
+                               }
+
+                               switch ( op ) {
+                                       case '===':
+                                               func = function () {
+                                                       return getVal() === v;
+                                               };
+                                               break;
+                                       case '!==':
+                                               func = function () {
+                                                       return getVal() !== v;
+                                               };
+                                               break;
+                               }
+
+                               return [ $field, func ];
+
+                       default:
+                               throw new Error( 'Unrecognized operation \'' + op + '\'' );
+               }
+       }
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               $root.find( '.mw-htmlform-hide-if' ).each( function () {
+                       var v, $fields, test, func,
+                               $el = $( this ),
+                               spec = $el.data( 'hideIf' );
+
+                       if ( !spec ) {
+                               return;
+                       }
+
+                       v = hideIfParse( $el, spec );
+                       $fields = v[ 0 ];
+                       test = v[ 1 ];
+                       func = function () {
+                               if ( test() ) {
+                                       $el.hide();
+                               } else {
+                                       $el.show();
+                               }
+                       };
+                       $fields.on( 'change', func );
+                       func();
+               } );
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/htmlform.js b/resources/src/mediawiki/htmlform/htmlform.js
new file mode 100644 (file)
index 0000000..19f8f3e
--- /dev/null
@@ -0,0 +1,7 @@
+( function ( mw, $ ) {
+
+       $( function () {
+               mw.hook( 'htmlform.enhance' ).fire( $( document ) );
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/images/question.png b/resources/src/mediawiki/htmlform/images/question.png
new file mode 100644 (file)
index 0000000..acce58c
Binary files /dev/null and b/resources/src/mediawiki/htmlform/images/question.png differ
diff --git a/resources/src/mediawiki/htmlform/images/question.svg b/resources/src/mediawiki/htmlform/images/question.svg
new file mode 100644 (file)
index 0000000..98fbe8d
--- /dev/null
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="21.059" height="21.06"><path fill="#575757" d="M10.529 0c-5.814 0-10.529 4.714-10.529 10.529s4.715 10.53 10.529 10.53c5.816 0 10.529-4.715 10.529-10.53s-4.712-10.529-10.529-10.529zm-.002 16.767c-.861 0-1.498-.688-1.498-1.516 0-.862.637-1.534 1.498-1.534.828 0 1.5.672 1.5 1.534 0 .827-.672 1.516-1.5 1.516zm2.137-6.512c-.723.568-1 .931-1 1.739v.5h-2.205v-.603c0-1.517.449-2.136 1.154-2.688.707-.552 1.139-.845 1.139-1.637 0-.672-.414-1.051-1.24-1.051-.707 0-1.328.189-1.982.638l-1.051-1.807c.861-.604 1.93-1.034 3.342-1.034 1.912 0 3.516 1.051 3.516 3.066-.001 1.43-.794 2.188-1.673 2.877z"/></svg>
\ No newline at end of file
diff --git a/resources/src/mediawiki/htmlform/multiselect.js b/resources/src/mediawiki/htmlform/multiselect.js
new file mode 100644 (file)
index 0000000..3cdab3c
--- /dev/null
@@ -0,0 +1,67 @@
+/*
+ * HTMLForm enhancements:
+ * Convert multiselect fields from checkboxes to Chosen selector when requested.
+ */
+( function ( mw, $ ) {
+
+       function addMulti( $oldContainer, $container ) {
+               var name = $oldContainer.find( 'input:first-child' ).attr( 'name' ),
+                       oldClass = ( ' ' + $oldContainer.attr( 'class' ) + ' ' ).replace( /(mw-htmlform-field-HTMLMultiSelectField|mw-chosen)/g, '' ),
+                       $select = $( '<select>' ),
+                       dataPlaceholder = mw.message( 'htmlform-chosen-placeholder' );
+               oldClass = $.trim( oldClass );
+               $select.attr( {
+                       name: name,
+                       multiple: 'multiple',
+                       'data-placeholder': dataPlaceholder.plain(),
+                       'class': 'htmlform-chzn-select mw-input ' + oldClass
+               } );
+               $oldContainer.find( 'input' ).each( function () {
+                       var $oldInput = $( this ),
+                       checked = $oldInput.prop( 'checked' ),
+                       $option = $( '<option>' );
+                       $option.prop( 'value', $oldInput.prop( 'value' ) );
+                       if ( checked ) {
+                               $option.prop( 'selected', true );
+                       }
+                       $option.text( $oldInput.prop( 'value' ) );
+                       $select.append( $option );
+               } );
+               $container.append( $select );
+       }
+
+       function convertCheckboxesToMulti( $oldContainer, type ) {
+               var $fieldLabel = $( '<td>' ),
+               $td = $( '<td>' ),
+               $fieldLabelText = $( '<label>' ),
+               $container;
+               if ( type === 'tr' ) {
+                       addMulti( $oldContainer, $td );
+                       $container = $( '<tr>' );
+                       $container.append( $td );
+               } else if ( type === 'div' ) {
+                       $fieldLabel = $( '<div>' );
+                       $container = $( '<div>' );
+                       addMulti( $oldContainer, $container );
+               }
+               $fieldLabel.attr( 'class', 'mw-label' );
+               $fieldLabelText.text( $oldContainer.find( '.mw-label label' ).text() );
+               $fieldLabel.append( $fieldLabelText );
+               $container.prepend( $fieldLabel );
+               $oldContainer.replaceWith( $container );
+               return $container;
+       }
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               if ( $root.find( '.mw-chosen' ).length ) {
+                       mw.loader.using( 'jquery.chosen', function () {
+                               $root.find( '.mw-chosen' ).each( function () {
+                                       var type = this.nodeName.toLowerCase(),
+                                               $converted = convertCheckboxesToMulti( $( this ), type );
+                                       $converted.find( '.htmlform-chzn-select' ).chosen( { width: 'auto' } );
+                               } );
+                       } );
+               }
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/ooui.styles.css b/resources/src/mediawiki/htmlform/ooui.styles.css
new file mode 100644 (file)
index 0000000..a9e75d7
--- /dev/null
@@ -0,0 +1,29 @@
+/* OOUIHTMLForm styles */
+
+.mw-htmlform-ooui-wrapper {
+       margin: 1em 0;
+}
+
+.mw-htmlform-ooui .mw-htmlform-submit-buttons {
+       margin-top: 1em;
+}
+
+.mw-htmlform-ooui .mw-htmlform-field-HTMLCheckMatrix,
+.mw-htmlform-ooui .mw-htmlform-matrix,
+.mw-htmlform-ooui .mw-htmlform-matrix tr {
+       width: 100%;
+}
+
+.mw-htmlform-ooui .mw-htmlform-matrix tr td.first {
+       margin-right: 5%;
+       width: 39%;
+}
+
+/* Flatlist styling for PHP widgets... */
+.mw-htmlform-flatlist .oo-ui-fieldLayout-align-inline,
+/* ...and for JS widgets */
+.mw-htmlform-flatlist .oo-ui-optionWidget,
+.mw-htmlform-flatlist .oo-ui-multioptionWidget {
+       display: inline-block;
+       margin-right: 1em;
+}
diff --git a/resources/src/mediawiki/htmlform/selectandother.js b/resources/src/mediawiki/htmlform/selectandother.js
new file mode 100644 (file)
index 0000000..95227d0
--- /dev/null
@@ -0,0 +1,41 @@
+/*
+ * HTMLForm enhancements:
+ * Add a dynamic max length to the reason field of SelectAndOther.
+ */
+( function ( mw, $ ) {
+
+       // cache the separator to avoid object creation on each keypress
+       var colonSeparator = mw.message( 'colon-separator' ).text();
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               // This checks the length together with the value from the select field
+               // When the reason list is changed and the bytelimit is longer than the allowed,
+               // nothing is done
+               $root
+                       .find( '.mw-htmlform-select-and-other-field' )
+                       .each( function () {
+                               var $this = $( this ),
+                                       // find the reason list
+                                       $reasonList = $root.find( '#' + $this.data( 'id-select' ) ),
+                                       // cache the current selection to avoid expensive lookup
+                                       currentValReasonList = $reasonList.val();
+
+                               $reasonList.change( function () {
+                                       currentValReasonList = $reasonList.val();
+                               } );
+
+                               $this.byteLimit( function ( input ) {
+                                       // Should be built the same as in HTMLSelectAndOtherField::loadDataFromRequest
+                                       var comment = currentValReasonList;
+                                       if ( comment === 'other' ) {
+                                               comment = input;
+                                       } else if ( input !== '' ) {
+                                               // Entry from drop down menu + additional comment
+                                               comment += colonSeparator + input;
+                                       }
+                                       return comment;
+                               } );
+                       } );
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/selectorother.js b/resources/src/mediawiki/htmlform/selectorother.js
new file mode 100644 (file)
index 0000000..66879e9
--- /dev/null
@@ -0,0 +1,61 @@
+/*
+ * HTMLForm enhancements:
+ * Animate the SelectOrOther fields, to only show the text field when 'other' is selected.
+ */
+( function ( mw, $ ) {
+
+       /**
+        * @class jQuery.plugin.htmlform
+        */
+
+       /**
+        * jQuery plugin to fade or snap to visible state.
+        *
+        * @param {boolean} [instantToggle=false]
+        * @return {jQuery}
+        * @chainable
+        */
+       $.fn.goIn = function ( instantToggle ) {
+               if ( instantToggle === true ) {
+                       return this.show();
+               }
+               return this.stop( true, true ).fadeIn();
+       };
+
+       /**
+        * jQuery plugin to fade or snap to hiding state.
+        *
+        * @param {boolean} [instantToggle=false]
+        * @return {jQuery}
+        * @chainable
+        */
+       $.fn.goOut = function ( instantToggle ) {
+               if ( instantToggle === true ) {
+                       return this.hide();
+               }
+               return this.stop( true, true ).fadeOut();
+       };
+
+       mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
+               /**
+                * @ignore
+                * @param {boolean|jQuery.Event} instant
+                */
+               function handleSelectOrOther( instant ) {
+                       var $other = $root.find( '#' + $( this ).attr( 'id' ) + '-other' );
+                       $other = $other.add( $other.siblings( 'br' ) );
+                       if ( $( this ).val() === 'other' ) {
+                               $other.goIn( instant );
+                       } else {
+                               $other.goOut( instant );
+                       }
+               }
+
+               $root
+                       .on( 'change', '.mw-htmlform-select-or-other', handleSelectOrOther )
+                       .each( function () {
+                               handleSelectOrOther.call( this, true );
+                       } );
+       } );
+
+}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/htmlform/styles.css b/resources/src/mediawiki/htmlform/styles.css
new file mode 100644 (file)
index 0000000..1603130
--- /dev/null
@@ -0,0 +1,49 @@
+/* HTMLForm styles */
+
+table.mw-htmlform-nolabel td.mw-label {
+       display: none;
+}
+
+.mw-htmlform-invalid-input td.mw-input input {
+       border-color: #f00;
+}
+
+.mw-htmlform-flatlist div.mw-htmlform-flatlist-item {
+       display: inline;
+       margin-right: 1em;
+       white-space: nowrap;
+}
+
+/* HTMLCheckMatrix */
+
+.mw-htmlform-matrix td {
+       padding-left: 0.5em;
+       padding-right: 0.5em;
+}
+
+tr.mw-htmlform-vertical-label td.mw-label {
+       text-align: left !important;
+}
+
+.mw-icon-question {
+       /* SVG support using a transparent gradient to guarantee cross-browser
+        * compatibility (browsers able to understand gradient syntax support also SVG).
+        * http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique */
+       background-image: url( images/question.png );
+       /* @embed */
+       background-image: linear-gradient( transparent, transparent ), url( images/question.svg );
+       background-repeat: no-repeat;
+       background-size: 13px 13px;
+       display: inline-block;
+       height: 13px;
+       width: 13px;
+       margin-left: 4px;
+}
+
+.mw-icon-question:lang(ar),
+.mw-icon-question:lang(fa),
+.mw-icon-question:lang(ur) {
+       -webkit-transform: scaleX( -1 );
+       -ms-transform: scaleX( -1 );
+       transform: scaleX( -1 );
+}
diff --git a/resources/src/mediawiki/images/question.png b/resources/src/mediawiki/images/question.png
deleted file mode 100644 (file)
index acce58c..0000000
Binary files a/resources/src/mediawiki/images/question.png and /dev/null differ
diff --git a/resources/src/mediawiki/images/question.svg b/resources/src/mediawiki/images/question.svg
deleted file mode 100644 (file)
index 98fbe8d..0000000
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="21.059" height="21.06"><path fill="#575757" d="M10.529 0c-5.814 0-10.529 4.714-10.529 10.529s4.715 10.53 10.529 10.53c5.816 0 10.529-4.715 10.529-10.53s-4.712-10.529-10.529-10.529zm-.002 16.767c-.861 0-1.498-.688-1.498-1.516 0-.862.637-1.534 1.498-1.534.828 0 1.5.672 1.5 1.534 0 .827-.672 1.516-1.5 1.516zm2.137-6.512c-.723.568-1 .931-1 1.739v.5h-2.205v-.603c0-1.517.449-2.136 1.154-2.688.707-.552 1.139-.845 1.139-1.637 0-.672-.414-1.051-1.24-1.051-.707 0-1.328.189-1.982.638l-1.051-1.807c.861-.604 1.93-1.034 3.342-1.034 1.912 0 3.516 1.051 3.516 3.066-.001 1.43-.794 2.188-1.673 2.877z"/></svg>
\ No newline at end of file
diff --git a/resources/src/mediawiki/mediawiki.htmlform.css b/resources/src/mediawiki/mediawiki.htmlform.css
deleted file mode 100644 (file)
index 1603130..0000000
+++ /dev/null
@@ -1,49 +0,0 @@
-/* HTMLForm styles */
-
-table.mw-htmlform-nolabel td.mw-label {
-       display: none;
-}
-
-.mw-htmlform-invalid-input td.mw-input input {
-       border-color: #f00;
-}
-
-.mw-htmlform-flatlist div.mw-htmlform-flatlist-item {
-       display: inline;
-       margin-right: 1em;
-       white-space: nowrap;
-}
-
-/* HTMLCheckMatrix */
-
-.mw-htmlform-matrix td {
-       padding-left: 0.5em;
-       padding-right: 0.5em;
-}
-
-tr.mw-htmlform-vertical-label td.mw-label {
-       text-align: left !important;
-}
-
-.mw-icon-question {
-       /* SVG support using a transparent gradient to guarantee cross-browser
-        * compatibility (browsers able to understand gradient syntax support also SVG).
-        * http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique */
-       background-image: url( images/question.png );
-       /* @embed */
-       background-image: linear-gradient( transparent, transparent ), url( images/question.svg );
-       background-repeat: no-repeat;
-       background-size: 13px 13px;
-       display: inline-block;
-       height: 13px;
-       width: 13px;
-       margin-left: 4px;
-}
-
-.mw-icon-question:lang(ar),
-.mw-icon-question:lang(fa),
-.mw-icon-question:lang(ur) {
-       -webkit-transform: scaleX( -1 );
-       -ms-transform: scaleX( -1 );
-       transform: scaleX( -1 );
-}
diff --git a/resources/src/mediawiki/mediawiki.htmlform.js b/resources/src/mediawiki/mediawiki.htmlform.js
deleted file mode 100644 (file)
index c3464ea..0000000
+++ /dev/null
@@ -1,417 +0,0 @@
-/**
- * Utility functions for jazzing up HTMLForm elements.
- *
- * @class jQuery.plugin.htmlform
- */
-( function ( mw, $ ) {
-
-       var cloneCounter = 0;
-
-       /**
-        * Helper function for hide-if to find the nearby form field.
-        *
-        * Find the closest match for the given name, "closest" being the minimum
-        * level of parents to go to find a form field matching the given name or
-        * ending in array keys matching the given name (e.g. "baz" matches
-        * "foo[bar][baz]").
-        *
-        * @private
-        * @param {jQuery} $el
-        * @param {string} name
-        * @return {jQuery|null}
-        */
-       function hideIfGetField( $el, name ) {
-               var $found, $p,
-                       suffix = name.replace( /^([^\[]+)/, '[$1]' );
-
-               function nameFilter() {
-                       return this.name === name ||
-                               ( this.name === ( 'wp' + name ) ) ||
-                               this.name.slice( -suffix.length ) === suffix;
-               }
-
-               for ( $p = $el.parent(); $p.length > 0; $p = $p.parent() ) {
-                       $found = $p.find( '[name]' ).filter( nameFilter );
-                       if ( $found.length ) {
-                               return $found;
-                       }
-               }
-               return null;
-       }
-
-       /**
-        * Helper function for hide-if to return a test function and list of
-        * dependent fields for a hide-if specification.
-        *
-        * @private
-        * @param {jQuery} $el
-        * @param {Array} spec
-        * @return {Array}
-        * @return {jQuery} return.0 Dependent fields
-        * @return {Function} return.1 Test function
-        */
-       function hideIfParse( $el, spec ) {
-               var op, i, l, v, $field, $fields, fields, func, funcs, getVal;
-
-               op = spec[ 0 ];
-               l = spec.length;
-               switch ( op ) {
-                       case 'AND':
-                       case 'OR':
-                       case 'NAND':
-                       case 'NOR':
-                               funcs = [];
-                               fields = [];
-                               for ( i = 1; i < l; i++ ) {
-                                       if ( !$.isArray( spec[ i ] ) ) {
-                                               throw new Error( op + ' parameters must be arrays' );
-                                       }
-                                       v = hideIfParse( $el, spec[ i ] );
-                                       fields = fields.concat( v[ 0 ].toArray() );
-                                       funcs.push( v[ 1 ] );
-                               }
-                               $fields = $( fields );
-
-                               l = funcs.length;
-                               switch ( op ) {
-                                       case 'AND':
-                                               func = function () {
-                                                       var i;
-                                                       for ( i = 0; i < l; i++ ) {
-                                                               if ( !funcs[ i ]() ) {
-                                                                       return false;
-                                                               }
-                                                       }
-                                                       return true;
-                                               };
-                                               break;
-
-                                       case 'OR':
-                                               func = function () {
-                                                       var i;
-                                                       for ( i = 0; i < l; i++ ) {
-                                                               if ( funcs[ i ]() ) {
-                                                                       return true;
-                                                               }
-                                                       }
-                                                       return false;
-                                               };
-                                               break;
-
-                                       case 'NAND':
-                                               func = function () {
-                                                       var i;
-                                                       for ( i = 0; i < l; i++ ) {
-                                                               if ( !funcs[ i ]() ) {
-                                                                       return true;
-                                                               }
-                                                       }
-                                                       return false;
-                                               };
-                                               break;
-
-                                       case 'NOR':
-                                               func = function () {
-                                                       var i;
-                                                       for ( i = 0; i < l; i++ ) {
-                                                               if ( funcs[ i ]() ) {
-                                                                       return false;
-                                                               }
-                                                       }
-                                                       return true;
-                                               };
-                                               break;
-                               }
-
-                               return [ $fields, func ];
-
-                       case 'NOT':
-                               if ( l !== 2 ) {
-                                       throw new Error( 'NOT takes exactly one parameter' );
-                               }
-                               if ( !$.isArray( spec[ 1 ] ) ) {
-                                       throw new Error( 'NOT parameters must be arrays' );
-                               }
-                               v = hideIfParse( $el, spec[ 1 ] );
-                               $fields = v[ 0 ];
-                               func = v[ 1 ];
-                               return [ $fields, function () {
-                                       return !func();
-                               } ];
-
-                       case '===':
-                       case '!==':
-                               if ( l !== 3 ) {
-                                       throw new Error( op + ' takes exactly two parameters' );
-                               }
-                               $field = hideIfGetField( $el, spec[ 1 ] );
-                               if ( !$field ) {
-                                       return [ $(), function () {
-                                               return false;
-                                       } ];
-                               }
-                               v = spec[ 2 ];
-
-                               if ( $field.first().prop( 'type' ) === 'radio' ||
-                                       $field.first().prop( 'type' ) === 'checkbox'
-                               ) {
-                                       getVal = function () {
-                                               var $selected = $field.filter( ':checked' );
-                                               return $selected.length ? $selected.val() : '';
-                                       };
-                               } else {
-                                       getVal = function () {
-                                               return $field.val();
-                                       };
-                               }
-
-                               switch ( op ) {
-                                       case '===':
-                                               func = function () {
-                                                       return getVal() === v;
-                                               };
-                                               break;
-                                       case '!==':
-                                               func = function () {
-                                                       return getVal() !== v;
-                                               };
-                                               break;
-                               }
-
-                               return [ $field, func ];
-
-                       default:
-                               throw new Error( 'Unrecognized operation \'' + op + '\'' );
-               }
-       }
-
-       /**
-        * jQuery plugin to fade or snap to visible state.
-        *
-        * @param {boolean} [instantToggle=false]
-        * @return {jQuery}
-        * @chainable
-        */
-       $.fn.goIn = function ( instantToggle ) {
-               if ( instantToggle === true ) {
-                       return this.show();
-               }
-               return this.stop( true, true ).fadeIn();
-       };
-
-       /**
-        * jQuery plugin to fade or snap to hiding state.
-        *
-        * @param {boolean} [instantToggle=false]
-        * @return {jQuery}
-        * @chainable
-        */
-       $.fn.goOut = function ( instantToggle ) {
-               if ( instantToggle === true ) {
-                       return this.hide();
-               }
-               return this.stop( true, true ).fadeOut();
-       };
-
-       function enhance( $root ) {
-               var $matrixTooltips, $autocomplete,
-                       // cache the separator to avoid object creation on each keypress
-                       colonSeparator = mw.message( 'colon-separator' ).text();
-
-               /**
-                * @ignore
-                * @param {boolean|jQuery.Event} instant
-                */
-               function handleSelectOrOther( instant ) {
-                       var $other = $root.find( '#' + $( this ).attr( 'id' ) + '-other' );
-                       $other = $other.add( $other.siblings( 'br' ) );
-                       if ( $( this ).val() === 'other' ) {
-                               $other.goIn( instant );
-                       } else {
-                               $other.goOut( instant );
-                       }
-               }
-
-               // Animate the SelectOrOther fields, to only show the text field when
-               // 'other' is selected.
-               $root
-                       .on( 'change', '.mw-htmlform-select-or-other', handleSelectOrOther )
-                       .each( function () {
-                               handleSelectOrOther.call( this, true );
-                       } );
-
-               // Add a dynamic max length to the reason field of SelectAndOther
-               // This checks the length together with the value from the select field
-               // When the reason list is changed and the bytelimit is longer than the allowed,
-               // nothing is done
-               $root
-                       .find( '.mw-htmlform-select-and-other-field' )
-                       .each( function () {
-                               var $this = $( this ),
-                                       // find the reason list
-                                       $reasonList = $root.find( '#' + $this.data( 'id-select' ) ),
-                                       // cache the current selection to avoid expensive lookup
-                                       currentValReasonList = $reasonList.val();
-
-                               $reasonList.change( function () {
-                                       currentValReasonList = $reasonList.val();
-                               } );
-
-                               $this.byteLimit( function ( input ) {
-                                       // Should be built the same as in HTMLSelectAndOtherField::loadDataFromRequest
-                                       var comment = currentValReasonList;
-                                       if ( comment === 'other' ) {
-                                               comment = input;
-                                       } else if ( input !== '' ) {
-                                               // Entry from drop down menu + additional comment
-                                               comment += colonSeparator + input;
-                                       }
-                                       return comment;
-                               } );
-                       } );
-
-               // Set up hide-if elements
-               $root.find( '.mw-htmlform-hide-if' ).each( function () {
-                       var v, $fields, test, func,
-                               $el = $( this ),
-                               spec = $el.data( 'hideIf' );
-
-                       if ( !spec ) {
-                               return;
-                       }
-
-                       v = hideIfParse( $el, spec );
-                       $fields = v[ 0 ];
-                       test = v[ 1 ];
-                       func = function () {
-                               if ( test() ) {
-                                       $el.hide();
-                               } else {
-                                       $el.show();
-                               }
-                       };
-                       $fields.on( 'change', func );
-                       func();
-               } );
-
-               function addMulti( $oldContainer, $container ) {
-                       var name = $oldContainer.find( 'input:first-child' ).attr( 'name' ),
-                               oldClass = ( ' ' + $oldContainer.attr( 'class' ) + ' ' ).replace( /(mw-htmlform-field-HTMLMultiSelectField|mw-chosen)/g, '' ),
-                               $select = $( '<select>' ),
-                               dataPlaceholder = mw.message( 'htmlform-chosen-placeholder' );
-                       oldClass = $.trim( oldClass );
-                       $select.attr( {
-                               name: name,
-                               multiple: 'multiple',
-                               'data-placeholder': dataPlaceholder.plain(),
-                               'class': 'htmlform-chzn-select mw-input ' + oldClass
-                       } );
-                       $oldContainer.find( 'input' ).each( function () {
-                               var $oldInput = $( this ),
-                               checked = $oldInput.prop( 'checked' ),
-                               $option = $( '<option>' );
-                               $option.prop( 'value', $oldInput.prop( 'value' ) );
-                               if ( checked ) {
-                                       $option.prop( 'selected', true );
-                               }
-                               $option.text( $oldInput.prop( 'value' ) );
-                               $select.append( $option );
-                       } );
-                       $container.append( $select );
-               }
-
-               function convertCheckboxesToMulti( $oldContainer, type ) {
-                       var $fieldLabel = $( '<td>' ),
-                       $td = $( '<td>' ),
-                       $fieldLabelText = $( '<label>' ),
-                       $container;
-                       if ( type === 'tr' ) {
-                               addMulti( $oldContainer, $td );
-                               $container = $( '<tr>' );
-                               $container.append( $td );
-                       } else if ( type === 'div' ) {
-                               $fieldLabel = $( '<div>' );
-                               $container = $( '<div>' );
-                               addMulti( $oldContainer, $container );
-                       }
-                       $fieldLabel.attr( 'class', 'mw-label' );
-                       $fieldLabelText.text( $oldContainer.find( '.mw-label label' ).text() );
-                       $fieldLabel.append( $fieldLabelText );
-                       $container.prepend( $fieldLabel );
-                       $oldContainer.replaceWith( $container );
-                       return $container;
-               }
-
-               if ( $root.find( '.mw-chosen' ).length ) {
-                       mw.loader.using( 'jquery.chosen', function () {
-                               $root.find( '.mw-chosen' ).each( function () {
-                                       var type = this.nodeName.toLowerCase(),
-                                               $converted = convertCheckboxesToMulti( $( this ), type );
-                                       $converted.find( '.htmlform-chzn-select' ).chosen( { width: 'auto' } );
-                               } );
-                       } );
-               }
-
-               $matrixTooltips = $root.find( '.mw-htmlform-matrix .mw-htmlform-tooltip' );
-               if ( $matrixTooltips.length ) {
-                       mw.loader.using( 'jquery.tipsy', function () {
-                               $matrixTooltips.tipsy( { gravity: 's' } );
-                       } );
-               }
-
-               // Set up autocomplete fields
-               $autocomplete = $root.find( '.mw-htmlform-autocomplete' );
-               if ( $autocomplete.length ) {
-                       mw.loader.using( 'jquery.suggestions', function () {
-                               $autocomplete.suggestions( {
-                                       fetch: function ( val ) {
-                                               var $el = $( this );
-                                               $el.suggestions( 'suggestions',
-                                                       $.grep( $el.data( 'autocomplete' ), function ( v ) {
-                                                               return v.indexOf( val ) === 0;
-                                                       } )
-                                               );
-                                       }
-                               } );
-                       } );
-               }
-
-               // Add/remove cloner clones without having to resubmit the form
-               $root.find( '.mw-htmlform-cloner-delete-button' ).filter( ':input' ).click( function ( ev ) {
-                       ev.preventDefault();
-                       $( this ).closest( 'li.mw-htmlform-cloner-li' ).remove();
-               } );
-
-               $root.find( '.mw-htmlform-cloner-create-button' ).filter( ':input' ).click( function ( ev ) {
-                       var $ul, $li, html;
-
-                       ev.preventDefault();
-
-                       $ul = $( this ).prev( 'ul.mw-htmlform-cloner-ul' );
-
-                       html = $ul.data( 'template' ).replace(
-                               new RegExp( mw.RegExp.escape( $ul.data( 'uniqueId' ) ), 'g' ),
-                               'clone' + ( ++cloneCounter )
-                       );
-
-                       $li = $( '<li>' )
-                               .addClass( 'mw-htmlform-cloner-li' )
-                               .html( html )
-                               .appendTo( $ul );
-
-                       enhance( $li );
-               } );
-
-               mw.hook( 'htmlform.enhance' ).fire( $root );
-
-       }
-
-       $( function () {
-               enhance( $( document ) );
-       } );
-
-       /**
-        * @class jQuery
-        * @mixins jQuery.plugin.htmlform
-        */
-}( mediaWiki, jQuery ) );
diff --git a/resources/src/mediawiki/mediawiki.htmlform.ooui.css b/resources/src/mediawiki/mediawiki.htmlform.ooui.css
deleted file mode 100644 (file)
index a9e75d7..0000000
+++ /dev/null
@@ -1,29 +0,0 @@
-/* OOUIHTMLForm styles */
-
-.mw-htmlform-ooui-wrapper {
-       margin: 1em 0;
-}
-
-.mw-htmlform-ooui .mw-htmlform-submit-buttons {
-       margin-top: 1em;
-}
-
-.mw-htmlform-ooui .mw-htmlform-field-HTMLCheckMatrix,
-.mw-htmlform-ooui .mw-htmlform-matrix,
-.mw-htmlform-ooui .mw-htmlform-matrix tr {
-       width: 100%;
-}
-
-.mw-htmlform-ooui .mw-htmlform-matrix tr td.first {
-       margin-right: 5%;
-       width: 39%;
-}
-
-/* Flatlist styling for PHP widgets... */
-.mw-htmlform-flatlist .oo-ui-fieldLayout-align-inline,
-/* ...and for JS widgets */
-.mw-htmlform-flatlist .oo-ui-optionWidget,
-.mw-htmlform-flatlist .oo-ui-multioptionWidget {
-       display: inline-block;
-       margin-right: 1em;
-}