Commit graph

216 commits

Author SHA1 Message Date
bwang 0109218ab9 Rename client preference menu to appearance menu
Bug: T362808
Change-Id: Id6800d38eebf433cf0c9e3f179dd83df2eefd1fb
2024-04-29 15:38:20 +00:00
libraryupgrader d22fd0d7ab build: Updating npm dependencies
* eslint-config-wikimedia: 0.26.0 → 0.27.0
* @wikimedia/codex: 1.3.5 → 1.4.0
* @wikimedia/codex-icons: 1.3.5 → 1.4.0

Change-Id: I3dbc33dde89f03b188918e29f89434aafc3690a9
2024-04-21 21:57:17 +00:00
bwang c69a53a16c Use client preferences for appearances menu
Bug: T361586
Change-Id: I636a557e724f23ea18da135bac59cb304ba81091
2024-04-15 22:36:48 +00:00
Jon Robson 3f7f355a2e Support legacy message box styles markup in JavaScript
Log a console warning to assist developers in migrating to the new
markup.

Bug: T360633
Change-Id: Iaa1a3fc3b910c5fe491459fc82c61bc329f3408d
2024-03-21 18:19:52 +00:00
Moh'd Khier Abualruz b3ab84f9e5 Vector - Rename the skin night mode classes to more readable classes
The classes:
- skin-night-mode-clientpref-0
- skin-night-mode-clientpref-1
- skin-night-mode-clientpref-2
is being replaced with
- skin-theme-clientpref-day
- skin-theme-clientpref-night
- skin-theme-clientpref-os

Other Changes:
- Change vector-night-mode preference to vector-theme
- Add skin-theme-os-label and other messages to skins.vector.clientPreferences
- Remove skin-night-mode-* messages from skins.vector.clientPreferences

Bug: T359983
Change-Id: I31eb086e623a97df9fbd004425559e05b0cae170
2024-03-20 23:54:47 +00:00
Steph Toyofuku 1492669009 Reorder client preferences (color above width)
In accordance with the original design, reorder the client prefs so that
night mode is above limited width

Visual change for users who have access to night mode

Bug: T357707
Change-Id: I21a976655734a2accc57d541bacba391961070a8
2024-03-13 16:29:11 -07:00
Moh'd Khier Abualruz 182bb7519b Migrate uses of codex-search in Vector to use CodexModule
- Loaded new skins.vector.search.codex.scripts module in skin.json, with only the CdxTypeaheadSearch component with codexScriptOnly flag set to true.
- Included skins.vector.search.codex.scripts in the script loading configuration for Vector22 within skin.json.
- Turned off the "interface-message-box" feature within Vector22's skins.vector.styles configuration in skin.json, as Codex now supplies these styles.
- Fix the style selector to add `.cdx-button` to `.vector-limited-width-toggle` in BottomDock.less since using the codex style
- Substituted "codex-search-styles" with "skins.vector.search.codex.styles" in the existing configuration.
- Ensured the availability of skins.vector.search.codex.scripts module for use, marking it in the list of modules in skin.js.
- Modified App.vue to utilize skins.vector.search.codex.scripts instead of @wikimedia/codex-search.
- Update App.test.js.snap to the latest output form
- Update bundlesize.config.json with newest values

Bug: T356677
Change-Id: I7fc223db01171efe6656792530d4b625be4c8edc
2024-03-13 15:58:26 +00:00
Moh'd Khier Abualruz a8eb85f3d5 Replace use of codex-styles in beta feature with CodexModule ResourceLoader
- Add new module 'skins.vector.search.codex.styles' to skin.json
- Added 'skins.vector.search.codex.styles' to bundlesize.config.json
- Replace the old styles module 'codex-search-styles' with the new one 'skins.vector.search.codex.styles' in skin.js

Bug: T353844
Change-Id: If3cbcac64242c403b42811159882741fda132555
2024-02-27 17:40:11 +00:00
bwang e964cbb785 Add Vector night mode feature flag
Bug: T355065
Change-Id: Ica63eb61ee042e8684168f6787b27a5e58e38bee
2024-02-05 11:33:37 -08:00
Jon Robson 63b3a23ead Register night mode as a client preference
The night mode setting should only show up if the feature flag
is enabled.

The messages are currently added to Vector, but we may want to upstream
these to core in future.

