viaprog/shaka-player
1
0
Fork 0
mirror of https://github.com/shaka-project/shaka-player.git synced 2026-06-13 15:46:46 +03:00
Code Issues Packages Projects Releases Wiki Activity

refactor(UI): Unify localization and availability updates in Element (#10128)

Browse Source
This commit is contained in:
Álvaro Velad Galván
2026-05-27 10:02:29 +02:00
committed by GitHub
parent 35d3a796dd
commit 1b41275415
35 changed files with 298 additions and 874 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/visualizer_button.js
+5 -19
View File
@@ -65,25 +65,14 @@ shakaDemo.VisualizerButton = class extends shaka.ui.Element {
shakaDemoMain.getIsVisualizerActive()) {
shakaDemoMain.setIsVisualizerActive(false);
}
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(document, 'fullscreenchange', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/** @private */
@@ -97,11 +86,8 @@ shakaDemo.VisualizerButton = class extends shaka.ui.Element {
}
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
if (!this.castProxy_.isCasting() &&
!this.controls.isFullScreenEnabled() &&
!this.isSubMenuOpened) {
ui/ad_info.js
-19
View File
@@ -11,7 +11,6 @@ goog.require('goog.asserts');
goog.require('shaka.ads.Utils');
goog.require('shaka.ui.Element');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
goog.require('shaka.util.Timer');
@@ -46,17 +45,6 @@ shaka.ui.AdInfo = class extends shaka.ui.Element {
this.onTimerTick_();
});
this.updateAriaLabel_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.eventManager.listen(
this.adManager, shaka.ads.Utils.AD_STARTED, () => {
this.onAdStarted_();
@@ -73,13 +61,6 @@ shaka.ui.AdInfo = class extends shaka.ui.Element {
}
}
/**
* @private
*/
updateAriaLabel_() {
// arai-label is set dynamically in onTimerTick_().
}
/**
* @private
*/
ui/ad_statistics_button.js
+11 -23
View File
@@ -14,7 +14,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -113,25 +112,16 @@ shaka.ui.AdStatisticsButton = class extends shaka.ui.Element {
this.onTimerTick_();
});
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.loadContainer_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
}
this.onClick_();
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
});
this.eventManager.listen(this.player, 'loading', () => {
@@ -142,15 +132,6 @@ shaka.ui.AdStatisticsButton = class extends shaka.ui.Element {
this.adManager, shaka.ads.Utils.AD_STARTED, () => {
shaka.ui.Utils.setDisplay(this.button_, true);
});
if (this.isSubMenu) {
this.eventManager.listen(this.controls, 'submenuopen', () => {
shaka.ui.Utils.setDisplay(this.button_, false);
});
this.eventManager.listen(this.controls, 'submenuclose', () => {
shaka.ui.Utils.setDisplay(this.button_, this.currentStats_.started > 0);
});
}
}
/** @private */
@@ -168,8 +149,8 @@ shaka.ui.AdStatisticsButton = class extends shaka.ui.Element {
}
}
/** @private */
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.nameSpan_.textContent =
@@ -182,6 +163,13 @@ shaka.ui.AdStatisticsButton = class extends shaka.ui.Element {
this.stateSpan_.textContent = this.localization.resolve(labelText);
}
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(
this.button_,
!this.isSubMenuOpened && this.currentStats_.started > 0);
}
/**
* @param {string} name
* @return {!HTMLElement}
ui/audio_language_selection.js
+8 -28
View File
@@ -11,7 +11,6 @@ goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.LanguageUtils');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -35,15 +34,6 @@ shaka.ui.AudioLanguageSelection = class extends shaka.ui.SettingsMenu {
this.button.classList.add('shaka-tooltip-status');
this.menu.classList.add('shaka-audio-languages');
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -55,24 +45,12 @@ shaka.ui.AudioLanguageSelection = class extends shaka.ui.SettingsMenu {
this.onAudioTracksChanged_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.onAudioTracksChanged_();
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.onAudioTracksChanged_();
}
/** @private */
onAudioTracksChanged_() {
const audioTracks = this.player.getAudioTracks() || [];
@@ -114,11 +92,8 @@ shaka.ui.AudioLanguageSelection = class extends shaka.ui.SettingsMenu {
this.player.configure({preferredAudio: [pref]});
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
@@ -128,6 +103,11 @@ shaka.ui.AudioLanguageSelection = class extends shaka.ui.SettingsMenu {
this.backSpan.textContent =
this.localization.resolve(LocIds.LANGUAGE);
}
/** @override */
checkAvailability() {
this.onAudioTracksChanged_();
}
};
ui/cast_button.js
+17 -33
View File
@@ -13,7 +13,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -65,20 +64,11 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
this.parent.appendChild(this.castButton_);
// Setup strings in the correct language
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
// Setup button display and state according to the current cast status
this.onCastStatusChange_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.castButton_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
@@ -89,15 +79,6 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.onCastStatusChange_();
});
if (this.isSubMenu) {
this.eventManager.listen(this.controls, 'submenuopen', () => {
shaka.ui.Utils.setDisplay(this.castButton_, false);
});
this.eventManager.listen(this.controls, 'submenuclose', () => {
shaka.ui.Utils.setDisplay(this.castButton_, true);
});
}
}
@@ -123,24 +104,23 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
/**
* @private
*
* Updates icon and aria state. Delegates visibility to checkAvailability()
* so that the submenu state is always factored in from a single place.
*/
onCastStatusChange_() {
const canCast = this.castProxy_.canCast() && this.controls.isCastAllowed();
const isCasting = this.castProxy_.isCasting();
const Icons = shaka.ui.Enums.MaterialDesignSVGIcons;
shaka.ui.Utils.setDisplay(this.castButton_, canCast);
this.castIcon_.use(isCasting ? Icons['EXIT_CAST'] : Icons['CAST']);
// Aria-pressed set to true when casting, set to false otherwise.
const canCast = this.castProxy_.canCast() && this.controls.isCastAllowed();
if (canCast) {
if (isCasting) {
this.castButton_.ariaPressed = 'true';
} else {
this.castButton_.ariaPressed = 'false';
}
this.castButton_.ariaPressed = isCasting ? 'true' : 'false';
}
this.setCurrentCastSelection_();
this.checkAvailability();
}
@@ -157,11 +137,8 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
}
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.castButton_.ariaLabel = this.localization.resolve(LocIds.CAST);
@@ -172,6 +149,13 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
// which needs localization.
this.setCurrentCastSelection_();
}
/** @override */
checkAvailability() {
const canCast = this.castProxy_.canCast() && this.controls.isCastAllowed();
shaka.ui.Utils.setDisplay(
this.castButton_, canCast && !this.isSubMenuOpened);
}
};
ui/chapter_selection.js
+13 -32
View File
@@ -12,7 +12,6 @@ goog.require('shaka.net.NetworkingUtils');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -37,16 +36,6 @@ shaka.ui.ChapterSelection = class extends shaka.ui.SettingsMenu {
this.menu.classList.add('shaka-chapters');
this.button.classList.add('shaka-tooltip-status');
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
this.updateChapters_();
});
let hasImageTracks = this.player.getImageTracks().length;
this.eventManager.listen(this.controls, 'chaptersupdated', () => {
@@ -65,40 +54,32 @@ shaka.ui.ChapterSelection = class extends shaka.ui.SettingsMenu {
hasImageTracks = newHasImageTracks;
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
const hasChapters = this.controls.getChapters().length > 0;
shaka.ui.Utils.setDisplay(this.button,
hasChapters && !this.isSubMenuOpened);
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateChapters_();
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
this.button.ariaLabel = this.localization.resolve(LocIds.CHAPTERS);
this.nameSpan.textContent = this.localization.resolve(LocIds.CHAPTERS);
this.backSpan.textContent = this.localization.resolve(LocIds.CHAPTERS);
this.updateChapters_();
}
/**
* @private
*/
/** @override */
checkAvailability() {
const hasChapters = this.controls.getChapters().length > 0;
shaka.ui.Utils.setDisplay(
this.button, hasChapters && !this.isSubMenuOpened);
}
/** @private */
updateChapters_() {
// 1. Save the back to menu button
const backButton = shaka.ui.Utils.getFirstDescendantWithClassName(
ui/copy_video_frame_button.js
+11 -41
View File
@@ -14,7 +14,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -37,7 +36,6 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
/** @private {shaka.cast.CastProxy} */
this.castProxy_ = this.controls.getCastProxy();
const LocIds = shaka.ui.Locales.Ids;
/** @private {!HTMLButtonElement} */
this.button_ = shaka.util.Dom.createButton();
this.button_.classList.add('shaka-copy-video-frame-button');
@@ -51,8 +49,6 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
label.classList.add('shaka-overflow-button-label');
label.classList.add('shaka-overflow-menu-only');
this.nameSpan_ = shaka.util.Dom.createHTMLElement('span');
this.nameSpan_.textContent =
this.localization.resolve(LocIds.COPY_VIDEO_FRAME);
label.appendChild(this.nameSpan_);
/** @private {!HTMLElement} */
@@ -62,26 +58,17 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
this.button_.appendChild(label);
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.parent.appendChild(this.button_);
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
this.controls.copyVideoFrameToClipboard();
});
const vr = this.controls.getVR();
this.eventManager.listen(vr, 'vrstatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -90,7 +77,7 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
shaka.ads.Utils.AD_STARTED,
shaka.ads.Utils.AD_STOPPED,
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -99,7 +86,7 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
'unloading',
'loaded',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -109,41 +96,24 @@ shaka.ui.CopyVideoFrameButton = class extends shaka.ui.Element {
shaka.util.MediaElementEvent.PAUSE,
shaka.util.MediaElementEvent.SEEKING,
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.button_,
this.controls.canCopyVideoFrameToClipboard() && !this.isSubMenuOpened);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button_.ariaLabel =
ui/element.js
+20 -1
View File
@@ -9,9 +9,9 @@ goog.provide('shaka.ui.Element');
goog.require('shaka.ads.Utils');
goog.require('shaka.util.EventManager');
goog.require('shaka.ui.Localization');
goog.requireType('shaka.Player');
goog.requireType('shaka.ui.Controls');
goog.requireType('shaka.ui.Localization');
/**
@@ -83,6 +83,17 @@ shaka.ui.Element = class {
this.ad = null;
});
if (this.localization) {
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings();
});
}
/**
* @protected {boolean}
* @exportInterface
@@ -99,9 +110,11 @@ shaka.ui.Element = class {
if (this.isSubMenu) {
this.eventManager.listen(this.controls, 'submenuopen', () => {
this.isSubMenuOpened = true;
this.checkAvailability();
});
this.eventManager.listen(this.controls, 'submenuclose', () => {
this.isSubMenuOpened = false;
this.checkAvailability();
});
}
}
@@ -122,4 +135,10 @@ shaka.ui.Element = class {
this.adManager = null;
this.ad = null;
}
/** @override */
updateLocalizedStrings() {}
/** @override */
checkAvailability() {}
};
ui/externs/ui.js
+12
View File
@@ -732,6 +732,18 @@ shaka.extern.IUIElement = class {
* @override
*/
release() {}
/**
* Called when the locale changes. Override to update UI strings.
* @protected
*/
updateLocalizedStrings() {}
/**
* Called when a submenu opens or closes. Override to show/hide this element.
* @protected
*/
checkAvailability() {}
};
ui/fast_forward_button.js
+3 -14
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.util.Dom');
@@ -40,19 +39,11 @@ shaka.ui.FastForwardButton = class extends shaka.ui.Element {
shaka.ui.Enums.MaterialDesignSVGIcons['FAST_FORWARD']);
this.parent.appendChild(this.button_);
this.updateAriaLabel_();
/** @private {!Array<number>} */
this.fastForwardRates_ = this.controls.getConfig().fastForwardRates;
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.updateLocalizedStrings();
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
@@ -67,10 +58,8 @@ shaka.ui.FastForwardButton = class extends shaka.ui.Element {
});
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.button_.ariaLabel =
this.localization.resolve(shaka.ui.Locales.Ids.FAST_FORWARD);
}
ui/fullscreen_button.js
+15 -33
View File
@@ -13,7 +13,7 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
goog.require('shaka.util.MediaElementEvent');
@@ -44,19 +44,11 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
this.icon_ = new shaka.ui.Icon(this.button_,
shaka.ui.Enums.MaterialDesignSVGIcons['FULLSCREEN']);
this.checkSupport_();
this.checkAvailability();
this.parent.appendChild(this.button_);
this.updateAriaLabel_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.updateLocalizedStrings();
this.eventManager.listen(this.button_, 'click', async () => {
if (!this.controls.isOpaque()) {
@@ -68,7 +60,7 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
this.eventManager.listen(document, 'fullscreenchange', () => {
this.updateIcon_();
this.updateAriaLabel_();
this.updateLocalizedStrings();
});
this.eventManager.listenMulti(
@@ -77,7 +69,7 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
shaka.util.MediaElementEvent.LOADED_METADATA,
shaka.util.MediaElementEvent.LOADED_DATA,
], () => {
this.checkSupport_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -86,26 +78,12 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
shaka.ads.Utils.AD_STARTED,
shaka.ads.Utils.AD_STOPPED,
], () => {
this.checkSupport_();
this.checkAvailability();
});
}
/**
* @private
*/
checkSupport_() {
// Don't show the button if fullscreen is not supported
if (!this.controls.isFullScreenSupported()) {
this.button_.classList.add('shaka-hidden');
} else {
this.button_.classList.remove('shaka-hidden');
}
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
const label = this.controls.isFullScreenEnabled() ?
LocIds.EXIT_FULL_SCREEN : LocIds.FULL_SCREEN;
@@ -115,15 +93,19 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
this.controls.isFullScreenEnabled() ? 'true' : 'false';
}
/**
* @private
*/
/** @private */
updateIcon_() {
this.icon_.use(this.controls.isFullScreenEnabled() ?
shaka.ui.Enums.MaterialDesignSVGIcons['EXIT_FULLSCREEN'] :
shaka.ui.Enums.MaterialDesignSVGIcons['FULLSCREEN'],
);
}
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(
this.button_, this.controls.isFullScreenSupported());
}
};
ui/loop_button.js
+10 -39
View File
@@ -13,7 +13,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -36,7 +35,6 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
/** @private {shaka.extern.IQueueManager} */
this.queueManager_ = this.controls.getQueueManager();
const LocIds = shaka.ui.Locales.Ids;
/** @private {!HTMLButtonElement} */
this.button_ = shaka.util.Dom.createButton();
this.button_.classList.add('shaka-loop-button');
@@ -53,7 +51,6 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
label.classList.add('shaka-overflow-menu-only');
label.classList.add('shaka-simple-overflow-button-label-inline');
this.nameSpan_ = shaka.util.Dom.createHTMLElement('span');
this.nameSpan_.textContent = this.localization.resolve(LocIds.LOOP);
label.appendChild(this.nameSpan_);
/** @private {!HTMLElement} */
@@ -63,19 +60,10 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
this.button_.appendChild(label);
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.parent.appendChild(this.button_);
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
@@ -88,7 +76,7 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
for (const mutation of mutationsList) {
if (mutation.type === 'attributes' &&
mutation.attributeName === 'loop') {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
}
}
});
@@ -105,29 +93,18 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
'loaded',
'manifestupdated',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.player, 'configurationchanged', () => {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
});
this.eventManager.listen(this.video, 'durationchange', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/**
@@ -163,11 +140,8 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
}
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
const Icons = shaka.ui.Enums.MaterialDesignSVGIcons;
@@ -206,11 +180,8 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
}
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(
this.button_, !this.player.isLive() && !this.isSubMenuOpened);
}
ui/mute_button.js
+15 -31
View File
@@ -13,7 +13,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -32,7 +31,6 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
constructor(parent, controls) {
super(parent, controls);
const LocIds = shaka.ui.Locales.Ids;
/** @private {!HTMLButtonElement} */
this.button_ = shaka.util.Dom.createButton();
this.button_.classList.add('shaka-mute-button');
@@ -48,7 +46,6 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
label.classList.add('shaka-overflow-button-label');
label.classList.add('shaka-overflow-menu-only');
this.nameSpan_ = shaka.util.Dom.createHTMLElement('span');
this.nameSpan_.textContent = this.localization.resolve(LocIds.MUTE);
label.appendChild(this.nameSpan_);
/** @private {!HTMLElement} */
@@ -59,18 +56,9 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
this.button_.appendChild(label);
this.parent.appendChild(this.button_);
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
@@ -87,12 +75,12 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
});
this.eventManager.listen(this.video, 'volumechange', () => {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
});
this.eventManager.listen(this.player, 'loading', () => {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
});
@@ -103,11 +91,11 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
'unloading',
'trackschanged',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
});
@@ -117,13 +105,13 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
shaka.ads.Utils.AD_VOLUME_CHANGED,
shaka.ads.Utils.AD_MUTED,
], () => {
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
});
this.eventManager.listen(this.adManager,
shaka.ads.Utils.AD_STARTED, () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.adManager,
@@ -133,18 +121,16 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
// the label and icon code depends on this.ad being correctly
// updated at the time it runs.
this.ad = null;
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateIcon_();
this.checkAvailability_();
this.checkAvailability();
});
this.checkAvailability_();
this.checkAvailability();
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
let label;
if (this.ad && this.ad.isLinear()) {
@@ -154,11 +140,9 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
LocIds.UNMUTE : LocIds.MUTE;
}
this.button_.ariaLabel = this.localization.resolve(label);
this.button_.ariaLabel = this.localization.resolve(label);
this.button_.ariaPressed = label == LocIds.UNMUTE ? 'true' : 'false';
this.nameSpan_.textContent = this.localization.resolve(label);
this.nameSpan_.textContent = this.localization.resolve(label);
}
/**
@@ -176,8 +160,8 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
this.icon_.use(icon);
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
let available = true;
if (this.ad && this.ad.isLinear()) {
// We can't tell if the Ad has audio or not.
@@ -185,7 +169,7 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
} else if (this.player.isVideoOnly()) {
available = false;
}
shaka.ui.Utils.setDisplay(this.button_, available);
shaka.ui.Utils.setDisplay(this.button_, available && !this.isSubMenuOpened);
}
};
ui/overflow_menu.js
+3 -21
View File
@@ -15,7 +15,6 @@ goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.MenuBase');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -48,15 +47,6 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
this.createChildren_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.eventManager.listen(
this.adManager, shaka.ads.Utils.AD_STARTED, () => {
if (this.ad && this.ad.isLinear()) {
@@ -76,7 +66,7 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
this.onOverflowMenuButtonClick_();
});
this.updateAriaLabel_();
this.updateLocalizedStrings();
if (this.ad && this.ad.isLinear()) {
// There was already an ad.
@@ -108,7 +98,6 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
}
}
/**
* @private
*/
@@ -123,7 +112,6 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
this.controlsContainer_.appendChild(this.overflowMenu_);
}
/**
* @private
*/
@@ -144,7 +132,6 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
this.parent.appendChild(this.overflowMenuButton_);
}
/**
* @private
*/
@@ -162,7 +149,6 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
}
}
/** @private */
onOverflowMenuButtonClick_() {
this.controls.hideContextMenus();
@@ -194,17 +180,13 @@ shaka.ui.OverflowMenu = class extends shaka.ui.MenuBase {
}
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.overflowMenuButton_.ariaLabel =
this.localization.resolve(LocIds.MORE_SETTINGS);
}
/** @override */
adjustCustomStyle() {
this.adjustMenuStyle(
ui/pip_button.js
+8 -37
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -38,7 +37,6 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
/** @private {HTMLElement } */
this.videoContainer_ = this.controls.getVideoContainer();
const LocIds = shaka.ui.Locales.Ids;
/** @private {!HTMLButtonElement} */
this.pipButton_ = shaka.util.Dom.createButton();
this.pipButton_.classList.add('shaka-pip-button');
@@ -55,8 +53,6 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
label.classList.add('shaka-overflow-menu-only');
label.classList.add('shaka-simple-overflow-button-label-inline');
this.pipNameSpan_ = shaka.util.Dom.createHTMLElement('span');
this.pipNameSpan_.textContent =
this.localization.resolve(LocIds.PICTURE_IN_PICTURE);
label.appendChild(this.pipNameSpan_);
/** @private {!HTMLElement} */
@@ -66,7 +62,7 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
this.pipButton_.appendChild(label);
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.parent.appendChild(this.pipButton_);
@@ -77,15 +73,6 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
shaka.ui.Utils.setDisplay(this.pipButton_, false);
}
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.pipButton_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
@@ -102,24 +89,13 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
});
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.player, 'trackschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
if ('documentPictureInPicture' in window) {
this.eventManager.listen(window.documentPictureInPicture, 'enter',
(e) => {
@@ -133,7 +109,7 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
});
}
this.checkAvailability_();
this.checkAvailability();
}
/** @private */
@@ -147,7 +123,6 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
this.pipButton_.ariaPressed = 'true';
}
/** @private */
onLeavePictureInPicture_() {
const LocIds = shaka.ui.Locales.Ids;
@@ -159,11 +134,8 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
this.pipButton_.ariaPressed = 'false';
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.pipNameSpan_.textContent =
@@ -182,15 +154,14 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
this.localization.resolve(currentPipState);
}
/**
* Display the picture-in-picture button only when the content contains video.
* If it's displaying in picture-in-picture mode, and an audio only content is
* loaded, exit the picture-in-picture display.
* @return {!Promise}
* @private
* @override
*/
async checkAvailability_() {
async checkAvailability() {
if (!this.controls.isPiPAllowed()) {
shaka.ui.Utils.setDisplay(this.pipButton_, false);
if (this.controls.isPiPEnabled()) {
ui/play_button.js
+6 -19
View File
@@ -13,7 +13,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.util.Dom');
goog.require('shaka.util.MediaElementEvent');
@@ -45,15 +44,6 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
/** @private {!shaka.ui.Icon} */
this.icon_ = new shaka.ui.Icon(this.button_);
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.eventManager.listenMulti(
this.video,
[
@@ -61,7 +51,7 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
shaka.util.MediaElementEvent.PAUSE,
shaka.util.MediaElementEvent.SEEKING,
], () => {
this.updateAriaLabel_();
this.updateLocalizedStrings();
this.updateIcon_();
});
@@ -73,7 +63,7 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
'unloading',
'buffering',
], () => {
this.updateAriaLabel_();
this.updateLocalizedStrings();
this.updateIcon_();
});
@@ -85,7 +75,7 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
shaka.ads.Utils.AD_STARTED,
shaka.ads.Utils.AD_STOPPED,
], () => {
this.updateAriaLabel_();
this.updateLocalizedStrings();
this.updateIcon_();
});
@@ -96,7 +86,7 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
this.controls.playPausePresentation();
});
this.updateAriaLabel_();
this.updateLocalizedStrings();
this.updateIcon_();
}
@@ -136,10 +126,8 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
return this.player ? this.player.isBuffering() : false;
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
if (this.isEnded_() && this.video.duration) {
this.button_.ariaLabel = this.localization.resolve(LocIds.REPLAY);
@@ -151,7 +139,6 @@ shaka.ui.PlayButton = class extends shaka.ui.Element {
}
}
/**
* @private
*/
ui/playback_rate_selection.js
+3 -24
View File
@@ -10,7 +10,6 @@ goog.provide('shaka.ui.PlaybackRateSelection');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -41,15 +40,6 @@ shaka.ui.PlaybackRateSelection = class extends shaka.ui.SettingsMenu {
this.button.appendChild(this.playbackRateMark);
}
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -59,25 +49,14 @@ shaka.ui.PlaybackRateSelection = class extends shaka.ui.SettingsMenu {
this.updatePlaybackRateSelection_();
});
if (this.isSubMenu) {
this.eventManager.listen(this.controls, 'submenuopen', () => {
shaka.ui.Utils.setDisplay(this.button, false);
});
this.eventManager.listen(this.controls, 'submenuclose', () => {
shaka.ui.Utils.setDisplay(this.button, true);
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.addPlaybackRates_();
this.updatePlaybackRateSelection_();
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
ui/queue_button.js
+9 -28
View File
@@ -10,7 +10,6 @@ goog.provide('shaka.ui.QueueButton');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -38,15 +37,6 @@ shaka.ui.QueueButton = class extends shaka.ui.SettingsMenu {
/** @private {shaka.extern.IQueueManager} */
this.queueManager_ = this.controls.getQueueManager();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.queueManager_,
[
@@ -60,20 +50,7 @@ shaka.ui.QueueButton = class extends shaka.ui.SettingsMenu {
this.updateCurrentItem_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
const hasItems = this.getDisplayableItems_().length > 1;
shaka.ui.Utils.setDisplay(this.button,
hasItems && !this.isSubMenuOpened);
});
}
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateQueueItems_();
}
@@ -92,10 +69,8 @@ shaka.ui.QueueButton = class extends shaka.ui.SettingsMenu {
(item) => item.metadata?.title);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
@@ -224,6 +199,12 @@ shaka.ui.QueueButton = class extends shaka.ui.SettingsMenu {
}
}
}
/** @override */
checkAvailability() {
const hasItems = this.getDisplayableItems_().length > 1;
shaka.ui.Utils.setDisplay(this.button, hasItems && !this.isSubMenuOpened);
}
};
ui/recenter_vr.js
+7 -34
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -56,16 +55,7 @@ shaka.ui.RecenterVRButton = class extends shaka.ui.Element {
this.parent.appendChild(this.recenterVRButton_);
// Setup strings in the correct language
this.updateLocalizedStrings_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.updateLocalizedStrings();
const vr = this.controls.getVR();
@@ -77,37 +67,20 @@ shaka.ui.RecenterVRButton = class extends shaka.ui.Element {
});
this.eventManager.listen(vr, 'vrstatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.recenterVRButton_,
this.controls.isPlayingVR() && !this.isSubMenuOpened);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.recenterVRButton_.ariaLabel =
ui/remote_button.js
+9 -29
View File
@@ -14,7 +14,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -70,25 +69,14 @@ shaka.ui.RemoteButton = class extends shaka.ui.Element {
this.callbackId_ = -1;
// Setup strings in the correct language
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
shaka.ui.Utils.setDisplay(this.remoteButton_, false);
/** @private {?RemotePlayback} */
this.remote_ = device.getRemote(this.video);
if (!this.remote_) {
this.remoteButton_.classList.add('shaka-hidden');
} else {
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
if (this.remote_) {
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.updateRemoteState_();
});
@@ -115,17 +103,6 @@ shaka.ui.RemoteButton = class extends shaka.ui.Element {
this.updateRemoteState_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.updateRemoteState_(/* force= */ true);
});
}
this.updateRemoteState_(/* force= */ true);
this.updateIcon_();
}
@@ -201,10 +178,8 @@ shaka.ui.RemoteButton = class extends shaka.ui.Element {
this.remote_?.state == 'connected' ? 'true' : 'false';
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
const text = this.isAirPlay_ ?
this.localization.resolve(LocIds.AIRPLAY) :
@@ -226,6 +201,11 @@ shaka.ui.RemoteButton = class extends shaka.ui.Element {
this.remoteIcon_.use(shaka.ui.Enums.MaterialDesignSVGIcons['EXIT_CAST']);
}
}
/** @override */
checkAvailability() {
this.updateRemoteState_(/* force= */ true);
}
};
ui/resolution_selection.js
+9 -37
View File
@@ -12,7 +12,6 @@ goog.require('shaka.Player');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Overlay.TrackLabelFormat');
goog.require('shaka.ui.SettingsMenu');
@@ -68,15 +67,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
spanWrapper.appendChild(this.autoQuality);
spanWrapper.appendChild(this.qualityMark);
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -92,18 +82,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
this.updateLabels_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.updateSelection_();
this.updateLabels_();
});
}
this.updateSelection_();
}
@@ -264,7 +242,7 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
this.controls.dispatchEvent(
new shaka.util.FakeEvent('resolutionselectionupdated'));
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
shaka.ui.Utils.setDisplay(
this.button, numberOfTracks > 0 && !this.isSubMenuOpened);
@@ -363,7 +341,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return tracks.length;
}
/**
* @return {number}
* @private
@@ -458,7 +435,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return tracks.length;
}
/**
* @param {!shaka.extern.VideoTrack} track
* @param {!Array<!shaka.extern.VideoTrack>} tracks
@@ -549,7 +525,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return text;
}
/**
* @param {!shaka.extern.VideoTrack} track
* @return {boolean}
@@ -563,7 +538,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return codec.startsWith('dovi-');
}
/**
* @param {!shaka.extern.VideoTrack} track
* @return {boolean}
@@ -577,7 +551,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return codec.startsWith('lcevc');
}
/**
* @param {?string} codecs
* @return {string}
@@ -592,7 +565,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return name ? ' ' + name : name;
}
/**
* @param {!shaka.extern.Track} track
* @param {!Array<!shaka.extern.Track>} tracks
@@ -620,7 +592,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
return text;
}
/**
* @param {number} bandwidth
* @return {string}
@@ -634,7 +605,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
}
}
/**
* @param {!shaka.extern.VideoTrack} track
* @private
@@ -647,7 +617,6 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
this.player.selectVideoTrack(track, clearBuffer);
}
/**
* @param {!shaka.extern.Track} track
* @private
@@ -660,11 +629,8 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
this.player.selectVariantTrack(track, clearBuffer);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
const locId = this.player.isAudioOnly() ?
LocIds.QUALITY : LocIds.RESOLUTION;
@@ -683,6 +649,12 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
this.localization.resolve(shaka.ui.Locales.Ids.AUTO_QUALITY);
}
}
/** @override */
checkAvailability() {
this.updateSelection_();
this.updateLabels_();
}
};
ui/rewind_button.js
+3 -15
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.util.Dom');
@@ -41,20 +40,11 @@ shaka.ui.RewindButton = class extends shaka.ui.Element {
shaka.ui.Enums.MaterialDesignSVGIcons['REWIND']);
this.parent.appendChild(this.button_);
this.updateAriaLabel_();
this.updateLocalizedStrings();
/** @private {!Array<number>} */
this.rewindRates_ = this.controls.getConfig().rewindRates;
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
return;
@@ -68,10 +58,8 @@ shaka.ui.RewindButton = class extends shaka.ui.Element {
});
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.button_.ariaLabel =
this.localization.resolve(shaka.ui.Locales.Ids.REWIND);
}
ui/save_video_frame_button.js
+11 -41
View File
@@ -14,7 +14,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -37,7 +36,6 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
/** @private {shaka.cast.CastProxy} */
this.castProxy_ = this.controls.getCastProxy();
const LocIds = shaka.ui.Locales.Ids;
/** @private {!HTMLButtonElement} */
this.button_ = shaka.util.Dom.createButton();
this.button_.classList.add('shaka-save.video-frame-button');
@@ -51,8 +49,6 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
label.classList.add('shaka-overflow-button-label');
label.classList.add('shaka-overflow-menu-only');
this.nameSpan_ = shaka.util.Dom.createHTMLElement('span');
this.nameSpan_.textContent =
this.localization.resolve(LocIds.DOWNLOAD_VIDEO_FRAME);
label.appendChild(this.nameSpan_);
/** @private {!HTMLElement} */
@@ -62,26 +58,17 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
this.button_.appendChild(label);
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.parent.appendChild(this.button_);
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
this.controls.takeScreenshot();
});
const vr = this.controls.getVR();
this.eventManager.listen(vr, 'vrstatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -90,7 +77,7 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
shaka.ads.Utils.AD_STARTED,
shaka.ads.Utils.AD_STOPPED,
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -99,7 +86,7 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
'unloading',
'loaded',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listenMulti(
@@ -109,41 +96,24 @@ shaka.ui.SaveVideoFrameButton = class extends shaka.ui.Element {
shaka.util.MediaElementEvent.PAUSE,
shaka.util.MediaElementEvent.SEEKING,
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.controls, 'caststatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.button_,
this.controls.canTakeScreenshot() && !this.isSubMenuOpened);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button_.ariaLabel =
ui/seek_bar.js
+3 -13
View File
@@ -11,7 +11,6 @@ goog.require('shaka.ads.Utils');
goog.require('shaka.net.NetworkingEngine');
goog.require('shaka.net.NetworkingUtils');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.RangeElement');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -179,15 +178,6 @@ shaka.ui.SeekBar = class extends shaka.ui.RangeElement {
this.controls.hideSettingsMenus();
});
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.eventManager.listen(
this.adManager, shaka.ads.Utils.AD_STARTED, () => {
if (!this.shouldBeDisplayed_()) {
@@ -254,7 +244,7 @@ shaka.ui.SeekBar = class extends shaka.ui.RangeElement {
// Initialize seek state and label.
this.setValue(this.video.currentTime);
this.update();
this.updateAriaLabel_();
this.updateLocalizedStrings();
if (this.ad) {
// There was already an ad.
@@ -627,8 +617,8 @@ shaka.ui.SeekBar = class extends shaka.ui.RangeElement {
return this.ad == null || !this.ad.isLinear();
}
/** @private */
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.bar.ariaLabel = this.localization.resolve(shaka.ui.Locales.Ids.SEEK);
}
ui/settings_menu.js
+5
View File
@@ -263,4 +263,9 @@ shaka.ui.SettingsMenu = class extends shaka.ui.MenuBase {
this.button,
this.controls.getControlsContainer());
}
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.button, !this.isSubMenuOpened);
}
};
ui/skip_ad_button.js
+4 -27
View File
@@ -11,7 +11,6 @@ goog.require('goog.asserts');
goog.require('shaka.ads.Utils');
goog.require('shaka.ui.Element');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
goog.require('shaka.util.Timer');
@@ -49,8 +48,7 @@ shaka.ui.SkipAdButton = class extends shaka.ui.Element {
shaka.ui.Utils.setDisplay(this.button_, false);
this.button_.classList.add('shaka-no-propagation');
this.container_.appendChild(this.button_);
this.updateAriaLabel_();
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
/**
* The timer that tracks down the ad progress until it can be skipped.
@@ -61,16 +59,6 @@ shaka.ui.SkipAdButton = class extends shaka.ui.Element {
this.onTimerTick_();
});
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
this.updateLocalizedStrings_();
});
this.eventManager.listen(
this.adManager, shaka.ads.Utils.AD_STARTED, () => {
this.onAdStarted_();
@@ -97,28 +85,17 @@ shaka.ui.SkipAdButton = class extends shaka.ui.Element {
}
}
/**
* @override
*/
/** @override */
release() {
this.timer_.stop();
this.timer_ = null;
super.release();
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button_.textContent = this.localization.resolve(LocIds.SKIP_AD);
}
/**
* @private
*/
updateAriaLabel_() {
const LocIds = shaka.ui.Locales.Ids;
this.button_.ariaLabel = this.localization.resolve(LocIds.SKIP_AD);
}
ui/skip_next_button.js
+8 -20
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -49,17 +48,8 @@ shaka.ui.SkipNextButton = class extends shaka.ui.Element {
shaka.ui.Enums.MaterialDesignSVGIcons['SKIP_NEXT']);
this.parent.appendChild(this.button_);
this.updateAriaLabel_();
this.checkAvailability_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.updateLocalizedStrings();
this.checkAvailability();
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
@@ -75,24 +65,22 @@ shaka.ui.SkipNextButton = class extends shaka.ui.Element {
'itemsinserted',
'itemsremoved',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.player, 'loading', () => {
this.checkAvailability_();
this.checkAvailability();
});
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.button_.ariaLabel =
this.localization.resolve(shaka.ui.Locales.Ids.SKIP_NEXT);
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
const itemsLength = this.queueManager_.getItems().length;
const hasNext = itemsLength > 1 &&
(this.queueManager_.getCurrentItemIndex() + 1) < itemsLength;
ui/skip_previous_button.js
+8 -20
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -49,17 +48,8 @@ shaka.ui.SkipPreviousButton = class extends shaka.ui.Element {
shaka.ui.Enums.MaterialDesignSVGIcons['SKIP_PREVIOUS']);
this.parent.appendChild(this.button_);
this.updateAriaLabel_();
this.checkAvailability_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
this.updateLocalizedStrings();
this.checkAvailability();
this.eventManager.listen(this.button_, 'click', () => {
if (!this.controls.isOpaque()) {
@@ -75,24 +65,22 @@ shaka.ui.SkipPreviousButton = class extends shaka.ui.Element {
'itemsinserted',
'itemsremoved',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.player, 'loading', () => {
this.checkAvailability_();
this.checkAvailability();
});
}
/**
* @private
*/
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.button_.ariaLabel =
this.localization.resolve(shaka.ui.Locales.Ids.SKIP_PREVIOUS);
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
const itemsLength = this.queueManager_.getItems().length;
const hasPrevious = itemsLength > 1 &&
this.queueManager_.getCurrentItemIndex() > 0;
ui/statistics_button.js
+9 -23
View File
@@ -13,7 +13,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -177,32 +176,14 @@ shaka.ui.StatisticsButton = class extends shaka.ui.Element {
this.onTimerTick_();
});
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.loadContainer_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listen(this.button_, 'click', () => {
this.onClick_();
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
});
if (this.isSubMenu) {
this.eventManager.listen(this.controls, 'submenuopen', () => {
shaka.ui.Utils.setDisplay(this.button_, false);
});
this.eventManager.listen(this.controls, 'submenuclose', () => {
shaka.ui.Utils.setDisplay(this.button_, true);
});
}
}
/** @private */
@@ -220,8 +201,8 @@ shaka.ui.StatisticsButton = class extends shaka.ui.Element {
}
}
/** @private */
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.nameSpan_.textContent =
@@ -303,6 +284,11 @@ shaka.ui.StatisticsButton = class extends shaka.ui.Element {
this.timer_ = null;
super.release();
}
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.button_, !this.isSubMenuOpened);
}
};
ui/text_position.js
+7 -30
View File
@@ -11,7 +11,6 @@ goog.require('shaka.config.PositionArea');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -37,15 +36,6 @@ shaka.ui.TextPosition = class extends shaka.ui.SettingsMenu {
this.button.classList.add('shaka-tooltip');
this.menu.classList.add('shaka-text-positions');
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -55,30 +45,19 @@ shaka.ui.TextPosition = class extends shaka.ui.SettingsMenu {
'trackschanged',
], () => {
this.updateTextPositionSelection_();
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.checkAvailability_();
this.checkAvailability();
this.addTextPositions_();
this.updateTextPositionSelection_();
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
const tracks = this.player.getTextTracks() || [];
const hasTrack = tracks.some((track) => track.active);
const available = hasTrack && !this.isSubMenuOpened &&
@@ -91,10 +70,8 @@ shaka.ui.TextPosition = class extends shaka.ui.SettingsMenu {
}
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button.ariaLabel = this.localization.resolve(LocIds.SUBTITLE_POSITION);
ui/text_selection.js
+13 -31
View File
@@ -11,7 +11,6 @@ goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.LanguageUtils');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -52,19 +51,6 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
this.addOffOption_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
// If captions/subtitles are off, this string needs localization.
// TODO: is there a more efficient way of updating just the strings
// we need instead of running the whole language update?
this.updateTextLanguages_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -81,22 +67,11 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
this.updateTextLanguages_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.updateTextLanguages_();
});
}
// Initialize caption state with a fake event.
this.onCaptionStateChange_();
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.updateTextLanguages_();
}
@@ -208,11 +183,8 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
});
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button.ariaLabel = this.localization.resolve(LocIds.CAPTIONS);
@@ -223,6 +195,16 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
this.localization.resolve(LocIds.CAPTIONS);
this.captionsOffSpan_.textContent =
this.localization.resolve(LocIds.OFF);
// If captions/subtitles are off, this string needs localization.
// TODO: is there a more efficient way of updating just the strings
// we need instead of running the whole language update?
this.updateTextLanguages_();
}
/** @override */
checkAvailability() {
this.updateTextLanguages_();
}
};
ui/text_size.js
+7 -30
View File
@@ -10,7 +10,6 @@ goog.provide('shaka.ui.TextSize');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -36,15 +35,6 @@ shaka.ui.TextSize = class extends shaka.ui.SettingsMenu {
this.button.classList.add('shaka-tooltip');
this.menu.classList.add('shaka-text-positions');
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -54,30 +44,19 @@ shaka.ui.TextSize = class extends shaka.ui.SettingsMenu {
'trackschanged',
], () => {
this.updateTextSizeSelection_();
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateLocalizedStrings();
this.checkAvailability_();
this.checkAvailability();
this.addTextSizes_();
this.updateTextSizeSelection_();
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
const tracks = this.player.getTextTracks() || [];
const hasTrack = tracks.some((track) => track.active);
const available = hasTrack && !this.isSubMenuOpened &&
@@ -90,10 +69,8 @@ shaka.ui.TextSize = class extends shaka.ui.SettingsMenu {
}
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.button.ariaLabel = this.localization.resolve(LocIds.SUBTITLE_SIZE);
ui/toggle_stereoscopic.js
+7 -34
View File
@@ -12,7 +12,6 @@ goog.require('shaka.ui.Element');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Icon');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.Utils');
goog.require('shaka.util.Dom');
@@ -59,16 +58,7 @@ shaka.ui.ToggleStereoscopicButton = class extends shaka.ui.Element {
this.parent.appendChild(this.toggleStereoscopicButton_);
// Setup strings in the correct language
this.updateLocalizedStrings_();
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
});
this.updateLocalizedStrings();
const vr = this.controls.getVR();
@@ -82,37 +72,20 @@ shaka.ui.ToggleStereoscopicButton = class extends shaka.ui.Element {
});
this.eventManager.listen(vr, 'vrstatuschanged', () => {
this.checkAvailability_();
this.checkAvailability();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.checkAvailability_();
});
}
this.checkAvailability_();
this.checkAvailability();
}
/**
* @private
*/
checkAvailability_() {
/** @override */
checkAvailability() {
shaka.ui.Utils.setDisplay(this.toggleStereoscopicButton_,
this.controls.isPlayingVR() && !this.isSubMenuOpened);
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.toggleStereoscopicButton_.ariaLabel =
ui/video_type_selection.js
+10 -29
View File
@@ -10,7 +10,6 @@ goog.provide('shaka.ui.VideoTypeSelection');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Enums');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.OverflowMenu');
goog.require('shaka.ui.SettingsMenu');
goog.require('shaka.ui.Utils');
@@ -35,16 +34,6 @@ shaka.ui.VideoTypeSelection = class extends shaka.ui.SettingsMenu {
this.menu.classList.add('shaka-video-type');
this.button.classList.add('shaka-tooltip-status');
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateLocalizedStrings_();
this.updateVideoRoles_();
});
this.eventManager.listenMulti(
this.player,
[
@@ -59,32 +48,24 @@ shaka.ui.VideoTypeSelection = class extends shaka.ui.SettingsMenu {
this.updateVideoRoles_();
});
if (this.isSubMenu) {
this.eventManager.listenMulti(
this.controls,
[
'submenuopen',
'submenuclose',
], () => {
this.updateVideoRoles_();
});
}
// Set up all the strings in the user's preferred language.
this.updateLocalizedStrings_();
this.updateVideoRoles_();
this.updateLocalizedStrings();
}
/**
* @private
*/
updateLocalizedStrings_() {
/** @override */
updateLocalizedStrings() {
const LocIds = shaka.ui.Locales.Ids;
this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
this.button.ariaLabel = this.localization.resolve(LocIds.VIDEO_TYPE);
this.nameSpan.textContent = this.localization.resolve(LocIds.VIDEO_TYPE);
this.backSpan.textContent = this.localization.resolve(LocIds.VIDEO_TYPE);
this.updateVideoRoles_();
}
/** @override */
checkAvailability() {
this.updateVideoRoles_();
}
/**
ui/volume_bar.js
+9 -19
View File
@@ -11,7 +11,6 @@ goog.require('goog.asserts');
goog.require('shaka.ads.Utils');
goog.require('shaka.ui.Controls');
goog.require('shaka.ui.Locales');
goog.require('shaka.ui.Localization');
goog.require('shaka.ui.RangeElement');
goog.require('shaka.ui.Utils');
@@ -57,7 +56,7 @@ shaka.ui.VolumeBar = class extends shaka.ui.RangeElement {
'unloading',
'trackschanged',
], () => {
this.checkAvailability_();
this.checkAvailability();
});
this.eventManager.listen(this.controls,
@@ -74,33 +73,24 @@ shaka.ui.VolumeBar = class extends shaka.ui.RangeElement {
this.eventManager.listen(this.adManager,
shaka.ads.Utils.AD_STARTED,
() => this.checkAvailability_());
() => this.checkAvailability());
this.eventManager.listen(this.adManager,
shaka.ads.Utils.AD_STOPPED, () => {
this.checkAvailability_();
this.checkAvailability();
this.onPresentationVolumeChange_();
});
this.eventManager.listenMulti(
this.localization,
[
shaka.ui.Localization.LOCALE_UPDATED,
shaka.ui.Localization.LOCALE_CHANGED,
], () => {
this.updateAriaLabel_();
});
// Initialize volume display and label.
this.onPresentationVolumeChange_();
this.updateAriaLabel_();
this.updateLocalizedStrings();
if (this.ad) {
// There was already an ad.
this.onChange();
}
this.checkAvailability_();
this.checkAvailability();
}
/**
@@ -153,13 +143,13 @@ shaka.ui.VolumeBar = class extends shaka.ui.RangeElement {
'linear-gradient(' + gradient.join(',') + ')';
}
/** @private */
updateAriaLabel_() {
/** @override */
updateLocalizedStrings() {
this.bar.ariaLabel = this.localization.resolve(shaka.ui.Locales.Ids.VOLUME);
}
/** @private */
checkAvailability_() {
/** @override */
checkAvailability() {
let available = true;
if (this.ad && this.ad.isLinear()) {
// We can't tell if the Ad has audio or not.