wikimedia/mediawiki-extensions-DiscussionTools
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/DiscussionTools synced 2024-11-27 17:51:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix detection for the sticky "Add topic" being stuck

Browse source 
This fixes some animations when scrolling.

Change-Id: I5ed4a066436f673732227612c5b393ea47e16c45
This commit is contained in:
Bartosz Dziewoński 2023-02-01 19:45:34 +01:00
parent 52de4b0b1b
commit 579766b5ab
2 changed files with 7 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
modules/dt.init.less
View file

@ -857,7 +857,7 @@ h1, h2, h3, h4, h5, h6 {
.ext-discussiontools-init-new-topic-closed &,
.ext-discussiontools-init-virtual-keyboard-open &,
&-pinned.oo-ui-buttonElement {
&-pinned {
transform: translateY( 0 );
opacity: 1;
position: static;

10
modules/mobile.js
View file

@ -94,6 +94,8 @@ function init( $container ) {
newTopicButton = OO.ui.infuse( $( '.ext-discussiontools-init-new-topic-button' ) );
// For compatibility with Minerva click tracking (T295490)
newTopicButton.$element.attr( 'data-event-name', 'talkpage.add-topic' );
// eslint-disable-next-line no-jquery/no-global-selector
var $newTopicWrapper = $( '.ext-discussiontools-init-new-topic' );
var $scrollContainer = $( OO.ui.Element.static.getClosestScrollableContainer( document.body ) );
var $scrollListener = $scrollContainer.is( 'html, body' ) ? $( OO.ui.Element.static.getWindow( $scrollContainer[ 0 ] ) ) : $scrollContainer;
var lastScrollTop = $scrollContainer.scrollTop();
@ -106,11 +108,11 @@ function init( $container ) {
var isScrollDown = scrollTop > lastScrollTop;
if ( isScrollDown !== wasScrollDown ) {
if ( !isScrollDown ) {
newTopicButton.$element.css( 'transition', 'none' );
$newTopicWrapper.css( 'transition', 'none' );
}
$body.removeClass( [ 'ext-discussiontools-init-new-topic-closed', 'ext-discussiontools-init-new-topic-opened' ] );
requestAnimationFrame( function () {
newTopicButton.$element.css( 'transition', '' );
$newTopicWrapper.css( 'transition', '' );
$body.addClass( isScrollDown ? 'ext-discussiontools-init-new-topic-close' : 'ext-discussiontools-init-new-topic-open' );
setTimeout( function () {
$body.removeClass( [ 'ext-discussiontools-init-new-topic-close', 'ext-discussiontools-init-new-topic-open' ] );
@ -121,12 +123,12 @@ function init( $container ) {
var observer = new IntersectionObserver(
function ( entries ) {
newTopicButton.$element.toggleClass( 'ext-discussiontools-init-new-topic-pinned', entries[ 0 ].intersectionRatio === 1 );
$newTopicWrapper.toggleClass( 'ext-discussiontools-init-new-topic-pinned', entries[ 0 ].intersectionRatio === 1 );
},
{ threshold: [ 1 ] }
);
observer.observe( newTopicButton.$element[ 0 ] );
observer.observe( $newTopicWrapper[ 0 ] );
lastScrollTop = scrollTop;
wasScrollDown = isScrollDown;