Change-Id: Idcd53399fa06821bbf5f463d1a242ecf59442c70
2024-01-31 10:14:30 -08:00
jenkins-bot 3961cbcfb4 Merge "Deactivate sticky header menus and search when sticky header is hidden attempt 2" 2024-01-30 19:36:34 +00:00
Bernard Wang 8172710236 Deactivate sticky header menus and search when sticky header is hidden attempt 2
This reverts commit 47e58d53d4.

Reason for revert: second attempt at the patch

Bug: T325083
Change-Id: I2190005fcad41ad61bbd02ea3603e222fc58ceb8
2024-01-30 18:14:21 +00:00
jenkins-bot 851bc5aecd Merge "Revert "Deactivate sticky header menus and search when sticky header is hidden"" 2024-01-30 02:48:24 +00:00
Jdlrobson 47e58d53d4 Revert "Deactivate sticky header menus and search when sticky header is hidden"
This reverts commit 984a8a03ae.

Reason for revert: For anonymous users this was triggering the
error "Cannot read properties of null (reading 'contains')"

Change-Id: I0bd78d195768c95b188208fa6fbab60fb483ed87
2024-01-30 02:24:15 +00:00
jenkins-bot 3d747b504a Merge "Deactivate sticky header menus and search when sticky header is hidden" 2024-01-30 00:56:46 +00:00
bwang c893934ee7 Fix linter warnings
Change-Id: I24c3ecb7858142dc1b90cf1e34456691660157f1
2024-01-29 17:06:53 +00:00
bwang 984a8a03ae Deactivate sticky header menus and search when sticky header is hidden
Bug: T325083
Bug: T336965
Change-Id: Ie2cc38b1cadf239f8350d47eba1f2fefc60e1f28
2024-01-18 14:24:36 -06:00
Jon Robson 7d5caf3f66 Generalize skins.vector.clientPreferences library for use in MobileFrontend
Bug: T354224
Change-Id: I6949c4f49ec34b8e47036da4222a5f3ff491af32
2024-01-17 14:51:29 -08:00
James D. Forrester 1c93d0514b build: Upgrade eslint-config-wikimedia from 0.25.1 to 0.26.0
Bug: T345100
Change-Id: I51fdef33d517ce4f2f50930bc46dddb2f497677c
2024-01-11 14:19:57 -05:00
Jon Robson 0ec9d2ecd6 Remove cache related FIXMES for CSS
Change-Id: I0b8bff3e880bef3e97341c24e40405401381006a
2024-01-09 09:48:06 -08:00
Moh'd Khier Abualruz 412c1f2d83 Create a sidebar for user preferences
* Adds mustache for sidebar
* Adds file to render sidebar

Bug: T350417
Change-Id: I691c8a0487e158e96027109c223569224f03a102
2023-11-14 14:33:01 -08:00
Jon Robson 0a33ffffac Remove Zebra A/B test code
Additional change:
* Remove duplicate A/B test requirement for language in header

Bug: T339957
Change-Id: I0258e71ac0e270682ec1f3bcb0f10198892f058d
2023-11-13 21:56:34 +00:00
Jon Robson 44d9f74c8f Client preferences: Support different render locations, use Codex
* Refactor client preferences to support different render locations
such as the sidebar or user menu.
* Make use of Codex markup.

Bug: T350195
Bug: T350417
Change-Id: I13eeb9cafc888faba4a5bf0390c1b6db1e3f0259
2023-11-09 19:04:03 +00:00
ksarabia 5e6d6124d0 Remove TOC state from logic
* This makes the function hyper-specific and only looks for main menu
  and page tools pinned states to return true.
* Renames function

Bug: T349924
Change-Id: I8e3a90b71c7f9acc5c217d76ed3a004342c503cd
2023-11-07 13:39:29 -06:00
Jon Robson 4cf50596bb Avoid nullish coalescing operators
Bug: T350519
Change-Id: If9a8a68aa9c6766b8cf9fb84ed526317d4d723ca
2023-11-06 11:10:44 -08:00
jenkins-bot 1db7b69286 Merge "Trigger window.resize when toggeling pinnableElement" 2023-10-26 16:47:14 +00:00
jenkins-bot 0eb580f4f7 Merge "Update pinnableHeader class when moving pinnableElement." 2023-10-25 18:36:00 +00:00
Jan Drewniak f59ceb4390 Update pinnableHeader class when moving pinnableElement.
Adds functionality to update the pinnable header class
(pinned or unpinned) after is has been moved via
movePinnableElement().

