Commit graph

875 commits

Author SHA1 Message Date
jenkins-bot 0a2408bb61 Merge "Talk overlays should be synchronous" 2019-11-25 23:13:58 +00:00
jdlrobson f1b9c909d7 Talk overlays should be synchronous
Talk overlays are only needed on talk pages, so we can now
unconditionally load them on talk pages and drop usage of
the ResourceLoader loading module.

When binding the section click handlers, the ids of the
associated headings are now removed to avoid ambiguity in
their behaviour.

Bug: T230695
Change-Id: I9b0ef7c5bc389209ed79761582e2f8aa3058c39d
2019-11-25 14:55:50 -08:00
Volker E 2ac6ee0309 Rename LESS variable for unified naming scheme
Change-Id: I89342b7dd01e9aba1b5761bad6cb44ab930d8ceb
2019-11-25 22:54:30 +00:00
Kosta Harlan e8e8c6cf80 Check if title can have talk page before accessing prefixed text
Loading Special:Homepage on mobile betalabs currently results in an error,
`TypeError: currentPage.titleObj.getTalkPage(...) is null`. The call to
canHaveTalkPage results in false because Special:Homepage is in a lower
namespace number than what canHaveTalkPage() checks for.

Before setting talkTitle, check to see if getTalkPage doesn't fail.
Theoretically we might want to wrap other usages of talkTitle to check if it's
undefined but it seems safe to leave them as is.

Bug: T239101
Change-Id: I913fc309458e014b84da054e25e636492e3ed12a
2019-11-25 19:27:00 +00:00
Volker E 9262b6bb09 Remove obsolete toc selector
Removing obsolete code, now that cache has definitely expired from
I720e62a578f0c7a14f4b5a698004471c85e54bc8.

Change-Id: I4f8dc279ed7eeb185e0591b64b91e68c135cf235
2019-11-25 07:31:41 -08:00
Volker E 6dac1b0bc0 Set overflow-y to scroll to avoid reflow
Setting `overflow-y: scroll` to prevent reflow as soon as content
comes in. Adding it to `body` as there might be side-effects when
it's set on both, `html` and `body` and latter seems to be the
place where volunteers or third parties would have set it already.

Bug: T204084
Change-Id: I08e8ceeaea4d8488bc9aee23d26f7791ceaa7ee0
2019-11-18 15:07:49 -08:00
Jdlrobson 10defb5aa1 Merge "Do not jump to the top of the page when the reference drawer is closed" 2019-11-05 19:57:04 +00:00
jenkins-bot 84bc822a4c Merge "Make label for the PDF button in the page-actions menu appear on desktop size" 2019-11-05 19:05:24 +00:00
Jan Drewniak 96ced4d6e3 Make label for the PDF button in the page-actions menu appear on desktop size
Bug: T226562
Change-Id: I60b0f2030b2519a36a2c5bbdc256885980de6420
2019-11-05 19:52:01 +01:00
jdlrobson b4f03d475f Do not jump to the top of the page when the reference drawer is closed
The default behaviour is only needed for the main menu and notification
drawer. In the case of a references drawer where no URL navigation has
occurred, do not reset the hash.

history.replaceState cannot be used here as that interferes with the
OverlayManager's work.

Bug: T237015
Change-Id: I51b8c755933f33a3274aa77dc4e4c0b929d872ec
2019-11-05 17:58:00 +00:00
Nicholas Ray 3a6729841b Remove eventbus usage in talk.js
Now that we have refactored TalkSectionAddOverlay to not use the
eventbus and instead exclusively use the passed in onSaveComplete
callback in I75158ff363d56d55ae385687baf64f8b9d5ca8b0, we can remove the
references in talk.js.

Bug: T230695
Depends-On: I75158ff363d56d55ae385687baf64f8b9d5ca8b0
Change-Id: Ia874fa04c125b00fd1997aa4be8b781d76a18763
2019-11-05 09:51:43 -07:00
Nicholas Ray 2d579183c9 Render talk page as a tab instead of an overlay
Following up on Jon's POC, this will get rid of the talk board component in
favor of linking to the server rendered talk page.

Additional Changes:

* Cleaned up talk selenium tests. Removed talk_steps.rb which doesn't appear
to be used anymore.

* Changed talk add button classes to a single class

* Moved "Add discussion" button to postheadinghtml per design mock

* Added  "...talk-explained", "...talk-explained-empty" messages to
postheadinghtml per design mock

* Due to undesirable jumps in window scroll caused by the section anchor
& Toggler.js code when opening the TalkSectionOverlay (read fixme in
code), a Promise is always returned from OverlayManager route to reset
the scroll position to the top when the section overlay is opened.

* Moved
"mobile-frontend-talk-fullpage",
"mobile-frontend-talk-reply-success",
"mobile-frontend-talk-topic-feedback",
"mobile-frontend-talk-explained"
"mobile-frontend-talk-explained-empty"
messages to minerva as minerva is
the one who initiates those messages now.

* Limited $talk selector to only `.talk` elements since amc talk tab
does not need to be targeted

* After saving a reply from TalkSectionOverlay, the DOM that is not
part of the overlay becomes out of sync since a new reply was created.
To get around this, an `onSaveComplete` callback was passed (similar to
the TalkSectionAddOverlay) to execute a full page refresh. Although this
is clunky, it is the easiest way to resync.

Bug: T230695
Depends-On: I80201394fd7015db6700446142b0b4b20829f12e
Change-Id: I243f1193bce0da9fa710fc3b5379f90b2d079680
2019-11-05 09:51:43 -07:00
Ed Sanders 49dd1fd71a build: Update eslint-config-wikimedia
Change-Id: Ic2148121161b804c3f6f41b9446fcea066f3de0d
2019-10-31 23:08:57 +00:00
jdlrobson 7f68c3d3ad MainMenu is a controller not a View and server rendered (take 2)
There should be no caching implications for this change, as the main menu
has been server side rendered on all wikis since 10th October.

As Stephen pointed out somewhere, this is a bit of a micro-optimisation
Let's simplify this code by always rendering it in the HTML. MainMenu.js
as a result becomes a controller that just decides when to show it.

The geolocation check for Nearby is removed given the fact that all
grade A browsers for mediawiki have Geolocation support.

ev.preventDefault in onSkinClick is dropped since the link to the '#'
(the default behaviour) is wanted

Additional changes
* Browser support suggests "animations" class is redundant now
* `open` event no longer filed - not being used anywhere
* Transparent shield is now managed by the MainMenu controller not
the skin (which was confusing)
* Test geolocation using a simple feature tests
rather than abstracting it away inside Browser
* The main menu button is always hidden under either a translucent shield
and/or the main menu itself when it has been opened
so so it's not possible to ever click it while the menu is open
 - the click handler is thus simplified
removing a check for the class of the button

Bug: T234650
Change-Id: If101eebbdbda1519af922745917237648722820e
2019-10-29 16:37:04 -07:00
Jan Drewniak 3014a6b8d1 Fix page-action menu labels for non-amc mode
Followup to 77a1424e4e

Bug: T226562
Change-Id: I85257e3e0dc32cbc0d04b31486b65743d073e7a3
2019-10-29 17:51:33 +00:00
Piotr Miazga f9c055e7f5 Remove Share feature
The feature got into Beta in over a year ago and never made into
the beta mode. For most of the time it was disabled for all users.
There is no need to keep this code as it is dead code now.

Change-Id: I9037f58b97373195e9d1b9f57789a6c531f42831
2019-10-28 12:54:14 -07:00
Jan Drewniak 77a1424e4e Show labels in page-actions menu on desktop widths
Adds labels to page-actions menu via a new
`.mw-ui-icon-with-label-desktop` class that shows labels at the
desktop break-point.

Bug: T226562
Change-Id: If57ab44660e0dc2a58c04fbf22dee6c27dd1f45f
2019-10-28 12:53:38 -07:00
jenkins-bot b962afe157 Merge "mainMenu: Document result of 0.7em padding-top of footer link" 2019-10-28 19:19:00 +00:00
jdlrobson bfc7540f7f Menu groups have identifiers
For compatibility and consistency/convergence with Vector, Minerva's
menus are linked to their Vector counterparts.

This allows us to get mw.util.addPortletLink to work inside Minerva

Bug: T231925
Change-Id: I121f12497eac6fcf0b63b9ccce561320eb8b3e62
2019-10-25 19:00:54 +00:00
Volker E 3da637156f Use default duration LESS variable and align timing function one
Bug: T236224
Change-Id: I5c709a0989ab22839453e64bcefab201c666bf3c
2019-10-24 14:50:38 -07:00
Timo Tijhof 574650e8f3 mainMenu: Document result of 0.7em padding-top of footer link
Change-Id: I179b418b177971b022c9e543519517a543c86c0d
2019-10-24 20:44:02 +01:00
Volker E 19b1ea2297 Unify transition values across board
Using newly introduced variables instead of fixed values.
Also adding `transition` to property blacklist to ensure using
mediawiki.mixin.

Bug: T236224
Change-Id: I3d2d05f4e50e7b6bba0fe84fae1dde5de5b75492
2019-10-24 12:11:52 -07:00
Volker E 02ac4be0fa Replace color with WikimediaUI palette color
Leftover from our color changes a while ago. Use blue shade for
background like in most other products.

