Commit graph

48 commits

Author SHA1 Message Date
Jon Robson 71de06a682 Simplify the RelatedArticles extension to use Codex CSS components
Changes:
- Removes redundant styles now inside Codex
- With the new component, it's not possible to display 3 cards in a
single line at a tablet resolution, so the media query responsible
is bumped to apply only at the desktop threshold
- Decisions are documented in ADR

Bug: T286835
Change-Id: I493e8e601ccc31b3cf1f16c0b5a8975f12ef336c
2024-01-30 09:16:34 -08:00
Volker E d09ace57c9 styles: Use new forward-facing breakpoint token
Replacing legacy tablet breakpoint width variable with new Codex
design system `@min-width-breakpoint-mobile` token. The values have
slightly changed. Tablet breakpoint is decreased by 80px, pushing lesser
devices into a mobile phone only experience but should in these three
contexts make barely a difference to vast majority of our users.

Bug: T331403
Change-Id: Ifc46dc0a9c531fefd1cd641eb6b86c6bc225cb7b
2023-11-08 14:06:26 -08:00
Ed Sanders ac97092078 Add mw-no-invert class to thumbnails
Bug: T345281
Change-Id: I65829811ff0027017d4f91b0dedf7957177f47b5
2023-09-11 18:46:45 +01:00
Volker E 8f6fce655b styles: Replace 'mediawiki.ui/variables' call with skin variables
Replacing 'mediawiki.ui/variables.less' `@import`
with new skin-aware 'mediawiki.skin.variables.less' standard.

Also
- replacing several static values with skin variables featuring new
  Codex design tokens for following properties:
  - background-color
  - color
  - border-width, border-style, border-color and border shorthand

Bump required MediaWiki core version to >= v1.41.0.

Bug: T319381
Bug: T332541
Depends-On: I04f9e48a1cf9dee915cf51e1e12b17ff0a595a06
Change-Id: I32c2996dedc9b3a54e1f916623dbe1c4da910083
2023-04-18 11:19:46 -07:00
Umherirrender 082a59b991 build: Updating npm dependencies
* stylelint-config-wikimedia: 0.13.0 → 0.14.0

Run stylelint fix to fix the new stylelint rule

Change-Id: Iedd35c282b67f58f4be8f74aba365e7581159956
2023-03-28 22:19:23 +02:00
jenkins-bot 9a11bcee04 Merge "Replace deprecated @borderRadius var with successor @border-radius-base" 2022-11-09 18:21:42 +00:00
Volker E 2e2159d1b5 styles: Remove linear-gradient vendor properties
All targeted browsers have fallen out of basic support.

Bug: T306486
Change-Id: I3d5d49d2911c72806922bdbba26ab2c8470588f8
2022-11-07 21:02:15 -08:00
gerritbot f3f58c0666 Replace deprecated @borderRadius var with successor @border-radius-base
Replacing deprecated mediawiki.ui `@borderRadius` variable with successor
@border-radius-base.
Former got deprecated in MW 1.35 about 2 years ago. Latter is in alignment
with mediawiki.skin.variables.less standardization. It's also in
accordance to Codex design tokens.

Bug: T322478
Change-Id: I6f9fe0a7d98713a66e1b7e78f105817f428c636f
2022-11-06 22:59:13 +00:00
Jon Robson e5431a1c0b Limit RelatedArticles feature to ES6 browsers
We currently require support for IntersectionObserver.
which is supported on Edge >= 15 (15 has partial support),
Firefox >55, Chrome >58, Safari 12.1, Opera >=38,
iOS Safari >=12.2, Android 100

Full ES6 is supported in Edge >=15, Firefox >=54, Chrome >=51,
Safari >=10, Opera >=38, iOS Safari >=10, so such a change
would only drop support for Edge 15 and Firefox 54.

CSS.escape is guaranteed in all these browsers according to
caniuse, with the only discrepancy being the Edge browser (versions
16-18) so it is also suggested we remove support for those browsers.

Firefox 54 accounts for 0.0026% of page views
Edge 15-18 accounts for 0.069% of page views

Bug: T306355
Change-Id: Id2987e3456607b610c38da9ee157a026d1d00ada
2022-04-27 15:45:42 +00:00
Jon Robson dfce5b1cb7 RelatedArticles should not use mw.trackSubscribe
Instead export a render method

Bug: T149317
Change-Id: I2b88690d381f896d6a646046574528a2312c91c2
2022-04-18 16:28:14 +00:00
Jon Robson 911d78e8ee [organization] organize file by module
Follow up to I9442b0336e22ca795cc06f76068215266fe81271

Bug: T306228
Change-Id: Ifb1f1937009b098999471cfa5e820a063dc5a4a0
2022-04-18 08:37:22 -07:00
Jon Robson df1ff38877 [Maintenance] Reduce related articles to two modules
1) Merge ext.relatedArticles.readMore and ext.relatedArticles.cards modules

