Fix inital display of control bar text

This commit is contained in:
saltrafael 2021-08-31 09:52:15 -03:00
parent 529ad258fe
commit 21372037b4
No known key found for this signature in database
GPG key ID: 9C7F1DC0B0F54515

View file

@ -282,7 +282,6 @@ export default React.memo<Props>(function VideoJs(props: Props) {
} }
} }
function resolveCtrlText(e) {
// Override the player's control text. We override to: // Override the player's control text. We override to:
// 1. Add keyboard shortcut to the tool-tip. // 1. Add keyboard shortcut to the tool-tip.
// 2. Override videojs' i18n and use our own (don't want to have 2 systems). // 2. Override videojs' i18n and use our own (don't want to have 2 systems).
@ -294,15 +293,31 @@ export default React.memo<Props>(function VideoJs(props: Props) {
// on top of just 'loadstart'. // on top of just 'loadstart'.
// - videojs changes the MuteToggle text at 'loadstart', so this was chosen // - videojs changes the MuteToggle text at 'loadstart', so this was chosen
// as the listener to update static texts. // as the listener to update static texts.
function resolveCtrlText(e, initialPlay) {
const player = playerRef.current; const player = playerRef.current;
if (player) { if (player) {
const controlBar = player.getChild('controlBar'); const controlBar = player.getChild('controlBar');
switch (e.type) { switch (e.type) {
case 'play': case 'play':
controlBar.getChild('PlayToggle').controlText(__('Pause (space)')); controlBar.getChild('PlayToggle').controlText(__('Pause (space/k)'));
if (initialPlay) {
controlBar.getChild('PlaybackRateMenuButton').controlText(__('Playback Rate (<, >)'));
controlBar.getChild('QualityButton').controlText(__('Quality'));
resolveCtrlText({ type: 'fullscreenchange' });
resolveCtrlText({ type: 'volumechange' });
resolveCtrlText({ type: 'fullscreenchange' });
// --- Do everything ---
// (1) The 'Theater mode' button should probably be changed to a class
// so that we can use getChild() with a specific name. There might be
// clashes if we add a new button in the future.
// (2) We'll have to get 'makeSelectClientSetting(SETTINGS.VIDEO_THEATER_MODE)'
// as a prop here so we can say "Theater mode|Default mode" instead of
// "Toggle Theater mode".
controlBar.getChild('Button').controlText(__('Toggle Theater mode (t)'));
}
break; break;
case 'pause': case 'pause':
controlBar.getChild('PlayToggle').controlText(__('Play (space)')); controlBar.getChild('PlayToggle').controlText(__('Play (space/k)'));
break; break;
case 'volumechange': case 'volumechange':
controlBar controlBar
@ -316,20 +331,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
.controlText(player.isFullscreen() ? __('Exit Fullscreen (f)') : __('Fullscreen (f)')); .controlText(player.isFullscreen() ? __('Exit Fullscreen (f)') : __('Fullscreen (f)'));
break; break;
case 'loadstart': case 'loadstart':
// --- Do everything --- resolveCtrlText({ type: 'play' }, true);
controlBar.getChild('PlaybackRateMenuButton').controlText(__('Playback Rate (<, >)'));
controlBar.getChild('QualityButton').controlText(__('Quality'));
resolveCtrlText({ type: 'play' });
resolveCtrlText({ type: 'pause' });
resolveCtrlText({ type: 'volumechange' });
resolveCtrlText({ type: 'fullscreenchange' });
// (1) The 'Theater mode' button should probably be changed to a class
// so that we can use getChild() with a specific name. There might be
// clashes if we add a new button in the future.
// (2) We'll have to get 'makeSelectClientSetting(SETTINGS.VIDEO_THEATER_MODE)'
// as a prop here so we can say "Theater mode|Default mode" instead of
// "Toggle Theater mode".
controlBar.getChild('Button').controlText(__('Toggle Theater mode (t)'));
break; break;
default: default:
if (isDev) throw Error('Unexpected: ' + e.type); if (isDev) throw Error('Unexpected: ' + e.type);
@ -347,6 +349,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
} else { } else {
showTapButton(TAP.NONE); showTapButton(TAP.NONE);
} }
resolveCtrlText({ type: 'play' }, true);
} }
function onVolumeChange() { function onVolumeChange() {