web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-03-03 15:12:49 +02:00
Code Releases Activity

refactor: MuteToggle#update (#4058)

Browse Source
This commit is contained in:
Kevin Litchfield 2017-02-17 12:34:51 -05:00 committed by Brandon Casey
parent 0da93249d3
commit a04f387a72
1 changed files with 37 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/js/control-bar/mute-toggle.js
View File

@ -65,15 +65,33 @@ class MuteToggle extends Button {
}
/**
* Update the state of volume.
* Update the `MuteToggle` button based on the state of `volume` and `muted`
* on the player.
*
* @param {EventTarget~Event} [event]
* The {@link Player#loadstart} event if this function was called through an
* event.
* The {@link Player#loadstart} event if this function was called
* through an event.
*
* @listens Player#loadstart
* @listens Player#volumechange
*/
update(event) {
this.updateIcon_();
this.updateControlText_();
}
/**
* Update the appearance of the `MuteToggle` icon.
*
* Possible states (given `level` variable below):
* - 0: crossed out
* - 1: zero bars of volume
* - 2: one bar of volume
* - 3: two bars of volume
*
* @private
*/
updateIcon_() {
const vol = this.player_.volume();
let level = 3;
@ -85,16 +103,6 @@ class MuteToggle extends Button {
level = 2;
}
// Don't rewrite the button text if the actual text doesn't change.
// This causes unnecessary and confusing information for screen reader users.
// This check is needed because this function gets called every time the volume level is changed.
const soundOff = this.player_.muted() || this.player_.volume() === 0;
const toMute = soundOff ? 'Unmute' : 'Mute';
if (this.controlText() !== toMute) {
this.controlText(toMute);
}
// TODO improve muted icon classes
for (let i = 0; i < 4; i++) {
Dom.removeClass(this.el_, `vjs-vol-${i}`);
@ -102,6 +110,22 @@ class MuteToggle extends Button {
Dom.addClass(this.el_, `vjs-vol-${level}`);
}
/**
* If `muted` has changed on the player, update the control text
* (`title` attribute on `vjs-mute-control` element and content of
* `vjs-control-text` element).
*
* @private
*/
updateControlText_() {
const soundOff = this.player_.muted() || this.player_.volume() === 0;
const text = soundOff ? 'Unmute' : 'Mute';
if (this.controlText() !== text) {
this.controlText(text);
}
}
}
/**