Change-Id: Ic6e7e7a50d5698dfcd302f5988df1327f7435976
2019-10-19 11:56:54 -07:00
jenkins-bot 0c3f7bc52d Merge "Use core watchstar code" 2019-10-15 22:56:25 +00:00
jdlrobson bf8d325388 Use core watchstar code
Apply the mediawiki core watchstar to the
Minerva skin. Note, watchstars in search and other locations will
continue to be provided by the MobileFrontend library (see
follow up patch I7b748dc87089389400b0035c62a3b9a00c2e43f9)

Bug: T234970
Change-Id: I11bbe976412b50dba76a55f37887e4c9235d0be1
2019-10-15 15:33:25 -07:00
jenkins-bot 43b6c80461 Merge "Hardcode page issues vertically alignment" 2019-10-14 14:46:23 +00:00
jdlrobson ab61dbb173 Echo is removed from Minerva
Managing the transition from old implementation to new:
* A version number is exported from skins.minerva.scripts to
tell dormant code added to Echo in I09c27a084100b223662f84de6cbe01bebe1fe774
to begin running.
* A skinStyle is added for the new `ext.echo.mobile` module.
`mobile.notifications.overlay` will soon cease to exist but is kept registered for
backwards compatibility reasons
- Drop ev.preventDefault call from onSkinClick - it is no longer necessary and will ensure
notifications overlay closes when shield is clicked while it is open.

Integration:
* A server side hook SkinMinervaReplaceNotificationsBadge allows Echo to replace
the current Minerva notification badge
* A to-be-created client side hook is subscribed to to deal with the navigations drawer
like functionality using the mainMenu code
* id and class names are added to the container for the NotificationBadge for compatibility with
ext.echo.init in Minerva's desktop mode (it will work like Vector)

See I09c27a084100b223662f84de6cbe01bebe1fe774 for understanding the bigger
picture.

Depends-On:  I09c27a084100b223662f84de6cbe01bebe1fe774
Bug: T221007
Change-Id: I4c11f1b241d629e1b294ebaec17472fbf944f8c7
2019-10-08 23:21:12 +00:00
jdlrobson a66f3a3cec Hardcode page issues vertically alignment
Bug: T234254
Change-Id: If14e52558631a20ea444564fa4758e20cf8ccf42
2019-10-08 20:41:31 +00:00
VolkerE bcd0d25b32 Revert "Last modified should have line-height 1"
This caused T234492. It seems that `1.65` is the minimum to universally satisfy language scripts like Burmese. It predates MinervaNeue being split out and was invented in 2cad4ce3d7af09fba52d87a32518715029eb32a0. While it might not be set with this intention, `1.6` is already cutting off letters. 

This reverts commit 1c7adedda4.

Bug: T234492
Change-Id: I36c85b307bacbbcb9d28c2c60e18da7a412eddae
2019-10-07 23:10:41 +00:00
jdlrobson e72c0d7ba4 Render main menu and shield on server side
This is a second attempt at I3892afb5ed3df628e2845043cf3bbc22a9928921
that is cached HTML friendly and won't cause T234599.

This time rather than solving the entire problem, we'll start rendering
the menu on the server, to allow us in future to drop the Menu code

Bug: T234650
Change-Id: Iea5406ef1c561f2907ec6132481007673aabf1e9
2019-10-04 19:35:28 +00:00
jenkins-bot 18b483b6ea Merge "Revert "MainMenu is a controller not a View and server rendered"" 2019-10-04 15:18:11 +00:00
Jdlrobson 93b16db1c5 Revert "MainMenu is a controller not a View and server rendered"
This reverts commit 111757970e.

Although I cannot replicate the performance issue, the menu doesn't seem to be rendering at all on cached HTML so this is a deal breaker. Back to the drawing board..

Bug: T234599
Change-Id: Idadc5a079340f44ec66d20a38259b6b337d2dcee
2019-10-04 15:03:19 +00:00
jenkins-bot 3c6fd24f00 Merge "MainMenu is a controller not a View and server rendered" 2019-10-03 20:30:02 +00:00
jdlrobson 111757970e MainMenu is a controller not a View and server rendered
As Stephen pointed out somewhere, this is a bit of a micro-optimisation
Let's simplify this code by always rendering it in the HTML. MainMenu.js
as a result becomes a controller that just decides when to show it.

The geolocation check for Nearby is removed given the fact that all
grade A browsers for mediawiki have Geolocation support

Additional changes
* Browser support suggests "animations" class is redundant now
* `open` event no longer filed - not being used anywhere
* Transparent shield is now managed by the MainMenu controller not
the skin (which was confusing)
* Test geolocation using a simple feature tests
rather than abstracting it away inside Browser
* The main menu button is always hidden under either a translucent shield
and/or the main menu itself when it has been opened
so so it's not possible to ever click it while the menu is open
 - the click handler is thus simplified
removing a check for the class of the button

Depends-On: I7fd243366cceae780bd46e1aef2c08dae073f647
Change-Id: I3892afb5ed3df628e2845043cf3bbc22a9928921
2019-10-03 13:13:09 -07:00
jenkins-bot b962edb559 Merge "Remove wgMinervaErrorLogSamplingRate" 2019-10-03 15:26:51 +00:00
jdlrobson 8ee17cf2b0 Remove wgMinervaErrorLogSamplingRate
We are counting errors rather than sending them via EventLogging.
This code is thus being shipped unnecessarily to our users and is
not ever enabled in production

Given our work to use Sentry (T106915) let's remove this code.

Bug: T233663
Change-Id: I71ef7377e91e38f9ccc13493d52ab629d433f8f4
2019-10-03 14:57:14 +00:00
Nicholas Ray 33236091f2 Trigger AmcOutreach on History, Talk, and Desktop links
This follows up on the work from MF:
- I399dd70b5b93fda8c6d1735e3861c5ab2da43bdb
- Id59381ddc330de2b8017963d6a25c6567317faf7

Event handlers are added to the history link, talk link, and desktop
link to support amc outreach. When eligible, the drawer is shown. When
ineligible, logic from the regular handler is executed.

Bug: T226069
Depends-On: Id59381ddc330de2b8017963d6a25c6567317faf7
Change-Id: I0cce0bb6f44801c383556f8c26ee865032d86c8a
2019-10-02 14:55:18 -06:00
jenkins-bot 27f9422613 Merge "Curtail use of mw.mobileFrontend in Minerva" 2019-10-02 00:10:40 +00:00
jenkins-bot 9152466474 Merge "Use consistent small font sizes" 2019-10-01 23:21:01 +00:00
jdlrobson 81bbd6eb48 Use consistent small font sizes
* Add @font-size-minerva-smallest and use it in place
of font-size: 0.8em across the site so that we get a round
number for our font sizes.

Bug: T229568
Change-Id: I4270225c07941b4c164d5e044f70d4b131dbc19d
2019-10-01 22:29:55 +00:00
jdlrobson ef5003f310 Curtail use of mw.mobileFrontend in Minerva
The MobileFrontend dependency in Minerva is problematic.
Code that Minerva needs should live in core.
MobileFrontend should load code on all skins when they operate on
a mobile domain.
This eslint check reminds developers of this in a hope it encourages
more upstreaming to core when possible.
Of course disabling is also an option, but this check will at least
make us aware of when we are moving further away from the goal.

Change-Id: I62183c9aefc81053e4ad81fb746decef2dd24b44
2019-10-01 14:54:59 +00:00
jdlrobson 1c7adedda4 Last modified should have line-height 1
Quick fix to resolve issues with vertical alignment.

Bug: T233172
Change-Id: I3213e6c9935dcc1dd5feb658f6f0321b1437d2ff
2019-09-30 14:56:11 -07:00
Jan Drewniak 51049c0ceb Refactor "last-modified" bar to use flexbox layout.
Brings the last-modified toolbar (links to history page at the bottom
of articles) in line with recent icon changes. Removes the icon
class from the toolbar itself and by employing a flexbox layout,
reducing the amount of CSS required for this toolbar.

Bug: T233172
Change-Id: I27658477aaeed3290aced844caa64fc5e1c34fbd
2019-09-27 00:03:14 +00:00
Jan Drewniak 6e6cdd74c4 [ICONS] Remove padding from .mw-ui-icon-small class
The `.mw-ui-icon-small` class shouldn't include the padding that comes
with `.mw-ui-icon-element`, it should instead render a small icon
without padding.

The right-margin for mw-ui-icon-before is also changed to be
the @icon-padding size instead of a static 1em.

Includes a fix for the "last-modified" bar cause by this change.
This temporarily breaks the reference drawer with error state but that
will be swiftly fixed in I229dd5ae04bde96ba8d5622097ff09ea4324ab0e

Change-Id: Ia44b3157ecec6a036f3bd6287d4b8096748d4afa
2019-09-26 23:07:03 +00:00
jenkins-bot a735151d19 Merge "Clear search alignment" 2019-09-25 22:44:17 +00:00
jdlrobson b15fa199a2 Clear search alignment
* Refactor less variables to make icon touch-area sizes flexible 
* Search input is bumped up 1px to an even number

Bug: T233156
Change-Id: I156d09bfca8db9506c0e9cee21e4d6e0a2e91689
2019-09-25 22:15:21 +00:00
Volker E 46f6449a3b Fix user navigation menu icons' vertical position in Firefox
Bug: T233517
Change-Id: Ic58b894e777f103509222dcf56cf80a39f1e844c
2019-09-24 23:33:04 +00:00
jenkins-bot 8d26958d78 Merge "Remove additional padding left on logout button" 2019-09-24 21:55:17 +00:00
jdlrobson d0c0cad942 Remove additional padding left on logout button
Bug: T233166
Change-Id: Ib51bb9c77d47a78a0b3f02a52fd169a5c06820bf
2019-09-24 13:38:13 -07:00
jdlrobson e888b487f4 Merge skins.minerva.talk and skins.minerva.watchstar into skins.minerva.script
Logic is moved from server to client. Config is added via getSkinConfigVariables (e.g.
passed to mw.config ) and a JavaScript if statement.

The IIFE in watchstar and talk files is replaced with a module.exports function to avoid
refactoring at this point and added risk. The file contents remain the same.

skins.minerva.options is left as is, given the code is more experimental and used in
the beta mode - should not be sent to all clients.

Additional change:
* Remove skins.minerva.toggling (that module has been empty for a week now and functionality
moved to mobile.init module)

Depends-On: Ie71adbe18e8dbeb661ddb9d7d3d1d0897891d515
Bug: T233048
Change-Id: Ife777e76d9d77894fb5d09e7c8f0238b00596a7a
2019-09-24 14:19:18 -06:00
jdlrobson 98d91a66f3 Remove watch and watched icons from repository in favor of Wikimedia UI
Note, because of the two versions of the watch icon, this will temporarily
make the watchstar not display for JavaScript users. The accompanying patch
Ic974b4d6dff14b0d72b8ca71b02c5ef73b1b1d93 will restore this.

Bug: T231613
Change-Id: I16ca70f2892d7418ff245e15f838dfc2b092f3aa
2019-09-19 10:39:27 -07:00
jdlrobson c1b419f715 Drop empty toc.less file
Follow up to I720e62a578f0c7a14f4b5a698004471c85e54bc8

Change-Id: I2fbf3008d712f9e76a49ec194f4f638d4b59d08c
See: T233095
2019-09-17 10:59:39 -07:00
Ed Sanders 8e579c373b build: Update linters
Change-Id: Ie0983466ad0eed0a30d62f28b10efebd0f2eacba
2019-09-17 14:21:30 +01:00
jenkins-bot bbab3daf12 Merge "Remove obsolete .previewnote p selector" 2019-09-17 02:07:02 +00:00
jenkins-bot fde1955293 Merge "Add general messagebox (neutral) styling to shared.css" 2019-09-16 21:48:14 +00:00
Jdlrobson de480f2523 Merge "Fix icon alignment & padding of last-modified bar" 2019-09-16 21:32:34 +00:00
Jan Drewniak 11af0b28b5 Fix icon alignment & padding of last-modified bar
Bug: T229440#5490743
Change-Id: I253d2e680ab1b8ea2b52eb336bfe1648a5238b36
2019-09-16 22:44:16 +02:00
jdlrobson 1735325f47 Correct personal and overflow menu padding and positioning
Bug: T233050
Change-Id: I09d1c53d2088034ab4eec0fa6b4af3daf66e2003
2019-09-16 20:32:19 +00:00
Jan Drewniak 73e87fdc08 Align right-most header icon with content.
uses the CSS :last-child selector to align the last item in the header
with the edge of the container.
This is usually the notification icon in "normal" mode and
the user menu icon in AMC mode.

Bug: T229440
Change-Id: I4430f5659093f76896e2b86e076526a0b51d9630
2019-09-16 11:05:36 +02:00
jdlrobson f8b8074c24 Last modified bar background should fill entire bar
Bug: T232800
Change-Id: If1ff57042b15faa1eee998dc389a996603355208
2019-09-13 22:09:56 +00:00
Jdlrobson 9ec7217d47 Merge "Adjust notification icon to be the same size as the other icons" 2019-09-13 21:53:37 +00:00
Jdlrobson fd3599b603 Merge "Fix truncated text showing through icons & last-modified bar" 2019-09-13 21:53:27 +00:00
jdlrobson 109b24e0ee Adjust notification icon to be the same size as the other icons
Bug: T232011
Change-Id: I0300685d38551bc9ee2c2bd32d6348f32d4df4de
2019-09-13 13:55:01 -07:00
Jdlrobson 4542840cf6 Merge "Utilize the mw-ui-icon-flush-left/right classes to align icons" 2019-09-13 20:33:55 +00:00
Volker E c2fdf9404e Add general messagebox (neutral) styling to shared.css
Bug: T232553
Change-Id: I274471bad1fa402ede4b273444023ea31d2bd502
2019-09-13 13:24:30 -07:00
Jan Drewniak 633c48bddf Utilize the mw-ui-icon-flush-left/right classes to align icons
Affected icons:
- hamburger menu
- "search|notifications|user" menu in page header
- notification "circle" icon
- page actions menu
- section edit icon

Bug: T229440
Change-Id: I5587855d0d9ecf2fac20ce16845e6749c26ab7c2
2019-09-13 12:09:43 -07:00
Jan Drewniak 35e489de25 Fix truncated text showing through icons & last-modified bar
To accommodate for cached HTML a new class last-modified-bar__text
replaces last-modifier-tagline to help us distinguish between old
out dated HTML and the new HTML.

Bug: T232792
Bug: T232800
Change-Id: I53fa45058dbc81c91089840073e03113ff1a4b9c
2019-09-13 18:35:31 +00:00
Nicholas Ray a456e205f8 Fix Main Menu text alignment problems
Per https://phabricator.wikimedia.org/T229440#5490743, the text was not
aligned in the center. This should center it.

Bug: T229440
Change-Id: I4e49d98ad180e54b54255d2844f711f7fcda5fab
2019-09-13 12:34:59 -06:00
Jan Drewniak 2ef6119bed [ICONS] Fix icon positions in page-issues, inline and overlay
Bug: T232837
Change-Id: Ie24b38146b9361f86467d40db7b07b6a5d0655d1
2019-09-13 15:47:50 +02:00
Jan Drewniak be76f05ebb Prepare for new mw-ui-icon spec for Minerva
Includes icon fixes and removal of some CSS overrides.

This causes the following temporary defects to the skin:
* Last modified bar will temporarily be squashed
* clear search  icon will be misaligned vertically

Depends-On:  Ie811d25595d041c35e6c214190101821f3a5d466
Bug: T229440
Change-Id: I0a3a73421791ad353bbcebaeb8241ad062f67ae4
2019-09-12 18:44:44 +00:00
jenkins-bot 02986e7a85 Merge "Change height of overlay headers to 3em, keep site header unchanged" 2019-09-10 22:58:50 +00:00
jdlrobson c0f08790ea Remove the mw-ui-icon hacks and overrides
Note: this agitates T230232 again - when merging this please
make sure a merge for I929090848f3e04647a97f4979ec78682623fa070
is pending.

In various places we try to override the default mw-ui-icon behaviours
The hacks need to be removed as part of addressing the core problem.

Changes:
* Wherever we use mw-ui-icon-before in PHP - wrap the label with a span
so that label font-size is altered where needed - not the icon
* Where a small icon is needed us isSmall parameter for the Icon component
* Apply font-size to labels of mw-ui-icon-before elements
* The browser tests need a slight update to access the span element inside
a menu item - in the case of the logout button the label is always hidden,
so we need to check the visibility of the parent element (secondary_action)

Bug: T229440
Depends-On:  I3f803ec4c9068b30aa93b803391aa4d65d8310ff
Change-Id: I07e4ae233979636b739f1117dd7703571e0a9366
2019-09-10 10:53:20 -07:00
Volker E d7f2ae030f Remove obsolete .previewnote p selector
This has been replaced in Ib678f03e908 by standard `.warningbox`

Bug: T232414
Depends-On: Ib678f03e908fa9dcd5af7632941475203478abf7
Change-Id: Ifb85ef51cdf1d39122e286cb8a7c6620a7bae09e
2019-09-09 16:58:50 -07:00
jenkins-bot 53ad4bac32 Merge "New table of contents icon, prepare for arrow->expand rename" 2019-09-09 19:25:29 +00:00
Timo Tijhof 6e4afbf3bb mediawiki.RegExp (deprecated) -> mediawiki.util
Bug: T218339
Change-Id: I6913330609c03a0418af2ab54aa31f27a52dc6d0
2019-09-09 18:10:35 +00:00
jdlrobson fea60ba244 New table of contents icon, prepare for arrow->expand rename
Bug: T231613
Change-Id: I86a4bdac83e1d6caef025ad025962127d74556dd
2019-09-09 10:39:52 -07:00
Nicholas Ray f7baa81b17 Remove skins.minerva.scripts/overlayManager.js
Instead, I think we can just use:

```
M.require( 'mobile.startup').OverlayManager.getSingleton()
```

Change-Id: I3c1d5d8ffb95eea7cf076c86e8e9578aff7f95a8
2019-09-06 14:32:01 -06:00
jdlrobson 96cee263fb Dev: Access OverlayManager via singleton method not M.define
Change-Id: Icb152f21bfd3a091676980a025dc651e49f49312
2019-09-06 19:30:22 +00:00
jdlrobson 497044290a MobileFrontend is now managing the toggling code. Remove.
Depends-On: I6bdeb7198082c4b1d0a32960cc4dc679ff4c6762
Change-Id: I1815a730fc12f68c287d58f2de6f92e05db3abd2
2019-09-06 15:50:00 +02:00
Volker E 1f27981ed1 Consistently use .transform() mixin
Make use of mediawiki.mixins' `.transform()` mixin for widest available
browser support.
Follow-up to I720e62a578f0c7a14f4b5a698004471c85e54bc8

