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 <jgon...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits