JGonera has submitted this change and it was merged.
Change subject: Add refresh button to nearby
......................................................................
Add refresh button to nearby
Fiddle with the search button so that the nearby page
can have both a search and refresh button
Animate it when clicked when animations available
Change-Id: I36758885d91e0afc08ff80f46c423545e4c35e28
---
M javascripts/common/mf-navigation.js
M javascripts/specials/modules/search-btn.js
M javascripts/specials/nearby.js
M less/mf-mixins.less
M less/specials/nearby.less
M stylesheets/modules/mf-photo.css
A stylesheets/specials/images/refresh.png
M stylesheets/specials/nearby.css
8 files changed, 107 insertions(+), 30 deletions(-)
Approvals:
JGonera: Verified; Looks good to me, approved
jenkins-bot: Checked
diff --git a/javascripts/common/mf-navigation.js
b/javascripts/common/mf-navigation.js
index 85fa4cc..9541c3f 100644
--- a/javascripts/common/mf-navigation.js
+++ b/javascripts/common/mf-navigation.js
@@ -101,7 +101,7 @@
} );
function getPageMenu() {
- return $( '#mw-mf-menu-page' )[ 0 ];
+ return $( '#mw-mf-menu-page' );
}
function enableEditing( title ) {
diff --git a/javascripts/specials/modules/search-btn.js
b/javascripts/specials/modules/search-btn.js
index 6a37895..afb71fe 100644
--- a/javascripts/specials/modules/search-btn.js
+++ b/javascripts/specials/modules/search-btn.js
@@ -2,7 +2,8 @@
var search = M.require( 'search' );
-if ( mw.config.get( 'wgNamespaceNumber' ) === mw.config.get( 'wgNamespaceIds'
).special ) {
+if ( mw.config.get( 'wgNamespaceNumber' ) === mw.config.get( 'wgNamespaceIds'
).special &&
+ mw.config.get( 'wgCanonicalSpecialPageName' ) !== 'Nearby' ) {// FIXME:
allow nearby to have search & refresh icon
$( '<a class="search-button">' ).attr( 'href', '#' ).
on( 'click', function() {
search.overlay.showAndFocus();
diff --git a/javascripts/specials/nearby.js b/javascripts/specials/nearby.js
index cddff3a..b38c29c 100644
--- a/javascripts/specials/nearby.js
+++ b/javascripts/specials/nearby.js
@@ -1,15 +1,14 @@
( function( M, $ ) {
var CACHE_KEY_RESULTS = 'mfNearbyLastSearchResult',
- PRECISION = 2,
CACHE_KEY_LAST_LOCATION = 'mfNearbyLastKnownLocation';
( function() {
var supported = M.supportsGeoLocation(),
watchstar = M.require( 'watchstar' ),
popup = M.require( 'notifications' ),
+ nav = M.require( 'navigation' ),
View = M.require( 'view' ),
endpoint = mw.config.get( 'wgMFNearbyEndpoint' ),
- cachedPages,
curLocation,
lastKnownLocation = M.settings.getUserSetting(
CACHE_KEY_LAST_LOCATION ),
cache = M.settings.saveUserSetting,
@@ -29,6 +28,7 @@
}
}
} ),
+ pendingQuery = false, btn, menu,
overlay = new Nearby( {
el: $( '#mw-mf-nearby' )
} );
@@ -140,20 +140,9 @@
} ).done( function( data ) {
var pages = $.map( data.query.pages, function( i ) {
return i;
- } ), $popup;
+ } );
if ( pages.length > 0 ) {
- if ( !cachedPages ) {
- render( $content, pages );
- } else {
- $popup = popup.show(
- mw.message(
'mobile-frontend-nearby-refresh' ).plain(), 'toast locked' );
- $popup.click( function() {
- render( $content, pages );
- popup.close( true );
- } );
- }
-
- cachedPages = pages;
+ render( $content, pages );
} else {
$content.empty();
$( '<div class="empty content">' ).
@@ -165,27 +154,39 @@
} );
}
+ function completeRefresh() {
+ $( 'button.refresh' ).removeClass( 'refreshing' );
+ pendingQuery = false;
+ }
+
function init() {
var $content = $( '#mw-mf-nearby' ).empty();
$( '<div class="content loading"> ').text(
mw.message( 'mobile-frontend-nearby-loading' )
).appendTo( $content );
- navigator.geolocation.watchPosition( function( geo ) {
+ navigator.geolocation.getCurrentPosition( function( geo ) {
var lat = geo.coords.latitude, lng =
geo.coords.longitude;
- if ( curLocation && lat.toFixed( PRECISION ) ===
curLocation.latitude.toFixed( PRECISION ) &&
- lng.toFixed( PRECISION ) ===
curLocation.longitude.toFixed( PRECISION ) ) { // bug 47898
- return;
- } else {
- curLocation = { latitude: lat, longitude: lng
}; // save as json so it can be cached bug 48268
- cache( CACHE_KEY_LAST_LOCATION, $.toJSON(
curLocation ) );
- findResults( lat, lng );
- }
+ curLocation = { latitude: lat, longitude: lng }; //
save as json so it can be cached bug 48268
+ cache( CACHE_KEY_LAST_LOCATION, $.toJSON( curLocation )
);
+ findResults( lat, lng );
+ completeRefresh();
},
function() {
popup.show( mw.message(
'mobile-frontend-nearby-lookup-error' ).plain(), 'toast' );
+ completeRefresh();
},
{
enableHighAccuracy: true
} );
+ }
+
+ function refresh() {
+ if ( pendingQuery ) {
+ return;
+ } else {
+ $( 'button.refresh' ).addClass( 'refreshing' );
+ pendingQuery = true;
+ init();
+ }
}
if ( supported ) {
@@ -200,6 +201,10 @@
render( $( '#content' ), $.parseJSON( lastSearchResult
) );
}
}
+
+ menu = $( '<li>' ).appendTo( nav.getPageMenu() );
+ btn = $( '<button class="refresh">refresh</button></li>' ).on( 'click',
refresh ).appendTo( menu );
+
M.define( 'nearby', {
distanceMessage: distanceMessage,
endpoint: endpoint,
diff --git a/less/mf-mixins.less b/less/mf-mixins.less
index 6c978e6..8012aed 100644
--- a/less/mf-mixins.less
+++ b/less/mf-mixins.less
@@ -105,7 +105,7 @@
transition-timing-function: @timingFunction;
}
-.animation( @name, @duration ) {
- animation: @name @duration ease-in-out infinite alternate;
- -webkit-animation: @name @duration ease-in-out infinite alternate;
+.animation( @name, @duration, @function: ease-in-out ) {
+ -webkit-animation: @name @duration @function infinite alternate;
+ animation: @name @duration @function infinite alternate;
}
diff --git a/less/specials/nearby.less b/less/specials/nearby.less
index efa29a1..cf3e142 100644
--- a/less/specials/nearby.less
+++ b/less/specials/nearby.less
@@ -15,3 +15,40 @@
}
}
}
+
+button.refresh {
+ background: rgba(0, 0, 0, 0) url(images/refresh.png) no-repeat center
center;
+ margin: 0;
+ text-indent: -9999px;
+ overflow: hidden;
+ width: 24px;
+ height: @headerHeight;
+ background-size: 24px 25px;
+ border: none;
+}
+
+@-webkit-keyframes infinite-spin {
+ from {
+ .transform( rotate(0deg) );
+ }
+
+ to {
+ .transform( rotate(360deg) );
+ }
+}
+
+@keyframes infinite-spin {
+ from {
+ .transform( rotate(0deg) );
+ }
+
+ to {
+ .transform( rotate(360deg) );
+ }
+}
+
+.animations {
+ .refreshing {
+ .animation( infinite-spin, 0.5s, linear );
+ }
+}
diff --git a/stylesheets/modules/mf-photo.css b/stylesheets/modules/mf-photo.css
index 48ccd19..f1047da 100644
--- a/stylesheets/modules/mf-photo.css
+++ b/stylesheets/modules/mf-photo.css
@@ -147,8 +147,8 @@
line-height: 1;
}
.animations .photo-nag label div.active {
- animation: pulse 1s ease-in-out infinite alternate;
-webkit-animation: pulse 1s ease-in-out infinite alternate;
+ animation: pulse 1s ease-in-out infinite alternate;
}
@media (min-width: 700px) {
.photo-nag .preview {
diff --git a/stylesheets/specials/images/refresh.png
b/stylesheets/specials/images/refresh.png
new file mode 100644
index 0000000..9582de6
--- /dev/null
+++ b/stylesheets/specials/images/refresh.png
Binary files differ
diff --git a/stylesheets/specials/nearby.css b/stylesheets/specials/nearby.css
index 5ff3c6a..c2b3541 100644
--- a/stylesheets/specials/nearby.css
+++ b/stylesheets/specials/nearby.css
@@ -8,3 +8,37 @@
font-size: .8em;
text-transform: none;
}
+button.refresh {
+ background: rgba(0, 0, 0, 0) url(images/refresh.png) no-repeat center center;
+ margin: 0;
+ text-indent: -9999px;
+ overflow: hidden;
+ width: 24px;
+ height: 46px;
+ background-size: 24px 25px;
+ border: none;
+}
+@-webkit-keyframes infinite-spin {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+@keyframes infinite-spin {
+ from {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+.animations .refreshing {
+ -webkit-animation: infinite-spin 0.5s linear infinite alternate;
+ animation: infinite-spin 0.5s linear infinite alternate;
+}
--
To view, visit https://gerrit.wikimedia.org/r/63149
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I36758885d91e0afc08ff80f46c423545e4c35e28
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
Gerrit-Reviewer: JGonera <[email protected]>
Gerrit-Reviewer: Jdlrobson <[email protected]>
Gerrit-Reviewer: awjrichards <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