Change-Id: I771a5a6e2020e323bf4cefdb944c26bdcce26ee2
2019-09-03 15:33:10 -07:00
Bartosz Dziewoński ee80c16f2c Change height of overlay headers to 3em, keep site header unchanged
Split @headerHeight variable into @siteHeaderHeight and @overlayHeaderHeight.
@overlayHeaderHeight is now set to 3em (48px).

Use @siteHeaderHeight for the base skin interface, and @overlayHeaderHeight
for overlays.

skinStyles/mobile.notifications.overlay/minerva.less:
* Update footer height to remain the same as header height.

skinStyles/mobile.startup/search/SearchOverlay.less:
* Use @siteHeaderHeight even though it is an overlay, because it's
  supposed to exactly match the base skin interface.

Bug: T215426
Change-Id: Iaa36f581a12a8eea2b755ae583b8a2c6324ebe29
2019-09-03 22:30:20 +00:00
jdlrobson 15323b3d63 Use core table of contents in Minerva
No more using the TableOfContents component in MobileFrontend. It's
just creating more work for us. The end result is exactly the same - we can make
a table of contents using the checkbox hack rule and CSS that looks identical to
the current table of contents.

For now, this change can only be tested on Minerva desktop.
I2ea1c23bc86871e2a095c4c6674a08ff2f04b160
is the patch that goes for the jugular and applies this to mobile Minerva. It's
important we merge the two together to avoid disruption to this feature, as
currently MobileFrontend strips the table of contents from core from the HTML
using the MobileFormatter.

Change-Id: I720e62a578f0c7a14f4b5a698004471c85e54bc8
2019-09-03 19:02:31 +00:00
Stephen Niedzielski 17ffe01016 [hack] [toolbar] tighten the icon spacing
Reduce the spacing between toolbar icons in a kind-of sort-of hacky
kinda way.

Bug: T230232
Change-Id: I53d194bc0fe760d1b855ca84bcd4b40ce2ec4c2e
2019-08-30 17:58:26 +00:00
Stephen Niedzielski 936ec8dcb4 [LESS] remove unused variables
Identified by:

  find -type f -name \*.less|
  xargs -rd\\n sed -rn 's%^\s*(@[a-zA-Z0-9_]+):.*%\1%p'|
  xargs -rd\\n -I{} bash -c "rg '{}''[^:]' > /dev/null || echo '{}'"

Change-Id: I64e02731e9f8b69ce8e934502208c061d595b673
2019-08-29 16:35:00 +02:00
Stephen Niedzielski 3c55b23d61 [icon] revise icons
Update the icons.

Bug: T229440
Change-Id: I4460efba7b122b2a66e65924f311bb87f84160e5
2019-08-29 13:20:35 +02:00
jdlrobson e5aeeea2a8 Restore contributions icon to non-AMC menu
Bug: T231363
Change-Id: I82b9b06a83454cf4b49d906a8358b338d30f892a
2019-08-27 11:00:52 -07:00
jenkins-bot 505a191755 Merge "Avoid unnecessary stopPropagation usage so event click tracking can work" 2019-08-27 10:01:44 +00:00
jenkins-bot 03d82134f9 Merge "Separate AMC icons from non-AMC icons" 2019-08-27 00:16:33 +00:00
jenkins-bot 0a7608085d Merge "Disable hyphenation for links" 2019-08-26 23:30:07 +00:00
jdlrobson 062e067d49 Separate AMC icons from non-AMC icons
Currently a bunch of icons are loaded for all users that are only
ever used for AMC. Clean this up and add notes on the necessary steps
if these ever become the default.

Bug: T229295
Change-Id: I4e16028e7121b0b3e1a60b9404183d483db52ad8
2019-08-26 19:12:48 +00:00
jdlrobson 44954fe3fd Avoid unnecessary stopPropagation usage so event click tracking can work
Hamburger menu item - stopPropagation and associated comment seem
unnecessary.  Clicking page center is supposed to hide open menus!

Notification item - also unnecessary and outdated comment. Works as
expected without

Talk links - no reason to stopProgation (which happens when you return
false) - only event.preventDefault is needed.

Edit icon - see depends on

Depends-On: Ie23ae7d8dba31b5f524693e60580032e2ccd714f
Bug: T220016
Change-Id: Ica95076f4399d173d49087e5c866f55fe6aec597
2019-08-26 11:43:11 -07:00
jdlrobson 9150aec131 Feature flag overhaul
Two new feature flags:
1) MinervaPersonalMenu
2) MinervaAdvancedMainMenu

Changes:
* AMC defaults to false on desktop - desktop doesn't have AMC mode it just
enables several skin options.
* WHen inserting a link at the bottom of the page check whether the talk at top
of the page (tabs) is enabled.. not AMC
* Update ServiceWiring to construct menu based on MinervaAdvancedMainMenu
and  MinervaPersonalMenu - note when former is enabled but not latter there is
no way to logout. Noted in README.
* Use one entry point for skins.minerva.amc.styles/index.less
* Document files inside skins.minerva.amc.styles to make it clear which features
they are associated with
* Drop history page styles when AMC is disabled - it's not possible to ever get to
these as the history page redirects in non-AMC mode
* Rename the class .minerva--amc-enabled to minerva--history-page-action-enabled
to reflect its real purpose and move styles from skins.minerva.base.styles to skins.minerva.amc.styles
No need to worry about cached HTML as AMC runs without cache...
* Remove isAnyAMCOptionEnabled - it's an antipattern and should be discouraged as it discourages the
art of feature flagging. Nothing is using it after these changes.
* The AMC_MODE flag is disabled. There is no need for this - AMC is not a feature and therefore not a
skin option. It is a mechanism for turning on other skin options. Tests are updated.

Testing:
It should now be possible to enable any feature in `beta` and see it in the beta of the
site.

Bug: T229295
Change-Id: I48959905f5c09721b14a27aa1a5ad82849ac6263
2019-08-23 10:48:14 -07:00
jenkins-bot c543219d3a Merge "Dev: Prep for storybook" 2019-08-21 21:08:25 +00:00
jdlrobson 7280d255c0 Dev: Prep for storybook
* Remove ambiguity in imports - say the file extension
'less' for all instances of variables and mixins.
* Separate toast styles from drawer styles so they can be
imported separately
* associate header-action selector with its parent
(.overlay-header) not parent's parent (.overlay) so it can be imported
and rendered without the Overlay.

Change-Id: Ib7e19a440ba095d6424d35305fb41d643ca9764c
2019-08-21 12:20:26 -07:00
Shreyas Minocha 9d6a5caf14 Disable hyphenation for links
Should fix a misleading "bug" I noticed wherein URLs sometimes break
over multiple lines with hyphenation, for example `www.exam-ple.com`.

Change-Id: Id96d708e6ba59d6e6a6a093c3195b5121160c899
Bug: T230860
2019-08-21 06:24:35 +00:00
jdlrobson ab8da137cb Provide access to original redirect page on toasts
Color progressive/destructive (blue and red) do not make
sense on a black background, so we use white and underlined
for both of these. Note these don't seem to be used currently
so this is not a breaking change.

Bug: T150189
Change-Id: I78a92b5b6c76638633b99fe32670911d355ce6f3
2019-08-12 22:48:14 +00:00
jdlrobson e09a6930b8 Go back before replacing current overlay
There are 2 ways to reach the talk topic create overlay
1) Navigating via link in page directly (currently only possible
on talk pages via new topic button)
2) From the list of talk topics

After saving in both cases you want to "GO BACK" and exit the overlay
before replacing it - otherwise what happens is you end up
replacing the create talk topic overlay with a list of talk topics
with the old instance of the talk overlay underneath (which causes
the OverlayManager a lot of confusion)

You need to go back before replacing stuff.

Bug: T229972
Change-Id: I7cc65dab8883744496380f4e1119cdc31f18f791
2019-08-12 20:33:33 +00:00
jdlrobson 59fe37cde1 Use showReference function rather than deprecated ReferenceDrawer
Bug: T217295
Depends-On: I2ef762dbc1458411dd8ed746b7e829a2924740e3
Change-Id: Ia90ba47f152315fd39da368edac986b55f8bd5a0
2019-08-12 18:58:25 +00:00
Stephen Niedzielski bfdfc1165c [UI] [menu] slide the main menu over the page
Slide the main menu over the page instead of sliding the page over the
menu. Also, use viewport units for the main and notification menus.

Note, this lays foundation work for T225213.

Bug: T206354
Change-Id: I14b67d1e97b84086ea13e28df8148824a1f493e3
2019-08-12 18:22:45 +00:00
Ed Sanders aad8addcec AMC actions: Increase touch target size to 44px
Bug: T230033
Change-Id: I3ec9091380d48e2fcedb8d222fa22b0143f7bceb
2019-08-11 12:42:05 +01:00
Stephen Niedzielski 83f90dacad [fix] [Visual Editor] [LESS] [content] create stacking context differently
b96ab7bd created a new CSS stacking context[0-1] for .content.
Unfortunately, this triggered a browser bug[2] which affects VE edit
cards (an unwanted margin appears around them). This also occurs when
creating a stacking context with filters. The issue does not occur when
the stacking context is created by changing position or opacity. Replace
the identity transform a `position: relative`.

