JGonera has uploaded a new change for review.
https://gerrit.wikimedia.org/r/83958
Change subject: Load talk overlay dynamically
......................................................................
Load talk overlay dynamically
Only when talk icon is clicked.
Initial page load (beta, desktop Chrome) before: 339KB, after: 332KB.
Change-Id: I4aa7976e88dbb214e37c7c6aae082a82623d3a3d
---
M includes/Resources.php
R javascripts/modules/talk/TalkOverlay.js
A javascripts/modules/talk/talk.js
3 files changed, 83 insertions(+), 56 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/58/83958/1
diff --git a/includes/Resources.php b/includes/Resources.php
index fbd1bfc..18bec83 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -263,10 +263,6 @@
'templates' => array(
// notifications.js
'overlays/notifications',
- // talk.js
- 'overlays/talk',
- 'overlays/talkSectionAdd',
- 'talkSection',
// page.js
'pageActionTutorial',
),
@@ -301,8 +297,7 @@
'scripts' => array(
'javascripts/modules/mf-toggle-dynamic.js',
'javascripts/modules/notifications.js',
- 'javascripts/modules/talk/TalkSectionOverlay.js',
- 'javascripts/modules/talk.js',
+ 'javascripts/modules/talk/talk.js',
'javascripts/modules/search/pageImages.js',
'javascripts/modules/languages/preferred.js',
'javascripts/modules/tutorials/PageActionOverlay.js',
@@ -321,10 +316,39 @@
'mobile-frontend-editor-tutorial-confirm',
// for talk.js
+ 'mobile-frontend-talk-overlay-header',
+
+ // notifications.js (defined in Echo)
+ 'echo-none',
+ 'notifications',
+ ),
+ ),
+
+ 'mobile.dynamic.talk' => $wgMFMobileResourceBoilerplate + array(
+ 'dependencies' => array(
+ 'mobile.beta',
+ 'mobile.dynamic.talk.plumbing',
+ ),
+ 'scripts' => array(
+ 'javascripts/modules/talk/TalkSectionOverlay.js',
+ 'javascripts/modules/talk/TalkOverlay.js',
+ ),
+ ),
+
+ 'mobile.dynamic.talk.plumbing' => array(
+ 'class' => 'MFResourceLoaderModule',
+ 'localBasePath' => $localBasePath,
+ 'localTemplateBasePath' => $localBasePath . '/templates',
+ 'templates' => array(
+ // talk.js
+ 'overlays/talk',
+ 'overlays/talkSectionAdd',
+ 'talkSection',
+ ),
+ 'messages' => array(
'mobile-frontend-talk-explained',
'mobile-frontend-talk-explained-empty',
'mobile-frontend-talk-overlay-lead-header',
- 'mobile-frontend-talk-overlay-header',
'mobile-frontend-talk-add-overlay-subject-placeholder',
'mobile-frontend-talk-add-overlay-content-placeholder',
'mobile-frontend-talk-edit-summary',
@@ -332,10 +356,6 @@
'mobile-frontend-talk-reply-success',
'mobile-frontend-talk-reply',
'mobile-frontend-talk-reply-info',
-
- // notifications.js (defined in Echo)
- 'echo-none',
- 'notifications',
),
),
diff --git a/javascripts/modules/talk.js
b/javascripts/modules/talk/TalkOverlay.js
similarity index 71%
rename from javascripts/modules/talk.js
rename to javascripts/modules/talk/TalkOverlay.js
index ee8a332..5e7fea3 100644
--- a/javascripts/modules/talk.js
+++ b/javascripts/modules/talk/TalkOverlay.js
@@ -5,7 +5,6 @@
Overlay = M.require( 'Overlay' ),
TalkSectionOverlay = M.require(
'modules/talk/TalkSectionOverlay' ),
api = M.require( 'api' ),
- leadHeading = mw.msg(
'mobile-frontend-talk-overlay-lead-header' ),
TalkSectionAddOverlay = Overlay.extend( {
defaults: {
cancelMsg: mw.msg(
'mobile-frontend-editor-cancel' ),
@@ -64,6 +63,10 @@
TalkOverlay = Overlay.extend( {
template: M.template.get( 'overlays/talk' ),
className: 'mw-mf-overlay list-overlay',
+ defaults: {
+ heading: mw.msg(
'mobile-frontend-talk-overlay-header' ),
+ leadHeading: mw.msg(
'mobile-frontend-talk-overlay-lead-header' )
+ },
appendSection: function( heading, text ) {
var $newTopic;
this.options.page.appendSection( heading, text
);
@@ -104,7 +107,7 @@
leadSection = {
content: page.lead,
id: 0,
- heading: leadHeading
+ heading: mw.msg(
'mobile-frontend-talk-overlay-lead-header' )
},
section = id === 0 ?
leadSection : page.getSubSection( id ),
childOverlay = new
TalkSectionOverlay( {
@@ -118,50 +121,8 @@
this.$( '.lead-discussion' ).remove();
}
}
- } ),
- Page = M.require( 'page' );
-
- function renderTalkOverlay( pageData ) {
- var topOverlay,
- page = new Page( pageData );
-
- topOverlay = new TalkOverlay( {
- heading: mw.msg( 'mobile-frontend-talk-overlay-header'
),
- leadHeading: mw.msg(
'mobile-frontend-talk-overlay-lead-header' ),
- page: page
} );
- topOverlay.show();
- }
- function onTalkClick( ev ) {
- var $talk = $( this ), talkPage = $talk.data( 'title' );
- // FIXME: this currently gives an indication something async is
happening. We can do better.
- $talk.addClass( 'loading' );
- ev.preventDefault();
-
- // FIXME: use Page's mechanisms for retrieving page data instead
- M.pageApi.getPage( talkPage ).fail( function( resp ) {
- if ( resp.error && resp.error.code === 'missingtitle' )
{
- renderTalkOverlay( {
- sections: [], title: talkPage
- } );
- }
- $talk.removeClass( 'loading' );
- } ).done( function( pageData ) {
- renderTalkOverlay( pageData );
- $talk.removeClass( 'loading' );
- } );
- }
-
- function init( title ) {
- var talkPrefix = mw.config.get( 'wgFormattedNamespaces' )
[mw.config.get( 'wgNamespaceNumber' ) + 1 ] + ':';
- // FIXME change when micro.tap.js in stable
- $( '#ca-talk' ).on( M.tapEvent( 'click' ), onTalkClick ).data(
'title', talkPrefix + title );
- }
-
- init( mw.config.get( 'wgTitle' ) );
- M.on( 'page-loaded', function( page ) {
- init( page.title );
- } );
+ M.define( 'modules/talk/TalkOverlay', TalkOverlay );
}( mw.mobileFrontend, jQuery ) );
diff --git a/javascripts/modules/talk/talk.js b/javascripts/modules/talk/talk.js
new file mode 100644
index 0000000..4c811a6
--- /dev/null
+++ b/javascripts/modules/talk/talk.js
@@ -0,0 +1,46 @@
+( function( M, $ ) {
+ M.assertMode( [ 'beta', 'alpha' ] );
+
+ var LoadingOverlay = M.require( 'LoadingOverlay' ),
+ Page = M.require( 'page' ),
+ loadingOverlay = new LoadingOverlay();
+
+ function renderTalkOverlay( pageData ) {
+ mw.loader.using( 'mobile.dynamic.talk', function() {
+ var TalkOverlay = M.require( 'modules/talk/TalkOverlay'
);
+
+ loadingOverlay.hide();
+ new TalkOverlay( { page: new Page( pageData ) }
).show();
+ } );
+ }
+
+ function onTalkClick( ev ) {
+ var talkPage = $( this ).data( 'title' );
+
+ ev.preventDefault();
+ loadingOverlay.show();
+
+ // FIXME: use Page's mechanisms for retrieving page data instead
+ M.pageApi.getPage( talkPage ).fail( function( resp ) {
+ if ( resp.error && resp.error.code === 'missingtitle' )
{
+ renderTalkOverlay( {
+ sections: [], title: talkPage
+ } );
+ }
+ } ).done( function( pageData ) {
+ renderTalkOverlay( pageData );
+ } );
+ }
+
+ function init( title ) {
+ var talkPrefix = mw.config.get( 'wgFormattedNamespaces' )
[mw.config.get( 'wgNamespaceNumber' ) + 1 ] + ':';
+ // FIXME change when micro.tap.js in stable
+ $( '#ca-talk' ).on( M.tapEvent( 'click' ), onTalkClick ).data(
'title', talkPrefix + title );
+ }
+
+ init( mw.config.get( 'wgTitle' ) );
+ M.on( 'page-loaded', function( page ) {
+ init( page.title );
+ } );
+
+}( mw.mobileFrontend, jQuery ) );
--
To view, visit https://gerrit.wikimedia.org/r/83958
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I4aa7976e88dbb214e37c7c6aae082a82623d3a3d
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: JGonera <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits