mirror of
https://github.com/videojs/video.js.git
synced 2025-01-25 11:13:52 +02:00
Rename vjs-disabled to vjs-hidden
Disabled is a bit overloaded with visible but unusable controls, so use hidden instead. Re-arrange default styles a bit and use dom helper methods instead of the vjs-objection functions.
This commit is contained in:
parent
cf52750a57
commit
65687aa3d0
@ -97,6 +97,8 @@ body.vjs-full-window {
|
||||
-o-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
|
||||
transition: visibility 0s linear 1.5s,opacity 1.5s linear;
|
||||
}
|
||||
/* Hide disabled or unsupported controls */
|
||||
.vjs-default-skin .vjs-hidden { display: none; }
|
||||
|
||||
/* DEFAULT SKIN (override in another file to create new skins)
|
||||
================================================================================
|
||||
@ -144,10 +146,6 @@ so you can upgrade to newer versions easier. You can remove all these styles by
|
||||
|
||||
/* Hide control text visually, but have it available for screenreaders: h5bp.com/v */
|
||||
.vjs-default-skin .vjs-control-text { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
|
||||
|
||||
/* Hide disabled or unsupported controls */
|
||||
.vjs-default-skin .vjs-disabled { display: none; }
|
||||
|
||||
/* Play/Pause
|
||||
-------------------------------------------------------------------------------- */
|
||||
.vjs-default-skin .vjs-play-control { width: 5em; cursor: pointer !important; }
|
||||
|
12
src/js/controls.js
vendored
12
src/js/controls.js
vendored
@ -853,13 +853,13 @@ vjs.VolumeControl = function(player, options){
|
||||
|
||||
// hide volume controls when they're not supported by the current tech
|
||||
if (player.tech && player.tech.features.volumeControl === false) {
|
||||
vjs.addClass(this.el(), 'vjs-disabled');
|
||||
this.addClass('vjs-hidden');
|
||||
}
|
||||
player.on('loadstart', vjs.bind(this, function(){
|
||||
if (player.tech.features.volumeControl === false) {
|
||||
vjs.addClass(this.el(), 'vjs-disabled');
|
||||
this.addClass('vjs-hidden');
|
||||
} else {
|
||||
vjs.removeClass(this.el(), 'vjs-disabled');
|
||||
this.removeClass('vjs-hidden');
|
||||
}
|
||||
}));
|
||||
};
|
||||
@ -982,13 +982,13 @@ vjs.MuteToggle = function(player, options){
|
||||
|
||||
// hide mute toggle if the current tech doesn't support volume control
|
||||
if (player.tech && player.tech.features.volumeControl === false) {
|
||||
vjs.addClass(this.el(), 'vjs-disabled');
|
||||
this.addClass('vjs-hidden');
|
||||
}
|
||||
player.on('loadstart', vjs.bind(this, function(){
|
||||
if (player.tech.features.volumeControl === false) {
|
||||
vjs.addClass(this.el(), 'vjs-disabled');
|
||||
this.addClass('vjs-hidden');
|
||||
} else {
|
||||
vjs.removeClass(this.el(), 'vjs-disabled');
|
||||
this.removeClass('vjs-hidden');
|
||||
}
|
||||
}));
|
||||
};
|
||||
|
16
test/unit/controls.js
vendored
16
test/unit/controls.js
vendored
@ -16,8 +16,8 @@ test('should hide volume control if it\'s not supported', function(){
|
||||
volumeControl = new vjs.VolumeControl(player);
|
||||
muteToggle = new vjs.MuteToggle(player);
|
||||
|
||||
ok(volumeControl.el().className.indexOf('vjs-disabled') >= 0, 'volumeControl is not hidden');
|
||||
ok(muteToggle.el().className.indexOf('vjs-disabled') >= 0, 'muteToggle is not hidden');
|
||||
ok(volumeControl.el().className.indexOf('vjs-hidden') >= 0, 'volumeControl is not hidden');
|
||||
ok(muteToggle.el().className.indexOf('vjs-hidden') >= 0, 'muteToggle is not hidden');
|
||||
});
|
||||
|
||||
test('should test and toggle volume control on `loadstart`', function(){
|
||||
@ -45,9 +45,9 @@ test('should test and toggle volume control on `loadstart`', function(){
|
||||
volumeControl = new vjs.VolumeControl(player);
|
||||
muteToggle = new vjs.MuteToggle(player);
|
||||
|
||||
ok(volumeControl.el().className.indexOf('vjs-disabled') < 0,
|
||||
ok(volumeControl.el().className.indexOf('vjs-hidden') < 0,
|
||||
'volumeControl is hidden initially');
|
||||
ok(muteToggle.el().className.indexOf('vjs-disabled') < 0,
|
||||
ok(muteToggle.el().className.indexOf('vjs-hidden') < 0,
|
||||
'muteToggle is hidden initially');
|
||||
|
||||
player.tech.features.volumeControl = false;
|
||||
@ -55,9 +55,9 @@ test('should test and toggle volume control on `loadstart`', function(){
|
||||
listener();
|
||||
});
|
||||
|
||||
ok(volumeControl.el().className.indexOf('vjs-disabled') >= 0,
|
||||
ok(volumeControl.el().className.indexOf('vjs-hidden') >= 0,
|
||||
'volumeControl does not hide itself');
|
||||
ok(muteToggle.el().className.indexOf('vjs-disabled') >= 0,
|
||||
ok(muteToggle.el().className.indexOf('vjs-hidden') >= 0,
|
||||
'muteToggle does not hide itself');
|
||||
|
||||
player.tech.features.volumeControl = true;
|
||||
@ -65,8 +65,8 @@ test('should test and toggle volume control on `loadstart`', function(){
|
||||
listener();
|
||||
});
|
||||
|
||||
ok(volumeControl.el().className.indexOf('vjs-disabled') < 0,
|
||||
ok(volumeControl.el().className.indexOf('vjs-hidden') < 0,
|
||||
'volumeControl does not show itself');
|
||||
ok(muteToggle.el().className.indexOf('vjs-disabled') < 0,
|
||||
ok(muteToggle.el().className.indexOf('vjs-hidden') < 0,
|
||||
'muteToggle does not show itself');
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user