jenkins-bot has submitted this change and it was merged.
Change subject: Alpha: Surface nearby articles
......................................................................
Alpha: Surface nearby articles
Create a reusable Nearby view
Note: currently for convenience putting all messages in
mobile.nearby module in anticipation of refactor
Moved mobile-frontend-nearby-link and
mobile-frontend-nearby-directions to correct module
Change-Id: I99eecdcd20eed8b4df88152f0eeecc6e730522cb
---
M MobileFrontend.i18n.php
M includes/Resources.php
A javascripts/modules/nearby/Nearby.js
A javascripts/modules/nearbypages.js
M javascripts/specials/nearby.js
M less/common/pagelist.less
A less/modules/nearbypages.less
M stylesheets/common/pagelist.css
A stylesheets/modules/images/nearby.png
A stylesheets/modules/nearbypages.css
M templates/articleList.html
A templates/overlays/nearby.html
12 files changed, 189 insertions(+), 10 deletions(-)
Approvals:
JGonera: Looks good to me, approved
jenkins-bot: Verified
diff --git a/MobileFrontend.i18n.php b/MobileFrontend.i18n.php
index 96b48e7..e9052e6 100644
--- a/MobileFrontend.i18n.php
+++ b/MobileFrontend.i18n.php
@@ -123,6 +123,9 @@
'mobile-frontend-user-cta' => 'Please login or sign up to see your
notifications.',
+ // nearby overlay
+ 'mobile-frontend-nearby-to-page' => 'The following pages are related to
$1 by their geographical location',
+
// nearby
'mobile-frontend-nearby-title' => 'Nearby',
'mobile-frontend-nearby-loading' => 'Loading topics near your current
location',
@@ -504,6 +507,7 @@
'mobile-frontend-page-saving' => 'Text shown whilst an article is being
saved.
{{Identical|Saving}}',
'mobile-frontend-user-cta' => 'Appears when you click user icon when
not logged in. First link is to login form, 2nd to sign up form. Links are
created in JavaScript.',
+ 'mobile-frontend-nearby-to-page' => 'Header that describes that the
pages are related as they have locations near the location of the current
article',
'mobile-frontend-nearby-title' => 'Title of Special:Nearby.
{{Identical|Nearby}}',
'mobile-frontend-nearby-loading' => 'Informative message telling user
that their location is being looked up',
diff --git a/includes/Resources.php b/includes/Resources.php
index 5a40b93..29959c7 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -341,11 +341,18 @@
),
),
+ 'mobile.alpha.plumbing' => $wgMFMobileResourceTemplateBoilerplate +
array(
+ 'templates' => array(
+ 'overlays/nearby',
+ ),
+ ),
'mobile.alpha' => $wgMFMobileResourceBoilerplate + array(
'dependencies' => array(
'mobile.stable',
'mobile.beta',
'mobile.history',
+ 'mobile.alpha.plumbing',
+ 'mobile.nearby',
),
'messages' => array(
@@ -354,9 +361,13 @@
// history-alpha.js
'mobile-frontend-language-article-heading',
+
+ // nearbypages.js
+ 'mobile-frontend-nearby-to-page',
),
'styles' => array(
'stylesheets/modules/mf-tables.css',
+ 'stylesheets/modules/nearbypages.css',
),
'scripts' => array(
'javascripts/modules/mf-inline-style-scrubber.js',
@@ -364,6 +375,7 @@
'javascripts/modules/mf-tables.js',
'javascripts/modules/mf-translator.js',
'javascripts/modules/lazyload.js',
+ 'javascripts/modules/nearbypages.js'
),
),
@@ -577,6 +589,8 @@
'messages' => array(
// preview.js
'mobile-frontend-ajax-preview-loading',
+ 'mobile-frontend-nearby-directions',
+ 'mobile-frontend-nearby-link',
),
'scripts' => array(
'javascripts/specials/overlays/preview.js',
@@ -600,7 +614,7 @@
),
),
- 'mobile.nearby.scripts' => $wgMFMobileResourceBoilerplate + array(
+ 'mobile.nearby' => $wgMFMobileResourceBoilerplate + array(
'dependencies' => array(
'mobile.stable.common',
'mobile.nearby.styles',
@@ -609,22 +623,36 @@
'mobile.pagelist.styles',
),
'messages' => array(
- 'mobile-frontend-nearby-error',
- 'mobile-frontend-nearby-error-guidance',
- 'mobile-frontend-nearby-refresh',
- 'mobile-frontend-nearby-title',
- 'mobile-frontend-nearby-loading',
+ // NearbyApi.js
'mobile-frontend-nearby-distance',
'mobile-frontend-nearby-distance-meters',
- 'mobile-frontend-nearby-lookup-ui-error',
- 'mobile-frontend-nearby-lookup-ui-error-guidance',
+ // other
+ 'mobile-frontend-nearby-error',
+ 'mobile-frontend-nearby-error-guidance',
+ 'mobile-frontend-nearby-title',
+ 'mobile-frontend-nearby-loading',
'mobile-frontend-nearby-noresults',
'mobile-frontend-nearby-noresults-guidance',
- 'mobile-frontend-nearby-link',
- 'mobile-frontend-nearby-directions',
),
'scripts' => array(
'javascripts/modules/nearby/NearbyApi.js',
+ 'javascripts/modules/nearby/Nearby.js',
+ ),
+ ),
+
+ 'mobile.nearby.scripts' => $wgMFMobileResourceBoilerplate + array(
+ 'dependencies' => array(
+ 'mobile.nearby',
+ ),
+ 'messages' => array(
+ // specials/nearby.js
+ 'mobile-frontend-nearby-refresh',
+ 'mobile-frontend-nearby-lookup-ui-error',
+ 'mobile-frontend-nearby-lookup-ui-error-guidance',
+ 'mobile-frontend-nearby-requirements',
+ 'mobile-frontend-nearby-requirements-guidance',
+ ),
+ 'scripts' => array(
'javascripts/specials/nearby.js',
),
// stop flash of unstyled content when loading from cache
diff --git a/javascripts/modules/nearby/Nearby.js
b/javascripts/modules/nearby/Nearby.js
new file mode 100644
index 0000000..b019b2f
--- /dev/null
+++ b/javascripts/modules/nearby/Nearby.js
@@ -0,0 +1,50 @@
+( function( M ) {
+ var NearbyApi = M.require( 'modules/nearby/NearbyApi' ),
+ View = M.require( 'view' ),
+ range = 1000,
+ Nearby;
+
+ Nearby = View.extend( {
+ template: M.template.get( 'articleList' ),
+ defaults: {
+ loadingMessage: mw.msg(
'mobile-frontend-nearby-loading' )
+ },
+ errorMessages: {
+ empty: {
+ heading: mw.msg(
'mobile-frontend-nearby-noresults' ),
+ guidance: mw.msg(
'mobile-frontend-nearby-noresults-guidance' )
+ },
+ server: {
+ heading: mw.msg( 'mobile-frontend-nearby-error'
),
+ guidance: mw.msg(
'mobile-frontend-nearby-error-guidance' )
+ }
+ },
+ initialize: function( options ) {
+ this.range = options.range;
+ if ( options.location ) {
+ this.location = options.location;
+ }
+ this.api = new NearbyApi();
+ this._super( options );
+ },
+ preRender: function( options ) {
+ if ( options.pages && options.pages.length === 0 ) {
+ options.error = this.errorMessages.empty;
+ }
+ },
+ postRender: function( options ) {
+ var self = this;
+ if ( !options.pages && !options.error && this.location
) {
+ self.$( '.loading' ).show();
+ this.api.getPages( this.location, range ).done(
function( pages ) {
+ self.render( { pages: pages } );
+ } ).fail( function() {
+ self.render( { error:
self.errorMessages.server } );
+ } );
+ }
+ }
+ } );
+
+ M.define( 'modules/nearby/Nearby', Nearby );
+
+}( mw.mobileFrontend ) );
diff --git a/javascripts/modules/nearbypages.js
b/javascripts/modules/nearbypages.js
new file mode 100644
index 0000000..059f07a
--- /dev/null
+++ b/javascripts/modules/nearbypages.js
@@ -0,0 +1,60 @@
+( function( M, $ ) {
+ var latLng, lat, lng,
+ Overlay = M.require( 'Overlay' ),
+ overlay,
+ Nearby = M.require( 'modules/nearby/Nearby' ),
+ NearbyOverlay;
+
+ NearbyOverlay = Overlay.extend( {
+ active: false,
+ className: 'mw-mf-overlay list-overlay',
+ template: M.template.get( 'overlays/nearby' ),
+ defaults: {
+ heading: 'Nearby',
+ pretext: mw.message(
'mobile-frontend-nearby-to-page', mw.config.get( 'wgTitle' ) )
+ },
+ initialize: function( options ) {
+ this._super( options );
+ this.latLngString = options.latitude + ',' +
options.longitude;
+ },
+ postRender: function( options ) {
+ var widget;
+
+ this._super( options );
+ widget = new Nearby( {
+ range: 2000,
+ location: { longitude:
options.longitude, latitude: options.latitude },
+ el: this.$( '.container' )
+ } );
+ }
+ } );
+
+
+ function initNearbyButton( latitude, longitude ) {
+ $( '<button class="nearby">' ).on( 'click', function() {
+ if ( !overlay ) {
+ overlay = new NearbyOverlay( { latitude:
latitude, longitude: longitude } );
+ }
+ overlay.show();
+ } ).appendTo( '#section_0' );
+ }
+
+ function init() {
+ // in form 37.783; -122.417 - take the first one
+ latLng = $( '.geo' ).eq( 0 ).text();
+ // Matches <number>;<spaces><number> where number can be
negative or positive and a float or integer
+ latLng = latLng.match( /([\-]?[\-0-9]+[\.]?[0-9]*);[
]+([\-]?[0-9]+[\.]?[0-9]*)/ );
+ if ( latLng ) {
+ lat = latLng[1];
+ lng = latLng[2];
+ }
+
+ if ( lat && lng ) {
+ // in business!
+ initNearbyButton( lat, lng );
+ }
+ }
+ init();
+ M.on( 'page-loaded', init );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/javascripts/specials/nearby.js b/javascripts/specials/nearby.js
index 76fe792..e54e088 100644
--- a/javascripts/specials/nearby.js
+++ b/javascripts/specials/nearby.js
@@ -1,3 +1,4 @@
+// FIXME: Refactor to use modules/nearby/Nearby
( function( M, $ ) {
var CACHE_KEY_RESULTS = 'mfNearbyLastSearchResult',
endpoint = mw.config.get( 'wgMFNearbyEndpoint' ),
diff --git a/less/common/pagelist.less b/less/common/pagelist.less
index 967b17f..4e328c7 100644
--- a/less/common/pagelist.less
+++ b/less/common/pagelist.less
@@ -104,6 +104,7 @@
}
.listThumb {
width: @thumbOverlayWidth;
+ height: 100%;
margin-left: -@thumbOverlaySpace;
}
a.title {
diff --git a/less/modules/nearbypages.less b/less/modules/nearbypages.less
new file mode 100644
index 0000000..61fba86
--- /dev/null
+++ b/less/modules/nearbypages.less
@@ -0,0 +1,9 @@
+.nearby {
+ // FIXME: Replace with a more appropriate image
+ background-image: url(images/nearby.png);
+ width: 20px;
+ height: 20px;
+ background-size: 20px 20px;
+ background-repeat: no-repeat;
+ margin-left: 8px;
+}
diff --git a/stylesheets/common/pagelist.css b/stylesheets/common/pagelist.css
index 76d8c9f..39bb7be 100644
--- a/stylesheets/common/pagelist.css
+++ b/stylesheets/common/pagelist.css
@@ -98,6 +98,7 @@
}
.mw-mf-overlay ul.a-to-z li .listThumb {
width: 40px;
+ height: 100%;
margin-left: -55px;
}
.mw-mf-overlay ul.a-to-z li a.title {
diff --git a/stylesheets/modules/images/nearby.png
b/stylesheets/modules/images/nearby.png
new file mode 100644
index 0000000..c830b70
--- /dev/null
+++ b/stylesheets/modules/images/nearby.png
Binary files differ
diff --git a/stylesheets/modules/nearbypages.css
b/stylesheets/modules/nearbypages.css
new file mode 100644
index 0000000..eb0e681
--- /dev/null
+++ b/stylesheets/modules/nearbypages.css
@@ -0,0 +1,8 @@
+.nearby {
+ background-image: url(images/nearby.png);
+ width: 20px;
+ height: 20px;
+ background-size: 20px 20px;
+ background-repeat: no-repeat;
+ margin-left: 8px;
+}
diff --git a/templates/articleList.html b/templates/articleList.html
index 33599fb..28608aa 100644
--- a/templates/articleList.html
+++ b/templates/articleList.html
@@ -6,6 +6,9 @@
</div>
</div>
{{/error}}
+{{#loadingMessage}}
+<div class="content loading">{{loadingMessage}}</div>
+{{/loadingMessage}}
<ul class="page-list a-to-z">
{{#pages}}
<li title="{{title}}">
diff --git a/templates/overlays/nearby.html b/templates/overlays/nearby.html
new file mode 100644
index 0000000..1f4b25f
--- /dev/null
+++ b/templates/overlays/nearby.html
@@ -0,0 +1,14 @@
+<div class="header">
+ <button class="cancel">{{closeMsg}}</button>
+ <h2>{{heading}}</h2>
+</div>
+<p class="mw-mf-overlay-header">{{pretext}}</p>
+<div class="container">
+ <ul>
+ {{#sections}}
+ <li>
+ <a data-id="{{id}}">{{heading}}</a>
+ </li>
+ {{/sections}}
+ </ul>
+</div>
--
To view, visit https://gerrit.wikimedia.org/r/70236
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I99eecdcd20eed8b4df88152f0eeecc6e730522cb
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
Gerrit-Reviewer: JGonera <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
