Player: chapter follow-up tweaks
- Make the chapters button appear consistently. - Previously, it was only appearing for Original. - We still hide it for mobile, as per previous explanation. - Changed the Chapters button position and popup aesthetics.
This commit is contained in:
parent
a4a20aa8e0
commit
511097cd67
4 changed files with 22 additions and 1 deletions
|
@ -1673,6 +1673,7 @@
|
|||
"Exit Fullscreen (f)": "Exit Fullscreen (f)",
|
||||
"Theater Mode (t)": "Theater Mode (t)",
|
||||
"Default Mode (t)": "Default Mode (t)",
|
||||
"Chapters": "Chapters",
|
||||
"Quality": "Quality",
|
||||
"Auto": "Auto",
|
||||
"Auto --[Video quality. Short form]--": "Auto",
|
||||
|
|
|
@ -126,7 +126,7 @@ function overrideHoverTooltip(player: any, tsData: TimestampData, duration: numb
|
|||
|
||||
function load(player: any, timestampData: TimestampData, duration: number) {
|
||||
player.one('loadedmetadata', () => {
|
||||
const textTrack = player.addTextTrack('chapters', 'label', 'en');
|
||||
const textTrack = player.addTextTrack('chapters', __('Chapters'), 'en');
|
||||
|
||||
setTimeout(() => {
|
||||
const values = Object.values(timestampData);
|
||||
|
@ -144,6 +144,11 @@ function load(player: any, timestampData: TimestampData, duration: number) {
|
|||
values.map((v) => v.seconds),
|
||||
duration
|
||||
);
|
||||
|
||||
const chaptersButton = player?.controlBar?.chaptersButton;
|
||||
if (chaptersButton) {
|
||||
chaptersButton.update();
|
||||
}
|
||||
}, REQUIRED_DELAY_FOR_IOS_MS);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -634,6 +634,18 @@ $control-bar-icon-size: 0.8rem;
|
|||
}
|
||||
}
|
||||
|
||||
.vjs-chapters-button {
|
||||
.vjs-menu {
|
||||
width: 20em;
|
||||
left: -3em;
|
||||
}
|
||||
|
||||
li {
|
||||
text-align: left;
|
||||
padding: var(--spacing-xxxs) var(--spacing-s);
|
||||
}
|
||||
}
|
||||
|
||||
.vjs-chromecast-button,
|
||||
.vjs-airplay-button {
|
||||
.vjs-icon-placeholder {
|
||||
|
|
|
@ -299,6 +299,9 @@ button.vjs-big-play-button {
|
|||
.vjs-custom-control-spacer {
|
||||
order: 9 !important;
|
||||
}
|
||||
.vjs-chapters-button {
|
||||
order: 10 !important;
|
||||
}
|
||||
.vjs-button--autoplay-next {
|
||||
order: 10 !important;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue