Santhosh has uploaded a new change for review. https://gerrit.wikimedia.org/r/124579
Change subject: Move the progress bar to tools column ...................................................................... Move the progress bar to tools column Match the style as per https://commons.wikimedia.org/w/index.php?title=File:Content-translation-designs.pdf&page=6 Change-Id: I0ddab8db7bdc410708d8320af12e936dd03b65a7 --- M Resources.php M modules/header/styles/ext.cx.header.less M modules/tools/ext.cx.progressbar.js M modules/tools/ext.cx.tools.js M modules/tools/styles/ext.cx.progressbar.less 5 files changed, 22 insertions(+), 31 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation refs/changes/79/124579/1 diff --git a/Resources.php b/Resources.php index c0dbd22..3f531ce 100644 --- a/Resources.php +++ b/Resources.php @@ -47,7 +47,6 @@ ), 'dependencies' => array( 'mediawiki.jqueryMsg', - 'ext.cx.progressbar', 'ext.cx.publish', ), 'messages' => array( @@ -105,14 +104,15 @@ 'cx-tools-view-guidelines', ), 'dependencies' => array( + 'ext.cx.progressbar', 'mediawiki.jqueryMsg', ), ) + $resourcePaths; $wgResourceModules['ext.cx.progressbar'] = array( - 'scripts' => 'header/ext.cx.progressbar.js', + 'scripts' => 'tools/ext.cx.progressbar.js', 'styles' => array( - 'header/styles/ext.cx.progressbar.less', + 'tools/styles/ext.cx.progressbar.less', ), 'messages' => array( 'cx-header-progressbar-text' diff --git a/modules/header/styles/ext.cx.header.less b/modules/header/styles/ext.cx.header.less index b475fcd..7d9857e 100644 --- a/modules/header/styles/ext.cx.header.less +++ b/modules/header/styles/ext.cx.header.less @@ -39,11 +39,6 @@ } } -.cx-header__progressbar { - .mw-ui-item; - .mw-ui-one-sixth; -} - .cx-header__publish { .mw-ui-item; .mw-ui-one-eighth; diff --git a/modules/tools/ext.cx.progressbar.js b/modules/tools/ext.cx.progressbar.js index 71c315a..1a3b78b 100644 --- a/modules/tools/ext.cx.progressbar.js +++ b/modules/tools/ext.cx.progressbar.js @@ -34,13 +34,10 @@ .addClass( 'cx-progressbar' ) .append( $( '<span>' ).addClass( 'cx-progressbar__bar' ) - ), - $( '<span>' ).addClass( 'cx-progressbar__text' ) + ) ); this.$bar = this.$container.find( '.cx-progressbar__bar' ); - this.$text = this.$container.find( '.cx-progressbar__text' ); - this.update( 0 ); }; @@ -51,7 +48,7 @@ ProgressBar.prototype.update = function ( percentage ) { this.status = percentage; this.$bar.css( 'width', this.status + '%' ); - this.$text.text( mw.msg( 'cx-header-progressbar-text', + this.$container.attr( 'title', mw.msg( 'cx-header-progressbar-text', mw.language.convertNumber( percentage ) ) ); }; diff --git a/modules/tools/ext.cx.tools.js b/modules/tools/ext.cx.tools.js index 5b240fe..50e7e57 100644 --- a/modules/tools/ext.cx.tools.js +++ b/modules/tools/ext.cx.tools.js @@ -24,9 +24,16 @@ } ContentTranslationTools.prototype.init = function () { - this.helpMessage(); + this.render(); }; + ContentTranslationTools.prototype.render = function () { + var $progressBar = $( '<div>' ) + .addClass( 'cx-header__progressbar' ) + .cxProgressBar(); + this.$container.append( $progressBar ); + this.helpMessage(); + }; ContentTranslationTools.prototype.listen = function () { $( window ).scroll( $.proxy( this.scroll, this ) ); }; diff --git a/modules/tools/styles/ext.cx.progressbar.less b/modules/tools/styles/ext.cx.progressbar.less index f77ff32..86d2eff 100644 --- a/modules/tools/styles/ext.cx.progressbar.less +++ b/modules/tools/styles/ext.cx.progressbar.less @@ -1,31 +1,23 @@ @import "../../base/styles/grid/agora-grid"; +.cx-header__progressbar { + .mw-ui-one-whole; +} + .cx-progressbar { .mw-ui-item; - .mw-ui-one-sixth; - height: 10px; - border-radius: 10px; + .mw-ui-one-whole; + height: 5px; border: 1px solid #ddd; background: #fbfbfb; vertical-align: middle; - position: absolute; + padding: 0; } .cx-progressbar__bar { background: #3892E3; - display: inline-block; - height: 10px; - border-radius: 10px; - position: absolute; + display: block; + height: 5px; left: 0; transition: width 1s; -} - -.cx-progressbar__text { - .mw-ui-item; - .mw-ui-one-whole; - font-size: 0.8em; - color: #999; - text-align: right; - padding-top: 10px; } -- To view, visit https://gerrit.wikimedia.org/r/124579 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I0ddab8db7bdc410708d8320af12e936dd03b65a7 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/ContentTranslation Gerrit-Branch: master Gerrit-Owner: Santhosh <santhosh.thottin...@gmail.com> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits