Commit da957d5c authored by webchick's avatar webchick

#515262 by Everett Zufelt, mgifford: Fixed Autocomplete requires ARIA for screen-reader users

parent 48abcd88
......@@ -12,10 +12,16 @@ Drupal.behaviors.autocomplete = {
if (!acdb[uri]) {
acdb[uri] = new Drupal.ACDB(uri);
}
var input = $('#' + this.id.substr(0, this.id.length - 13))
.attr('autocomplete', 'OFF')[0];
$(input.form).submit(Drupal.autocompleteSubmit);
new Drupal.jsAC(input, acdb[uri]);
var $input = $('#' + this.id.substr(0, this.id.length - 13))
.attr('autocomplete', 'OFF')
.attr('aria-autocomplete', 'list');
$($input[0].form).submit(Drupal.autocompleteSubmit);
$input.parent()
.attr('role', 'application')
.append($('<span class="element-invisible" aria-live="assertive"></span>')
.attr('id', $input.attr('id') + '-autocomplete-aria-live')
);
new Drupal.jsAC($input, acdb[uri]);
});
}
};
......@@ -33,12 +39,13 @@ Drupal.autocompleteSubmit = function () {
/**
* An AutoComplete object.
*/
Drupal.jsAC = function (input, db) {
Drupal.jsAC = function ($input, db) {
var ac = this;
this.input = input;
this.input = $input[0];
this.ariaLive = $('#' + $input.attr('id') + '-autocomplete-aria-live');
this.db = db;
$(this.input)
$input
.keydown(function (event) { return ac.onkeydown(this, event); })
.keyup(function (event) { ac.onkeyup(this, event); })
.blur(function () { ac.hidePopup(); ac.db.cancel(); });
......@@ -141,6 +148,7 @@ Drupal.jsAC.prototype.highlight = function (node) {
}
$(node).addClass('selected');
this.selected = node;
$(this.ariaLive).html($(this.selected).html());
};
/**
......@@ -149,6 +157,7 @@ Drupal.jsAC.prototype.highlight = function (node) {
Drupal.jsAC.prototype.unhighlight = function (node) {
$(node).removeClass('selected');
this.selected = false;
$(this.ariaLive).empty();
};
/**
......@@ -166,6 +175,7 @@ Drupal.jsAC.prototype.hidePopup = function (keycode) {
$(popup).fadeOut('fast', function () { $(popup).remove(); });
}
this.selected = false;
$(this.ariaLive).empty();
};
/**
......@@ -220,6 +230,7 @@ Drupal.jsAC.prototype.found = function (matches) {
if (this.popup) {
if (ul.children().size()) {
$(this.popup).empty().append(ul).show();
$(this.ariaLive).html(Drupal.t('Autocomplete popup'));
}
else {
$(this.popup).css({ visibility: 'hidden' });
......@@ -232,6 +243,7 @@ Drupal.jsAC.prototype.setStatus = function (status) {
switch (status) {
case 'begin':
$(this.input).addClass('throbbing');
$(this.ariaLive).html(Drupal.t('Searching for matches...'));
break;
case 'cancel':
case 'error':
......
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