Jdlrobson has uploaded a new change for review.
https://gerrit.wikimedia.org/r/66887
Change subject: Code cleanup: Separate Overlay, Drawer and CtaDrawer from
mf-navigation.js
......................................................................
Code cleanup: Separate Overlay, Drawer and CtaDrawer from mf-navigation.js
Change-Id: If1b52a918d3cb457a4d30bd68c2343c0ffc26461
---
M includes/Resources.php
A javascripts/common/CtaDrawer.js
A javascripts/common/Drawer.js
A javascripts/common/Overlay.js
M javascripts/common/mf-navigation.js
M javascripts/modules/editor/EditorOverlay.js
M javascripts/modules/mf-cleanuptemplates.js
M javascripts/modules/mf-languages.js
M javascripts/modules/mf-photo.js
M javascripts/modules/mf-tables.js
M javascripts/modules/mf-watchstar.js
M javascripts/modules/search-2.js
M javascripts/modules/talk.js
M javascripts/specials/overlays/preview.js
M tests/javascripts/common/test_mf-navigation.js
15 files changed, 140 insertions(+), 121 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/87/66887/1
diff --git a/includes/Resources.php b/includes/Resources.php
index 4c2c723..0f694cc 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -353,6 +353,9 @@
'javascripts/common/mf-oop.js',
'javascripts/common/mf-api.js',
'javascripts/common/mf-view.js',
+ 'javascripts/common/Drawer.js',
+ 'javascripts/common/CtaDrawer.js',
+ 'javascripts/common/Overlay.js',
'javascripts/widgets/progress-bar.js',
'javascripts/common/mf-navigation.js',
'javascripts/common/mf-notification.js',
diff --git a/javascripts/common/CtaDrawer.js b/javascripts/common/CtaDrawer.js
new file mode 100644
index 0000000..de6b8c0
--- /dev/null
+++ b/javascripts/common/CtaDrawer.js
@@ -0,0 +1,24 @@
+( function( M, $ ) {
+var Drawer = M.require( 'Drawer' ),
+ CtaDrawer = Drawer.extend( {
+ defaults: {
+ loginCaption: mw.msg(
'mobile-frontend-watchlist-cta-button-login' ),
+ signupCaption: mw.msg(
'mobile-frontend-watchlist-cta-button-signup' ),
+ cancelMessage: mw.msg( 'mobile-frontend-drawer-cancel' )
+ },
+ template: M.template.get( 'ctaDrawer' ),
+
+ preRender: function( options ) {
+ var params = {
+ returnto: mw.config.get( 'wgTitle' ),
+ returntoquery: options.returnToQuery
+ };
+
+ options.loginUrl = M.history.getArticleUrl(
'Special:UserLogin', params );
+ options.signupUrl = M.history.getArticleUrl(
'Special:UserLogin', $.extend( params, { type: 'signup' } ) );
+ }
+ } );
+
+M.define( 'CtaDrawer', CtaDrawer );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/javascripts/common/Drawer.js b/javascripts/common/Drawer.js
new file mode 100644
index 0000000..4501f8b
--- /dev/null
+++ b/javascripts/common/Drawer.js
@@ -0,0 +1,37 @@
+( function( M, $ ) {
+
+var View = M.require( 'view' ),
+ Drawer = View.extend( {
+ defaults: {
+ cancelMessage: M.message(
'mobile-frontend-drawer-cancel' )
+ },
+ className: 'drawer position-fixed',
+
+ initialize: function() {
+ var self = this;
+ this.$( '.close' ).click( function( ev ) {
+ ev.preventDefault();
+ self.hide();
+ } );
+ $( window ).on( 'scroll click', function() {
+ self.hide();
+ } );
+ this.appendTo( '#mw-mf-page-center' );
+ },
+
+ show: function() {
+ this.$el.addClass( 'visible' );
+ },
+
+ hide: function() {
+ this.$el.removeClass( 'visible' );
+ },
+
+ isVisible: function() {
+ return this.$el.hasClass( 'visible' );
+ }
+ } );
+
+M.define( 'Drawer', Drawer );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/javascripts/common/Overlay.js b/javascripts/common/Overlay.js
new file mode 100644
index 0000000..cf648f8
--- /dev/null
+++ b/javascripts/common/Overlay.js
@@ -0,0 +1,47 @@
+( function( M, $ ) {
+
+var View = M.require( 'view' ),
+ Overlay = View.extend( {
+ defaults: {
+ heading: '',
+ content: '',
+ closeMsg: mw.msg( 'mobile-frontend-overlay-escape' )
+ },
+ template: M.template.get( 'overlay' ),
+ className: 'mw-mf-overlay',
+ initialize: function( options ) {
+ var self = this;
+ this.parent = options.parent;
+ this.isOpened = false;
+ this.$( '.cancel,.confirm' ).click( function( ev ) {
+ ev.preventDefault();
+ self.hide();
+ } );
+ },
+ show: function() {
+ if ( this.parent ) {
+ this.parent.hide();
+ }
+ this.$el.appendTo( 'body' );
+ this.scrollTop = document.body.scrollTop;
+ $( 'html' ).addClass( 'overlay' );
+ $( 'body' ).removeClass( 'navigation-enabled' );
+
+ // skip the URL bar if possible
+ window.scrollTo( 0, 1 );
+ },
+ hide: function() {
+ this.$el.detach();
+ if ( !this.parent ) {
+ $( 'html' ).removeClass( 'overlay' );
+ // return to last known scroll position
+ window.scrollTo( document.body.scrollLeft,
this.scrollTop );
+ } else {
+ this.parent.show();
+ }
+ }
+ } );
+
+M.define( 'Overlay', Overlay );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/javascripts/common/mf-navigation.js
b/javascripts/common/mf-navigation.js
index e2373de..ffaf7fe 100644
--- a/javascripts/common/mf-navigation.js
+++ b/javascripts/common/mf-navigation.js
@@ -1,103 +1,10 @@
(function( M ) {
var m = ( function( $ ) {
- var View = M.require( 'view' ),
+ var
menu,
mfePrefix = M.prefix,
- inBeta = mw.config.get( 'wgMFMode' ) === 'beta',
- Overlay,
- Drawer, CtaDrawer;
-
- Drawer = View.extend( {
- defaults: {
- cancelMessage: M.message(
'mobile-frontend-drawer-cancel' )
- },
- className: 'drawer position-fixed',
-
- initialize: function() {
- var self = this;
- this.$( '.close' ).click( function( ev ) {
- ev.preventDefault();
- self.hide();
- } );
- $( window ).on( 'scroll click', function() {
- self.hide();
- } );
- this.appendTo( '#mw-mf-page-center' );
- },
-
- show: function() {
- this.$el.addClass( 'visible' );
- },
-
- hide: function() {
- this.$el.removeClass( 'visible' );
- },
-
- isVisible: function() {
- return this.$el.hasClass( 'visible' );
- }
- } );
-
- CtaDrawer = Drawer.extend( {
- defaults: {
- loginCaption: mw.msg(
'mobile-frontend-watchlist-cta-button-login' ),
- signupCaption: mw.msg(
'mobile-frontend-watchlist-cta-button-signup' ),
- cancelMessage: mw.msg( 'mobile-frontend-drawer-cancel' )
- },
- template: M.template.get( 'ctaDrawer' ),
-
- preRender: function( options ) {
- var params = {
- returnto: mw.config.get( 'wgTitle' ),
- returntoquery: options.returnToQuery
- };
-
- options.loginUrl = M.history.getArticleUrl(
'Special:UserLogin', params );
- options.signupUrl = M.history.getArticleUrl(
'Special:UserLogin', $.extend( params, { type: 'signup' } ) );
- }
- } );
-
- Overlay = View.extend( {
- defaults: {
- heading: '',
- content: '',
- closeMsg: mw.msg( 'mobile-frontend-overlay-escape' )
- },
- template: M.template.get( 'overlay' ),
- className: 'mw-mf-overlay',
- initialize: function( options ) {
- var self = this;
- this.parent = options.parent;
- this.isOpened = false;
- this.$( '.cancel,.confirm' ).click( function( ev ) {
- ev.preventDefault();
- self.hide();
- } );
- },
- show: function() {
- if ( this.parent ) {
- this.parent.hide();
- }
- this.$el.appendTo( 'body' );
- this.scrollTop = document.body.scrollTop;
- $( 'html' ).addClass( 'overlay' );
- $( 'body' ).removeClass( 'navigation-enabled' );
-
- // skip the URL bar if possible
- window.scrollTo( 0, 1 );
- },
- hide: function() {
- this.$el.detach();
- if ( !this.parent ) {
- $( 'html' ).removeClass( 'overlay' );
- // return to last known scroll position
- window.scrollTo( document.body.scrollLeft,
this.scrollTop );
- } else {
- this.parent.show();
- }
- }
- } );
+ inBeta = mw.config.get( 'wgMFMode' ) === 'beta';
function getPageMenu() {
return $( '#mw-mf-menu-page' );
@@ -165,8 +72,6 @@
};
return {
- CtaDrawer: CtaDrawer,
- Overlay: Overlay,
getPageMenu: getPageMenu,
getMenu: menu
};
diff --git a/javascripts/modules/editor/EditorOverlay.js
b/javascripts/modules/editor/EditorOverlay.js
index 936679b..f2f7e19 100644
--- a/javascripts/modules/editor/EditorOverlay.js
+++ b/javascripts/modules/editor/EditorOverlay.js
@@ -1,6 +1,6 @@
( function( M, $ ) {
- var Overlay = M.require( 'navigation' ).Overlay,
+ var Overlay = M.require( 'Overlay' ),
popup = M.require( 'notifications' ),
EditorApi = M.require( 'modules/editor/EditorApi' ),
EditorOverlay;
diff --git a/javascripts/modules/mf-cleanuptemplates.js
b/javascripts/modules/mf-cleanuptemplates.js
index 54379a7..3375651 100644
--- a/javascripts/modules/mf-cleanuptemplates.js
+++ b/javascripts/modules/mf-cleanuptemplates.js
@@ -1,8 +1,8 @@
( function( M, $ ) {
var module = (function() {
- var nav = M.require( 'navigation' ),
- Overlay = nav.Overlay,
+ var
+ Overlay = M.require( 'Overlay' ),
CleanupOverlay = Overlay.extend( {
template: M.template.get( 'overlays/cleanup' )
} );
diff --git a/javascripts/modules/mf-languages.js
b/javascripts/modules/mf-languages.js
index 4ef5234..def38b7 100644
--- a/javascripts/modules/mf-languages.js
+++ b/javascripts/modules/mf-languages.js
@@ -1,6 +1,6 @@
( function( M, $ ) {
- var Overlay = M.require( 'navigation' ).Overlay,
+ var Overlay = M.require( 'Overlay' ),
LanguageOverlay;
function countAvailableLanguages() {
diff --git a/javascripts/modules/mf-photo.js b/javascripts/modules/mf-photo.js
index 796a338..def52c6 100644
--- a/javascripts/modules/mf-photo.js
+++ b/javascripts/modules/mf-photo.js
@@ -2,10 +2,10 @@
var View = M.require( 'view' ),
Api = M.require( 'api' ).Api,
+ CtaDrawer = M.require( 'CtaDrawer' ),
EventEmitter = M.require( 'eventemitter' ),
ProgressBar = M.require( 'widgets/progress-bar' ),
- nav = M.require( 'navigation' ),
- Overlay = nav.Overlay,
+ Overlay = M.require( 'Overlay' ),
ownershipMessage = mw.msg( 'mobile-frontend-photo-ownership',
mw.config.get( 'wgUserName' ), mw.user ),
popup = M.require( 'notifications' ),
endpoint = mw.config.get( 'wgMFPhotoUploadEndpoint' ),
@@ -487,7 +487,7 @@
// show CTA instead if not logged in
if ( !M.isLoggedIn() ) {
- ctaDrawer = new nav.CtaDrawer( {
+ ctaDrawer = new CtaDrawer( {
content: mw.msg(
'mobile-frontend-photo-upload-cta' ),
returnToQuery:
'article_action=photo-upload'
} );
diff --git a/javascripts/modules/mf-tables.js b/javascripts/modules/mf-tables.js
index ee202a9..f31b59d 100644
--- a/javascripts/modules/mf-tables.js
+++ b/javascripts/modules/mf-tables.js
@@ -1,4 +1,5 @@
( function( M, $ ) {
+var Overlay = M.require( 'Overlay' );
( function() {
var STEP_SIZE = 150;
@@ -8,7 +9,7 @@
}
function collapseTables( $container ) {
- var nav = M.require( 'navigation' ),
+ var
$tables = $container ? $container.find( 'table' ) : $(
'table' );
$tables.each( function( i ) {
@@ -33,7 +34,7 @@
$tr = $( '<tr class="overlayZoomer">'
).prependTo( $tc );
$( '<td>' ).attr( 'colspan', colspan
).click( function() {
- var overlay = new nav.Overlay( {
+ var overlay = new Overlay( {
heading: '<h2>' + $(
this ).text() + '</h2>',
content: $(
'<div>').append( $container ).html()
} );
diff --git a/javascripts/modules/mf-watchstar.js
b/javascripts/modules/mf-watchstar.js
index 521ea7e..9e931e5 100644
--- a/javascripts/modules/mf-watchstar.js
+++ b/javascripts/modules/mf-watchstar.js
@@ -1,8 +1,9 @@
(function( M, $ ) {
var api = M.require( 'api' ), w = ( function() {
- var nav = M.require( 'navigation' ), popup = M.require( 'notifications'
),
- drawer = new nav.CtaDrawer( {
+ var popup = M.require( 'notifications' ),
+ CtaDrawer = M.require( 'CtaDrawer' ),
+ drawer = new CtaDrawer( {
content: mw.msg( 'mobile-frontend-watchlist-cta' ),
returnToQuery: 'article_action=watch'
} );
diff --git a/javascripts/modules/search-2.js b/javascripts/modules/search-2.js
index bf32c98..9a4e55e 100644
--- a/javascripts/modules/search-2.js
+++ b/javascripts/modules/search-2.js
@@ -1,6 +1,6 @@
( function( M, $ ) {
-var Overlay = M.require( 'navigation' ).Overlay, SearchOverlay,
+var Overlay = M.require( 'Overlay' ), SearchOverlay,
api = M.require( 'api' ),
searchOverlay,
overlayInitialize = Overlay.prototype.initialize;
diff --git a/javascripts/modules/talk.js b/javascripts/modules/talk.js
index 37c6667..4ab89f5 100644
--- a/javascripts/modules/talk.js
+++ b/javascripts/modules/talk.js
@@ -1,9 +1,10 @@
( function( M, $ ) {
- var nav = M.require( 'navigation' ),
+ var
+ Overlay = M.require( 'Overlay' ),
api = M.require( 'api' ),
leadHeading = mw.msg(
'mobile-frontend-talk-overlay-lead-header' ),
- TalkSectionAddOverlay = nav.Overlay.extend( {
+ TalkSectionAddOverlay = Overlay.extend( {
defaults: {
cancelMsg: mw.msg(
'mobile-frontend-editor-cancel' ),
confirmMsg: mw.msg(
'mobile-frontend-editor-confirm' ),
@@ -56,7 +57,7 @@
}
}
} ),
- TalkOverlay = nav.Overlay.extend( {
+ TalkOverlay = Overlay.extend( {
template: M.template.get( 'overlays/talk' ),
appendSection: function( heading, text ) {
var $newTopic;
@@ -85,7 +86,7 @@
heading: leadHeading
},
section = id === 0 ?
leadSection : page.getSubSection( id ),
- childOverlay = new nav.Overlay(
{
+ childOverlay = new Overlay( {
content:
M.template.get( 'talkSection' ).render( section ),
parent: self
} );
diff --git a/javascripts/specials/overlays/preview.js
b/javascripts/specials/overlays/preview.js
index bb6908a..3ea30ff 100644
--- a/javascripts/specials/overlays/preview.js
+++ b/javascripts/specials/overlays/preview.js
@@ -1,5 +1,5 @@
( function( M, $ ) {
- var Overlay = M.require( 'navigation' ).Overlay,
+ var Overlay = M.require( 'Overlay' ),
Page = M.require( 'page' ),
LoadingOverlay = Overlay.extend( {
defaults: {
diff --git a/tests/javascripts/common/test_mf-navigation.js
b/tests/javascripts/common/test_mf-navigation.js
index ecaf77d..2956b35 100644
--- a/tests/javascripts/common/test_mf-navigation.js
+++ b/tests/javascripts/common/test_mf-navigation.js
@@ -1,16 +1,16 @@
-( function( nav, $ ) {
+( function( Overlay, $ ) {
QUnit.module( 'MobileFrontend: mf-navigation.js' );
QUnit.test( 'Simple overlay', 1, function() {
- var overlay = new nav.Overlay( { heading: '<h2>Title</h2>', content:
'Text' } );
+ var overlay = new Overlay( { heading: '<h2>Title</h2>', content: 'Text'
} );
overlay.show();
strictEqual( overlay.$el[0].parentNode, document.body, 'In DOM' );
overlay.hide();
} );
QUnit.test( 'HTML overlay', 2, function() {
- var overlay = new nav.Overlay( {
+ var overlay = new Overlay( {
heading: '<div id="test">Awesome: <input></div>',
content: '<div class="content">YO</div>'
} );
@@ -19,15 +19,15 @@
} );
QUnit.test( 'Close overlay', 1, function() {
- var overlay = new nav.Overlay( { heading: '<h2>Title</h2>', content:
'Text' } );
+ var overlay = new Overlay( { heading: '<h2>Title</h2>', content: 'Text'
} );
overlay.show();
overlay.hide();
strictEqual( overlay.$el[0].parentNode, null, 'No longer in DOM' );
} );
QUnit.test( 'Stacked overlays', 6, function() {
- var overlay = new nav.Overlay( { heading: 'Overlay 1', content: 'Text'
} ),
- overlayTwo = new nav.Overlay( { heading: 'Overlay 2', content:
'Text <button class="cancel">cancel</button>',
+ var overlay = new Overlay( { heading: 'Overlay 1', content: 'Text' } ),
+ overlayTwo = new Overlay( { heading: 'Overlay 2', content:
'Text <button class="cancel">cancel</button>',
parent: overlay } );
overlay.show();
overlayTwo.show();
@@ -46,4 +46,4 @@
} );
-} )( mw.mobileFrontend.require( 'navigation' ), jQuery );
+} )( mw.mobileFrontend.require( 'Overlay' ), jQuery );
--
To view, visit https://gerrit.wikimedia.org/r/66887
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: If1b52a918d3cb457a4d30bd68c2343c0ffc26461
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
