1
0
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:
David LaPalomento 2013-04-02 16:17:30 -04:00
parent cf52750a57
commit 65687aa3d0
3 changed files with 16 additions and 18 deletions

View File

@ -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
View File

@ -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
View File

@ -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');
});