Skip to content

E
edx-platform
Commit a3db5da9 by jmclaus
Options

Code cleanup

parent cd12492e
Showing with 69 additions and 67 deletions
common/lib/xmodule/xmodule/js/src/video/04_video_control.js
......@@ -67,20 +67,23 @@ function () {
// ARIA
// Let screen readers know that:
// these anchors behaves like buttons
state.videoControl.playPauseEl.attr('role', gettext('button'));
state.videoControl.fullScreenEl.attr('role', gettext('button'));
// and this one as a slider
state.videoControl.sliderEl.find('.ui-slider-handle').attr('role', gettext('slider'));
// what their names are: (title attribute are set in video.html template):
// Play, Pause
// Fill browser
state.videoControl.sliderEl.find('.ui-slider-handle').attr('title', gettext('video slider'));
// These anchors behaves like buttons, named 'Play' or 'Pause', and
// 'Fill screen' (the title attribute is set in video.html template).
state.videoControl.playPauseEl.attr({
'role': gettext('button'),
'aria-disabled': 'false'
});
state.videoControl.fullScreenEl.attr({
'role': gettext('button'),
'aria-disabled': 'false'
});
// what their states are:
state.videoControl.playPauseEl.attr('aria-disabled', 'false');
state.videoControl.fullScreenEl.attr('aria-disabled', 'false');
// This anchor behaves as a slider named 'video slider'.
state.videoControl.sliderEl.find('.ui-slider-handle').attr({
'role': gettext('slider'),
'title': gettext('video slider')
});
}
// function _bindHandlers(state)
......
common/lib/xmodule/xmodule/js/src/video/05_video_quality_control.js
......@@ -47,14 +47,12 @@ function () {
// ARIA
// Let screen readers know that:
// this anchor behaves like a button
state.videoQualityControl.el.attr('role', gettext('button'));
// what its name is: (title attribute is set in video.html template):
// HD
// what its state is:
state.videoQualityControl.el.attr('aria-disabled', 'false');
// This anchor behaves as a button named 'HD'.
// (the title attribute is set in video.html template).
state.videoQualityControl.el.attr({
'role': gettext('button'),
'aria-disabled': 'false'
});
}
// function _bindHandlers(state)
......
common/lib/xmodule/xmodule/js/src/video/06_video_progress_slider.js
......@@ -54,18 +54,16 @@ function () {
function _buildHandle(state) {
state.videoProgressSlider.handle = state.videoProgressSlider.el.find('.ui-slider-handle');
// ARIA
// Let screen readers know that this anchor behaves like a slider, is
// named 'video position' and give its state
// Let screen readers know that:
// This anchor behaves as a button named 'video position'.
state.videoProgressSlider.handle.attr({
'role': gettext('slider'),
'title': 'video position',
'aria-disabled': 'false',
'aria-valuetext': getTimeDescription(state.videoProgressSlider.slider.slider('option', 'value'))
//'aria-valuenow': state.videoProgressSlider.slider.slider('option', 'value'),
//'aria-valuemin': state.videoProgressSlider.slider.slider('option', 'min'),
//'aria-valuemax': state.videoProgressSlider.slider.slider('option', 'max')
});
}
......@@ -89,8 +87,9 @@ function () {
this.trigger('videoPlayer.onSlideSeek', {'type': 'onSlideSeek', 'time': ui.value});
// ARIA
this.videoProgressSlider.handle.attr('aria-valuetext',
getTimeDescription(this.videoPlayer.currentTime));
this.videoProgressSlider.handle.attr(
'aria-valuetext', getTimeDescription(this.videoPlayer.currentTime)
);
}
function onStop(event, ui) {
......@@ -101,8 +100,9 @@ function () {
this.trigger('videoPlayer.onSlideSeek', {'type': 'onSlideSeek', 'time': ui.value});
// ARIA
this.videoProgressSlider.handle.attr('aria-valuetext',
getTimeDescription(this.videoPlayer.currentTime));
this.videoProgressSlider.handle.attr(
'aria-valuetext', getTimeDescription(this.videoPlayer.currentTime)
);
setTimeout(function() {
_this.videoProgressSlider.frozen = false;
......
common/lib/xmodule/xmodule/js/src/video/07_video_volume_control.js
......@@ -66,25 +66,26 @@ function () {
// ARIA
// Let screen readers know that:
// this anchor behaves like a button
state.videoVolumeControl.buttonEl.attr('role', gettext('button'));
// what its name is: (title attribute is set in video.html template):
state.videoVolumeControl.buttonEl.attr('aria-label', gettext('Volume'));
// what its state is:
state.videoVolumeControl.buttonEl.attr('aria-disabled', 'false');
// This anchor behaves as a button named 'Volume'.
// (the title attribute is set in video.html template).
state.videoVolumeControl.buttonEl.attr({
'role': gettext('button'),
'aria-label': gettext('Volume'), // Doesn't read the title attribute, why?
'aria-disabled': 'false'
});
//state.videoVolumeControl.buttonEl.attr();
// Volume slider
// The anchor representing the slider handle behaves as a slider named
// volume.
state.videoVolumeControl.volumeSliderHandleEl = state.videoVolumeControl.volumeSliderEl.find('.ui-slider-handle');
state.videoVolumeControl.volumeSliderHandleEl.attr({
'role': gettext('slider'),
'title': 'volume',
'aria-disabled': 'false',
'aria-valuetext': getVolumeDescription(state.videoVolumeControl.slider.slider('option', 'value')),
'aria-valuenow': state.videoVolumeControl.slider.slider('option', 'value'),
'aria-valuemin': state.videoVolumeControl.slider.slider('option', 'min'),
'aria-valuemax': state.videoVolumeControl.slider.slider('option', 'max')
'aria-valuemax': state.videoVolumeControl.slider.slider('option', 'max'),
'aria-valuenow': state.videoVolumeControl.slider.slider('option', 'value'),
'aria-valuetext': getVolumeDescription(state.videoVolumeControl.slider.slider('option', 'value'))
});
}
......@@ -171,9 +172,12 @@ function () {
});
this.trigger('videoPlayer.onVolumeChange', ui.value);
// ARIA
this.videoVolumeControl.volumeSliderHandleEl.attr('aria-valuenow', ui.value);
this.videoVolumeControl.volumeSliderHandleEl.attr('aria-valuetext', getVolumeDescription(ui.value));
this.videoVolumeControl.volumeSliderHandleEl.attr({
'aria-valuenow': ui.value,
'aria-valuetext': getVolumeDescription(ui.value)
});
}
function toggleMute(event) {
......@@ -183,21 +187,22 @@ function () {
this.videoVolumeControl.previousVolume = this.videoVolumeControl.currentVolume;
this.videoVolumeControl.slider.slider('option', 'value', 0);
// ARIA
state.videoVolumeControl.volumeSliderHandleEl.attr({
this.videoVolumeControl.volumeSliderHandleEl.attr({
'aria-valuenow': 0,
'aria-valuetext': getVolumeDescription(0),
'aria-valuenow': 0
});
} else {
this.videoVolumeControl.slider.slider('option', 'value', this.videoVolumeControl.previousVolume);
// ARIA
state.videoVolumeControl.volumeSliderHandleEl.attr({
'aria-valuetext': getVolumeDescription(this.videoVolumeControl.previousVolume),
'aria-valuenow': this.videoVolumeControl.previousVolume
this.videoVolumeControl.volumeSliderHandleEl.attr({
'aria-valuenow': this.videoVolumeControl.previousVolume,
'aria-valuetext': getVolumeDescription(this.videoVolumeControl.previousVolume)
});
}
}
// ARIA
// Returns a string describing the level of volume.
function getVolumeDescription(vol) {
if (vol === 0) {
return 'silent';
......
common/lib/xmodule/xmodule/js/src/video/08_video_speed_control.js
......@@ -80,17 +80,15 @@ function () {
state.videoSpeedControl.setSpeed(state.speed);
// ARIA
// ARIA
// Let screen readers know that:
// this anchor behaves like a button
state.videoSpeedControl.el.children('a').attr('role', gettext('button'));
// what its name is: (title attribute is set in video.html template):
state.videoSpeedControl.el.children('a').attr('aria-label', 'Speeds');
// what its state is:
state.videoSpeedControl.el.children('a').attr('aria-disabled', 'false');
// This anchor behaves as a button named 'Speeds'.
// (the title attribute is set in video.html template).
state.videoSpeedControl.el.children('a').attr({
'role': gettext('button'),
'aria-disabled': 'false'
});
}
/**
......
common/lib/xmodule/xmodule/js/src/video/09_video_caption.js
......@@ -109,14 +109,12 @@ function () {
// ARIA
// Let screen readers know that:
// this anchor behaves like a button
this.videoCaption.hideSubtitlesEl.attr('role', gettext('button'));
// what its name is:
// what its name is: (title attribute is set in video.html template):
// Speeds
// what its state is:
this.videoCaption.hideSubtitlesEl.attr('aria-disabled', 'false');
// This anchor behaves as a button named 'CC'.
// (the title attribute is set in video.html template).
this.videoCaption.hideSubtitlesEl.attr({
'role': gettext('button'),
'aria-disabled': 'false'
});
}
// function bindHandlers()
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment