Merge "mw.Upload.BookletLayout: Use notice instead of popup for help text"

diff --combined resources/src/mediawiki/mediawiki.ForeignStructuredUpload.BookletLayout.js
index daacb2a,5199f22..23e80b9
--- 1/resources/src/mediawiki/mediawiki.ForeignStructuredUpload.BookletLayout.js
--- 2/resources/src/mediawiki/mediawiki.ForeignStructuredUpload.BookletLayout.js
+++ b/resources/src/mediawiki/mediawiki.ForeignStructuredUpload.BookletLayout.js
@@@ -114,9 -114,7 +114,9 @@@
                );
                $ownWorkMessage.add( $notOwnWorkMessage ).find( 'a' ).attr( 'target', '_blank' );
  
 -              this.selectFileWidget = new OO.ui.SelectFileWidget();
 +              this.selectFileWidget = new OO.ui.SelectFileWidget( {
 +                      showDropTarget: true
 +              } );
                this.messageLabel = new OO.ui.LabelWidget( {
                        label: $notOwnWorkMessage
                } );
@@@ -127,7 -125,8 +127,7 @@@
                fieldset = new OO.ui.FieldsetLayout();
                fieldset.addItems( [
                        new OO.ui.FieldLayout( this.selectFileWidget, {
 -                              align: 'top',
 -                              label: mw.msg( 'upload-form-label-select-file' )
 +                              align: 'top'
                        } ),
                        new OO.ui.FieldLayout( this.ownWorkCheckbox, {
                                align: 'inline',
@@@ -158,8 -157,6 +158,8 @@@
                        layout.getDateFromExif( file ).done( function ( date ) {
                                layout.dateWidget.setValue( date );
                        } );
 +
 +                      layout.updateFilePreview();
                } );
  
                return this.uploadForm;
@@@ -181,9 -178,6 +181,9 @@@
        mw.ForeignStructuredUpload.BookletLayout.prototype.renderInfoForm = function () {
                var fieldset;
  
 +              this.filePreview = new OO.ui.Widget( {
 +                      classes: [ 'mw-upload-bookletLayout-filePreview' ]
 +              } );
                this.filenameWidget = new OO.ui.TextInputWidget( {
                        required: true,
                        validate: /.+/
@@@ -212,12 -206,14 +212,14 @@@
                        new OO.ui.FieldLayout( this.filenameWidget, {
                                label: mw.msg( 'upload-form-label-infoform-name' ),
                                align: 'top',
-                               help: mw.msg( 'upload-form-label-infoform-name-tooltip' )
+                               classes: [ 'mw-foreignStructuredUploa-bookletLayout-small-notice' ],
+                               notices: [ mw.msg( 'upload-form-label-infoform-name-tooltip' ) ]
                        } ),
                        new OO.ui.FieldLayout( this.descriptionWidget, {
                                label: mw.msg( 'upload-form-label-infoform-description' ),
                                align: 'top',
-                               help: mw.msg( 'upload-form-label-infoform-description-tooltip' )
+                               classes: [ 'mw-foreignStructuredUploa-bookletLayout-small-notice' ],
+                               notices: [ mw.msg( 'upload-form-label-infoform-description-tooltip' ) ]
                        } ),
                        new OO.ui.FieldLayout( this.categoriesWidget, {
                                label: mw.msg( 'foreign-structured-upload-form-label-infoform-categories' ),
@@@ -228,10 -224,7 +230,10 @@@
                                align: 'top'
                        } )
                ] );
 -              this.infoForm = new OO.ui.FormLayout( { items: [ fieldset ] } );
 +              this.infoForm = new OO.ui.FormLayout( {
 +                      classes: [ 'mw-upload-bookletLayout-infoForm' ],
 +                      items: [ this.filePreview, fieldset ]
 +              } );
  
                // Validation
                this.filenameWidget.on( 'change', this.onInfoFormChange.bind( this ) );