These are always loaded together. No need to have them in separate modules.
In process switch to packagefiles

2) Merge ext.relatedArticles.readMore.bootstrap and ext.relatedArticles.readMore.gateway

Always loaded together.

Bug: T306228
Change-Id: I9442b0336e22ca795cc06f76068215266fe81271
2022-04-14 17:48:37 -07:00
Jon Robson dc2e65a084 Drop outdated references to Cards extension
Previously RelatedArticles required the Cards extension
This code refers to that old state and is cleaned up.

ext.relatedArticles.cards is added a dependency of
ext.relatedArticles.readMore since it now belongs to the same
extension

Change-Id: I4a89ed4256a4ae9fd22b0191748bd47ac3ffc593
2022-03-31 08:14:23 -07:00
Ed Sanders ebecd9c144 build: Update eslint-config-wikimedia to 0.16.2
Change-Id: Ib6681e7d5fb03f4fa54823bf0d37e16d37be3416
2020-06-23 20:30:43 +01:00
James D. Forrester 56416d08e9 Don't try to register "" as a style path, that breaks ResourceLoader
Bug: T248090
Change-Id: Ic1475003f9f00c3593736be1421c93b8b7f5c30f
2020-03-19 15:24:20 +00:00
Jesús Martínez Novo be3385e6d5 Support other ways to get the description of the page
Currently, the extension queries the prop=description api to fetch the
description, but this api is only available if Wikibaseclient is installed.

Let's support other sources to fetch the page description from, too, or
disable it (by default) to sabe 85 bytes from each response by avoiding the
warning returned from the api when prop=description is not recognized.

A new configuration setting has been added: RelatedArticlesDescriptionSource.
It defaults to false (no description is fetched), but can be set to one of
those string values:

- wikidata: What's being used right now on WMF wikis
- textextracts: Extension:TextExtracts provides the prop=extracts api.
- pagedescription: Extension:Description2 provides a description page property, that can be queried by prop=pageprops&ppprop=description

Bug: T230947
Change-Id: I34410334ba9d6db1f686c7efb5722e2a51957145
2019-08-23 20:24:37 +02:00
Isarra b31970084f Use SkinAfterContent hook to place cards in the DOM
This allows skins to determine where the cards appear in a consistent
fashion with other extensions, and require minimal special handling from
the extension itself.

Also change default settings as to when RelatedArticle cards will appear
- keep the whitelist to allow projects to configure their usage such as
in the case of only wanting it on mobile, etc, but now that it should
just work in any given skin, default it to on for all so that it's easier
for the average third party to install for whatever use.

Note that this default setting change will not affect WMF wikis, as
wmgRelatedArticlesFooterWhitelistedSkins is explicitly set in the
wmf-config regardless.

Bug: T181242
Depends-On: I5b0ad889e633fde88c392577ce5373c81fc5486a
Change-Id: Iebd759c0d1a536768d18953f372664df762d9e04
2019-07-26 19:28:49 +00:00
James D. Forrester 2066d438ae build: Upgrade eslint-config-wikimedia from 0.10.1 to 0.11.0
Change-Id: Ie1f3e5f9ead8f69da554fb9a3260fa44b1c91f4e
2019-04-03 16:21:00 -07:00
Ed Sanders 26b15d19b9 build: Update eslint-config-wikimedia to 0.10.1
Change-Id: I01388bfdda108e9e80b32d68983e1d826d0db784
2019-02-10 16:46:48 +00:00
Volker E 9a5d59caee build: Update 'stylelint-config-wikimedia' to v0.5.0 and make pass
Also enabling 'no-descending-specificity' rule and the same time
simplify VE hidden rule.

Change-Id: Idad811e7fca681883fccbc961c70f49e2b356c02
2019-01-16 19:26:36 -08:00
Volker E 68e0e12794 Increase headline color contrast slightly to conform to AA ratio
Bug: T208343
Change-Id: I31d3c0a06de9597a8fc1367a7d3b906b8ffe9921
2018-10-30 12:33:45 -07:00
jdlrobson 6b49ddff1b Remove EventLogging/A-B test code from RelatedArticles
With RelatedArticlesEnabledBucketSize now removed, installation of this
extension will turn it on for 100% users without any mechanism to turn
it off.

Additional changes:
* Bump version
* Add Readers team to contributors

Bug: T202306
Change-Id: I7dc270a06dd3afd4e894c8298165d6d6d4fda8d6
2018-09-20 11:13:13 -07:00
Fomafix 00405b0309 Remove mediaWiki and jQuery from eslint globals
Remove all mappings in the closures like in
I7cf2426cde597259e8c6f3f6f615a1a81a0ca82b in core.

