Merge "Factor out byte limit label logic from edit page to utility function"

diff --git a/resources/Resources.php b/resources/Resources.php
index 66ea2a9..8695a0c 100644 (file)
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -1418,6 +1418,7 @@ return [
                        'jquery.accessKeyLabel',
                        'jquery.textSelection',
                        'jquery.byteLimit',
+                       'mediawiki.widgets.visibleByteLimit',
                        'mediawiki.api',
                ],
        ],
@@ -2373,6 +2374,16 @@ return [
                ],
                'targets' => [ 'desktop', 'mobile' ],
        ],
+       'mediawiki.widgets.visibleByteLimit' => [
+               'scripts' => [
+                       'resources/src/mediawiki.widgets.visibleByteLimit/mediawiki.widgets.visibleByteLimit.js'
+               ],
+               'dependencies' => [
+                       'oojs-ui-core',
+                       'jquery.byteLimit'
+               ],
+               'targets' => [ 'desktop', 'mobile' ]
+       ],
        'mediawiki.widgets.datetime' => [
                'scripts' => [
                        'resources/src/mediawiki.widgets.datetime/mediawiki.widgets.datetime.js',

diff --git a/resources/src/mediawiki.action/mediawiki.action.edit.js b/resources/src/mediawiki.action/mediawiki.action.edit.js
index 8cde703..5b81017 100644 (file)
--- a/resources/src/mediawiki.action/mediawiki.action.edit.js
+++ b/resources/src/mediawiki.action/mediawiki.action.edit.js
@@ -27,18 +27,10 @@
                                // TODO: This should be an OOjs UI feature, or somehow happen automatically after infusing.
                                wpSummary.$input.updateTooltipAccessKeys();
 
-                               // Make sure edit summary does not exceed byte limit
-                               wpSummary.$input.byteLimit( 255 );
-
                                // Show a byte-counter to users with how many bytes are left for their edit summary.
                                // TODO: This looks a bit weird, as there is no unit in the UI, just numbers; showing
                                // 'bytes' confused users in testing, and showing 'chars' would be a lie. See T42035.
-                               function updateSummaryLabelCount() {
-                                       wpSummary.setLabel( String( 255 - $.byteLength( wpSummary.getValue() ) ) );
-                               }
-                               wpSummary.on( 'change', updateSummaryLabelCount );
-                               // Initialise value
-                               updateSummaryLabelCount();
+                               mw.widgets.visibleByteLimit( wpSummary, 255 );
                        } );
                } else {
                        // Make sure edit summary does not exceed byte limit

diff --git a/resources/src/mediawiki.widgets.visibleByteLimit/mediawiki.widgets.visibleByteLimit.js b/resources/src/mediawiki.widgets.visibleByteLimit/mediawiki.widgets.visibleByteLimit.js
new file mode 100644 (file)
index 0000000..5678a80
--- /dev/null
+++ b/resources/src/mediawiki.widgets.visibleByteLimit/mediawiki.widgets.visibleByteLimit.js
@@ -0,0 +1,21 @@
+/**
+ * Add a visible byte limit label to a TextInputWidget
+ *
+ * Uses jQuery.byteLimit to enforce the limit.
+
+ * @param {OO.ui.TextInputWidget} textInputWidget Text input widget
+ * @param {number} [limit] Byte limit, defaults to $input's maxlength
+ */
+mediaWiki.widgets.visibleByteLimit = function ( textInputWidget, limit ) {
+       limit = limit || +textInputWidget.$input.attr( 'maxlength' );
+
+       function updateCount() {
+               textInputWidget.setLabel( ( limit - $.byteLength( textInputWidget.getValue() ) ).toString() );
+       }
+       textInputWidget.on( 'change', updateCount );
+       // Initialise value
+       updateCount();
+
+       // Actually enforce limit
+       textInputWidget.$input.byteLimit( limit );
+};