diff --git a/src/features/MatchPage/store/index.tsx b/src/features/MatchPage/store/index.tsx
index 2f5e34bd..778a5853 100644
--- a/src/features/MatchPage/store/index.tsx
+++ b/src/features/MatchPage/store/index.tsx
@@ -12,8 +12,8 @@ type Props = { children: ReactNode }
const MatchPageContext = createContext({} as Context)
export const MatchPageStore = ({ children }: Props) => {
- const lexics = useMatchPage()
- return {children}
+ const values = useMatchPage()
+ return {children}
}
export const useMatchPageStore = () => useContext(MatchPageContext)
diff --git a/src/features/MatchPopup/store/hooks/usePlayerClickHandler.tsx b/src/features/MatchPopup/store/hooks/usePlayerClickHandler.tsx
deleted file mode 100644
index 9538a0f3..00000000
--- a/src/features/MatchPopup/store/hooks/usePlayerClickHandler.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import type { MouseEvent } from 'react'
-import { useState, useEffect } from 'react'
-import { useLocation } from 'react-router'
-
-import type { PlaylistOption } from 'features/MatchPage/types'
-
-export const usePlayerClickHandler = () => {
- const { pathname } = useLocation()
- const [selectedPlaylist, setSelectedPlaylist] = useState()
- const handlePlaylistClick = (playlist: PlaylistOption, e?: MouseEvent) => {
- e?.stopPropagation()
- if (playlist !== selectedPlaylist) {
- setSelectedPlaylist(playlist)
- }
- }
-
- useEffect(() => {
- setSelectedPlaylist(undefined)
- }, [pathname])
-
- return {
- handlePlaylistClick,
- selectedPlaylist,
- }
-}
diff --git a/src/features/MultiSourcePlayer/components/ProgressBar/stories.tsx b/src/features/MultiSourcePlayer/components/ProgressBar/stories.tsx
deleted file mode 100644
index 807640f6..00000000
--- a/src/features/MultiSourcePlayer/components/ProgressBar/stories.tsx
+++ /dev/null
@@ -1,126 +0,0 @@
-import type { ReactElement } from 'react'
-
-import styled from 'styled-components/macro'
-
-import { VolumeBar } from 'features/StreamPlayer/components/VolumeBar'
-import {
- Controls,
- Fullscreen,
- PlayStop,
-} from 'features/StreamPlayer/styled'
-
-import { ProgressBar } from '.'
-
-const Story = {
- component: ProgressBar,
- title: 'ProgressBarWithChapters',
-}
-
-export default Story
-
-const Wrapper = styled.div`
- position: relative;
- width: 95vw;
- height: 50vh;
- left: 50%;
- transform: translateX(-50%);
- background-color: #000;
-`
-
-const callback = () => {}
-
-const renderInControls = (progressBarElement: ReactElement) => (
-
-
-
-
- {progressBarElement}
-
-
-
-)
-
-const duration = 70000
-
-const chapters = [
- {
- duration: 30000,
- endMs: 30000,
- endOffsetMs: 0,
- period: 0,
- startMs: 0,
- startOffsetMs: 0,
- urls: {},
- },
- {
- duration: 30000,
- endMs: 60000,
- endOffsetMs: 0,
- period: 0,
- startMs: 30000,
- startOffsetMs: 0,
- urls: {},
- },
- {
- duration: 10000,
- endMs: 70000,
- endOffsetMs: 0,
- period: 0,
- startMs: 60000,
- startOffsetMs: 0,
- urls: {},
- },
-]
-
-export const Empty = () => renderInControls(
- ,
-)
-
-export const HalfLoaded = () => renderInControls(
- ,
-)
-
-export const HalfPlayed = () => renderInControls(
- ,
-)
-
-export const Loaded40AndPlayed20 = () => renderInControls(
- ,
-)
diff --git a/src/features/MultiSourcePlayer/config.tsx b/src/features/MultiSourcePlayer/config.tsx
deleted file mode 100644
index 4602985b..00000000
--- a/src/features/MultiSourcePlayer/config.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-export const REWIND_SECONDS = 5
-
-export const HOUR_IN_MILLISECONDS = 60 * 60 * 1000
diff --git a/src/features/MultiSourcePlayer/hooks/useVideoQuality.tsx b/src/features/MultiSourcePlayer/hooks/useVideoQuality.tsx
deleted file mode 100644
index 4c810ab0..00000000
--- a/src/features/MultiSourcePlayer/hooks/useVideoQuality.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import keys from 'lodash/keys'
-import uniq from 'lodash/uniq'
-import orderBy from 'lodash/orderBy'
-import includes from 'lodash/includes'
-
-import { useLocalStore } from 'hooks'
-
-import type { Chapters } from '../types'
-
-const getVideoQualities = (chapters: Chapters) => {
- const qualities = uniq(keys(chapters[0]?.urls))
- return orderBy(
- qualities,
- Number,
- 'desc',
- )
-}
-
-export const useVideoQuality = (chapters: Chapters) => {
- const videoQualities = getVideoQualities(chapters)
-
- const qualityValidator = (localStorageQuality: string) => (
- includes(videoQualities, localStorageQuality)
- )
-
- const [selectedQuality, setSelectedQuality] = useLocalStore({
- // по умолчанию наилучшее качество
- defaultValue: videoQualities[0],
- key: 'player_quality',
- validator: qualityValidator,
- })
-
- return {
- selectedQuality,
- setSelectedQuality,
- videoQualities,
- }
-}
diff --git a/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx b/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx
index 9a257fb9..498aac56 100644
--- a/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx
+++ b/src/features/StreamPlayer/components/ProgressBar/helpers/calculateChapterStyles/index.tsx
@@ -49,7 +49,9 @@ export const calculateChapterStyles = ({
...chapter,
loaded: calculateChapterProgress(loadedProgress, chapter),
played: calculateChapterProgress(playedProgress, chapter),
- width: chapter.duration * 100 / videoDuration,
+ width: chapter.duration
+ ? chapter.duration * 100 / videoDuration
+ : 100,
}
return [
...playedChapters,
diff --git a/src/features/StreamPlayer/hooks/index.tsx b/src/features/StreamPlayer/hooks/index.tsx
index 443889e8..f0cab226 100644
--- a/src/features/StreamPlayer/hooks/index.tsx
+++ b/src/features/StreamPlayer/hooks/index.tsx
@@ -7,10 +7,12 @@ import {
import size from 'lodash/size'
import isNumber from 'lodash/isNumber'
+import isEmpty from 'lodash/isEmpty'
import { isIOS } from 'config/userAgent'
import { useObjectState } from 'hooks/useObjectState'
+import { useEventListener } from 'hooks/useEventListener'
import { useVolume } from 'features/VideoPlayer/hooks/useVolume'
import { useNoNetworkPopupStore } from 'features/NoNetworkPopup'
@@ -197,6 +199,14 @@ export const useVideoPlayer = ({
setPlayerState({ playedProgress: liveProgressMs, seek: liveProgressMs / 1000 })
}, [duration, setPlayerState])
+ useEventListener({
+ callback: (e: KeyboardEvent) => {
+ if (e.code === 'ArrowLeft') rewindBackward()
+ else if (e.code === 'ArrowRight') rewindForward()
+ },
+ event: 'keydown',
+ })
+
useEffect(() => {
if (isNumber(seek)) {
setPlayerState({ seek: undefined })
@@ -216,11 +226,15 @@ export const useVideoPlayer = ({
}, [chapters, setPlayerState])
useEffect(() => {
+ if (isLive || isEmpty(chapters)) return
+
const { duration: chapterDuration } = getActiveChapter()
if (playedProgress >= chapterDuration && !seeking) {
playNextChapter()
}
}, [
+ isLive,
+ chapters,
getActiveChapter,
playedProgress,
seeking,
diff --git a/src/features/StreamPlayer/hooks/usePlayingHandlers.tsx b/src/features/StreamPlayer/hooks/usePlayingHandlers.tsx
index b223fbf2..7d7c698f 100644
--- a/src/features/StreamPlayer/hooks/usePlayingHandlers.tsx
+++ b/src/features/StreamPlayer/hooks/usePlayingHandlers.tsx
@@ -15,7 +15,11 @@ export const usePlayingHandlers = (
setPlayerState((state) => (
state.ready
? state
- : { playing: true, ready: true }
+ : {
+ buffering: false,
+ playing: true,
+ ready: true,
+ }
))
}, [setPlayerState])
diff --git a/src/requests/getFullMatchDuration.tsx b/src/requests/getFullMatchDuration.tsx
deleted file mode 100644
index dd9a1e90..00000000
--- a/src/requests/getFullMatchDuration.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import pipe from 'lodash/fp/pipe'
-import orderBy from 'lodash/fp/orderBy'
-import sumBy from 'lodash/fp/sumBy'
-import uniqBy from 'lodash/fp/uniqBy'
-
-import type { Videos, Video } from './getVideos'
-import { getVideos } from './getVideos'
-
-const calculateDuration = (videos: Videos) => {
- const durationMs = pipe(
- orderBy(({ quality }: Video) => Number(quality), 'desc'),
- uniqBy(({ period }: Video) => period),
- sumBy(({ duration }: Video) => duration),
- )(videos)
- return durationMs / 1000
-}
-
-/**
- * Временный способ получения длительности матча
- */
-export const getFullMatchDuration = async (...args: Parameters) => {
- const videos = await getVideos(...args)
- return calculateDuration(videos)
-}
diff --git a/src/requests/getVideos.tsx b/src/requests/getVideos.tsx
deleted file mode 100644
index 4364de67..00000000
--- a/src/requests/getVideos.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import isEmpty from 'lodash/isEmpty'
-import filter from 'lodash/filter'
-
-import { API_ROOT, SportTypes } from 'config'
-import { callApi } from 'helpers'
-
-const filterByIds = (videos: Videos) => {
- const zeroIdVideos = filter(videos, { abc: '0' })
- return isEmpty(zeroIdVideos) ? videos : zeroIdVideos
-}
-
-export type Video = {
- /** id дорожки */
- abc: string,
- duration: number,
- period: number,
- quality: string,
- start_ms: number,
- url: string,
-}
-
-export type Videos = Array