From a2f8fa236143b44f90e53c19806cfd0efa014857 Mon Sep 17 00:00:00 2001 From: Thomas Bruederli <thomas@roundcube.net> Date: Mon, 12 May 2014 04:32:45 -0400 Subject: [PATCH] Set aria-selected and aria-expanded state attributes --- program/js/app.js | 631 +++++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 456 insertions(+), 175 deletions(-) diff --git a/program/js/app.js b/program/js/app.js index d8568ce..06008b2 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -1,23 +1,37 @@ -/* - +-----------------------------------------------------------------------+ - | Roundcube Webmail Client Script | - | | - | This file is part of the Roundcube Webmail client | - | Copyright (C) 2005-2014, The Roundcube Dev Team | - | Copyright (C) 2011-2014, Kolab Systems AG | - | | - | Licensed under the GNU General Public License version 3 or | - | any later version with exceptions for skins & plugins. | - | See the README file for a full license statement. | - | | - +-----------------------------------------------------------------------+ - | Authors: Thomas Bruederli <roundcube@gmail.com> | - | Aleksander 'A.L.E.C' Machniak <alec@alec.pl> | - | Charles McNulty <charles@charlesmcnulty.com> | - +-----------------------------------------------------------------------+ - | Requires: jquery.js, common.js, list.js | - +-----------------------------------------------------------------------+ -*/ +/** + * Roundcube Webmail Client Script + * + * This file is part of the Roundcube Webmail client + * + * @licstart The following is the entire license notice for the + * JavaScript code in this file. + * + * Copyright (C) 2005-2014, The Roundcube Dev Team + * Copyright (C) 2011-2014, Kolab Systems AG + * + * The JavaScript code in this page is free software: you can + * redistribute it and/or modify it under the terms of the GNU + * General Public License (GNU GPL) as published by the Free Software + * Foundation, either version 3 of the License, or (at your option) + * any later version. The code is distributed WITHOUT ANY WARRANTY; + * without even the implied warranty of MERCHANTABILITY or FITNESS + * FOR A PARTICULAR PURPOSE. See the GNU GPL for more details. + * + * As additional permission under GNU GPL version 3 section 7, you + * may distribute non-source (e.g., minimized or compacted) forms of + * that code without the copy of the GNU GPL normally required by + * section 4, provided you include this license notice and a URL + * through which recipients can access the Corresponding Source. + * + * @licend The above is the entire license notice + * for the JavaScript code in this file. + * + * @author Thomas Bruederli <roundcube@gmail.com> + * @author Aleksander 'A.L.E.C' Machniak <alec@alec.pl> + * @author Charles McNulty <charles@charlesmcnulty.com> + * + * @requires jquery.js, common.js, list.js + */ function rcube_webmail() { @@ -32,6 +46,7 @@ this.messages = {}; this.group2expand = {}; this.http_request_jobs = {}; + this.menu_stack = new Array(); // webmail client settings this.dblclick_time = 500; @@ -139,11 +154,11 @@ // initialize webmail client this.init = function() { - var n, p = this; + var n; this.task = this.env.task; // check browser - if (!bw.dom || !bw.xmlhttp_test() || (bw.mz && bw.vendver < 1.9)) { + if (this.env.server_error != 409 && (!bw.dom || !bw.xmlhttp_test() || (bw.mz && bw.vendver < 1.9) || (bw.ie && bw.vendver < 7))) { this.goto_url('error', '_code=0x199'); return; } @@ -183,7 +198,10 @@ // enable general commands this.enable_command('close', 'logout', 'mail', 'addressbook', 'settings', 'save-pref', - 'compose', 'undo', 'about', 'switch-task', 'menu-open', 'menu-save', true); + 'compose', 'undo', 'about', 'switch-task', 'menu-open', 'menu-close', 'menu-save', true); + + // set active task button + this.set_button(this.task, 'sel'); if (this.env.permaurl) this.enable_command('permaurl', 'extwin', true); @@ -200,26 +218,25 @@ column_movable:this.env.col_movable, dblclick_time:this.dblclick_time }); this.message_list - .addEventListener('initrow', function(o) { p.init_message_row(o); }) - .addEventListener('dblclick', function(o) { p.msglist_dbl_click(o); }) - .addEventListener('click', function(o) { p.msglist_click(o); }) - .addEventListener('keypress', function(o) { p.msglist_keypress(o); }) - .addEventListener('select', function(o) { p.msglist_select(o); }) - .addEventListener('dragstart', function(o) { p.drag_start(o); }) - .addEventListener('dragmove', function(e) { p.drag_move(e); }) - .addEventListener('dragend', function(e) { p.drag_end(e); }) - .addEventListener('expandcollapse', function(o) { p.msglist_expand(o); }) - .addEventListener('column_replace', function(o) { p.msglist_set_coltypes(o); }) - .addEventListener('listupdate', function(o) { p.triggerEvent('listupdate', o); }) + .addEventListener('initrow', function(o) { ref.init_message_row(o); }) + .addEventListener('dblclick', function(o) { ref.msglist_dbl_click(o); }) + .addEventListener('click', function(o) { ref.msglist_click(o); }) + .addEventListener('keypress', function(o) { ref.msglist_keypress(o); }) + .addEventListener('select', function(o) { ref.msglist_select(o); }) + .addEventListener('dragstart', function(o) { ref.drag_start(o); }) + .addEventListener('dragmove', function(e) { ref.drag_move(e); }) + .addEventListener('dragend', function(e) { ref.drag_end(e); }) + .addEventListener('expandcollapse', function(o) { ref.msglist_expand(o); }) + .addEventListener('column_replace', function(o) { ref.msglist_set_coltypes(o); }) + .addEventListener('listupdate', function(o) { ref.triggerEvent('listupdate', o); }) .init(); // TODO: this should go into the list-widget code $(this.message_list.thead).on('click', 'a.sortcol', function(e){ - return rcmail.command('sort', $(this).attr('rel'), this); + return ref.command('sort', $(this).attr('rel'), this); }); - document.onmouseup = function(e){ return p.doc_mouse_up(e); }; - this.gui_objects.messagelist.parentNode.onmousedown = function(e){ return p.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()); @@ -262,7 +279,7 @@ this.env.address_group_stack = []; this.env.compose_commands = ['send-attachment', 'remove-attachment', 'send', 'cancel', 'toggle-editor', 'list-adresses', 'pushgroup', 'search', 'reset-search', 'extwin', - 'insert-response', 'save-response']; + 'insert-response', 'save-response', 'menu-open', 'menu-close']; if (this.env.drafts_mailbox) this.env.compose_commands.push('savedraft') @@ -283,10 +300,12 @@ $('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 @@ -294,8 +313,6 @@ $('#'+this.buttons['save-response'][i].id).mousedown(function(e){ return rcube_event.cancel(e); }) } } - - document.onmouseup = function(e){ return p.doc_mouse_up(e); }; // init message compose form this.init_messageform(); @@ -320,11 +337,12 @@ // 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) { p.triggerEvent('insertrow', { cid:o.uid, row:o }); }) + .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(); } @@ -363,21 +381,20 @@ this.contact_list = new rcube_list_widget(this.gui_objects.contactslist, {multiselect:true, draggable:this.gui_objects.folderlist?true:false, keyboard:true}); this.contact_list - .addEventListener('initrow', function(o) { p.triggerEvent('insertrow', { cid:o.uid, row:o }); }) - .addEventListener('keypress', function(o) { p.contactlist_keypress(o); }) - .addEventListener('select', function(o) { p.contactlist_select(o); }) - .addEventListener('dragstart', function(o) { p.drag_start(o); }) - .addEventListener('dragmove', function(e) { p.drag_move(e); }) - .addEventListener('dragend', function(e) { p.drag_end(e); }) + .addEventListener('initrow', function(o) { ref.triggerEvent('insertrow', { cid:o.uid, row:o }); }) + .addEventListener('keypress', function(o) { ref.contactlist_keypress(o); }) + .addEventListener('select', function(o) { ref.contactlist_select(o); }) + .addEventListener('dragstart', function(o) { ref.drag_start(o); }) + .addEventListener('dragmove', function(e) { ref.drag_move(e); }) + .addEventListener('dragend', function(e) { ref.drag_end(e); }) .init(); if (this.env.cid) this.contact_list.highlight_row(this.env.cid); - this.gui_objects.contactslist.parentNode.onmousedown = function(e){ return p.click_on_list(e); }; - document.onmouseup = function(e){ return p.doc_mouse_up(e); }; + this.gui_objects.contactslist.parentNode.onmousedown = function(e){ return ref.click_on_list(e); }; - $(this.gui_objects.qsearchbox).focusin(function() { rcmail.contact_list.blur(); }); + $(this.gui_objects.qsearchbox).focusin(function() { ref.contact_list.blur(); }); this.update_group_commands(); this.command('list'); @@ -429,7 +446,7 @@ this.identity_list = new rcube_list_widget(this.gui_objects.identitieslist, {multiselect:false, draggable:false, keyboard:false}); this.identity_list - .addEventListener('select', function(o) { p.identity_select(o); }) + .addEventListener('select', function(o) { ref.identity_select(o); }) .init() .focus(); @@ -439,7 +456,7 @@ else if (this.gui_objects.sectionslist) { this.sections_list = new rcube_list_widget(this.gui_objects.sectionslist, {multiselect:false, draggable:false, keyboard:false}); this.sections_list - .addEventListener('select', function(o) { p.section_select(o); }) + .addEventListener('select', function(o) { ref.section_select(o); }) .init() .focus(); } @@ -451,10 +468,10 @@ this.responses_list .addEventListener('select', function(list) { var win, id = list.get_single_selection(); - p.enable_command('delete', !!id && $.inArray(id, p.env.readonly_responses) < 0); - if (id && (win = p.get_frame_window(p.env.contentframe))) { - p.set_busy(true); - p.location_href({ _action:'edit-response', _key:id, _framed:1 }, win); + ref.enable_command('delete', !!id && $.inArray(id, ref.env.readonly_responses) < 0); + if (id && (win = ref.get_frame_window(ref.env.contentframe))) { + ref.set_busy(true); + ref.location_href({ _action:'edit-response', _key:id, _framed:1 }, win); } }) .init() @@ -473,7 +490,7 @@ $('#rcmloginpwd').focus(); // detect client timezone - if (window.jstz && !bw.ie6) { + if (window.jstz) { var timezone = jstz.determine(); if (timezone.name()) $('#rcmlogintz').val(timezone.name()); @@ -541,6 +558,18 @@ .get(0).addEventListener('drop', function(e){ return ref.file_dropped(e); }, false); } + // catch document (and iframe) mouse clicks + var body_mouseup = function(e){ return ref.doc_mouse_up(e); }; + $(document.body) + .bind('mouseup', body_mouseup) + .bind('keydown', function(e){ return ref.doc_keypress(e); }); + + $('iframe').load(function(e) { + try { $(this.contentDocument || this.contentWindow).on('mouseup', body_mouseup); } + catch (e) {/* catch possible "Permission denied" error in IE */ } + }) + .contents().on('mouseup', body_mouseup); + // trigger init event hook this.triggerEvent('init', { task:this.task, action:this.env.action }); @@ -576,7 +605,8 @@ if (obj && obj.blur) obj.blur(); - if (this.busy) + // do nothing if interface is locked by other command (with exception for searching reset) + if (this.busy && !(command == 'reset-search' && this.last_command == 'search')) return false; // let the browser handle this click (shift/ctrl usually opens the link in a new window/tab) @@ -602,6 +632,8 @@ this.remove_compose_data(this.env.compose_id); } + this.last_command = command; + // process external commands if (typeof this.command_handlers[command] === 'function') { ret = this.command_handlers[command](props, obj); @@ -613,8 +645,8 @@ } // trigger plugin hooks - this.triggerEvent('actionbefore', {props:props, action:command}); - ret = this.triggerEvent('before'+command, props); + this.triggerEvent('actionbefore', {props:props, action:command, originalEvent:event}); + ret = this.triggerEvent('before'+command, props || event); if (ret !== undefined) { // abort if one of the handlers returned false if (ret === false) @@ -689,9 +721,15 @@ var mimetype = this.env.attachments[props.id]; this.enable_command('open-attachment', mimetype && this.env.mimetypes && $.inArray(mimetype, this.env.mimetypes) >= 0); } + this.show_menu(props, props.show || undefined, event); + break; + + case 'menu-close': + this.hide_menu(props, event); + break; case 'menu-save': - this.triggerEvent(command, {props:props}); + this.triggerEvent(command, {props:props, originalEvent:event}); return false; case 'open': @@ -876,14 +914,14 @@ case 'move': case 'moveto': // deprecated if (this.task == 'mail') - this.move_messages(props, obj); + this.move_messages(props, event); else if (this.task == 'addressbook') this.move_contacts(props); break; case 'copy': if (this.task == 'mail') - this.copy_messages(props, obj); + this.copy_messages(props, event); else if (this.task == 'addressbook') this.copy_contacts(props); break; @@ -1074,8 +1112,9 @@ // Reset the auto-save timer clearTimeout(this.save_timer); - if (!this.upload_file(props || this.gui_objects.uploadform, 'upload')) { - alert(this.get_label('selectimportfile')); + if (!(flag = this.upload_file(props || this.gui_objects.uploadform, 'upload'))) { + if (flag !== false) + alert(this.get_label('selectimportfile')); aborted = true; } break; @@ -1200,12 +1239,15 @@ break; case 'import-messages': - var form = props || this.gui_objects.importform; - var importlock = this.set_busy(true, 'importwait'); + var form = props || this.gui_objects.importform, + importlock = this.set_busy(true, 'importwait'); + $('input[name="_unlock"]', form).val(importlock); - if (!this.upload_file(form, 'import')) { + + if (!(flag = this.upload_file(form, 'import'))) { this.set_busy(false, null, importlock); - alert(this.get_label('selectimportfile')); + if (flag !== false) + alert(this.get_label('selectimportfile')); aborted = true; } break; @@ -1295,6 +1337,11 @@ } } }; + + this.command_enabled = function(cmd) + { + return this.commands[cmd]; + } // lock/unlock interface this.set_busy = function(a, message, id) @@ -1436,7 +1483,8 @@ if (menu && modkey == SHIFT_KEY && this.commands['copy']) { var pos = rcube_event.get_mouse_pos(e); this.env.drag_target = target; - $(menu).css({top: (pos.y-10)+'px', left: (pos.x-10)+'px'}).show(); + this.show_menu(this.gui_objects.dragmenu.id, true, e); + $(menu).css({top: (pos.y-10)+'px', left: (pos.x-10)+'px'}); return true; } @@ -1552,12 +1600,13 @@ } }; + // global mouse-click handler to cleanup some UI elements this.doc_mouse_up = function(e) { - var list, id; + var list, id, target = rcube_event.get_target(e); // ignore event if jquery UI dialog is open - if ($(rcube_event.get_target(e)).closest('.ui-dialog, .ui-widget-overlay').length) + if ($(target).closest('.ui-dialog, .ui-widget-overlay').length) return; list = this.message_list || this.contact_list; @@ -1571,7 +1620,73 @@ this.button_out(this.buttons_sel[id], id); this.buttons_sel = {}; } + + // reset popup menus; delayed to have updated menu_stack data + window.setTimeout(function(e){ + var obj, skip, config, id, i; + for (i = ref.menu_stack.length - 1; i >= 0; i--) { + id = ref.menu_stack[i]; + obj = $('#' + id); + + if (obj.is(':visible') + && target != obj.data('opener') + && target != obj.get(0) // check if scroll bar was clicked (#1489832) + && id != skip + && (obj.attr('data-editable') != 'true' || !$(target).parents('#' + id).length) + && (obj.attr('data-sticky') != 'true' || !rcube_mouse_is_over(e, obj.get(0))) + ) { + ref.hide_menu(id, e); + } + skip = obj.data('parent'); + } + }, 10); }; + + // global keypress event handler + this.doc_keypress = function(e) + { + // Helper method to move focus to the next/prev active menu item + var focus_menu_item = function(dir) { + var obj, mod = dir < 0 ? 'prevAll' : 'nextAll', limit = dir < 0 ? 'last' : 'first'; + if (ref.focused_menu && (obj = $('#'+ref.focused_menu))) { + return obj.find(':focus').closest('li')[mod](':has(:not([aria-disabled=true]))').find('a,input')[limit]().focus().length; + } + + return 0; + }; + + var target = e.target || {}, + keyCode = rcube_event.get_keycode(e); + + if (e.keyCode != 27 && (!this.menu_keyboard_active || target.nodeName == 'TEXTAREA' || target.nodeName == 'SELECT')) { + return true; + } + + switch (keyCode) { + case 38: + case 40: + case 63232: // "up", in safari keypress + case 63233: // "down", in safari keypress + focus_menu_item(mod = keyCode == 38 || keyCode == 63232 ? -1 : 1); + break; + + case 9: // tab + if (this.focused_menu) { + var mod = rcube_event.get_modifier(e); + if (!focus_menu_item(mod == SHIFT_KEY ? -1 : 1)) { + this.hide_menu(this.focused_menu, e); + } + } + return rcube_event.cancel(e); + + case 27: // esc + if (this.menu_stack.length) + this.hide_menu(this.menu_stack[this.menu_stack.length-1], e); + break; + } + + return true; + } this.click_on_list = function(e) { @@ -1579,9 +1694,9 @@ 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; }; @@ -1784,7 +1899,7 @@ this.init_message_row = function(row) { - var i, fn = {}, self = this, uid = row.uid, + var i, fn = {}, uid = row.uid, status_icon = (this.env.status_col != null ? 'status' : 'msg') + 'icn' + row.id; if (uid && this.env.messages[uid]) @@ -1792,7 +1907,7 @@ // set eventhandler to status icon if (row.icon = document.getElementById(status_icon)) { - fn.icon = function(e) { self.command('toggle_status', uid); }; + fn.icon = function(e) { ref.command('toggle_status', uid); }; } // save message icon position too @@ -1803,12 +1918,12 @@ // set eventhandler to flag icon if (this.env.flagged_col != null && (row.flagicon = document.getElementById('flagicn'+row.id))) { - fn.flagicon = function(e) { self.command('toggle_flag', uid); }; + fn.flagicon = function(e) { ref.command('toggle_flag', uid); }; } // set event handler to thread expand/collapse icon if (!row.depth && row.has_children && (row.expando = document.getElementById('rcmexpando'+row.id))) { - fn.expando = function(e) { self.expand_message_row(e, uid); }; + fn.expando = function(e) { ref.expand_message_row(e, uid); }; } // attach events @@ -1927,16 +2042,18 @@ // 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 = '<a href="./?_task=mail&_action='+action+'&_mbox='+urlencode(flags.mbox)+'&'+uid_param+'='+urlencode(uid)+'"'+ - ' onclick="return rcube_event.cancel(event)" onmouseover="rcube_webmail.long_subject_title(this,'+(message.depth+1)+')"><span>'+cols.subject+'</span></a>'; + 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 = '<a href="' + this.url(action, query) + '" onclick="return rcube_event.keyboard_only(event)"' + + ' onmouseover="rcube_webmail.long_subject_title(this,'+(message.depth+1)+')" tabindex="-1"><span>'+cols.subject+'</span></a>'; } // add each submitted col for (n in this.env.listcols) { c = this.env.listcols[n]; - col = { className: String(c).toLowerCase() }; + col = {className: String(c).toLowerCase(), events:{}}; if (this.env.coltypes[c] && this.env.coltypes[c].hidden) { col.className += ' hidden'; @@ -1970,11 +2087,8 @@ else if (c == 'threads') html = expando; else if (c == 'subject') { - if (bw.ie) { - col.onmouseover = function() { rcube_webmail.long_subject_title_ex(this, message.depth+1); }; - if (bw.ie8) - tree = '<span></span>' + tree; // #1487821 - } + if (bw.ie) + col.events.mouseover = function() { rcube_webmail.long_subject_title_ex(this); }; html = tree + cols[c]; } else if (c == 'priority') { @@ -1982,6 +2096,9 @@ html = '<span class="prio'+flags.prio+'"> </span>'; else html = ' '; + } + else if (c == 'folder') { + html = '<span onmouseover="rcube_webmail.long_subject_title(this)">' + cols[c] + '<span>'; } else html = cols[c]; @@ -2180,7 +2297,7 @@ var lock = this.set_busy(true, 'checkingmail'), params = this.check_recent_params(); - this.http_request('check-recent', params, lock); + this.http_post('check-recent', params, lock); }; // list messages of a specific mailbox using filter @@ -2192,6 +2309,7 @@ // reset vars this.env.current_page = 1; + this.env.search_filter = filter; this.http_request('search', this.search_params(false, filter), lock); }; @@ -2284,6 +2402,7 @@ url._page = page; this.http_request('list', url, lock); + this.update_state({ _mbox: mbox, _page: (page && page > 1 ? page : null) }); }; // removes messages that doesn't exists from list selection array @@ -2670,12 +2789,12 @@ }; // copy selected messages to the specified mailbox - this.copy_messages = function(mbox, obj) + this.copy_messages = function(mbox, event) { if (mbox && typeof mbox === 'object') mbox = mbox.id; else if (!mbox) - return this.folder_selector(obj, function(folder) { ref.command('copy', folder); }); + return this.folder_selector(event, function(folder) { ref.command('copy', folder); }); // exit if current or no mailbox specified if (!mbox || mbox == this.env.mailbox) @@ -2692,12 +2811,12 @@ }; // move selected messages to the specified mailbox - this.move_messages = function(mbox, obj) + this.move_messages = function(mbox, event) { if (mbox && typeof mbox === 'object') mbox = mbox.id; else if (!mbox) - return this.folder_selector(obj, function(folder) { ref.command('move', folder); }); + return this.folder_selector(event, function(folder) { ref.command('move', folder); }); // exit if current or no mailbox specified if (!mbox || (mbox == this.env.mailbox && !this.is_multifolder_listing())) @@ -3103,8 +3222,8 @@ // handler for keyboard events on the _user field this.login_user_keyup = function(e) { - var key = rcube_event.get_keycode(e); - var passwd = $('#rcmloginpwd'); + var key = rcube_event.get_keycode(e), + passwd = $('#rcmloginpwd'); // enter if (key == 13 && passwd.length && !passwd.val()) { @@ -3560,15 +3679,18 @@ $('<a>').addClass('insertresponse active') .attr('href', '#') .attr('rel', key) + .attr('tabindex', '0') .html(this.quote_html(response.name)) .appendTo(li) .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); + } }); } }; @@ -3846,9 +3968,9 @@ this.clear_compose_data = function() { if (window.localStorage) { - var index = this.local_storage_get_item('compose.index', []); + var i, index = this.local_storage_get_item('compose.index', []); - for (var i=0; i < index.length; i++) { + for (i=0; i < index.length; i++) { this.local_storage_remove_item('compose.' + index[i]); } this.local_storage_remove_item('compose.index'); @@ -3898,7 +4020,7 @@ // cleanup rx = new RegExp(rx_delim + '\\s*' + rx_delim, 'g'); - input_val = input_val.replace(rx, delim); + input_val = String(input_val).replace(rx, delim); rx = new RegExp('^[\\s' + rx_delim + ']+'); input_val = input_val.replace(rx, ''); @@ -4019,7 +4141,7 @@ this.upload_file = function(form, action) { if (!form) - return false; + return; // count files and size on capable browser var size = 0, numfiles = 0; @@ -4079,8 +4201,6 @@ this.gui_objects.attachmentform = form; return true; } - - return false; }; // add file name to attachment list @@ -4102,7 +4222,7 @@ li.attr('id', name) .addClass(att.classname) .html(att.html) - .on('mouseover', function() { rcube_webmail.long_subject_title_ex(this, 0); }); + .on('mouseover', function() { rcube_webmail.long_subject_title_ex(this); }); // replace indicator's li if (upload_id && (indicator = document.getElementById(upload_id))) { @@ -4199,7 +4319,22 @@ this.env.qsearch = {lock: lock, request: r}; this.enable_command('set-listmode', this.env.threads && (this.env.search_scope || 'base') == 'base'); + + return true; } + + return false; + }; + + this.continue_search = function(request_id) + { + var lock = ref.set_busy(true, 'stillsearching'); + + setTimeout(function(){ + var url = ref.search_params(); + url._continue = request_id; + ref.env.qsearch = { lock: lock, request: ref.http_request('search', url, lock) }; + }, 100); }; // build URL params for search @@ -4263,8 +4398,9 @@ // re-send search query with new scope if (scope != old && this.env.search_request) { - this.qsearch(this.gui_objects.qsearchbox.value); - if (scope == 'base') + if (!this.qsearch(this.gui_objects.qsearchbox.value) && this.env.search_filter && this.env.search_filter != 'ALL') + this.filter_mailbox(this.env.search_filter); + if (scope != 'all') this.select_folder(this.env.mailbox, '', true); } }; @@ -4644,7 +4780,7 @@ if (this.preview_timer) clearTimeout(this.preview_timer); - var n, id, sid, contact, ref = this, writable = false, + var n, id, sid, contact, writable = false, source = this.env.source ? this.env.address_sources[this.env.source] : null; // we don't have dblclick handler here, so use 200 instead of this.dblclick_time @@ -5061,7 +5197,7 @@ this.init_contact_form = function() { - var ref = this, col; + var col; if (this.env.coltypes) { this.set_photo_actions($('#ff_photo').val()); @@ -5709,25 +5845,25 @@ this.init_subscription_list = function() { - var p = this, delim = RegExp.escape(this.env.delimiter); + var delim = RegExp.escape(this.env.delimiter); this.last_sub_rx = RegExp('['+delim+']?[^'+delim+']+$'); this.subscription_list = new rcube_list_widget(this.gui_objects.subscriptionlist, {multiselect:false, draggable:true, keyboard:false, toggleselect:true}); this.subscription_list - .addEventListener('select', function(o){ p.subscription_select(o); }) - .addEventListener('dragstart', function(o){ p.drag_active = true; }) - .addEventListener('dragend', function(o){ p.subscription_move_folder(o); }) + .addEventListener('select', function(o){ ref.subscription_select(o); }) + .addEventListener('dragstart', function(o){ ref.drag_active = true; }) + .addEventListener('dragend', function(o){ ref.subscription_move_folder(o); }) .addEventListener('initrow', function (row) { - row.obj.onmouseover = function() { p.focus_subscription(row.id); }; - row.obj.onmouseout = function() { p.unfocus_subscription(row.id); }; + row.obj.onmouseover = function() { ref.focus_subscription(row.id); }; + row.obj.onmouseout = function() { ref.unfocus_subscription(row.id); }; }) .init(); $('#mailboxroot') - .mouseover(function(){ p.focus_subscription(this.id); }) - .mouseout(function(){ p.unfocus_subscription(this.id); }) + .mouseover(function(){ ref.focus_subscription(this.id); }) + .mouseout(function(){ ref.unfocus_subscription(this.id); }) }; this.focus_subscription = function(id) @@ -6141,22 +6277,19 @@ init_button(cmd, this.buttons[cmd][i]); } } - - // set active task button - this.set_button(this.task, 'sel'); }; // 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<len; n++) { button = a_buttons[n]; obj = document.getElementById(button.id); - if (!obj) + if (!obj || button.status == state) continue; // get default/passive setting of the button @@ -6185,7 +6318,14 @@ obj.disabled = state == 'pas'; } else if (button.type == 'uibutton') { + button.status = state; $(obj).button('option', 'disabled', state == 'pas'); + } + else { + $obj = $(obj); + $obj + .attr('tabindex', state == 'pas' || state == 'sel' ? '-1' : ($obj.attr('data-tabindex') || '0')) + .attr('aria-disabled', state == 'pas' || state == 'sel' ? 'true' : 'false'); } } }; @@ -6271,8 +6411,7 @@ type = type ? type : 'notice'; - var ref = this, - key = this.html_identifier(msg), + var key = this.html_identifier(msg), date = new Date(), id = type + date.getTime(); @@ -6311,7 +6450,8 @@ 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 }); @@ -6660,8 +6800,9 @@ // fetch headers only once if (!this.gui_objects.all_headers_box.innerHTML) { - var lock = this.display_message(this.get_label('loading'), 'loading'); - this.http_post('headers', {_uid: this.env.uid}, lock); + this.http_post('headers', {_uid: this.env.uid, _mbox: this.env.mailbox}, + this.display_message(this.get_label('loading'), 'loading') + ); } }; @@ -6677,17 +6818,15 @@ }; // create folder selector popup, position and display it - this.folder_selector = function(obj, callback) + this.folder_selector = function(event, callback) { var container = this.folder_selector_element; if (!container) { var rows = [], delim = this.env.delimiter, - ul = $('<ul class="toolbarmenu iconized">'), - li = document.createElement('li'), - link = document.createElement('a'), - span = document.createElement('span'); + ul = $('<ul class="toolbarmenu">'), + link = document.createElement('a'); container = $('<div id="folder-selector" class="popupmenu"></div>'); link.href = '#'; @@ -6695,33 +6834,30 @@ // loop over sorted folders list $.each(this.env.mailboxes_list, function() { - var tmp, n = 0, s = 0, + var n = 0, s = 0, folder = ref.env.mailboxes[this], id = folder.id, - a = link.cloneNode(false), row = li.cloneNode(false); + a = $(link.cloneNode(false)), + row = $('<li>'); if (folder.virtual) - a.className += ' virtual'; - else { - a.className += ' active'; - a.onclick = function() { container.hide().data('callback')(folder.id); }; - } + a.addClass('virtual').attr('aria-disabled', 'true').attr('tabindex', '-1'); + else + a.addClass('active').data('id', folder.id); if (folder['class']) - a.className += ' ' + folder['class']; + a.addClass(folder['class']); // calculate/set indentation level while ((s = id.indexOf(delim, s)) >= 0) { n++; s++; } - a.style.paddingLeft = n ? (n * 16) + 'px' : 0; + a.css('padding-left', n ? (n * 16) + 'px' : 0); // add folder name element - tmp = span.cloneNode(false); - $(tmp).text(folder.name); - a.appendChild(tmp); + a.append($('<span>').text(folder.name)); - row.appendChild(a); + row.append(a); rows.push(row); }); @@ -6733,22 +6869,158 @@ // set max-height if the list is long if (rows.length > 10) - container.css('max-height', $('li', container)[0].offsetHeight * 10 + 9) + container.css('max-height', $('li', container)[0].offsetHeight * 10 + 9); + // register delegate event handler for folder item clicks + container.on('click', 'a.active', function(e){ + container.data('callback')($(this).data('id')); + return false; + }); +/* // hide selector on click out of selector element var fn = function(e) { if (e.target != container.get(0)) container.hide(); }; $(document.body).on('mouseup', fn); $('iframe').contents().on('mouseup', fn) .load(function(e) { try { $(this).contents().on('mouseup', fn); } catch(e) {}; }); - +*/ this.folder_selector_element = container; } - // position menu on the screen - this.element_position(container, obj); + container.data('callback', callback); - container.show().data('callback', callback); + // position menu on the screen + this.show_menu('folder-selector', true, event); }; + + + /***********************************************/ + /********* popup menu functions *********/ + /***********************************************/ + + // Show/hide a specific popup menu + this.show_menu = function(prop, show, event) + { + var name = typeof prop == 'object' ? prop.menu : prop, + obj = $('#'+name), + ref = event && event.target ? $(event.target) : $(obj.attr('rel') || '#'+name+'link'), + keyboard = rcube_event.is_keyboard(event), + align = obj.attr('data-align') || '', + stack = false; + + if (typeof prop == 'string') + prop = { menu:name }; + + // let plugins or skins provide the menu element + if (!obj.length) { + obj = this.triggerEvent('menu-get', { name:name, props:prop, originalEvent:event }); + } + + if (!obj || !obj.length) { + // just delegate the action to subscribers + return this.triggerEvent(show === false ? 'menu-close' : 'menu-open', { name:name, props:prop, originalEvent:event }); + } + + // move element to top for proper absolute positioning + obj.appendTo(document.body); + + if (typeof show == 'undefined') + show = obj.is(':visible') ? false : true; + + if (show && ref.length) { + var win = $(window), + pos = ref.offset(), + above = align.indexOf('bottom') >= 0; + + stack = ref.attr('role') == 'menuitem' || ref.closest('[role=menuitem]').length > 0; + + ref.offsetWidth = ref.outerWidth(); + ref.offsetHeight = ref.outerHeight(); + if (!above && pos.top + ref.offsetHeight + obj.height() > win.height()) { + above = true; + } + if (align.indexOf('right') >= 0) { + pos.left = pos.left + ref.outerWidth() - obj.width(); + } + else if (stack) { + pos.left = pos.left + ref.offsetWidth - 5; + pos.top -= ref.offsetHeight; + } + if (pos.left + obj.width() > win.width()) { + pos.left = win.width() - obj.width() - 12; + } + pos.top = Math.max(0, pos.top + (above ? -obj.height() : ref.offsetHeight)); + obj.css({ left:pos.left+'px', top:pos.top+'px' }); + } + + // add menu to stack + if (show) { + // truncate stack down to the one containing the ref link + for (var i = this.menu_stack.length - 1; stack && i >= 0; i--) { + if (!$(ref).parents('#'+this.menu_stack[i]).length) + this.hide_menu(this.menu_stack[i]); + } + if (stack && this.menu_stack.length) { + obj.data('parent', this.menu_stack.last()); + obj.css('z-index', ($('#'+this.menu_stack.last()).css('z-index') || 0) + 1); + } + else if (!stack && this.menu_stack.length) { + this.hide_menu(this.menu_stack[0], event); + } + + obj.show().attr('aria-hidden', 'false').data('opener', ref.attr('aria-expanded', 'true').get(0)); + this.triggerEvent('menu-open', { name:name, obj:obj, props:prop, originalEvent:event }); + this.menu_stack.push(name); + + this.menu_keyboard_active = show && keyboard; + if (this.menu_keyboard_active) { + this.focused_menu = name; + obj.find('a,input:not(:disabled)').not('[aria-disabled=true]').first().focus(); + } + } + else { // close menu + this.hide_menu(name, event); + } + + return show; + }; + + // hide the given popup menu (and it's childs) + this.hide_menu = function(name, event) + { + if (!this.menu_stack.length) { + // delegate to subscribers + this.triggerEvent('menu-close', { name:name, props:{ menu:name }, originalEvent:event }); + return; + } + + var obj, keyboard = rcube_event.is_keyboard(event); + for (var j=this.menu_stack.length-1; j >= 0; j--) { + obj = $('#' + this.menu_stack[j]).hide().attr('aria-hidden', 'true').data('parent', false); + this.triggerEvent('menu-close', { name:this.menu_stack[j], obj:obj, props:{ menu:this.menu_stack[j] }, originalEvent:event }); + if (this.menu_stack[j] == name) { + j = -1; // stop loop + if (obj.data('opener')) { + $(obj.data('opener')).attr('aria-expanded', 'false'); + if (keyboard) + obj.data('opener').focus(); + } + } + this.menu_stack.pop(); + } + + // focus previous menu in stack + if (this.menu_stack.length && keyboard) { + this.menu_keyboard_active = true; + this.focused_menu = this.menu_stack.last(); + if (!obj || !obj.data('opener')) + $('#'+this.focused_menu).find('a,input:not(:disabled)').not('[aria-disabled=true]').first().focus(); + } + else { + this.focused_menu = null; + this.menu_keyboard_active = false; + } + } + // position a menu element on the screen in relation to other object this.element_position = function(element, obj) @@ -6790,15 +7062,14 @@ this.html2plain = function(htmlText, id) { - var rcmail = this, - url = '?_task=utils&_action=html2text', + var url = '?_task=utils&_action=html2text', lock = this.set_busy(true, 'converting'); this.log('HTTP POST: ' + url); $.ajax({ type: 'POST', url: url, data: htmlText, contentType: 'application/octet-stream', - error: function(o, status, err) { rcmail.http_error(o, status, err, lock); }, - success: function(data) { rcmail.set_busy(false, null, lock); $('#'+id).val(data); rcmail.log(data); } + error: function(o, status, err) { ref.http_error(o, status, err, lock); }, + success: function(data) { ref.set_busy(false, null, lock); $('#'+id).val(data); ref.log(data); } }); }; @@ -6829,13 +7100,13 @@ if (action) query._action = action; - else + else if (this.env.action) query._action = this.env.action; var base = this.env.comm_path, k, param = {}; // overwrite task name - if (query._action.match(/([a-z0-9_-]+)\/([a-z0-9-_.]+)/)) { + if (action && action.match(/([a-z0-9_-]+)\/([a-z0-9-_.]+)/)) { query._action = RegExp.$2; base = base.replace(/\_task=[a-z0-9_-]+/, '_task='+RegExp.$1); } @@ -6846,7 +7117,7 @@ param[k] = query[k]; } - return base + '&' + $.param(param) + querystring; + return base + (base.indexOf('?') > -1 ? '&' : '?') + $.param(param) + querystring; }; this.redirect = function(url, lock) @@ -6889,6 +7160,13 @@ // reset keep-alive interval this.start_keepalive(); + }; + + // update browser location to remember current view + this.update_state = function(query) + { + if (window.history.replaceState) + window.history.replaceState({}, document.title, rcmail.url('', query)); }; // send a http request to the server @@ -7067,13 +7345,16 @@ this.env.qsearch = null; case 'list': if (this.task == 'mail') { + var is_multifolder = this.is_multifolder_listing(); this.enable_command('show', 'select-all', 'select-none', this.env.messagecount > 0); - this.enable_command('expunge', this.env.exists); - this.enable_command('purge', this.purge_mailbox_test()); - this.enable_command('expand-all', 'expand-unread', 'collapse-all', this.env.threading && this.env.messagecount); - this.enable_command('set-listmode', this.env.threads && !this.is_multifolder_listing()); + this.enable_command('expunge', this.env.exists && !is_multifolder); + this.enable_command('purge', this.purge_mailbox_test() && !is_multifolder); + this.enable_command('import-messages', !is_multifolder); + this.enable_command('expand-all', 'expand-unread', 'collapse-all', this.env.threading && this.env.messagecount && !is_multifolder); + 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 }); } @@ -7085,6 +7366,7 @@ this.enable_command('search-create', this.env.source == ''); this.enable_command('search-delete', this.env.search_id); this.update_group_commands(); + this.contact_list.focus(); this.triggerEvent('listupdate', { folder:this.env.source, rowcount:this.contact_list.rowcount }); } } @@ -7176,7 +7458,8 @@ */ this.multi_thread_http_request = function(prop) { - var reqid = new Date().getTime(); + var i, item, reqid = new Date().getTime(), + threads = prop.threads || 1; prop.reqid = reqid; prop.running = 0; @@ -7191,8 +7474,7 @@ this.http_request_jobs[reqid] = prop; // start n threads - var item, threads = prop.threads || 1; - for (var i=0; i < threads; i++) { + for (i=0; i < threads; i++) { item = prop._items.shift(); if (item === undefined) break; @@ -7500,7 +7782,7 @@ this.env.lastrefresh = new Date(); // plugins should bind to 'requestrefresh' event to add own params - this.http_request('refresh', params, lock); + this.http_post('refresh', params, lock); }; // returns check-recent request parameters @@ -7830,7 +8112,6 @@ // wrapper for localStorage.getItem(key) this.local_storage_get_item = function(key, deflt, encrypted) { - // TODO: add encryption var item = localStorage.getItem(this.get_local_storage_prefix() + key); return item !== null ? JSON.parse(item) : (deflt || null); @@ -7857,12 +8138,12 @@ { if (!elem.title) { var $elem = $(elem); - if ($elem.width() + indent * 15 > $elem.parent().width()) + if ($elem.width() + (indent || 0) * 15 > $elem.parent().width()) elem.title = $elem.text(); } }; -rcube_webmail.long_subject_title_ex = function(elem, indent) +rcube_webmail.long_subject_title_ex = function(elem) { if (!elem.title) { var $elem = $(elem), @@ -7874,7 +8155,7 @@ w = tmp.width(); tmp.remove(); - if (w + indent * 15 > $elem.width()) + if (w + $('span.branch', $elem).width() * 15 > $elem.width()) elem.title = txt; } }; -- Gitblit v1.9.1