Santhosh has uploaded a new change for review.
https://gerrit.wikimedia.org/r/259456
Change subject: Code cleanup for ext.cx.translationview module
......................................................................
Code cleanup for ext.cx.translationview module
* Remove the cx jquery plugin, and directly use translation view widget
* Rename the ContentTranslation class to ContentTranslationView
* ContentTranslationView widget's scoll handler is removed. They are
moved to header widget and tools column widget. The scroll handler
also simplified.
* Move the .stick-to-side LESS definition to ext.cx.common.less
because it applies to both the header and tools columns
Change-Id: I85190ab8835bb1c03dea652fc53e9a65ec066ad6
---
M extension.json
M modules/header/ext.cx.header.js
M modules/tools/ext.cx.tools.js
M modules/translationview/ext.cx.translationview.js
M modules/widgets/common/ext.cx.column.less
M modules/widgets/common/ext.cx.common.less
6 files changed, 61 insertions(+), 72 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation
refs/changes/56/259456/1
diff --git a/extension.json b/extension.json
index 823e6bd..2f58427 100644
--- a/extension.json
+++ b/extension.json
@@ -322,6 +322,7 @@
"header/styles/ext.cx.header.less"
],
"dependencies": [
+ "jquery.throttle-debounce",
"mediawiki.Uri",
"mediawiki.jqueryMsg",
"mediawiki.ui.button",
@@ -483,6 +484,7 @@
"ext.cx.tools.template",
"ext.cx.util.selection",
"ext.cx.widgets.spinner",
+ "jquery.throttle-debounce",
"jquery.uls.data",
"mediawiki.jqueryMsg"
]
diff --git a/modules/header/ext.cx.header.js b/modules/header/ext.cx.header.js
index a4525d9..489338d 100644
--- a/modules/header/ext.cx.header.js
+++ b/modules/header/ext.cx.header.js
@@ -170,6 +170,7 @@
mw.hook( 'mw.cx.draft.restore-failed' ).add( function () {
self.$draftStatus.text( mw.msg(
'cx-draft-restore-failed' ) );
} );
+ $( window ).scroll( $.throttle( 250, $.proxy( this.scroll, this
) ) );
};
ContentTranslationHeader.prototype.updateSaveStatus = function ( status
) {
@@ -253,6 +254,16 @@
.append( $headerTitle, $headerBar, this.$infoBar );
};
+ ContentTranslationHeader.prototype.scroll = function () {
+ var scrollTop = $( window ).scrollTop();
+
+ if ( scrollTop > 0 ) {
+ this.$container.addClass( 'sticky' );
+ } else {
+ this.$container.removeClass( 'sticky' );
+ }
+ };
+
/**
* CX Header plugin. Prepares the Special:CX header and interactions.
*
diff --git a/modules/tools/ext.cx.tools.js b/modules/tools/ext.cx.tools.js
index dbd4d78..ad1c030 100644
--- a/modules/tools/ext.cx.tools.js
+++ b/modules/tools/ext.cx.tools.js
@@ -98,6 +98,17 @@
ContentTranslationTools.prototype.listen = function () {
mw.hook( 'mw.cx.select.word' ).add( $.proxy( this.updateSearch,
this ) );
mw.hook( 'mw.cx.select.link' ).add( $.proxy( this.updateSearch,
this ) );
+ $( window ).scroll( $.throttle( 250, $.proxy( this.scroll, this
) ) );
+ };
+
+ ContentTranslationTools.prototype.scroll = function () {
+ var scrollTop = $( window ).scrollTop();
+
+ if ( scrollTop > 0 ) {
+ this.$container.addClass( 'sticky' );
+ } else {
+ this.$container.removeClass( 'sticky' );
+ }
};
$.fn.cxTools = function () {
diff --git a/modules/translationview/ext.cx.translationview.js
b/modules/translationview/ext.cx.translationview.js
index da0954a..4281aed 100644
--- a/modules/translationview/ext.cx.translationview.js
+++ b/modules/translationview/ext.cx.translationview.js
@@ -11,11 +11,11 @@
'use strict';
/**
- * ContentTranslation
+ * ContentTranslationView
*
* @class
*/
- function ContentTranslation( element, siteMapper, options ) {
+ function ContentTranslationView( element, siteMapper, options ) {
this.$container = $( element );
this.$translation = null;
@@ -23,22 +23,19 @@
this.$source = null;
this.$tools = null;
- this.options = $.extend( true, {}, $.fn.cx.defaults, options );
+ this.options = options;
this.siteMapper = siteMapper;
-
- this.init();
}
- ContentTranslation.prototype.init = function () {
+ ContentTranslationView.prototype.init = function () {
this.render();
this.initComponents();
- this.listen();
};
/**
* Initialize the components
*/
- ContentTranslation.prototype.initComponents = function () {
+ ContentTranslationView.prototype.initComponents = function () {
var cx = this,
modules;
this.$header.cxHeader( this.siteMapper );
@@ -63,7 +60,7 @@
}
};
- ContentTranslation.prototype.render = function () {
+ ContentTranslationView.prototype.render = function () {
var $content;
$content = $( '<div>' ).addClass( 'cx-widget' )
@@ -75,7 +72,7 @@
$( '<div>' ).addClass( 'cx-column
cx-column--translation' ),
$( '<div>' ).addClass( 'cx-column
cx-column--tools' )
)
- );
+ );
this.$container.append( $content );
this.$header = this.$container.find( '.cx-widget__header' );
@@ -84,45 +81,13 @@
this.$tools = this.$container.find( '.cx-column--tools' );
};
- ContentTranslation.prototype.listen = function () {
- $( window ).scroll( $.proxy( this.scroll, this ) );
- };
-
- ContentTranslation.prototype.scroll = function () {
- var scrollTop = $( window ).scrollTop(),
- // Use the top of source column as reference point
- offsetTop = this.$source.offset().top;
-
- if ( scrollTop > offsetTop ) {
- this.$header.addClass( 'sticky' );
- this.$tools.addClass( 'sticky' );
- } else if ( scrollTop <= offsetTop ) {
- this.$header.removeClass( 'sticky' );
- this.$tools.removeClass( 'sticky' );
- }
- };
-
- $.fn.cx = function ( siteMapper, options ) {
- return this.each( function () {
- var $this = $( this ),
- data = $this.data( 'cx' );
-
- if ( !data ) {
- $this.data( 'cx', ( data = new
ContentTranslation( this, siteMapper, options ) ) );
- }
-
- if ( typeof options === 'string' ) {
- data[ options ].call( $this );
- }
- } );
- };
-
- $.fn.cx.defaults = {};
-
- // Set the global siteMapper for code which we cannot inject it
- mw.cx.siteMapper = new mw.cx.SiteMapper( mw.config.get(
'wgContentTranslationSiteTemplates' ) );
-
$( function () {
- $( 'body' ).cx( mw.cx.siteMapper );
+ var cxview,
+ container = document.body;
+
+ // Set the global siteMapper for code which we cannot inject it
+ mw.cx.siteMapper = new mw.cx.SiteMapper( mw.config.get(
'wgContentTranslationSiteTemplates' ) );
+ cxview = new ContentTranslationView( container,
mw.cx.siteMapper );
+ cxview.init();
} );
}( jQuery, mediaWiki ) );
diff --git a/modules/widgets/common/ext.cx.column.less
b/modules/widgets/common/ext.cx.column.less
index b609bd7..9ef7552 100644
--- a/modules/widgets/common/ext.cx.column.less
+++ b/modules/widgets/common/ext.cx.column.less
@@ -59,26 +59,3 @@
margin-bottom: 10px;
word-wrap: break-word;
}
-
-.stick-to-side() {
- position: fixed;
- top: 0;
- right: 0;
-}
-
-.stick-to-bottom() {
- position: fixed;
- top: auto;
- bottom: 0;
- left: 0;
- box-shadow: 0 -3px 0 0 rgba(0, 0, 0, 0.05);
- max-height: 20%;
- min-height: 3em;
- overflow-x: hidden;
- overflow-y: auto;
- transition: max-height 0.25s;
-
- &:hover {
- max-height: 50%;
- }
-}
diff --git a/modules/widgets/common/ext.cx.common.less
b/modules/widgets/common/ext.cx.common.less
index 930ecdd..cfe73fb 100644
--- a/modules/widgets/common/ext.cx.common.less
+++ b/modules/widgets/common/ext.cx.common.less
@@ -13,3 +13,26 @@
padding-bottom: 50px;
font-size: medium;
}
+
+.stick-to-side() {
+ position: fixed;
+ top: 0;
+ right: 0;
+}
+
+.stick-to-bottom() {
+ position: fixed;
+ top: auto;
+ bottom: 0;
+ left: 0;
+ box-shadow: 0 -3px 0 0 rgba(0, 0, 0, 0.05);
+ max-height: 20%;
+ min-height: 3em;
+ overflow-x: hidden;
+ overflow-y: auto;
+ transition: max-height 0.25s;
+
+ &:hover {
+ max-height: 50%;
+ }
+}
--
To view, visit https://gerrit.wikimedia.org/r/259456
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I85190ab8835bb1c03dea652fc53e9a65ec066ad6
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/ContentTranslation
Gerrit-Branch: master
Gerrit-Owner: Santhosh <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