Change-Id: Ie9a2fadb8e276774784a4937bb5c3ec11f213352
2018-09-15 17:54:03 +00:00
Fomafix 0fa064728f Use native JavaScript instead of jQuery
Replace
* $.each( array, function ( index, value ) { ... } ) by
  array.forEach( function ( value ) { ... } )

* $.map( array, function ( value ) { ... } ) by
  array.map( function ( value ) { ... } )

* $.isArray( var ) by
  Array.isArray( var )

* $.isFunction( var ) by
  typeof var === 'function'

Change-Id: I450f5a75eb9c3fe20517da02986b0a491ebca67a
2018-08-17 12:45:12 +02:00
Jan Drewniak 816bda69c5 Replace pageterms with description API
Bug: T190953
Change-Id: Ia188a7bdc4d3533d6ee0e9bb06fa62da4b759c66
2018-04-13 10:02:14 +02:00
Volker E 581a247d70 Replace abandoned colors with current WikimediaUI ones
Replacing abandoned `@colorGray8` (`#888`) & `@colorGray9` (`#999`)
with slightly increased contrast, WCAG 2.0 level AA conformant,
`@colorGray7` from WikimediaUI color palette.

Bug: T172850
Change-Id: I750261b83cc79c32e9ccdb2d69bb5e396b20ed35
2017-08-09 17:49:35 -04:00
jdlrobson 6dee0147f4 Migrate Cards code to RelatedArticles
* Move across all files
* Rename ext-card- prefix to ext-related-articles- prefix
** Since all code using these prefixes is JS
  we do not have to worry about cached HTML

Bug: T137021
Change-Id: I784fd132c36329fa0dcc49fe2804460061940347
2017-06-07 08:35:53 -07:00
Umherirrender 627c254157 Add stylelint for less files
Fixed the following rules:
string-quotes
declaration-property-value-blacklist
number-leading-zero