Bug: T348039
Change-Id: I23552bdbb3390222c2c8efbd5f9122a4d5021a00
2023-10-25 17:44:12 +00:00
Jon Robson 329d91c99c Vector 2022: Support dropdown creation via addPortlet
Vector 2022:
mw.util.addPortlet('p-twinkle', 'TW', '#p-cactions');
mw.util.addPortletLink('p-twinkle','#', 'Hello world');

Or if preferred it can be added to the pinned menu
mw.util.addPortlet('p-twinkle-pinnable', 'TW', '#p-tb');
mw.util.addPortletLink('p-twinkle-pinnable','#', 'Hello world');

Bug: T342815
Change-Id: Id58515e72bfbd5f700aa573a122529c6efdfea9d
2023-10-25 15:44:45 +00:00
Jon Robson 076f957c5d Drop p-namespaces backwards compatibility script
Bug: T347907
Change-Id: Ib2bec20315440f89a0ca375f0e2b65b7a041006d
2023-10-24 18:43:28 +00:00
WMDE-Fisch 7e63cdb219 Trigger window.resize when toggeling pinnableElement
The width of the screen changes when the pinnableElement is pinned
or un-pinned. Other features may need to react to this, like for
example the RevisionSlider extension.

Triggering a window.resize is a generic way to make sure these
changes can be handled by other elements on the page.

Bug: T336729
Depends-On: Iba22924b660f2709c0680aa6fbeb0feba92cfa76
Change-Id: I49878fdd8794273919bf961648fd93fdcf9511af
2023-10-18 13:39:06 +00:00
Jon Robson 922475be6b Define stable and internal APIs
Bug: T348081
Change-Id: I2ca9f27802e5ff1e0738300e2595ea419d49a431
2023-10-04 23:47:01 +00:00
ksarabia a1c2d5ca35 Add new utility function for detecting pinned elements
* Introduces a new utility function, `hasPinnedElements()`, that allows us to check whether there are any pinned elements in the HTML document based on their CSS class names.
* This function will be useful for detecting pinned elements and can be used within WikimediaEvents.


Bug: T346106
Change-Id: I4283cd234ba71acce1e5cbadabf8aeb17cd8d86e
2023-09-29 21:17:24 +00:00
Sergio Gimeno 76c21734d6 Apply body styles to mw teleport target
Bug: T347199
Change-Id: Ibd5d8c7cc7880678fae498a451cfd417f1f8e1b8
2023-09-26 20:16:57 +00:00
Moh'd Khier Abualruz c88d72f1d7 [anon prefs] TOC pinned / unpinned
- Status should persist across page views for anonymous users
- Added 'toc-pinned' as a persistable feature in features.js and FeatureManager.php.
- Handling for cached HTML supporting both new and old class names for pinned/unpinned TOC

Based-On: I0fbe0ab458c5bd55d659d3c35a8fbaa6cd6ec0e1

Bug: T316060
Change-Id: Iad8523037ed364f09962b2d6ca0a3d50d7bd2266
2023-09-14 21:37:50 +00:00
Jon Robson 2ea12a11ef Remove limited width cached HTML handling
Bug: T343843
Change-Id: Ib49e8325fddef90e202d4e753526af45ed7b2c26
2023-08-10 22:04:32 +00:00
Jon Robson beb466521b Fix suffix check
Follow up to I120f8f7114b33d2cfbd1c3c57ebf41f8b2d7fec4
Caught by Pixel.

Bug: T341641
Change-Id: If11d78bc48648647b9aab48908214058270eea57
2023-08-09 16:42:42 +00:00
Jon Robson 93a4b76b00 Fixes the pinning functionality
Pinning functionality was broken in
I120f8f7114b33d2cfbd1c3c57ebf41f8b2d7fec4
as it breaks the check against "legacy" feature
classes. We should resort to using the legacy mode
when neither of the new classes can be found.

Bug: T341641
Change-Id: If97a393140175fd41551c3db14b19becb8d9f460
2023-08-08 23:18:12 +00:00
Jon Robson e5bf8adad7 Limited width uses new client preferences system
* Update classes to use clientpref-1 and clientpref-0 suffix for limited width
I've limited this to the only client preference for now to reduce
risk.
* For cached HTML retain existing CSS rules, and continue saving
a cookie
* Migrate cookie if found for newly generated pages. This will be
to ensure the old cookie and new cookie are in sync (this should be
a one time operation)

