diff options
| author | Miguel Ángel Moreno <mail@migalmoreno.com> | 2024-03-10 23:27:48 +0100 |
|---|---|---|
| committer | Miguel Ángel Moreno <mail@migalmoreno.com> | 2024-03-10 23:27:48 +0100 |
| commit | 800652c653684947e7394934bb06355ff07aac4b (patch) | |
| tree | f434f3a66374d0ecb161b63815387b62ff931f40 | |
| parent | e9514a2548e68702843ee70b215896d02d1d3cef (diff) | |
feat: add player duration control bar elements
| -rw-r--r-- | resources/src/css/tubo.scss | 6 | ||||
| -rw-r--r-- | src/frontend/tubo/views/stream.cljs | 7 |
2 files changed, 9 insertions, 4 deletions
diff --git a/resources/src/css/tubo.scss b/resources/src/css/tubo.scss index 91d33fa..cc3090a 100644 --- a/resources/src/css/tubo.scss +++ b/resources/src/css/tubo.scss @@ -14,10 +14,14 @@ object-fit: cover; } -.vjs-tubo .vjs-control-bar { +.vjs-tubo .vjs-control-bar, .vjs-tubo .vjs-volume-control { background: none; } +.vjs-tubo .vjs-current-time, .vjs-tubo .vjs-time-divider, .vjs-tubo .vjs-duration { + display: block; +} + .vjs-tubo .vjs-big-play-button, .vjs-tubo.vjs-paused .vjs-big-play-button { background: none; font-size: 120px; diff --git a/src/frontend/tubo/views/stream.cljs b/src/frontend/tubo/views/stream.cljs index 7ee00f8..147686f 100644 --- a/src/frontend/tubo/views/stream.cljs +++ b/src/frontend/tubo/views/stream.cljs @@ -40,8 +40,8 @@ (when-not resolution (str " " averageBitrate "kbit/s")))}) available-streams)) - player-elements ["playToggle" "progressControl" - "volumePanel" "playbackRateMenuButton" + player-elements ["playToggle" "CurrentTimeDisplay" "progressControl" + "DurationDisplay" "volumePanel" "playbackRateMenuButton" "QualitySelector" "fullscreenToggle"]] [layout/content-container [:div.flex.justify-center.relative @@ -50,7 +50,8 @@ {:sources sources :poster thumbnail-url :controls true - :controlBar {:children player-elements} + :controlBar {:volumePanel {:inline false} + :children player-elements} :preload "metadata" :responsive true :fill true |