Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

automatically jump to video on mount, remove button

Browse source
This commit is contained in:
Abdalrzag Eisa 2025-06-14 02:38:11 +03:00
parent 7dc0958e39
commit 524bcd90da
No known key found for this signature in database
GPG key ID: 4CD5A78B36195BC8
2 changed files with 7 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/routes/Player/SideDrawer/SideDrawer.less
View file

@ -1,6 +1,5 @@
// Copyright (C) 2017-2024 Smart code 203358507
@import (reference) '~@stremio/stremio-colors/less/stremio-colors.less';
@import (reference) '~stremio/common/screen-sizes.less';
:import('~stremio/components/MetaPreview/styles.less') {
@ -72,22 +71,10 @@
flex: 2;
display: flex;
flex-direction: column;
position: relative;
.videos {
overflow-y: auto;
}
.jump-to-currently-playing-btn {
position: absolute;
bottom: 1rem;
right: 1rem;
z-index: 1;
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
background-color: @color-primaryvariant1-light1-90;
}
}
}

14
src/routes/Player/SideDrawer/SideDrawer.tsx
View file

@ -1,11 +1,11 @@
// Copyright (C) 2017-2024 Smart code 203358507
import React, { useMemo, useCallback, useState, forwardRef, memo, useRef } from 'react';
import React, { useMemo, useCallback, useState, forwardRef, memo, useRef, useEffect } from 'react';
import classNames from 'classnames';
import Icon from '@stremio/stremio-icons/react';
import { useServices } from 'stremio/services';
import { CONSTANTS } from 'stremio/common';
import { MetaPreview, Video, Button } from 'stremio/components';
import { MetaPreview, Video } from 'stremio/components';
import SeasonsBar from 'stremio/routes/MetaDetails/VideosList/SeasonsBar';
import styles from './SideDrawer.less';
@ -78,11 +78,12 @@ const SideDrawer = memo(forwardRef<HTMLDivElement, Props>(({ seriesInfo, classNa
const currentlyPlayingVideoRef = useRef<HTMLDivElement>(null);
const jumpToCurrentlyPlaying = () => {
useEffect(() => {
const { current } = currentlyPlayingVideoRef;
if (current) current.scrollIntoView({ behavior: 'smooth', block: 'center' });
};
if (current) {
setTimeout(() => { current.scrollIntoView({ behavior: 'smooth', block: 'center' }); }, 300);
}
}, []);
return (
<div ref={ref} className={classNames(styles['side-drawer'], className)} onMouseDown={onMouseDown}>
@ -111,7 +112,6 @@ const SideDrawer = memo(forwardRef<HTMLDivElement, Props>(({ seriesInfo, classNa
onSelect={seasonOnSelect}
/>
<div className={styles['videos']}>
<Button className={styles['jump-to-currently-playing-btn']} disabled={seriesInfo.season !== season} onClick={jumpToCurrentlyPlaying}><Icon className={styles['icon']} name={'discover-outline'} /></Button>
{videos.map((video, index) => (
<div key={index} ref={video.id === props.currentlyPlayingVideoID ? currentlyPlayingVideoRef : null}>
<Video