Depends-On: I1e635f843ac9b2f248b1f7618134598e80291b38
Bug: T341641
Change-Id: I120f8f7114b33d2cfbd1c3c57ebf41f8b2d7fec4
2023-08-04 21:31:21 +00:00
Jon Robson 6b81214687 Fix issues with addPortlet handler
Follow up to I35a51df6ece2e48e086e722337d4c6bba427eeb4

1) the insertBefore function raises a JS error
2) We must take into account portlets added before the
Vector hook is registered.
3) Register the portlet in main. Loading the module should
not have side effects.

Bug: T303488
Change-Id: Iee6b308d6da63bc53bcba0fa5bb383d88787892a
2023-07-26 13:51:06 -07:00
Moh'd Khier Abualruz 4b4fc6c6c9 Add hook support for mw.util.addPortlet method
- Hooking into mw.util.addPortlet
- merged in tests from: I3258388d74c103515e3f0680304f9a376e439a35

possible follow-ups:
- tooltips support
- custom attributes support
- Adapting portlets of types dropdown, tab to vector skin. Check patch set 10 for a starting point

Depends-on: I79bad8661e34e653d41e6cb1cd4462ac5c6bc3b1
Bug: T303488
Change-Id: I35a51df6ece2e48e086e722337d4c6bba427eeb4
2023-07-26 13:37:09 +03:00
Jon Robson 48b1263533 Performance: Language dropdown menu should be hidden when ULS is enabled
The language dropdown currently impacts rendering due to making use of
visibility: hidden as space must be allocated for it on the page.

However when ULS is installed it is never used. As some JS to take
that into account so it doesn't impact the rendering of the page.

Since ULS may not be installed we have to consider that case and
retain the existing behaviour for those wiki (this should only
impact 3rd parties)

Bug: T340715
Change-Id: Ic83eaa34ffa74a42c7cf6df7c0857dd7a9401aba
2023-07-07 17:17:42 +00:00
bwang 6a57506ae8 Separate vector-menu classes from Dropdowns
Bug: T319358
Change-Id: Idf05c1664c026f58487ba34af5ede8a11e695baf
2023-06-27 10:14:29 -05:00
bwang 8cc436ac4b Replace search loader indicator with Codex pending search message
Bug: T321106
Change-Id: Ic27ecf16277725f6a08038a5501d0903a2494b5f
2023-06-20 13:32:48 -05:00
jenkins-bot 84864d21de Merge "Drop styles for cached HTML" 2023-06-16 16:32:31 +00:00
jenkins-bot 0ff1b2f3da Merge "Prevent Skins Vector from setting preferences for temporary accounts" 2023-06-14 20:38:33 +00:00
tsepothoabala e5ef6f5f64 Prevent Skins Vector from setting preferences for temporary accounts
Bug: T337874
Change-Id: I83ca625276569349abcd6622d295137c5c4ffe2c
2023-06-14 11:05:27 -07:00
Jon Robson 24d69726f3 Drop styles for cached HTML
Performance: This reclaims 1.3kb of CSS.

Bug: T336526
Change-Id: I6c1ed1523df8cc9e2f2ca09506f12a595b8b013d
2023-06-14 10:52:44 -07:00
Jon Robson 48d8ad0415 Forbid jQuery in new code
Follow up to I9d07acffa6f8133ec3e44ceba3d1fa5b27b81258

Change-Id: I5240c414cc4f4e4cc832647791b4a2c96acbc845
2023-06-13 15:45:43 -07:00
Jon Robson 68239ae344 Use Codex for button styles, start transitioning icons to use Codex icon mixins
Changes:
- mw-ui-button to cdx-button
- mw-ui-quiet to cdx-button--weight-quiet
- mw-ui-icon-element to cdx-button--icon-only
- mw-ui-icon to vector-icon
- mw-ui-icon-flush-right/left to vector-button-flush-right/left
- Removes $isSmallIcon param in Hooks.php

85 Visual Changes
- ~36 changes from minor pixel changes from the new button classes in the main menu, language button
- 22 from standardizing the padding of the TOC in page title
- ~10 changes from addition of .cdx-button to the TOC toggle buttons

PERFORMANCE:
This will result in an overall increase of 2.7kb of render blocking
CSS, 1kb will be reclaimed when
I6c1ed1523df8cc9e2f2ca09506f12a595b8b013d is merged.

Co-author: Bernard Wang <bwang@wikimedia.org>
Bug: T336526
Change-Id: Ibd558238a41a0d3edb981e441638f9564f43d226
2023-06-12 16:26:28 -07:00