[0] https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
[1] https://stackoverflow.com/questions/16148007/which-css-properties-create-a-stacking-context?answertab=votes#tab-top
[2] https://bugs.chromium.org/p/chromium/issues/detail?id=20574

Bug: T230154
Change-Id: I23ad776f0bcde8f7eec5ffbdefb8f0825db084ec
2019-08-08 13:17:13 -06:00
jenkins-bot 78748794c6 Merge "[dev] [LESS] use z-index symbol instead of hardcode" 2019-08-08 16:42:31 +00:00
jenkins-bot fb383c6356 Merge "[LESS] [content] lower content render order" 2019-08-08 13:56:41 +00:00
jenkins-bot 15434e6267 Merge "[fix] [LESS] remove main menu styles duplicate" 2019-08-08 00:45:07 +00:00
jenkins-bot 4cbba412d6 Merge "Revert "MainMenu no longer manages classes on the body tag"" 2019-08-08 00:45:05 +00:00
Stephen Niedzielski de29b14be6 [fix] [LESS] remove main menu styles duplicate
MainMenu.less was unintentionally duplicated in a previous commit as
mainmenu.less. Remove it.

Change-Id: I37103432fcee3fbfe6b57db435f9cc727f61a3f6
2019-08-07 18:14:11 -06:00
Niedzielski 6241c8dad7 Revert "MainMenu no longer manages classes on the body tag"
This reverts commit 354de09fa7.

When tapping notifications, both main and notification
menus are shown.

Change-Id: Iaa3ca4d2c7eadb1c9888b514d08895c658336d10
2019-08-07 23:43:43 +00:00
Stephen Niedzielski b1cbc639da [dev] [LESS] use z-index symbol instead of hardcode
@z-indexBase is 0. @z-indexBase - 1 is -1 which is identical to the
symbol @z-indexOccluded. The calculation didn't seem to add much to the
clarity of the code so use the symbol for grepability.

Change-Id: Ie8dcbca00a0a3e1d08a4ffe0b4fb3b71257f69c0
2019-08-07 14:44:56 -06:00
jenkins-bot 095f0f245f Merge "MainMenu no longer manages classes on the body tag" 2019-08-07 20:37:23 +00:00
jdlrobson 354de09fa7 MainMenu no longer manages classes on the body tag
The responsibilities of managing the classes on the body tag are
pulled upwards from the Menu code.

Due to the absence of global state/Redux like thing, the open and close
navigation drawer methods remain for the time being.

Bug: T206354
Change-Id: I77cd8ff75b0d4487ad19c1506a2911791542d70f
2019-08-07 20:11:09 +00:00
Stephen Niedzielski 73a95866bc [menu] [UI] [notifications] make notifications slide over top
Animate the notifications menu over the content instead of the content
over the menu. Try to trim unnecessary CSS.

Bug: T206354
Bug: T226125
Change-Id: I08f65798ef41da3c7c48fb5c65e31c6a3dd71af1
2019-08-07 19:42:48 +00:00
Stephen Niedzielski b96ab7bd40 [LESS] [content] lower content render order
Create a new stacking context for page content. Previously, it was
possible for on page content to defeat the skin's z-index values with
superior numbers. This occurred with StructuredDiscussion OOUI widgets
on https://test.m.wikipedia.org/wiki/Talk:Main_Page and the
`position: sticky` header on Special:Notifications.

`scaleY(1)` is an identity transform that is terse and unlikely to be
confused when RTL flipping.

Bug: T225959
Change-Id: If8f718a707d9dd07e1182bc26e63e6e665bf98c2
2019-08-07 13:24:02 -06:00
Stephen Niedzielski 10076c1b61 [dev] divide main menu LESS
Split apart the extensive mainmenu.less file into a few component-like
files: MainMenu, MainMenuFooter, MainMenuItem, and NotificationsOverlay.
Two variables, @duration and @easing, were moved to minerva.variables.
The separation is imperfect as some overlap still exists but is far
better than before.

This patch is focused on division without regression. Please limit any
refactor requests.

No user visible changes intended. The only selector that was cognizantly
changed was to duplicate the drawer visibility on main menu and
notifications overlay:

  // Old: mainmenu.less
  .navigation-drawer,
  .transparent-shield {
    visibility: visible;
  }

  // ---

  // New: MainMenu.less
  #mw-mf-page-left,
  .transparent-shield {
    visibility: visible;
  }

  // New: NotifcationsOverlay.less
  .navigation-enabled {
    .notifications-overlay {
      visibility: visible;
    }
  }

The is unfortunately useless. It is best to reproduce these changes
locally by renaming mainmenu.less to MainMenu.less and extract parts to
MainMenuFooter, MainMenuItem, and NotificationsOverlay LESS files until
the result matches.

Bug: T206354
Change-Id: I8d37c5346efcf39a4d76322fd6e6af3fff96ac53
2019-08-07 16:48:31 +00:00
Ed Sanders b836141c9f Remove outer border from overflow tables
Bug: T206762
Change-Id: Ice5e85d10d932a93094228629201afd98a9cc1f4
2019-08-05 12:40:18 +01:00
Stephen Niedzielski 0867ff03aa [fix] [notifications] fix icon width
When notifications are present, the wrong icon width was used. Set the
icon width and remove a useless class, main-header-button.

https://codesearch.wmflabs.org/search/?q=main-header-button&i=nope&files=&repos=

Change-Id: Ie274ffcc93cf576f36eb0fccee80ecd3d4ac3a21
2019-08-02 14:39:04 -06:00
jenkins-bot 77d0632959 Merge "Do not hide notifications icon when drawer open" 2019-08-02 15:17:03 +00:00
jenkins-bot 7c869ec86a Merge "Remove all main_menu tracking related code.""" 2019-08-02 14:06:23 +00:00
jdlrobson 223f22d1c9 Do not hide notifications icon when drawer open
Bug: T228890
Change-Id: I7af7d4d760a443bd2c7dcce04fabb7e80dd35524
2019-08-01 21:35:25 +00:00
jenkins-bot df7abeae25 Merge "Empty subtitle elements should not have margin" 2019-08-01 17:48:58 +00:00
Jdlrobson 8d703b7758 Remove all main_menu tracking related code.""
This reverts commit de353c06c9.

Bug: T228681
Change-Id: Idfd964c31e09e271dca9ac39f7932df49cdcb5f6
2019-08-01 10:40:09 -07:00
jenkins-bot d688190547 Merge "Don't show download button on missing pages" 2019-08-01 17:24:08 +00:00
jdlrobson 64896669e2 Empty subtitle elements should not have margin
I considered not outputting the subtitle, but the PHP mustaching
templating library requires truthy values and that seemed like overkill

Bug: T217197
Change-Id: I3ebe550bad8b5eb0f24d742261ea696950c91a59
2019-08-01 17:18:32 +00:00
jdlrobson a0e5139e40 Don't show download button on missing pages
Additional: Pass in a page rather than a skin - skin is not
used anywhere other than to get the page

Bug: T211775
Change-Id: Ia7c56158773ac16992fb1ebf002131e9c24dda14
2019-08-01 16:11:57 +00:00
jdlrobson c63fceea6e Normalize small fonts
We use 0.9em in a variety of places, to shrink font-size from the
default font-size. However given we use 16px as a base font this results
in a font-size of 14.4px. This can also cause problems with icons resulting
in rounding errors when used with multiple icons

This changes the font-size to 14px for those areas and makes future usages
centralized by adding a specific variable.
Also amending `@font-size-browser` variable to be aligned to naming convention
and equal to Vector one.

Bug: T229399
Change-Id: I8e31bca2982c049a9be73c89aa9e8e2aa8141269
2019-08-01 16:11:29 +00:00
jdlrobson 02c43249cd partly correct the transitions between talk overlays
Tapping browser back button now does not show the underlying article
However clicking the back icon does (which can be fixed by a hack
see I80328b388b2e2da105bd670a3679b4ed3061b33a )

This works because displaying the talk overlay triggers a load
to mobile.talk.overlays (for talk topic board) so the other overlays
are guaranteed to be ready by the time you want to transition to them.

Bug: T221978
Change-Id: Ic3b448169d52880b38408da47af9e4576c585e16
2019-07-31 23:40:34 +00:00
Stephen Niedzielski 93f930ce3e [UI] [menu] remove menu height resizing
Remove the page action overflow and user menu height sizing. Previously,
a maximum menu height was set so that the menu itself would scroll. A
minimum height was also used so that the menu couldn't be shrunk down to
a silly size. Both the minimum height LESS and maximum height JS are now
removed.

Bug: T225959
Change-Id: I201374ab8b249272ee5dbb1401b844ffe034ea66
2019-07-31 20:05:54 +00:00
jenkins-bot eb157118f0 Merge "[UI] [main menu] make menu scrollable" 2019-07-31 18:30:26 +00:00
Stephen Niedzielski 2c070409f4 [UI] [main menu] make menu scrollable
Adds a scrollbar as needed to the main menu.

Bug: T218206
Change-Id: I71f75128939eba56dea10a8092b67820736934ce
2019-07-31 11:15:27 -06:00
Roan Kattouw ec17da76c1 Improve tab scrolling logic
* If the leftmost tab is selected, scroll all the way to the left
* If the rightmost tab is selected, scroll all the way to the right
* If a tab in the middle is selected, scroll to center it
* If the selected tab is wider than the tab container, make sure its
  start (left edge in LTR, right edge in RTL) is always made visible.

