diff --git a/src/features/MatchPage/components/LiveMatch/helpers.tsx b/src/features/MatchPage/components/LiveMatch/helpers.tsx index 5bb69240..d589b8ad 100644 --- a/src/features/MatchPage/components/LiveMatch/helpers.tsx +++ b/src/features/MatchPage/components/LiveMatch/helpers.tsx @@ -5,6 +5,7 @@ import concat from 'lodash/concat' import type { Episodes } from 'requests/getMatchPlaylists' import type { Chapters, Chapter } from 'features/StreamPlayer/types' +import type { MatchInfo, VideoBound } from 'requests/getMatchInfo' import type { MatchPlaylistOption, PlaylistOption } from '../../types' import { FULL_GAME_KEY } from '../../helpers/buildPlaylists' @@ -32,7 +33,11 @@ const getFullMatchChapters = (url: string, playlist: MatchPlaylistOption) => { /** * Формирует эпизоды плейлистов матча и игроков * */ -const getPlaylistChapters = (url: string, episodes: Episodes) => reduce( +const getPlaylistChapters = ( + profile: MatchInfo, + url: string, + episodes: Episodes, +) => reduce( episodes, ( acc: Chapters, @@ -41,15 +46,20 @@ const getPlaylistChapters = (url: string, episodes: Episodes) => reduce( ) => { if (episode.s >= episode.e) return acc + const bound = profile!.video_bounds!.filter( + (ep: VideoBound) => Number(ep.h) === Number(episode.h), + ) + const episodeDuration = (episode.e - episode.s) * 1000 - const prevVideoEndMs = last(acc)?.endMs || 0 + const prevVideoEndMs = (last(acc)?.endMs ?? bound[0].s * 1000) || 0 + const nextChapter: Chapter = { duration: episodeDuration, endMs: prevVideoEndMs + episodeDuration, - endOffsetMs: episode.e * 1000, + endOffsetMs: prevVideoEndMs + episode.e * 1000, index, - startMs: prevVideoEndMs, - startOffsetMs: episode.s * 1000, + startMs: 0, + startOffsetMs: prevVideoEndMs + episode.s * 1000, url, } return concat(acc, nextChapter) @@ -58,6 +68,7 @@ const getPlaylistChapters = (url: string, episodes: Episodes) => reduce( ) type Args = { + profile: MatchInfo, selectedPlaylist?: PlaylistOption, url: string, } @@ -66,6 +77,7 @@ type Args = { * Формирует список эпизодов из выбранного плейлиста для плеера */ export const buildChapters = ({ + profile, selectedPlaylist, url, }: Args): Chapters => { @@ -73,5 +85,9 @@ export const buildChapters = ({ if (selectedPlaylist.id === FULL_GAME_KEY) { return getFullMatchChapters(url, selectedPlaylist) } - return getPlaylistChapters(url, selectedPlaylist.episodes) + return getPlaylistChapters( + profile, + url, + selectedPlaylist.episodes, + ) } diff --git a/src/features/MatchPage/components/LiveMatch/hooks/index.tsx b/src/features/MatchPage/components/LiveMatch/hooks/index.tsx index fe528730..11cd8287 100644 --- a/src/features/MatchPage/components/LiveMatch/hooks/index.tsx +++ b/src/features/MatchPage/components/LiveMatch/hooks/index.tsx @@ -30,6 +30,7 @@ export const useLiveMatch = () => { ) const { chapters } = useChapters({ + profile, selectedPlaylist, url: `${API_ROOT}/video/stream/${sportType}/${matchId}.m3u8`, }) diff --git a/src/features/MatchPage/components/LiveMatch/hooks/useChapters.tsx b/src/features/MatchPage/components/LiveMatch/hooks/useChapters.tsx index 760f686d..146134aa 100644 --- a/src/features/MatchPage/components/LiveMatch/hooks/useChapters.tsx +++ b/src/features/MatchPage/components/LiveMatch/hooks/useChapters.tsx @@ -1,24 +1,29 @@ import { useMemo } from 'react' import type { PlaylistOption } from 'features/MatchPage/types' +import type { MatchInfo } from 'requests/getMatchInfo' import { buildChapters } from '../helpers' type Args = { + profile: MatchInfo, selectedPlaylist?: PlaylistOption, url: string, } export const useChapters = ({ + profile, selectedPlaylist, url, }: Args) => { const chapters = useMemo( () => buildChapters({ + profile, selectedPlaylist, url, }), [ + profile, selectedPlaylist, url, ], diff --git a/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx b/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx index 8bf4bde5..2d9861c7 100644 --- a/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx +++ b/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx @@ -44,7 +44,8 @@ export const calculateChapterStyles = ({ })), )(chapters) - const chapter = chapters[activeChapterIndex] + const chapter = chapters[activeChapterIndex] ?? chapters[0] + const activeChapter = { ...chapter, loaded: calculateChapterProgress(loadedProgress, chapter), diff --git a/src/features/StreamPlayer/hooks/index.tsx b/src/features/StreamPlayer/hooks/index.tsx index 70adf164..b7529be3 100644 --- a/src/features/StreamPlayer/hooks/index.tsx +++ b/src/features/StreamPlayer/hooks/index.tsx @@ -90,7 +90,7 @@ export const useVideoPlayer = ({ } = usePlayingHandlers(setPlayerState, chapters) const getActiveChapter = useCallback( - (index: number = activeChapterIndex) => chapters[index], + (index: number = activeChapterIndex) => chapters[index] ?? chapters[0], [chapters, activeChapterIndex], ) diff --git a/src/requests/getMatchInfo.tsx b/src/requests/getMatchInfo.tsx index 31960455..9ec36c98 100644 --- a/src/requests/getMatchInfo.tsx +++ b/src/requests/getMatchInfo.tsx @@ -16,6 +16,14 @@ export type Team = { score: number, } +export type VideoBound = { + e: number, + h: number, + s: number, +} + +type VideoBounds = Array + export type MatchInfo = { access?: boolean, calc: boolean, @@ -33,6 +41,7 @@ export type MatchInfo = { name_eng: string, name_rus: string, }, + video_bounds?: VideoBounds, youtube_link?: string, } | null