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/js/app.js | 31 ++++++++++++++++++++----------- 1 file changed, 20 insertions(+), 11 deletions(-) (limited to 'program/js/app.js') diff --git a/program/js/app.js b/program/js/app.js index 2451a6d3d..b2c9209a7 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -199,6 +199,9 @@ function rcube_webmail() this.enable_command('close', 'logout', 'mail', 'addressbook', 'settings', 'save-pref', 'compose', 'undo', 'about', 'switch-task', 'menu-open', 'menu-save', true); + // set active task button + this.set_button(this.task, 'sel'); + if (this.env.permaurl) this.enable_command('permaurl', 'extwin', true); @@ -233,7 +236,7 @@ function rcube_webmail() }); document.onmouseup = function(e){ return ref.doc_mouse_up(e); }; - this.gui_objects.messagelist.parentNode.onmousedown = function(e){ return ref.click_on_list(e); }; + this.gui_objects.messagelist.parentNode.onclick = function(e){ return ref.click_on_list(e || window.event); }; this.enable_command('toggle_status', 'toggle_flag', 'sort', true); this.enable_command('set-listmode', this.env.threads && !this.is_multifolder_listing()); @@ -1605,9 +1608,9 @@ function rcube_webmail() this.gui_objects.qsearchbox.blur(); if (this.message_list) - this.message_list.focus(); + this.message_list.focus(e); else if (this.contact_list) - this.contact_list.focus(); + this.contact_list.focus(e); return true; }; @@ -1953,10 +1956,12 @@ function rcube_webmail() // build subject link if (cols.subject) { - var action = flags.mbox == this.env.drafts_mailbox ? 'compose' : 'show'; - var uid_param = flags.mbox == this.env.drafts_mailbox ? '_draft_uid' : '_uid'; - cols.subject = ''+cols.subject+''; + var action = flags.mbox == this.env.drafts_mailbox ? 'compose' : 'show', + uid_param = flags.mbox == this.env.drafts_mailbox ? '_draft_uid' : '_uid', + query = { _mbox: flags.mbox }; + query[uid_param] = uid; + cols.subject = ''+cols.subject+''; } // add each submitted col @@ -6182,9 +6187,6 @@ function rcube_webmail() init_button(cmd, this.buttons[cmd][i]); } } - - // set active task button - this.set_button(this.task, 'sel'); }; // set button to a specific state @@ -6197,7 +6199,7 @@ function rcube_webmail() button = a_buttons[n]; obj = document.getElementById(button.id); - if (!obj) + if (!obj || button.status == state) continue; // get default/passive setting of the button @@ -6226,8 +6228,14 @@ function rcube_webmail() obj.disabled = state == 'pas'; } else if (button.type == 'uibutton') { + button.status = state; $(obj).button('option', 'disabled', state == 'pas'); } + else { + $(obj) + .attr('tabindex', state == 'pas' || state == 'sel' ? '-1' : '0') + .attr('aria-disabled', state == 'pas' || state == 'sel' ? 'true' : 'false'); + } } }; @@ -7116,6 +7124,7 @@ function rcube_webmail() this.enable_command('set-listmode', this.env.threads && !is_multifolder); if ((response.action == 'list' || response.action == 'search') && this.message_list) { + this.message_list.focus(); this.msglist_select(this.message_list); this.triggerEvent('listupdate', { folder:this.env.mailbox, rowcount:this.message_list.rowcount }); } -- cgit v1.2.3 From a539cebdaac8141189f51cb9de87525bb2c8571a Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Thu, 1 May 2014 16:13:58 +0200 Subject: Improve mail view document structure with headings, roles, labels and aria-attributes --- program/js/app.js | 3 +- skins/larry/includes/header.html | 20 +++--- skins/larry/includes/mailtoolbar.html | 20 +++--- skins/larry/mail.css | 10 +++ skins/larry/styles.css | 35 +++++++--- skins/larry/templates/mail.html | 111 +++++++++++++++++------------- skins/larry/templates/message.html | 13 ++-- skins/larry/templates/messagepreview.html | 43 ++++++------ skins/larry/ui.js | 2 + 9 files changed, 156 insertions(+), 101 deletions(-) (limited to 'program/js/app.js') diff --git a/program/js/app.js b/program/js/app.js index b2c9209a7..f0aadd970 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -6359,7 +6359,8 @@ function rcube_webmail() this.messages[key].labels = [{'id': id, 'msg': msg}]; } else { - obj.click(function() { return ref.hide_message(obj); }); + obj.click(function() { return ref.hide_message(obj); }) + .attr('role', 'alert'); } this.triggerEvent('message', { message:msg, type:type, timeout:timeout, object:obj }); diff --git a/skins/larry/includes/header.html b/skins/larry/includes/header.html index 8ce784b02..4692913fa 100644 --- a/skins/larry/includes/header.html +++ b/skins/larry/includes/header.html @@ -1,5 +1,6 @@ -