As Bartosz reminded me, .scrollLeft in RTL is a cross-browser nightmare
(see https://github.com/othree/jquery.rtl-scroll-type), so add a bunch
of code working around this. Some of this logic is in OOUI already, but
what's there is not enough for what we need here, and we also don't want
to load OOUI for this.

Bug: T223142
Change-Id: Ica298954b42f9daa4819043ec24bc0266290a927
2019-07-30 18:35:14 -07:00
jdlrobson dfb3e0b8c7 Restore MobileWebMainMenuClickTracking logging (old way)
menu/schema is never imported so it never executed.
Move it into initLogging which seems to the be the logic place
for this code to execute

Change-Id: Iec85548cf96fcc7ea96977d0aa89f601dbd8599f
2019-07-30 15:41:35 -07:00
jenkins-bot fd38627869 Merge "Subtitle appear below page actions" 2019-07-30 20:26:32 +00:00
jenkins-bot 13475413e7 Merge "Dev: Simplify red link drawer" 2019-07-30 20:06:37 +00:00
jenkins-bot 2ca195c98f Merge "[UI] [AMC] add recent changes to the AMC menu" 2019-07-30 19:58:40 +00:00
Stephen Niedzielski 805cc92e73 [UI] [AMC] add recent changes to the AMC menu
This mostly reverts commit 692309090d and
updates the icon.

Bug: T224216
Change-Id: I7200aaef5a15479afb4bc99f5195e900351a055a
2019-07-30 11:27:34 -06:00
jdlrobson 87a0795ed8 Subtitle appear below page actions
Bug: T217197
Change-Id: I6582db82ac750783dffa5612c9a0b3ccc86749a1
2019-07-30 09:59:58 -07:00
jdlrobson 0443f9936f Dev: Simplify red link drawer
* Remove event and add class .hide so that it uses event defined in
Drawer class
* Use actionAnchor - it achieves the same purpose

Change-Id: I2570de1e692a22c9383a850460eabb75b3d8eaf5
2019-07-30 08:29:29 -07:00
jdlrobson afecb58a88 Restore desktop MMV
Changes in the MultimediaViewer extension mean Minerva's onClick event
is preventing the default of the click handler in MultimediaViewer.

Explicitly do not setup our multimedia viewer version when the desktop
MMV is present!

Bug: T227034
Change-Id: I94e22d045346d53bb2c50035281398799fb6c7ac
2019-07-29 23:36:16 +00:00
jenkins-bot e9a879e635 Merge "Drop lazy loading references feature usage" 2019-07-26 19:58:47 +00:00
jdlrobson d1cd558821 Drop lazy loading references feature usage
This temporarily and quietly breaks references display in beta
on the assumption
that I2dcf9b0cbfe2f46eb6763e0add4ed892d1fbecd9 will be merged swiftly
afterwards.

Bug: T123328
Change-Id: I2dcf9b0cbfe2f46eb6763e0add4ed892d1fbecd9
2019-07-26 19:04:46 +00:00
jdlrobson f0503a52d0 Refresh the user, bell and search icon
* New module skins.minerva.icons.wikimedia provides icons
from Wikimedia UI in Minerva
* search selector in skins.minerva.content.styles.images is
retained for cached HTML
* skins.minerva.icons.loggedin now a
ResourceLoaderOOUIIconPackModule and bell removed from repo.
* userAvatar replaced with userAvatarOutline

Bug: T224070
Change-Id: Ibed609371060acc4b69e5cd4cd4f20edc871b3ba
2019-07-25 16:35:01 +00:00
jenkins-bot 84b950da58 Merge "[UI] [new] add user menu" 2019-07-24 18:41:46 +00:00
Stephen Niedzielski 0a4f5b6126 [UI] [new] add user menu
Add new user menu. The changes required include:

- Break up AuthMenuEntry into reusable components. They're now simple,
  independent, static functions in AuthUtil that are easy to reason
  about and compose.

  There's lots of verbose code because of the builder and director
  patterns. That is, most of the code is for building the thing we
  actually want to build instead of just building it. It's easy to write
  but no fun to read--even simple configurations are extremely verbose
  expressions that must be threaded through the system.

  These builders are also single purpose and unlikely to be reusable
  unlike a URI builder, for example. As objects, they're not especially
  composable either.

- Similarly, break up Menu/DefaultBuilder into BuilderUtil and ban
  inheritance. Inheritance has not worked well on the frontend of
  MobileFrontend. I don't think it's going to work well here. E.g., I
  could have made changes to the base class' getPersonalTools() method
  such that the client passes a parameter for the advanced config or
  maybe I just override it in the subclass. In either case, I think it
  makes the whole hierarchy nuanced and harder to reason about for
  something that should be simple.

- Add ProfileMenuEntry and LogOutMenuEntry for the user menu.

- Rename insertLogInOutMenuItem() to insertAuthMenuItem() which matches
  the entry name, AuthMenuEntry.

- Extension:SandboxLink is needed to display the sandbox link in the
  user menu.

- Performance note: the toolbar is now processed in MinervaTemplate,
  which corresponds to removing the buildPersonalUrls() override.

- To mimic the design of main menu, the following steps would be
  necessary:

  1. Create a user/Default and user/Advanced user menu builder and also
     a user/IBuilder interface.
  2. Create a user/Director.
  3. Create a service entry for Minerva.Menu.UserDirector in
     ServiceWiring. The Director is actually powerless and doesn't get
     to make any decisions--the appropriate builder is passed in from
     ServiceWiring which checks the mode.
  4. Access the service in SkinMinerva to set a userMenuHTML data member
     on the Minerva QuickTemplate.
  5. In MinervaTemplate, access the userMenuHTML QuickTemplate member
     and do the usual song and dance of inflating a Mustache template.

  This patch does everything except add a service, which was agreed to
  be unnecessary, so that logic is now in SkinMinerva.

- Wrap the existing echo user notifications button and new user menu
  button in a nav element. This seems like a semantic improvement.

- The existing styling and logic for the search bar and search overlay
  are pretty messy and delicate. Changes made to that LESS endeavored to
  be surgical. There's lots of room for improvement in the toolbar but
  it's out of scope.

- Rename logout icon to logOut.

Bug: T214540
Change-Id: Ib517864fcf4e4d611e05525a6358ee6662fe4e05
2019-07-24 18:24:07 +00:00
jdlrobson 0c5ca96031 Drop mobile.init dependency
Depends-On: If0de2d74139131be592d8edc2dbf063e9b98860c
Bug: T216537
Change-Id: I4b8011f5b73000a01d9cea032a6287b24b10f6ec
2019-07-24 15:28:49 +00:00
Pmiazga de353c06c9 Revert "Remove all main_menu tracking related code."
This reverts commit d11c84d08b.

We decided to track both old MobileWebMainMenuClickTracking and new MobileWebUIActionsTracking for some time. Then once everything goes stable and it's proven to work correctly we will merge d11c84d08b.

Bug: T220016
Change-Id: Ib4d52e8b8c870774041284e575564a9933af6136
2019-07-22 18:31:55 +00:00
Jan Drewniak 8ae59453de Reduce margin below article/discussion tabs.
Bug: T225230
Change-Id: I318848d8e47b0a7d4f47946a1f2ae22a5c7878bb
2019-07-22 13:42:12 +02:00
jenkins-bot 9352a70023 Merge "Remove all main_menu tracking related code." 2019-07-19 16:24:49 +00:00
Piotr Miazga d11c84d08b Remove all main_menu tracking related code.
This code should live in WikimediaEvents extension, not in
Minerva.

Bug: T220016
Depends-On: Ic2d6d1b21b0eb72ad68b0c447bc63f7d1bb021f4
Change-Id: Iaeb12704dcd257f0783f1ebec3def01cb2848228
2019-07-19 15:30:28 +00:00
jdlrobson 0320d1a9af Talk overlays for creating new topics now use callback
This copies across code from MobileFrontend and gives
Minerva full control of the lifecycle of this talk
overlay.

Depends-On: Ie2d54659ae746acc3d18368b19918aaafb236202
Bug: T228418
Change-Id: Ice1a56fbb24d9b314dfa7b2d73a4642ad1bc0593
2019-07-18 15:19:12 -07:00
Bartosz Dziewoński 1fed815868 Allow .transparent-shield styles for navigation to be reused
Define the color etc. in the base styles, so that other drawers will
not have to redefine them to display the shield.

Bug: T214049
Change-Id: Ife957374cb0d21446db2067171e68fb726ad8347
2019-07-17 23:32:37 +02:00
jenkins-bot 2d9be80368 Merge "Use wikimedia.ui from core directly" 2019-07-17 15:15:12 +00:00
jdlrobson 0a4f88b317 router.navigate is deprecated use router.navigateTo
The navigate method does not accept a second parameter for
replacing state. navigateTo was what was wanted.

Mark navigate as deprecated (to match ooui router) to make
sure this doesn't happen again.

Bug: T226106
Change-Id: Ie86fa632b2175727417b166c222c29bdf12bfea4
2019-07-16 16:50:58 -07:00
jenkins-bot e6b4f4f2b2 Merge "Make sure lazy loaded images display in printed PDFs" 2019-07-16 23:39:27 +00:00
jdlrobson e27debc1dd Use wikimedia.ui from core directly
There's no reason to copy and paste all this here. These icons
can be imported directly from core using ResourceLoaderOOUIIconPackModule

Depends-On: I7800da87a6a10399f705b43e05c8592c766bae6f
Change-Id: I1f25aaca9b7313cd95cefc7f5629b8a7e65c887f
2019-07-16 22:20:25 +00:00
jdlrobson a9d73060fa Restore table of contents and error logging
When moving to packageFiles, the modules errorLogging and toc
were not imported by init.js meaning they were not run.

ResourceLoader should probably error in this situation, but until
then we should fix this problem.

This is a follow up to I44790dd3fc6fe42bb502d79c39c4081c223bf2b1

Bug: T212944
Change-Id: I86efb7be1c39b03f63c8f1e0b107216cd30ff6de
2019-07-16 14:45:35 -07:00
jenkins-bot 6076c61772 Merge "Embrace packageFiles" 2019-07-16 21:21:42 +00:00
jenkins-bot 937d2b48ea Merge "On user pages, move language icon from Toolbar to Overflow menu" 2019-07-16 20:09:04 +00:00
jdlrobson 72df451bd3 Embrace packageFiles
Help with readability by using module.exports and require rather than the MobileFrontend
provided mw.mobileFrontend module manager (and avoid adopting webpack at this time)

Replace usages of mw.mobileFrontend.require with local require and module.exports
(compatible with RL or Node implementation)

Changes:
* Notifications modules are merged into skins.minerva.scripts and initialised
via a client side check.
* new file overlayManager for exporting an overlayManager singleton
rather than being hidden inside resources/skins.minerva.scripts/init.js
* All M.define/M.requires swapped out for require where possible
The `define` method is now forbidden in the repo.

Bug: T212944
Change-Id: I44790dd3fc6fe42bb502d79c39c4081c223bf2b1
2019-07-16 18:04:10 +00:00
Stephen Niedzielski 21b24830b5 [dev] match page issues LESS filename to JS naming
Bug: T212944
Change-Id: I0fa44cdb26b24fff87a7c4dfd424fe4400ceee22
2019-07-16 18:03:44 +00:00
Piotr Miazga dee1c197b9 On user pages, move language icon from Toolbar to Overflow menu
The Language icon is not useful on user pages as most probably there
are no translated user pages, thus there is no need to show all-time
disabled Language icon.

If overflow menu is available, don't show Language switcher icon in
toolbar, show it as first item in the overflow menu.

Bug: T224735
Follow-Up: I46d58758356e870c408a74b2c087a42d6ad0ddea
Change-Id: I05be9e6457257a1f2eb224ca9ec5808814bc9ed7
2019-07-16 17:51:11 +00:00
jenkins-bot 4e2458aeba Merge "Make Minerva use new PageHTMLParser.js and refactored Page.js" 2019-07-15 23:12:58 +00:00
Nicholas Ray 331df226f5 Make Minerva use new PageHTMLParser.js and refactored Page.js
In I02f8645aac1d7b081eaba8f2ac92a2ef51f78182, Page.js was made into a
model and its html parsing responsibilities were moved to
PageHTMLParser. Additionally, a singleton for the current page
(currentPage.js) and a singleton for the curent page html parser
(currentPageHTMLParser.js) were introduced to replace the usage of
M.getCurrentPage().

This commit refactors Minerva to make use of these changes.

Notable changes:

* 🐛 The event bus singleton was added to references.js since it
previously relied on an instance of Skin to listen for the
`references-loaded` event. However, this event is emitted on the event
bus singleton.

* Additionally, I didn't see a reason why the `references-loaded` event
needed to also pass the current page instance when the only file
listening to it is references.js (which already has the current page
instance) so I removed that and the convoluted passing of page.js within
the file. I assumed this logic was unecessary.

* The call to drawer.showReferences in references.js now was made to
pass the currentPage instance as well as the currentPageHTMLParser. This
is to prepare for I6e858bbe73f83166476b5b2c0fdac1cca7404246 where the
getReferences() interface for ReferencesMobileViewGateway.js and
ReferencesHtmlScraperGateway.js is refactored to accept both of these
instances. Additionally, references.js was refactored to support event
delegation which gets rid of some parsing/setup logic.

Bug: T193077
Depends-On: I02f8645aac1d7b081eaba8f2ac92a2ef51f78182
Change-Id: I2f32dbcc4ebaa4bebb297cda1ecce3457922b343
2019-07-15 16:43:51 -06:00
jdlrobson 6df395f141 Guard against undefined config variable
Bug: T225423
Change-Id: Icfbd90c52d9f27ee58bde15c010f705b081285ab
2019-07-12 13:06:52 -07:00
jdlrobson d996008e9a Make sure lazy loaded images display in printed PDFs
The CSS animation will never complete in print media so will not display
in PDF rendering. A note is added to explain this rule.

Bug: T220668
Change-Id: I82260fa4e18a13970243d3cb2fc585aefb3c1d09
2019-07-09 10:50:46 -07:00
jdlrobson 9b4c22f31f Update page issues folder structure
Tests are untouched as these will be moved to headless
node-qunit in a follow up.

Bug: T212944
Change-Id: I3d9b43387e34fd49827e3ab62420f3555ff4b3cd
2019-07-08 23:07:28 +00:00
jdlrobson b9862d7d24 skins.minerva.options uses packageFiles
I want to remove the need for M.define in the Minerva repository.
It's no longer necessary with packageFiles and will help tame
a lot of the code we have here!

Change-Id: If6a35a23e84a44adb965fd9c41265ba37eb8368e
2019-07-08 17:22:11 +00:00
Stephen Niedzielski edb4385345 Hygiene: extract ToggleList to a reusable component
A list that toggles visibility via the checkbox hack is needed in at
least two spots: the page actions overflow menu and the user menu. This
patch makes several refactors to turn what was previously hardcoded into
page actions a reusable component:

- Start a new components directory. Components are reusable and
  composable. The subdirectories are organized by function, not
  ResourceLoader module bundling which greatly improves the ability to
  see a component's full functionality in one directory instead of
  examining the entire codebase. See updates to README.

- Extract pageactions.less into:
  - ToggleList.less: LESS for any checkbox hack list.
  - DropDownList.less: LESS for lists that open downwards.
  - MenuListItem.less: LESS for list items of menus.
  The division makes it easier to see concerns, dependencies, and change
  code.

- Move pageActionMenu.mustache to a component and extract ToggleList
  template.

- Extract ToggleList.js from Toolbar.js.

Bug: T214540
Change-Id: I171831469a6733c458bc5c7ba249a5096ca975b8
2019-07-04 13:48:13 -06:00
jenkins-bot 141d9a89ed Merge "Don't scroll vertically when scrolling active tab into view" 2019-06-25 14:13:24 +00:00
jenkins-bot 62090bcd69 Merge "Use wgRelevantPageTitle when setting up talk overlay" 2019-06-25 10:21:53 +00:00
Roan Kattouw b64b4c1b9f Don't scroll vertically when scrolling active tab into view
Do the scrolling math manually, and only do horizontal scrolling on the
tab container. Don't do vertical scrolling, and don't scroll the
viewport.

Bug: T226112
Bug: T223142
Change-Id: Ie67e15bd51252906897a213505ae82cf29ba5cf2
2019-06-24 15:18:56 -07:00
Stephen Niedzielski 1e61706e0e Hygiene: rename "secondary button" to "user notifications"
The secondary button is not generic. Rename it to match its specific
purpose.

Bug: T214540
Change-Id: I50b7e7fa7bea91a029a8ca71199b0309dff1c518
2019-06-19 11:31:16 -06:00
jenkins-bot 1aa31ea5b8 Merge "Correct Wikidata icon color in overflow menu" 2019-06-19 14:10:38 +00:00
Nicholas Ray 9676395529 Correct Wikidata icon color in overflow menu
This icon's stroke was explicitly set to `#000` before this commit, but
we need its color to be `#54595d` to match the other icons in the
overflow menu [1]. Unfortunately, although we set a variant in skin.json
for the icon to be colored this way [2], there are 2 problems that
prevent it from displaying this color:

1) The icon sets an explicit black color for its stroke attribute
2) ResourceLoader currently only sets the fill color on the `g` element
when applying the variant style [3]. It does not set the stroke color. Even
if problem 1) was removed, we would need RL to set the stroke color, but
I'm not sure how that would affect other variant icons that RL deals
with.

