jenkins-bot has submitted this change and it was merged. Change subject: Fix UploadTutorial ......................................................................
Fix UploadTutorial Unbreak the rendering of the finished button/icon http://localhost:8080/wiki/Albert_Einstein#/upload-tutorial/foo Change-Id: Ibeb904fc83470de7da31b7573b9c5cbec4d68361 --- M javascripts/modules/uploads/UploadTutorial.js M less/modules/tutorials.less M less/modules/uploads/UploadTutorial.less M templates/modules/uploads/UploadTutorial.hogan 4 files changed, 43 insertions(+), 30 deletions(-) Approvals: Jhernandez: Looks good to me, approved jenkins-bot: Verified diff --git a/javascripts/modules/uploads/UploadTutorial.js b/javascripts/modules/uploads/UploadTutorial.js index 1017b08..02b15a1 100644 --- a/javascripts/modules/uploads/UploadTutorial.js +++ b/javascripts/modules/uploads/UploadTutorial.js @@ -1,4 +1,4 @@ -( function ( M, $ ) { +( function ( M ) { var context = M.require( 'context' ), Overlay = M.require( 'Overlay' ), @@ -39,12 +39,10 @@ */ defaults: { slideLeftButton: new Icon( { - name: 'previous', - additionalClassNames: 'slider-button prev' + name: 'previous' } ).toHtmlString(), slideRightButton: new Icon( { - name: 'next', - additionalClassNames: 'slider-button next' + name: 'next' } ).toHtmlString(), inBeta: context.isBetaGroupMember(), pages: [ @@ -65,10 +63,11 @@ /** @inheritdoc */ postRender: function ( options ) { - var $button = this.$( '.button' ); + var $button = this.$( '.button' ), + photoUploaderButton; if ( options.funnel ) { - new LeadPhotoUploaderButton( { + photoUploaderButton = new LeadPhotoUploaderButton( { el: $button, buttonCaption: buttonMsg, funnel: options.funnel @@ -97,9 +96,10 @@ * @method */ onClickUploadButton: function () { - // need timeout for the file dialog to open - setTimeout( $.proxy( this, 'hide' ), 0 ); - setTimeout( $.proxy( this, 'emit', 'hide' ), 0 ); + this.emit( 'hide' ); + // FIXME: this is a hack. Not sure why this is needed but without it + // when escaping the upload interface you will still see it. + this.$el.hide(); }, /** @@ -123,4 +123,4 @@ M.define( 'modules/uploads/UploadTutorial', UploadTutorial ); -}( mw.mobileFrontend, jQuery ) ); +}( mw.mobileFrontend ) ); diff --git a/less/modules/tutorials.less b/less/modules/tutorials.less index 19003e4..db72028 100644 --- a/less/modules/tutorials.less +++ b/less/modules/tutorials.less @@ -1,6 +1,20 @@ @import "minerva.variables"; @import "minerva.mixins"; +.stable { + .content-overlay { + + .button { + // FIXME: without this the cloaked input seems to interfere making cancel button start upload + position: relative; + // use background to override gradient in other buttons + background: #fff; + color: @colorTutorial; + padding: 12px; + font-weight: bold; + } + } +} .content-overlay { position: absolute; @@ -17,16 +31,6 @@ p { line-height: 1.4; margin: 0 0 1em; - } - - .button { - // FIXME: without this the cloaked input seems to interfere making cancel button start upload - position: relative; - // use background to override gradient in other buttons - background: #fff; - color: @colorTutorial; - padding: 12px; - font-weight: bold; } .cancel.inline { diff --git a/less/modules/uploads/UploadTutorial.less b/less/modules/uploads/UploadTutorial.less index fd04ba5..ec05e1d 100644 --- a/less/modules/uploads/UploadTutorial.less +++ b/less/modules/uploads/UploadTutorial.less @@ -12,25 +12,30 @@ bottom: 0; z-index: @z-indexOverlay; - &:before { - top: 0; - } - &.prev { left: 0; // FIXME: Remove when mw-ui-icon in stable - &.icon { + .icon { .background-image('../images/uploads/chevronLeft.png'); + right: 0; } } &.next { right: 0; // FIXME: Remove when mw-ui-icon in stable - &.icon { + .icon { .background-image('../images/uploads/chevronRight.png'); + right: @buttonWidth - 32px; } } + + // vertically align icon. + > * { + position: absolute; + top: 50%; + margin-top: -50% + } } .slide { diff --git a/templates/modules/uploads/UploadTutorial.hogan b/templates/modules/uploads/UploadTutorial.hogan index f92578a..dcb8d63 100644 --- a/templates/modules/uploads/UploadTutorial.hogan +++ b/templates/modules/uploads/UploadTutorial.hogan @@ -1,4 +1,6 @@ -{{{slideLeftButton}}} +<div class="prev slider-button"> + {{{slideLeftButton}}} +</div> <ul> {{#pages}} <li class="slide slide-image"> @@ -6,13 +8,15 @@ <p>{{text}}</p> {{#button}} {{#funnel}} - <div class="button"></div> + <div class="mw-ui-button button"></div> {{/funnel}} {{^funnel}} - <button class="cancel button">{{button}}</button> + <button class="cancel button mw-ui-button">{{button}}</button> {{/funnel}} {{/button}} </li> {{/pages}} </ul> +<div class="next slider-button"> {{{slideRightButton}}} +</div> -- To view, visit https://gerrit.wikimedia.org/r/185850 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: Ibeb904fc83470de7da31b7573b9c5cbec4d68361 Gerrit-PatchSet: 10 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Jdlrobson <jrob...@wikimedia.org> Gerrit-Reviewer: Bmansurov <bmansu...@wikimedia.org> Gerrit-Reviewer: Jdlrobson <jrob...@wikimedia.org> Gerrit-Reviewer: Jhernandez <jhernan...@wikimedia.org> Gerrit-Reviewer: Phuedx <g...@samsmith.io> Gerrit-Reviewer: jenkins-bot <> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits