Jdlrobson has uploaded a new change for review.
https://gerrit.wikimedia.org/r/92002
Change subject: Beta desktop feature: Nearby pages
......................................................................
Beta desktop feature: Nearby pages
* Create a 'mobile bridge' that tweaks the desktop UI so mobile code
can run on it and required styles are loaded
* Create generic mixin so icon style for nearby can be rendered in the desktop
stylesheet as well as mobile:
* Separate header css into several files so desktop stylesheet can load it
* Add hook for GetBetaFeaturePreferences and provide feature
* Add an additional wgMFMode for beta (desktop-beta), update modules so
they can run in this environment
Change-Id: Id81ef4715f545180dbe8f7f2f377e6da29742a05
---
M MobileFrontend.i18n.php
M MobileFrontend.php
M includes/MobileFrontend.hooks.php
M includes/Resources.php
A javascripts/desktop/mobileBridge.js
M javascripts/modules/nearby/NearbyOverlay.js
M javascripts/modules/nearby/PagePreviewOverlay.js
M less/common/overlays.less
M less/common/secondaryPageActions.less
M less/common/ui.less
M less/desktop/mobileBridge.less
M less/mixins.less
12 files changed, 80 insertions(+), 33 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/02/92002/1
diff --git a/MobileFrontend.i18n.php b/MobileFrontend.i18n.php
index 4bcaa8f..0444c43 100644
--- a/MobileFrontend.i18n.php
+++ b/MobileFrontend.i18n.php
@@ -346,6 +346,10 @@
// geo not a hack
'mobile-frontend-geonotahack' => 'Near this page',
+
+ // Beta Features
+ 'beta-feature-geonotahack' => 'Near this page',
+ 'beta-feature-geonotahack-description' => 'Allows you to see other
related pages to pages you view with GeoData.',
);
/** Message documentation (Message documentation)
@@ -934,6 +938,8 @@
* $2 - title of page for editing which the thank was given
* $3 - (optional) name of user who was thanked, for GENDER support',
'mobile-frontend-geonotahack' => 'Label for button that shows pages
near a given page',
+ 'beta-feature-geonotahack' => 'Title for near this page beta feature.',
+ 'beta-feature-geonotahack-description' => 'Description for near this
page beta feature.',
);
/** Achinese (Acèh)
diff --git a/MobileFrontend.php b/MobileFrontend.php
index 321b146..0cb3bf7 100644
--- a/MobileFrontend.php
+++ b/MobileFrontend.php
@@ -123,6 +123,7 @@
$wgHooks['BeforePageDisplay'][] = 'MobileFrontendHooks::onBeforePageDisplay';
$wgHooks['CustomEditor'][] = 'MobileFrontendHooks::onCustomEditor';
$wgHooks['GetPreferences'][] = 'MobileFrontendHooks::onGetPreferences';
+$wgHooks['GetBetaFeaturePreferences'][] =
'MobileFrontendHooks::onGetBetaFeaturePreferences';
$wgHooks['Gadgets::allowLegacy'][] =
'MobileFrontendHooks::onAllowLegacyGadgets';
$wgHooks['UnitTestsList'][] = 'MobileFrontendHooks::onUnitTestsList';
$wgHooks['CentralAuthLoginRedirectData'][] =
'MobileFrontendHooks::onCentralAuthLoginRedirectData';
diff --git a/includes/MobileFrontend.hooks.php
b/includes/MobileFrontend.hooks.php
index 635511d..8a131b7 100644
--- a/includes/MobileFrontend.hooks.php
+++ b/includes/MobileFrontend.hooks.php
@@ -482,6 +482,12 @@
global $wgMFEnableXAnalyticsLogging;
wfProfileIn( __METHOD__ );
+ if ( class_exists( 'BetaFeatures' ) &&
+ BetaFeatures::isFeatureEnabled(
$out->getSkin()->getUser(), 'betafeatures-geonotahack' ) ) {
+ $out->addModules( array( 'mobile.bridge' ) );
+ $out->addJsConfigVars( 'wgMFMode', 'desktop-beta' );
+ }
+
$context = MobileContext::singleton();
if ( !$context->shouldDisplayMobileView() ) {
wfProfileOut( __METHOD__);
@@ -557,6 +563,28 @@
}
/**
+ * GetBetaFeaturePreferences hook handler
+ * @see https://www.mediawiki.org/wiki/Manual:Hooks/GetPreferences
+ *
+ * @param User $user
+ * @param array $preferences
+ *
+ * @return bool
+ */
+ public static function onGetBetaFeaturePreferences( $user,
&$preferences ) {
+ global $wgExtensionAssetsPath;
+ $preferences['betafeatures-geonotahack'] = array(
+ 'label-message' => 'beta-feature-geonotahack',
+ 'desc-message' =>
'beta-feature-geonotahack-description',
+ 'info-link' => 'https://www.mediawiki.org/wiki/Beta
Features/Nearby Pages',
+ 'discussion-link' =>
'https://www.mediawiki.org/wiki/Talk:Beta Features/Nearby Pages',
+ 'screenshot' => $wgExtensionAssetsPath .
'/MobileFrontend/less/common/images/secondaryPageActions/geo.png',
+ );
+
+ return true;
+ }
+
+ /**
* Gadgets::allowLegacy hook handler
*
* @return bool
diff --git a/includes/Resources.php b/includes/Resources.php
index 2b410d7..3f130aa 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -73,6 +73,16 @@
'targets' => array( 'mobile', 'desktop' ),
),
+ // Mobile Bridge - Tweaks the desktop UI so mobile code can run on it
+ 'mobile.bridge' => $wgMFMobileResourceBoilerplate + array(
+ 'styles' => array(
+ 'less/desktop/mobileBridge.less',
+ ),
+ 'scripts' => array(
+ 'javascripts/desktop/mobileBridge.js',
+ ),
+ ),
+
// EventLogging
'mobile.loggingSchemas' => $wgMFMobileResourceBoilerplate + array(
'dependencies' => array(
diff --git a/javascripts/desktop/mobileBridge.js
b/javascripts/desktop/mobileBridge.js
new file mode 100644
index 0000000..1f7bb74
--- /dev/null
+++ b/javascripts/desktop/mobileBridge.js
@@ -0,0 +1,5 @@
+jQuery( function( $ ) {
+ $( 'body' ).attr( 'id', 'mw-mf-viewport' );
+ $( '<div id="page-secondary-actions">' ).insertAfter( '#firstHeading' );
+ mw.loader.using( 'mobile.geonotahack' );
+} );
diff --git a/javascripts/modules/nearby/NearbyOverlay.js
b/javascripts/modules/nearby/NearbyOverlay.js
index c44a779..f644f61 100644
--- a/javascripts/modules/nearby/NearbyOverlay.js
+++ b/javascripts/modules/nearby/NearbyOverlay.js
@@ -1,5 +1,5 @@
( function( M ) {
- M.assertMode( [ 'beta', 'alpha' ] );
+ M.assertMode( [ 'beta', 'alpha', 'desktop-beta' ] );
var Nearby = M.require( 'modules/nearby/Nearby' ),
Overlay = M.require( 'Overlay' ),
NearbyOverlay;
diff --git a/javascripts/modules/nearby/PagePreviewOverlay.js
b/javascripts/modules/nearby/PagePreviewOverlay.js
index 30c490b..c14e4ff 100644
--- a/javascripts/modules/nearby/PagePreviewOverlay.js
+++ b/javascripts/modules/nearby/PagePreviewOverlay.js
@@ -1,5 +1,5 @@
( function( M, $ ) {
- M.assertMode( [ 'beta', 'alpha' ] );
+ M.assertMode( [ 'beta', 'alpha', 'desktop-beta' ] );
var Overlay = M.require( 'Overlay' ),
MobileWebClickTracking = M.require(
'loggingSchemas/MobileWebClickTracking' ),
api = M.require( 'api' ),
diff --git a/less/common/overlays.less b/less/common/overlays.less
index e45fd6e..9ac48dc 100644
--- a/less/common/overlays.less
+++ b/less/common/overlays.less
@@ -24,7 +24,7 @@
position: absolute;
top: 0;
left: 0;
- width: 100%;
+ right: 0;
background-color: white;
z-index: 4;
diff --git a/less/common/secondaryPageActions.less
b/less/common/secondaryPageActions.less
index 8c1f844..89bb637 100644
--- a/less/common/secondaryPageActions.less
+++ b/less/common/secondaryPageActions.less
@@ -6,18 +6,7 @@
margin-top: 45px;
button,
.button {
- // FIXME: These is becoming a common pattern.
Generalise.
- text-indent: -9999px;
- width: 70px;
- /* Default styling for button tag is border box but not
for a.button thus make sure this is consistent
- Note we have to set this we are setting a fixed
width above
- */
- .box-sizing(border-box);
- // buttons are inline-block so ensure that we avoid the
whitespace above 2nd button due to default value baseline
- vertical-align: top;
- .background-size(30px, auto);
- background-repeat: no-repeat;
- background-position: center center;
+ .secondaryPageActionButton();
&.nearby {
background-image:
url(images/secondaryPageActions/geo.png);
diff --git a/less/common/ui.less b/less/common/ui.less
index 1fab43b..fcbe48a 100644
--- a/less/common/ui.less
+++ b/less/common/ui.less
@@ -1,6 +1,7 @@
@import "mediawiki.mixins";
@import "buttons.less";
@import 'mainmenu.less';
+@import 'headers.less';
// Used for messages on login screen, page lists and uploads and when showing
old revisions
.alert {
@@ -24,22 +25,6 @@
body {
background: #fff;
height: 100%;
-}
-
-.header {
- // .header needs position: relative, it's not always at the top of the
page
- // (Zero banners, campaigns)
- position: relative;
- .vertical-gradient( @searchBoxColor, @searchBoxColorTo );
- border-bottom: 1px solid #e2e2e2;
- line-height: (@headerHeight - 2px);
- text-align: center;
- min-height: (@headerHeight - 2px);
- padding: 2px 10px 0 @searchBarPaddingLeft;
-
- h1, h2 {
- font-size: @baseFontSize * 1.6;
- }
}
/* Menu buttons */
diff --git a/less/desktop/mobileBridge.less b/less/desktop/mobileBridge.less
index d244aa1..be2e61f 100644
--- a/less/desktop/mobileBridge.less
+++ b/less/desktop/mobileBridge.less
@@ -1,7 +1,7 @@
@import '../common/headers.less';
@import '../common/buttons.less';
-@import "../common/common-js.less";
-
+@import '../common/common-js.less';
+@import '../common/pagelist.less';
.overlay-enabled {
.skin-vector {
@@ -16,6 +16,9 @@
}
.skin-vector {
+ .mw-body {
+ position: relative;
+ }
.mw-mf-overlay {
.page-list {
@@ -29,7 +32,12 @@
}
#page-secondary-actions {
+ position: absolute;
+ top: 7px;
+ right: 22px;
+
.button.nearby {
+ width: 40px;
background-image: url(images/geo.png);
.secondaryPageActionButton();
}
diff --git a/less/mixins.less b/less/mixins.less
index a37710c..b1d2799 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -1,5 +1,20 @@
@import "variables.less";
+.secondaryPageActionButton() {
+ // FIXME: These is becoming a common pattern. Generalise.
+ text-indent: -9999px;
+ width: 70px;
+ /* Default styling for button tag is border box but not for a.button
thus make sure this is consistent
+ Note we have to set this we are setting a fixed width above
+ */
+ .box-sizing(border-box);
+ // buttons are inline-block so ensure that we avoid the whitespace
above 2nd button due to default value baseline
+ vertical-align: top;
+ .background-size(30px, auto);
+ background-repeat: no-repeat;
+ background-position: center center;
+}
+
.watchlist-heading() {
font: inherit;
margin: 0;
--
To view, visit https://gerrit.wikimedia.org/r/92002
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Id81ef4715f545180dbe8f7f2f377e6da29742a05
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
