summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorcboyden2017-10-15 15:48:56 (GMT)
committerolstjos2017-10-15 15:48:56 (GMT)
commit863357491e866186beb9c5e140bd1f4d02a7cb9a (patch)
treefe5fb0e512f33031c8596c283441675b9803f023
parent6faeabac327fb37e2db4c13eafa6809ffbf071b6 (diff)
Issue #2372903 by dsnopek, cboyden: Library tab not keyboard-accessible or testable
-rw-r--r--js/plugins/media.views.js22
-rw-r--r--media-views-view-media-browser.tpl.php2
-rw-r--r--media.views.inc2
3 files changed, 18 insertions, 8 deletions
diff --git a/js/plugins/media.views.js b/js/plugins/media.views.js
index 1ea4440..f3816f1 100644
--- a/js/plugins/media.views.js
+++ b/js/plugins/media.views.js
@@ -93,7 +93,7 @@ Drupal.media.browser.views.select = function(view) {
Drupal.media.browser.selectMedia([]);
// Reset all 'selected'-status.
- $('.view-content .media-item', view).removeClass('selected');
+ $('.view-content .media-item', view).removeClass('selected').parent().attr('aria-checked', 'false');
}
/**
@@ -140,16 +140,15 @@ Drupal.media.browser.views.setup = function(view) {
});
- // Catch the click on a media item
- $('.view-content .media-item', view).bind('click', function () {
+ function onSelectMediaItem() {
var fid = $(this).closest('.media-item[data-fid]').data('fid'),
selectedFiles = new Array();
// Remove all currently selected files
- $('.view-content .media-item', view).removeClass('selected');
+ $('.view-content .media-item', view).removeClass('selected').parent().attr('aria-checked', 'false');
// Mark it as selected
- $(this).addClass('selected');
+ $(this).addClass('selected').parent().attr('aria-checked', 'true');
// Multiselect!
if (Drupal.settings.media.browser.params.multiselect) {
@@ -160,7 +159,7 @@ Drupal.media.browser.views.setup = function(view) {
// If the current file exists in the list of already selected
// files, we deselect instead of selecting
if (currentFid == fid) {
- $(this).removeClass('selected');
+ $(this).removeClass('selected').parent().attr('aria-checked', 'false');
// If we change the fid, the later matching won't
// add it back again because it can't find it.
fid = NaN;
@@ -173,7 +172,7 @@ Drupal.media.browser.views.setup = function(view) {
selectedFiles.push(Drupal.media.browser.selectedMedia[index]);
// Mark it as selected
- $('.view-content *[data-fid=' + currentFid + '].media-item', view).addClass('selected');
+ $('.view-content *[data-fid=' + currentFid + '].media-item', view).addClass('selected').parent().attr('aria-checked', 'true');
}
}
}
@@ -194,6 +193,15 @@ Drupal.media.browser.views.setup = function(view) {
}
}
Drupal.media.browser.selectMedia(selectedFiles);
+ }
+
+ // Catch the click or space bar press on a media item.
+ $('.view-content .media-item', view).bind('click', onSelectMediaItem);
+ $('.view-content .media-item', view).parent().bind('keydown', function (evt) {
+ if (evt.which == 32 || evt.which == 13) {
+ onSelectMediaItem.call($('.media-item', this).get(0), evt);
+ return false;
+ }
});
// Add the processed class, so we dont accidentally process the same element twice..
diff --git a/media-views-view-media-browser.tpl.php b/media-views-view-media-browser.tpl.php
index b37f0cf..feb0a2b 100644
--- a/media-views-view-media-browser.tpl.php
+++ b/media-views-view-media-browser.tpl.php
@@ -13,7 +13,7 @@
<div class="clearfix">
<?php print $list_type_prefix; ?>
<?php foreach ($rows as $id => $row): ?>
- <li id="media-item-<?php print $row->fid; ?>" class="<?php print $classes_array[$id]; ?>">
+ <li id="media-item-<?php print $row->fid; ?>" class="<?php print $classes_array[$id]; ?>" tabindex="0" role="<?php print $aria_role; ?>" aria-checked="false">
<?php print $row->preview; ?>
</li>
<?php endforeach; ?>
diff --git a/media.views.inc b/media.views.inc
index 9640dde..5fd2c02 100644
--- a/media.views.inc
+++ b/media.views.inc
@@ -98,6 +98,7 @@ function template_preprocess_media_views_view_media_browser(&$vars) {
drupal_add_js(array('media' => array('files' => array_values($files))), 'setting');
// Add the browser parameters to the settings and that this display exists.
+ $params = media_get_browser_params();
drupal_add_js(array(
'media' => array(
'browser' => array(
@@ -126,6 +127,7 @@ function template_preprocess_media_views_view_media_browser(&$vars) {
$vars['wrapper_suffix'] = '</div>';
$vars['list_type_prefix'] = '<' . $handler->options['type'] . ' id="media-browser-library-list" class="' . implode(' ', $class) . '">';
$vars['list_type_suffix'] = '</' . $handler->options['type'] . '>';
+ $vars['aria_role'] = $params['multiselect'] ? 'checkbox' : 'radio';
// Run theming variables through a standard Views preprocess function.
template_preprocess_views_view_unformatted($vars);