Commit e1784c61 authored by Dave Lane's avatar Dave Lane

starting to make the interface keyboard navigable

parent ee3e4447
......@@ -310,6 +310,13 @@ button.ore-processing {
list-style-type: decimal;
}
/* accessibility styles */
#ore-login-status .ore-trigger:focus {
color: black;
}
/* end accessibility styles */
/* mobile configuration */
@media (max-width: 992px) {
#ore-login-status {
......
......@@ -86,7 +86,7 @@ jQuery(document).ready(function() {
text = '<div class="ore-menu-block ore-left"><p>Don\'t have an account? We invite you to</p><p style="text-align: center;"> <span id="ore-register-button" class="button ore-button" data-toggle="modal" data-target="#ore-modal">Register</span></p></div><div class="ore-menu-block ore-right"><p>Already have an account? Please</p><p style="text-align: center;"><span id="ore-login-button" class="button ore-button" data-toggle="modal" data-target="#ore-modal">Log In</span></p></div>';
LOG('new text: '+text);
// enable menus
prepare_menu(text);
show_menu(text);
}
/*
* Menu for an unauthenticated (anonymous) user
......@@ -121,7 +121,7 @@ jQuery(document).ready(function() {
}
LOG('new text: '+text);
// enable menus
prepare_menu(text);
show_menu(text);
}
// replace country selector tag with country selector
function add_countries(markup, select) {
......@@ -192,7 +192,7 @@ jQuery(document).ready(function() {
return match;
}
// set up the menu infrastructure
function prepare_menu(text) {
function show_menu(text) {
// menu pause and fade times in milliseconds
var pausetime = 3000;
var postclicktime = 500;
......@@ -205,28 +205,19 @@ jQuery(document).ready(function() {
$(this).data('title', $(this).attr('title'));
LOG('sorted trigger with text '+$(this).data('title'));
$(this).removeAttr('title');
// for accessibility, make this tab indexable!
$(this).attr('tabindex', '0');
// manage clicks, e.g. from touch devices
$(trigger).click( function(e) {
create_menu($(this), text);
enable_menu();
LOG('click');
set_menu_fade();
// if the user clicks within the box, fade shortly thereafter
//
// Process Menu Click Events
$(this).next().click( function (e) {
LOG('click in menu - this should be passed on!')
//LOG('this = ', $(this));
//LOG('e = ', e);
if (!menu_events(e.target.id)) {
LOG('menu_event '+e.target.id+' was false - stopping propagation');
e.stopPropagation();
} else {
LOG('menu_event '+e.target.id+' was true... eventually stopping propagation');
}
});
// don't send this click to the "hide menu" function below.
e.stopPropagation();
$(trigger).keyup(function(e) {
LOG('got keyup event ', e);
if (e.keyCode === 32 || e.keyCode === 13) {
LOG('got a enter or spacebar!');
prepare_menu(text);
}
});
$(trigger).click(function(e) {
LOG('got click event ', e)
prepare_menu(text);
});
});
function set_menu_fade() {
......@@ -235,6 +226,32 @@ jQuery(document).ready(function() {
}
});
}
function prepare_menu(text) {
LOG('preparing menu with ', text);
create_menu($(this), text);
LOG('enabling menu');
enable_menu();
LOG('click');
set_menu_fade();
// if the user clicks within the box, fade shortly thereafter
//
// Process Menu Click Events
$(this).next().click( function (e) {
LOG('click in menu - this should be passed on!')
//LOG('this = ', $(this));
//LOG('e = ', e);
if (!menu_events(e.target.id)) {
LOG('menu_event '+e.target.id+' was false - stopping propagation');
e.stopPropagation();
} else {
LOG('menu_event '+e.target.id+' was true... eventually stopping propagation');
}
});
// don't send this click to the "hide menu" function below.
e.stopPropagation();
}
function create_menu(trigger, text) {
trigger.next('.'+menu).remove();
// create the menu
......
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