Change-Id: I7c8021070b69cd60ac010e90b3bc13a033d695e2
2017-04-18 18:20:50 +02:00
Baha a40286c800 Hygiene: lazy-load event logging code
This allows us to decouple the event logging code from the
`ext.relatedArticles.readMore' module. As a result we'll be able to
log events without loading the above mentioned module.

Bug: T157375
Change-Id: I55cf4f40cafc88d6baeb5cc1b41fc2d6bcd2fbb9
2017-03-01 14:45:32 -05:00
Piotr Miazga 0806dbdb42 Use mw.experiment to enable related pages only to subset of users
Changes:
 - introduced new config variable: RelatedArticlesEnabledSamplingRate
 - do not trigger RelatedArticles clientside scripts if feature is disabled
 - do not log events when navigator.sendBeacon is not available

Bug: T156039
Change-Id: I7e9773131c5b9aea9e9fb554d4508842cdedede7
2017-01-30 23:29:32 +01:00
jhobs e68d5b6599 Use mw.viewport to check when to load related pages
Does not change distance threshold.

Bug: T135607
Change-Id: I82dfa78e93f4bb7a8a28d038470265e7fd30c423
2016-09-02 12:01:17 -07:00
jdlrobson f960e7b651 Remove styles for old Minerva design
This CSS rule exists for Minerva's old footer. Considering Related
pages is currently only in mobile beta and the new footer should go
live before related pages does. The cost of maintaining 2 related
pages Minerva designs is not worth it.

In a follow up patch the read more container class will be reintroduced
to Minerva

Change-Id: I2d5c4e73c0cfa3f1107a0fd195d3e09f4e14ef2a
2016-09-02 11:56:17 -07:00
jdlrobson fc7799b9f3 Allow skins a mechanism to decide on placement of related pages
* If a footer-content element is present prepend there
* If no footer-content element given wrap the component in a container that is known to be compatible
with known skins - this has post-content class (for backwards compatiblity with
old Minerva skins) and a class to apply the correct margin to Vector

Bug: T141002
Change-Id: Iac11948f8f5fdaad45d51b905bb7494a84775710
2016-08-23 11:51:33 -07:00
Florian 66a05df808 Remove 70px margin-bottom in mobile view
Combined with the padding top of the footer, this results in a
massive unused white space area between the related articles box
and the footer, which is now removed.

Extra points: Removed unused less import

Bug: T138185
Change-Id: Iaf008977bce3c003fe0fad7c16ed6bf94aef60f9
2016-07-19 18:29:45 +02:00
Tacsipacsi 1b952bde29 Add "noprint" class
Add "noprint" class to the <aside> element containing the suggestions and the header.

Bug: T123551
Change-Id: Ie7de692208028fe788ffd3c901ee4649390203a7
2016-04-17 21:45:10 +02:00
Baha cfc73ff5c9 Remove the isElementInViewport function
Use mw.viewport.isElementInViewport instead.

Bug: T124317
Change-Id: I621aa4c21d673d8d431bb38ba094271b570ca93c
2016-04-07 12:23:38 -04:00
Baha f4400ec5c9 Fix RelatedPages placement in Monobook
* Load skin specific styles only in that skin;
* Vector styles are default for all skins unless overwritten;
* Allow monobook styles to inherit from vector styles;
* Do not load visual editor related rules in minerva;
* Remove an unused CSS rule.

Bug: T126149
Change-Id: I1e657de7a45fb4812c42ca7b99624b585dc4b7dd
2016-02-23 14:13:09 -05:00
Sam Smith d24e8f01d2 Design review
Changes:
* Reduce the size and increase the spacing of the Related Pages header

Bug: T122030
Change-Id: I26273a1602e2e329b68d23d01c0f75f69b821b92
2016-01-28 19:05:41 +00:00
jdlrobson f13cdafbb1 Remove bottom border on related pages heading
Bug: T122030
Change-Id: Id656acadec617f837046816a9b8b2dfbe756b7f0
2016-01-26 16:00:38 -08:00
Baha 929c249018 Design tweaks to Cards
* Move after the content in Vector
* Make title uppercase

Bug: T122030
Change-Id: I8f33ff4115a6a5d328ebbb924293cd4944bc0143
2016-01-19 21:09:07 +00:00
jenkins-bot a079805616 Merge "Hygiene: Minor styling improvements" into dev 2015-12-21 03:08:54 +00:00
jdlrobson 302ddedf21 Hygiene: Minor styling improvements
* Using nesting in LESS allows you to easily identify in large stylesheets
what to remove/update when changing a component class/removing it entirely

Change-Id: I9190e16c5db9ba0bd6357f8685268af5e1cb93fe
2015-12-18 17:34:42 +00:00
jdlrobson ed338bbed5 Disable RelatedArticles when editor enabled
We only want to show it in view mode.
When a reader hits edit, wgAction is view so we add a CSS rule to
hide the widget when that transition occurs.

This means related widget does not show up post edit (you'll need to
refresh but this seems like an acceptable workaround until we can
understand this issue some more)

Bug: T120443
Bug: T120735
Change-Id: If1356906d5f55167c9d1abbed88f433f36b7f390
2015-12-09 16:47:52 -08:00
Paladox 8a73239abf Update packages
Update grunt-jscs to 2.4.0

Update grunt-jsonlint to 1.0.6

Change-Id: I34b1f23469a35e64345ee42a183dd74679e50b81
2015-12-07 21:00:56 +00:00
Baha 8cf9b60ab5 Make RelatedArticles soft-depend on Cards
RelatedArticles tries to load the 'ext.cards' module and if
it succeeds it continues with showing the related articles
on the page.

Dependency: I6661527175eb889cec4193b18fa18207f332b4fc
Bug: T117108
Change-Id: I33936a3e9cd5d1f0296e48fd1c2bba77fff4e466
2015-11-18 22:22:10 +05:00
jhobs d08962d12d [Hygiene] Rename internal uses of "article" to "page"
Leave all public-facing uses of "article" (including classes) because
the extension is remaining named RelatedArticles. Replace all other
instances with "page" for consistency with other extensions.

Bug: T117908
Change-Id: Ib0f258f26b0d11cfe8a598dbd90ff37afbbe36ac
2015-11-13 19:03:39 -05:00
Sam Smith 0fed50e266 Optionally disable Read More using extension data
By default, the Read More feature tries to use editor-curated articles
before using the CirrusSearch morelike: feature. Add a configuration
variable that disables the former behaviour but leave the default in
place.

Changes:

* Add the wgReadMoreOnlyUseCirrusSearch configuration variable, which
  defaults to false, and pass it in to
  mw.relatedArticles.RelatedPagesGateway at construction time
* Add the onlyUseCirrusSearch parameter to
  mw.relatedArticles.RelatedPagesGateway, which controls whether to
  ignore the editorCuratedArticles parameter

Bug: T117443
Change-Id: I0dfa67f4a68e8dc17302fef7ebf8d23c0c1d892c
2015-11-12 12:43:29 +00:00
jdlrobson e86fc3b159 Fall back to CirrusSearch's morelike: feature
When no related articles have been specified by an editor we instead
hit request pages similar to the current page using the CirrusSearch
extension's "morelike:" feature [0].

Changes:
* Config variable introduced RelatedArticlesUseCirrusSearch which allows
you to turn on use of the CirrusSearch API.
* Introduce a RelatedPagesGateway for dealing with making the API call
  and returning consistent results
* Move the "simple" API call for hydrating related pages fetched from
  the wgRelatedArticles configuration variable into RelatedPagesGateway
* Reduce the bootstrap module to just a bootstrap module!

Bug: T116707
Change-Id: Ia0ced1d7ae57c0939d1f5af275aa9d393f1420b1
2015-11-06 10:23:39 -08:00