Jdlrobson has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/402127 )
Change subject: List all the features in beta (UI)
......................................................................
List all the features in beta (UI)
This takes care of the UI portion of listing all features
in beta.
@todo pending mock
* Fix icons
* Add separater above "beta"
* Add star
* Make feedback link at bottom of screen configurable and check whether
it should be a button or a link (and how OOUI allows that)
Bug: T182362
Change-Id: If0855122e388e2f6742b19bffaf078e90b18809e
---
M extension.json
M i18n/en.json
M i18n/qqq.json
M includes/specials/SpecialMobileOptions.php
A resources/mobile.special.mobileoptions.icons/mobileoptions.less
M resources/mobile.special.mobileoptions.styles/mobileoptions.less
6 files changed, 178 insertions(+), 7 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/27/402127/1
diff --git a/extension.json b/extension.json
index f9e69bd..34f7d34 100644
--- a/extension.json
+++ b/extension.json
@@ -940,6 +940,14 @@
],
"position": "top"
},
+ "mobile.special.mobileoptions.icons": {
+ "class": "ResourceLoaderImageModule",
+ "selector": ".oo-ui-icon-{name}",
+ "images": {
+ "mf-tick":
"resources/mobile.special.mobileoptions.icons/tick.svg",
+ "mf-lock":
"resources/mobile.special.mobileoptions.icons/lock.svg"
+ }
+ },
"mobile.special.mobileoptions.scripts": {
"targets": "mobile",
"position": "top",
diff --git a/i18n/en.json b/i18n/en.json
index d946136..9217300 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -178,7 +178,7 @@
"mobile-frontend-nearby-requirements-guidance": "Try a different
browser or enable JavaScript if you've disabled it.",
"mobile-frontend-nearby-title": "Nearby",
"mobile-frontend-news-items": "In the news",
- "mobile-frontend-opt-in-explain": "Join {{SITENAME}} Beta to get access
to the latest experimental features!",
+ "mobile-frontend-opt-in-explain": "{{SITENAME}} βeta is a way for you
to try these experimental features and provide us with valuable feedback",
"mobile-frontend-overlay-close": "Close",
"mobile-frontend-overlay-continue": "Continue",
"mobile-frontend-page-edit-summary": "<span><strong>Edit
summary</strong> $1</span>",
@@ -199,7 +199,7 @@
"mobile-frontend-search-content-no-results":
"'''{{int:mobile-frontend-search-content}}''' to see if this phrase appears
anywhere.",
"mobile-frontend-search-no-results": "No page with this title.",
"mobile-frontend-settings-tagline": "Reading preferences",
- "mobile-frontend-settings-beta": "Beta",
+ "mobile-frontend-settings-beta": "{{SITENAME}} βeta",
"mobile-frontend-settings-site-description": "{{SITENAME}} is available
in $1 {{PLURAL:$1|language|languages}}. All available versions are listed
below",
"mobile-frontend-settings-site-header": "{{SITENAME}} Languages",
"mobile-frontend-settings-save": "Settings were saved successfully.",
@@ -297,5 +297,10 @@
"mobile-frontend-panel-betaoptin-msg": "Do you want to try some new
features? By joining the beta, you will get access to experimental features, at
the risk of encountering bugs and issues.",
"mobile-frontend-search-feedback-link-text": "Give us your feedback.",
"mobile-frontend-search-feedback-prompt": "Couldn't find what you were
looking for?",
- "mobile-frontend-notifications-filter-title": "Filter notifications"
-}
\ No newline at end of file
+ "mobile-frontend-notifications-filter-title": "Filter notifications",
+ "mobile-frontend-mobile-option-MFLazyLoadReferences": "Lazy load
references",
+ "mobile-frontend-mobile-option-MFEnableWikidataDescriptions": "Title
descriptions",
+
"mobile-frontend-mobile-option-MFEnableWikidataDescriptions-description":
"Learn about the subject of the article with a short description below the
title",
+ "mobile-frontend-mobile-option-MFLazyLoadReferences-description": "Load
article references only when needed",
+ "mobile-frontend-send-feedback": "Send feedback"
+}
diff --git a/i18n/qqq.json b/i18n/qqq.json
index ab92dfc..91f2348 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -298,5 +298,10 @@
"mobile-frontend-panel-betaoptin-msg": "Message in panel asking if user
wants to opt in to beta.",
"mobile-frontend-search-feedback-link-text": "Text of anchor linking to
a form for the user to give feedback on search results.",
"mobile-frontend-search-feedback-prompt": "Text shown in front of an
anchor linking to a form for the user to give feedback on search results.",
- "mobile-frontend-notifications-filter-title": "Title shown in the
notifications filter page on click of the Filter button"
+ "mobile-frontend-notifications-filter-title": "Title shown in the
notifications filter page on click of the Filter button",
+ "mobile-frontend-mobile-option-MFLazyLoadReferences": "An identifier
for the lazy load references subproject/feature",
+ "mobile-frontend-mobile-option-MFEnableWikidataDescriptions": "An
identifier for the wikidata descriptions subproject/feature",
+
"mobile-frontend-mobile-option-MFEnableWikidataDescriptions-description": "A
description of the wikidata description subproject/feature",
+ "mobile-frontend-mobile-option-MFLazyLoadReferences-description": "A
description of the lazy load references subproject/feature",
+ "mobile-frontend-send-feedback": "Link label for sending feedback to
the mobile web beta"
}
diff --git a/includes/specials/SpecialMobileOptions.php
b/includes/specials/SpecialMobileOptions.php
index 21f2432..a371549 100644
--- a/includes/specials/SpecialMobileOptions.php
+++ b/includes/specials/SpecialMobileOptions.php
@@ -3,6 +3,9 @@
* SpecialMobileOptions.php
*/
+// @todo:
+// use MobileFrontendFeatureManager;
+
/**
* Adds a special page with mobile specific preferences
*/
@@ -35,6 +38,7 @@
public function execute( $par = '' ) {
parent::execute( $par );
$context = MobileContext::singleton();
+ $out =
$this->returnToTitle = Title::newFromText(
$this->getRequest()->getText( 'returnto' ) );
if ( !$this->returnToTitle ) {
@@ -76,6 +80,7 @@
$out->setPageTitle( $this->msg(
'mobile-frontend-main-menu-settings-heading' ) );
$out->enableOOUI();
+ $out->addModuleStyles( 'mobile.special.mobileoptions.icons' );
$fields = [];
$form = new OOUI\FormLayout( [
@@ -107,9 +112,43 @@
Html::closeElement(
'div' )
)
] ),
- 'id' => 'beta-field',
]
);
+ // @todo: Piotr magic added here to replace this line
with $manager->getAllFeatures('beta');
+ $features = [
+ //'MinervaEnableBackToTop', < will be
registered by Minerva
+ 'MFEnableWikidataDescriptions',
+ 'MFLazyLoadReferences',
+ //'MinervaShowCategoriesButton',, < will be
registered by Minerva
+ ];
+
+ $isEnabled = $context->isBetaGroupMember();
+ $classNames = [ 'mobile-options-beta-feature' ];
+ if ( $isEnabled ) {
+ $classNames[] = 'is-enabled';
+ }
+ foreach( $features as $key => $featureName ) {
+ $fields[] = new OOUI\FieldLayout(
+ new OOUI\IconWidget( [
+ 'icon' => $isEnabled ?
'mf-tick' : 'mf-lock',
+ 'title' => 'Available in beta
only',
+ ] ),
+ [
+ 'classes' => $classNames,
+ 'label' => new
OOUI\LabelWidget( [
+ 'label' => new
OOUI\HtmlSnippet(
+
Html::rawElement( 'div', [],
+
Html::element( 'strong', [],
+
wfMessage( 'mobile-frontend-mobile-option-' . $featureName ) ) .
+
Html::element( 'div', [ 'class' => 'option-description' ],
+
wfMessage( 'mobile-frontend-mobile-option-' .
+
$featureName . '-description' ) )
+ )
+ ),
+ ] )
+ ]
+ );
+ }
}
$fields[] = new OOUI\ButtonInputWidget( [
@@ -126,6 +165,15 @@
'value' => $user->getEditToken() ] );
}
+ $fields[] = new OOUI\ButtonWidget( [
+ // @todo:
+ 'href' =>
'https://m.mediawiki.org/wiki/Talk:Reading/Web/Mobile_Beta',
+ 'icon' => 'feedback',
+ 'flags' => 'progressive',
+ 'classes' => [ 'mobile-options-feedback' ],
+ 'label' => $this->msg( 'mobile-frontend-send-feedback'
)->escaped(),
+ ] );
+
// @codingStandardsIgnoreEnd
$form->appendContent(
$fields
diff --git a/resources/mobile.special.mobileoptions.icons/mobileoptions.less
b/resources/mobile.special.mobileoptions.icons/mobileoptions.less
new file mode 100644
index 0000000..56d919b
--- /dev/null
+++ b/resources/mobile.special.mobileoptions.icons/mobileoptions.less
@@ -0,0 +1,86 @@
+@import 'mobile.variables';
+
+/*
+SETTINGS PAGE
+*/
+.client-js {
+
+ #mw-mf-settings-save {
+ display: none;
+ }
+ // Checkboxes in form will be upgraded to toggle switches with JS
+ // Minimise FOUC
+ #mobile-options .oo-ui-checkboxInputWidget {
+ visibility: hidden;
+ }
+}
+
+form.mw-mf-settings {
+ margin: 0;
+ padding: 0;
+ padding-bottom: 40px;
+
+ .oo-ui-fieldLayout-header strong {
+ font-weight: bold;
+ }
+
+ .option-description {
+ font-weight: normal;
+ font-size: 0.8em;
+ padding-right: 8px;
+ line-height: 1.4em;
+ }
+
+ .oo-ui-fieldLayout {
+ border-top: solid 1px @colorGray14;
+ padding-top: 12.5px;
+ }
+
+ #beta-field {
+ border-top: 0;
+ padding-top: 0;
+
+ &:before {
+ content: '';
+ width: 100%;
+ height: 10%;
+ background: @colorGray14;
+ padding-top: 20px;
+ margin-bottom: 10px;
+ display: block;
+ }
+
+ &:first-child {
+ border-top: solid 1px @colorGray14;
+
+ &:before {
+ background: none;
+ }
+ }
+ }
+
+ .mobile-options-beta-feature {
+ font-size: 0.9em;
+ opacity: 0.4;
+
+ &.is-enabled {
+ opacity: 1;
+ }
+ }
+
+ .oo-ui-fieldLayout-body {
+ margin-bottom: 40px;
+ }
+
+ // Work around for T180652
+ .oo-ui-fieldLayout-header {
+ width: 65% !important;
+ }
+ .oo-ui-fieldLayout-field {
+ width: 30% !important;
+ text-align: right;
+ .oo-ui-widget {
+ text-align: left;
+ }
+ }
+}
diff --git a/resources/mobile.special.mobileoptions.styles/mobileoptions.less
b/resources/mobile.special.mobileoptions.styles/mobileoptions.less
index 643b482..4ef7f2c 100644
--- a/resources/mobile.special.mobileoptions.styles/mobileoptions.less
+++ b/resources/mobile.special.mobileoptions.styles/mobileoptions.less
@@ -32,8 +32,18 @@
}
.oo-ui-fieldLayout {
- border-top: solid 1px @colorGray14;
+ border-bottom: solid 1px @colorGray14;
padding-top: 12.5px;
+ padding-bottom: 12.5px;
+ margin-top: 0;
+
+ &:first-child {
+ border-top: solid 1px @colorGray14;
+ }
+ }
+
+ .mobile-options-feedback {
+ margin-top: 10px !important;
}
#beta-field {
@@ -59,6 +69,15 @@
}
}
+ .mobile-options-beta-feature {
+ font-size: 0.9em;
+ opacity: 0.75;
+
+ &.is-enabled {
+ opacity: 1;
+ }
+ }
+
.oo-ui-fieldLayout-body {
margin-bottom: 40px;
}
--
To view, visit https://gerrit.wikimedia.org/r/402127
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: If0855122e388e2f6742b19bffaf078e90b18809e
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: specialpages
Gerrit-Owner: Jdlrobson <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
