From e8bcf08c72a18b3bf396e6448d6658227ecb46f2 Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Wed, 30 Apr 2014 16:21:29 +0200 Subject: 1. Prepare core and Larry skin for improved accessibility 2. Implement full keyboard navigation in main mail view --- program/include/rcmail_output_html.php | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'program/include') diff --git a/program/include/rcmail_output_html.php b/program/include/rcmail_output_html.php index eb4a52d04..a57165f03 100644 --- a/program/include/rcmail_output_html.php +++ b/program/include/rcmail_output_html.php @@ -1130,6 +1130,15 @@ EOF; $attrib['alt'] = html::quote($this->app->gettext($attrib['alt'], $attrib['domain'])); } + // set accessibility attributes + if (!$attrib['role']) { + $attrib['role'] = 'button'; + } + if (!empty($attrib['class']) && !empty($attrib['classact']) || !empty($attrib['imagepas']) && !empty($attrib['imageact'])) { + $attrib['tabindex'] = '-1'; // disable button by default + $attrib['aria-disabled'] = 'true'; + } + // set title to alt attribute for IE browsers if ($this->browser->ie && !$attrib['title'] && $attrib['alt']) { $attrib['title'] = $attrib['alt']; -- cgit v1.2.3 From 184ed2efe2258579c886de337446fcbb05f5faf4 Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Wed, 7 May 2014 17:27:05 +0200 Subject: Declare content language for proper text-to-speech support --- program/include/rcmail_output_html.php | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'program/include') diff --git a/program/include/rcmail_output_html.php b/program/include/rcmail_output_html.php index a57165f03..ff660a4df 100644 --- a/program/include/rcmail_output_html.php +++ b/program/include/rcmail_output_html.php @@ -1332,6 +1332,15 @@ EOF; $this->pagetitle = 'Roundcube Mail'; } + // declare page language + if (!empty($_SESSION['language'])) { + $lang = substr($_SESSION['language'], 0, 2); + $output = preg_replace('/pagetitle); $page_header = ''; -- cgit v1.2.3 From ea0866a1adc9239b8b115ab2490e1dd88f3c64ec Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Wed, 7 May 2014 20:04:13 +0200 Subject: Improve keyboard navigation on compose screen: define tabindex groups + enable keyboard controls of contacts list widget --- program/include/rcmail_output_html.php | 2 ++ program/js/app.js | 31 +++++++++------- program/js/list.js | 2 ++ skins/larry/addressbook.css | 17 --------- skins/larry/mail.css | 29 +++++++++++++-- skins/larry/styles.css | 30 ++++++++++++++++ skins/larry/templates/addressbook.html | 2 +- skins/larry/templates/compose.html | 66 +++++++++++++++++----------------- skins/larry/ui.js | 13 ++++--- 9 files changed, 121 insertions(+), 71 deletions(-) (limited to 'program/include') diff --git a/program/include/rcmail_output_html.php b/program/include/rcmail_output_html.php index ff660a4df..19a8d142c 100644 --- a/program/include/rcmail_output_html.php +++ b/program/include/rcmail_output_html.php @@ -1135,6 +1135,8 @@ EOF; $attrib['role'] = 'button'; } if (!empty($attrib['class']) && !empty($attrib['classact']) || !empty($attrib['imagepas']) && !empty($attrib['imageact'])) { + if (array_key_exists('tabindex', $attrib)) + $attrib['data-tabindex'] = $attrib['tabindex']; $attrib['tabindex'] = '-1'; // disable button by default $attrib['aria-disabled'] = 'true'; } diff --git a/program/js/app.js b/program/js/app.js index 11236d0cb..4c9462afa 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -300,10 +300,12 @@ function rcube_webmail() $('a.insertresponse', this.gui_objects.responseslist) .attr('unselectable', 'on') .mousedown(function(e){ return rcube_event.cancel(e); }) - .mouseup(function(e){ - ref.command('insert-response', $(this).attr('rel')); - $(document.body).trigger('mouseup'); // hides the menu - return rcube_event.cancel(e); + .bind('mouseup keypress', function(e){ + if (e.type == 'mouseup' || rcube_event.get_keycode(e) == 13) { + ref.command('insert-response', $(this).attr('rel')); + $(document.body).trigger('mouseup'); // hides the menu + return rcube_event.cancel(e); + } }); // avoid textarea loosing focus when hitting the save-response button/link @@ -337,11 +339,12 @@ function rcube_webmail() // init address book widget if (this.gui_objects.contactslist) { this.contact_list = new rcube_list_widget(this.gui_objects.contactslist, - { multiselect:true, draggable:false, keyboard:false }); + { multiselect:true, draggable:false, keyboard:true }); this.contact_list .addEventListener('initrow', function(o) { ref.triggerEvent('insertrow', { cid:o.uid, row:o }); }) .addEventListener('select', function(o) { ref.compose_recipient_select(o); }) .addEventListener('dblclick', function(o) { ref.compose_add_recipient('to'); }) + .addEventListener('keypress', function(o) { if (o.key_pressed == o.ENTER_KEY) ref.compose_add_recipient('to'); }) .init(); } @@ -3600,10 +3603,12 @@ function rcube_webmail() .mousedown(function(e){ return rcube_event.cancel(e); }) - .mouseup(function(e){ - ref.command('insert-response', key); - $(document.body).trigger('mouseup'); // hides the menu - return rcube_event.cancel(e); + .bind('mouseup keypress', function(e){ + if (e.type == 'mouseup' || rcube_event.get_keycode(e) == 13) { + ref.command('insert-response', $(this).attr('rel')); + $(document.body).trigger('mouseup'); // hides the menu + return rcube_event.cancel(e); + } }); } }; @@ -6195,7 +6200,7 @@ function rcube_webmail() // set button to a specific state this.set_button = function(command, state) { - var n, button, obj, a_buttons = this.buttons[command], + var n, button, obj, $obj, a_buttons = this.buttons[command], len = a_buttons ? a_buttons.length : 0; for (n=0; n