diff --git a/src/routes/Player/ControlBar/SeekBar/SeekBar.js b/src/routes/Player/ControlBar/SeekBar/SeekBar.js index 27f0a4ff8..0fcb7423e 100644 --- a/src/routes/Player/ControlBar/SeekBar/SeekBar.js +++ b/src/routes/Player/ControlBar/SeekBar/SeekBar.js @@ -5,7 +5,7 @@ const PropTypes = require('prop-types'); const classnames = require('classnames'); const debounce = require('lodash.debounce'); const { useRouteFocused } = require('stremio-router'); -const { Slider } = require('stremio/common'); +const { Slider, Button, useBinaryState } = require('stremio/common'); const formatTime = require('./formatTime'); const styles = require('./styles'); @@ -13,6 +13,8 @@ const SeekBar = ({ className, time, duration, buffered, onSeekRequested }) => { const disabled = time === null || isNaN(time) || duration === null || isNaN(duration); const routeFocused = useRouteFocused(); const [seekTime, setSeekTime] = React.useState(null); + + const [remainingTimeMode,,, toggleRemainingTimeMode] = useBinaryState(false); const resetTimeDebounced = React.useCallback(debounce(() => { setSeekTime(null); }, 1500), []); @@ -56,7 +58,13 @@ const SeekBar = ({ className, time, duration, buffered, onSeekRequested }) => { onSlide={onSlide} onComplete={onComplete} /> -
{formatTime(duration)}
+ ); }; diff --git a/src/routes/Player/ControlBar/SeekBar/formatTime.js b/src/routes/Player/ControlBar/SeekBar/formatTime.js index 2bd684485..4dbe645ad 100644 --- a/src/routes/Player/ControlBar/SeekBar/formatTime.js +++ b/src/routes/Player/ControlBar/SeekBar/formatTime.js @@ -4,7 +4,7 @@ const formatUnit = (value) => { return ('0' + value).slice(-1 * Math.max(value.toString().length, 2)); }; -const formatTime = (time) => { +const formatTime = (time, prefix = '') => { if (time === null || isNaN(time)) { return '--:--:--'; } @@ -12,7 +12,7 @@ const formatTime = (time) => { const hours = Math.floor(time / (1000 * 60 * 60)); const minutes = Math.floor((time / (1000 * 60)) % 60); const seconds = Math.floor((time / 1000) % 60); - return `${formatUnit(hours)}:${formatUnit(minutes)}:${formatUnit(seconds)}`; + return `${formatUnit(hours)}:${formatUnit(minutes)}:${formatUnit(seconds)}${prefix}`; }; module.exports = formatTime; diff --git a/src/routes/Player/ControlBar/SeekBar/styles.less b/src/routes/Player/ControlBar/SeekBar/styles.less index 6a659a790..98446fbfb 100644 --- a/src/routes/Player/ControlBar/SeekBar/styles.less +++ b/src/routes/Player/ControlBar/SeekBar/styles.less @@ -14,7 +14,7 @@ .label { flex: none; - width: 5rem; + width: 6rem; white-space: nowrap; text-overflow: ellipsis; direction: rtl;