jenkins-bot has submitted this change and it was merged.
Change subject: Fix growTextArea ONCE AND FOR ALL
......................................................................
Fix growTextArea ONCE AND FOR ALL
This is stolen from OOJS-UI, so ty VE team.
Should fix the IE issue linked below. (at least, it did for me!)
Bug: 73210
Change-Id: Ibbaad1870da1cf8d9bf0ca828d7cf27c186bcb89
---
M resources/mw.UploadWizard.js
M resources/mw.UploadWizardDetails.js
M resources/uploadWizard.css
3 files changed, 44 insertions(+), 23 deletions(-)
Approvals:
Gilles: Looks good to me, approved
jenkins-bot: Verified
diff --git a/resources/mw.UploadWizard.js b/resources/mw.UploadWizard.js
index af41349..d41c57e 100644
--- a/resources/mw.UploadWizard.js
+++ b/resources/mw.UploadWizard.js
@@ -1131,33 +1131,46 @@
/**
* jQuery extension. Makes a textarea automatically grow if you enter
overflow
- * (This feature was in the old Commons interface with a confusing
arrow icon; it's nicer to make it automatic.)
+ * Stolen implementation from OOJS-UI. Thanks guys.
+ *
+ * @TODO Just use OOJS-UI for this instead of copying their code.
*/
jQuery.fn.growTextArea = function () {
+ function resizeIfNeeded() {
+ // Begin stolen code from OOJS-UI's
TextInputWidget.prototype.adjustSize
+ var $clone, scrollHeight, innerHeight, outerHeight,
maxInnerHeight, measurementError, idealHeight,
+ $this = $( this );
- // this is a jquery-style object
+ $clone = $this.clone()
+ .val( $this.val() )
+ // Set inline height property to 0 to measure
scroll height
+ .css( { height: 0 } )
+ .insertAfter( $this );
- // in MSIE, this makes it possible to know what scrollheight is
- // Technically this means text could now dangle over the edge,
- // but it shouldn't because it will always grow to accomodate
very quickly.
-
- if ( $.msie ) {
- this.each( function (i, textArea) {
- textArea.style.overflow = 'visible';
- } );
+ scrollHeight = $clone[0].scrollHeight;
+ // Remove inline height property to measure natural
heights
+ $clone.css( 'height', '' );
+ innerHeight = $clone.innerHeight();
+ outerHeight = $clone.outerHeight();
+ // Measure max rows height
+ $clone.attr( 'rows', 20 ).css( 'height', 'auto' ).val(
'' );
+ maxInnerHeight = $clone.innerHeight();
+ // Difference between reported innerHeight and
scrollHeight with no scrollbars present
+ // Equals 1 on Blink-based browsers and 0 everywhere
else
+ measurementError = maxInnerHeight -
$clone[0].scrollHeight;
+ $clone.remove();
+ idealHeight = Math.min( maxInnerHeight, scrollHeight +
measurementError );
+ // Only apply inline height when expansion beyond
natural height is needed
+ if ( idealHeight > innerHeight ) {
+ // Use the difference between the inner and
outer height as a buffer
+ $this.css( 'height', idealHeight + (
outerHeight - innerHeight ) );
+ } else {
+ $this.css( 'height', '' );
+ }
+ // End stolen code from OOJS-UI's
TextInputWidget.prototype.adjustSize
}
- var resizeIfNeeded = function () {
- // this is the dom element
- // is there a better way to do this?
- if ( this.scrollHeight >= this.offsetHeight &&
!this.style.height ) {
- this.rows++;
- while ( this.scrollHeight > this.offsetHeight )
{
- this.rows++;
- }
- }
- };
-
+ // this is a jquery-style object
this.addClass( 'mwe-grow-textarea' );
this.bind( 'resizeEvent', resizeIfNeeded );
diff --git a/resources/mw.UploadWizardDetails.js
b/resources/mw.UploadWizardDetails.js
index 7cee7a1..e09fe82 100644
--- a/resources/mw.UploadWizardDetails.js
+++ b/resources/mw.UploadWizardDetails.js
@@ -165,8 +165,12 @@
moreDetailsDiv = $('<div class="mwe-more-details"></div>');
otherInformationId = 'otherInformation' + this.upload.index;
- this.otherInformationInput = $( '<textarea id="' +
otherInformationId + '" name="' + otherInformationId + '"
class="mwe-upwiz-other-textarea"></textarea>' )
- .growTextArea();
+ this.otherInformationInput = $( '<textarea id="' +
otherInformationId + '" name="' + otherInformationId + '"
class="mwe-upwiz-other-textarea" rows="2" cols="36"></textarea>' )
+ .growTextArea()
+ .on( 'keyup', function ( e ) {
+ e.stopPropagation();
+ return false;
+ } );
otherInformationDiv = $('<div>')
.append( $( '<div
class="mwe-upwiz-details-more-label"></div>' ).text( mw.message(
'mwe-upwiz-other' ).text() ).addHint( 'other' ) )
diff --git a/resources/uploadWizard.css b/resources/uploadWizard.css
index 8e0ca6f..803cc85 100644
--- a/resources/uploadWizard.css
+++ b/resources/uploadWizard.css
@@ -832,3 +832,7 @@
.mwe-upwiz-lightbox-link a {
cursor: pointer;
}
+
+.mwe-upwiz-other-textarea {
+ width: 31.5em;
+}
--
To view, visit https://gerrit.wikimedia.org/r/172887
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ibbaad1870da1cf8d9bf0ca828d7cf27c186bcb89
Gerrit-PatchSet: 2
Gerrit-Project: mediawiki/extensions/UploadWizard
Gerrit-Branch: master
Gerrit-Owner: MarkTraceur <[email protected]>
Gerrit-Reviewer: Gilles <[email protected]>
Gerrit-Reviewer: MarkTraceur <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