The simplest possible solution is to to change the stroke attribute on
the icon itself, although it unfortunately introduces technical debt as
this icon now differs slightly from the OOUI one :(

[1] https://phabricator.wikimedia.org/T222630#5266575
[2] https://github.com/wikimedia/mediawiki-skins-MinervaNeue/blob/master/skin.json#L262-L267
[3] 4e59467427/includes/resourceloader/ResourceLoaderImage.php (L331)

Bug: T222630
Change-Id: I8c10a6012c7d32ab8555b874e766bc2f36437cf8
2019-06-18 17:05:26 -06:00
Ed Sanders 240280b906 Tabs: Remove unnecessary flexbox styles
white-space:nowrap is simpler and better supported.

Change-Id: I8c44cdd3c30a4cad1817b7912f9bbaae9e5ef641
2019-06-18 21:36:28 +01:00
Stephane Bisson 5a3a8efc31 Use wgRelevantPageTitle when setting up talk overlay
wgRelevantPageTitle is generally the same as wgPageTitle.
It is different on special pages that act on a page.
For example, on Special:WhatLinksHere/Moai
  wgPageTitle => Special:WhatLinksHere
  wgRelevantPageTitle => Moai

This change would allow Special:Homepage to have the talk overlay
connected to its talk tab.

If Minerva has such special pages that act on a page AND those
pages have talk links AND the 'skins.minerva.talk' happens to
be loaded, those links would now show the talk overlay.
I found no such cases but I cannot say they don't exist.
I also don't know if this change would be a regression
or an improvement.

Bug: T225659
Change-Id: I5d60ff3f0295f44a6d59cd772e27656b69ef0972
2019-06-18 15:38:33 -04:00
Stephane Bisson 4f5dbf7d55 Make the tabs scrollable horizontally
* Add a container around the tabs and use flexbox
  to position the tabs on one line and make it
  scrollable.
* Add some JS to scroll the currently selected
  tab into view.

Bug: T223142
Change-Id: Ie2205e6836797c2ac000e12a01f78a4aa7bc5b81
2019-06-14 13:50:23 -04:00
Ed Sanders 12e6a2b9d5 Add missing dollar prefix to jQuery variable
Change-Id: Ib6ea281b749e040d43c2dc3558a0a96ce59b7385
2019-06-12 21:29:49 +01:00
Jan Drewniak 0213011285 Updating icons for AMC mode
Replaced the following icons:
- communityportal.svg
- specialpages.svg
- info.svg
- contributions.svg

Bug: T222228
Change-Id: Id7889aeb99abe39bc0efae0a1c6457826015302b
2019-06-07 00:25:21 +02:00
Jan Drewniak ed9f455545 Adding a reflist.less file to hold Template:Reflist specific styles
Template:Reflist needs a larger column-gap to be consistent with
the Vector skin.

Bug: T150377
Change-Id: I14911f9b0fa46249cf11a591bc5323a227f7c3cc
2019-06-03 14:27:50 +02:00
Jan Drewniak 650198b7bb Fix z-index issue with button on action=history page
When opening/closing the main navigation, the large blue button
on the action=history page is visible above the opaque page content.

This changes the z-index when the main navigation is enabled.

Bug: T219895
Change-Id: I724c2419800a4aec0b55b18be920d8bf7e47fa60
2019-05-27 16:48:09 +02:00
Timo Tijhof 9ef2e2e88f skins.minerva.scripts: Remove use of deprecated ext.eventLogging.subscriber
Was trimmed down and merged into 'ext.eventLogging'.

Bug: T221281
Change-Id: Idd03f92950a05bef31b7ad843600504281ec39f2
2019-05-22 20:03:56 +01:00
Volker E 9845433bf1 Remove unused 'sectionAnchor.less'
File is not referenced and not in use as MF removes class.

Change-Id: I4fb9f887f38b991ac809903a120844d24fbbcac6
2019-05-09 08:07:43 -07:00
Ed Sanders 8e352f7824 Connect initMediaViewer to wikipage.content hook
This means if new content is added to the page, it
will be connected to the media viewer code.

Depends-On: I79caa6d1b83ec2a618ca703607165197add4e100
Change-Id: I9936ee1decaa5de6677bc33ebe726ff6253d6ac5
2019-05-08 18:41:22 +00:00
jenkins-bot 17b821861a Merge "Fix: AMC overflow menu initial CSS and SSR icons" 2019-05-01 21:06:18 +00:00
jenkins-bot dcf2d589a3 Merge "Minerva is Hogan free" 2019-05-01 19:41:39 +00:00
jenkins-bot db3e6d2380 Merge "Do not use pass the "string" (deprecated parameter) to toast show method" 2019-05-01 18:25:15 +00:00
jdlrobson 281341f0b4 Do not use pass the "string" (deprecated parameter) to toast show method
Bug: T217220
Change-Id: Ie188a0e613d16775c327dadf505cf8a10005d450
2019-05-01 17:15:32 +00:00
Stephen Niedzielski b594daf8c8 Fix: AMC overflow menu initial CSS and SSR icons
When advanced mobile contributions is enabled and the overflow menu is
shown:

- The initial state should have no transition. This prevents the menu
  from flickering initially. Move the transition to the checked state
  only.

- The icons should be available for server-side rendered HTML without
  JavaScript. Add wikimedia.ui to the SSR modules.

Bug: T216418#5129152
Change-Id: I3b91f6cdefd4b727c2fb512272d8c4282af632bf
2019-05-01 09:29:50 -06:00
Volker E cd61867f0a Unify ul bullet styling
Unifying unordered lists bullet styling with Wikimedia Design Style
Guide defaults and other products.

Bug: T220323
Change-Id: Ifa990010cf80010cd3184f9bcb72fc081674db05
2019-04-30 10:25:35 -07:00
Volker E e562227392 Remove ol overrides to ensure list styles in non-Arabic number scripts
Bug: T205341
Bug: T217616
Change-Id: I66a677ab5d7ea4555d16d5761340eaad4158c3bc
2019-04-29 21:53:15 +02:00
jenkins-bot f1ccfd50e1 Merge "Switch to outside list style for ordered lists too (second try)" 2019-04-29 19:45:14 +00:00
Nicholas Ray 858935210b Hygiene: Cleanup schemaMobileWebMainMenuClickTracking sampling rate logic
AMC mode is already determined prior to the `trackSubscribe` callback
executing so we can set the sampling rate outside
the callback as well.

Hopefully, this improves readability. If not, I'm happy to abandon this
patch.

Change-Id: Ic1386c0e31ae7fbdd52f18d3b881ec6a5fb5a67c
2019-04-26 11:13:35 -06:00
jdlrobson daef425ba1 Minerva is Hogan free
All hail Mustache!

Change-Id: Iaf83dc27addd00ffd65d003bd5d84441965124e8
Depends-On: If00010e092e3766f9812f9a69ce0dfe22298689a
Bug: T220620
2019-04-25 10:34:01 +08:00
jenkins-bot 55ad654176 Merge "Update: add secondary page actions submenu in AMC mode" 2019-04-19 22:15:22 +00:00
Stephen Niedzielski 815f3386e3 Update: add secondary page actions submenu in AMC mode
When advanced mobile contributions mode is enabled and
`$wgMinervaOverflowInPageActions` is set, show a secondary overflow menu
on main namespace articles and user namespace pages. The menu content
varies for each namespace. The new submenu is *disabled* by default,
even when AMC is active. This feature should not be deployed until
instrumentation is available.

The secondary menu is rendered in PHP using the existing menu system
with some changes to the template. The checkbox hack is needed for no-
JavaScript keyboard navigation until :focus-within is supported. CSS
additions are documented in the source.

All client side toolbar execution occurs in Toolbar.js. Enhancements are
documented in the source.

Minor changes to the existing download button:
- Move download and edit button initialization to Toolbar.
- Update copy (not visible) from "Download" to "Download PDF".
- When the overflow menu is present, use the "hasText" / label style.

Wikimedia UI icons are copied from OOUI at d00a0ac and seem useful to
expose as HTTP URIs (not data URIs).

The overflow menu does not show for pages provided by the content proxy
since its entries depend on $tpl->data['nav_urls'] being populated.

Bug: T216418
Depends-On: I0781151a8232b6a7b52f79a34298afcecb8e4271
Change-Id: I4b50a0e519024a7ab91dae6ab40b23cf14a03861
2019-04-19 14:51:17 +00:00
jenkins-bot 6cd23276b2 Merge "QA: Port Notifications browser test to Node.js" 2019-04-19 12:07:16 +00:00
Piotr Miazga 692309090d Remove Recent Changes from Main Menu
We decided to remove the Recent Changes menu entry from Advanced
menu for now, we might come back to it later.
For more info: https://phabricator.wikimedia.org/T216152#5123296

Bug: T216152
Change-Id: I6342e273fdc5f483692de6e1ac238c38d06f3e5f
2019-04-18 20:32:23 +02:00
jenkins-bot 8767b8ad18 Merge "Add basic hr element styles" 2019-04-17 20:16:01 +00:00
Piotr Miazga 2cf4ed8981 Add Community Portal link to Mobile Main Menu
Changes:
 - introduced new icon for Community Portal
 - added new menu entry in Advanced Builder that links to
 MediaWiki:Portal-url

Bug: T216152
Change-Id: Id38836d8f1a62d4e15181ab10e219d5c5b769ec3
2019-04-16 11:21:43 +00:00
Piotr Miazga 1f4582cc09 Provide a code structure for menus handling and add Advanced menu
Changes:
 - moved all menu elements definitions from SkinMinerva into
 a separate Definitions.php file
 - moved menu building from SkinMinerva into includes/menu/Main
 folder
 - introduced Builder pattern for easy menu building
 Minerva/Menu/Main/Director takes an Minerva/Menu/Main/IBuilder
 and builds the menu. The IBuilders use definitions from
 Minerva/Menu/Definitions file, so all definitions can be shared
 across different menus
 - used ServiceWiring file to register MainMenu Director as Service
 - left class_alias for old MenuBuilder as some extensions still use it
 - The hooks system have to stay like that as some extensions
 are using it (BlueSpiceMultiUpload and GrowthExperiments).
 - introduced AdvancedMenu builder for the AMC mode

Bug: T216152
Change-Id: I210c3f1fa36bbd2f9108d728b12cbb21ee210354
2019-04-16 13:19:51 +02:00
Volker E 5f6f75e487 Add basic hr element styles
Bug: T221020
Change-Id: I90cef54b48d5934dac4adac6be6ffe7145a726f4
2019-04-15 17:43:09 -07:00