Mirrors/roundcubemail
2
0
Fork 0
mirror of https://github.com/roundcube/roundcubemail.git synced 2026-03-12 11:06:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

Moved popup-menu functions to Roundcube core for seamless integration of (stackable) skin and core menus

Browse Source
This commit is contained in:
Thomas Bruederli
2014-05-08 18:19:20 +02:00
parent ea0866a1ad
commit 6789bf1f4d
7 changed files with 331 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
plugins/zipdownload/zipdownload.js
View File

@@ -43,21 +43,10 @@ window.rcmail && rcmail.addEventListener('init', function(evt) {
link.html('').append(span);
}
span.addClass('folder-selector-link').text(rcmail.gettext('zipdownload.download'));
span.text(rcmail.gettext('zipdownload.download'));
rcmail.env.download_link = link;
});
// hide menu on click out of menu element
var fn = function(e) {
var menu = $('#zipdownload-menu');
if (e.target != menu.get(0))
menu.hide();
};
$(document.body).on('mouseup', fn);
$('iframe').contents().on('mouseup', fn)
.load(function(e) { try { $(this).contents().on('mouseup', fn); } catch(e) {}; });
});
});
function rcmail_zipdownload(mode)
@@ -100,14 +89,10 @@ function rcmail_zipdownload(mode)
}
// display download options menu
function rcmail_zipdownload_menu()
function rcmail_zipdownload_menu(e)
{
// fix menu style and display menu
var z_index = rcmail.env.download_link.parents('.popupmenu').css('z-index'),
menu = $('#zipdownload-menu').css({'max-height': 'none', 'z-index': z_index + 1}).show();
// position menu on the screen
rcmail.element_position(menu, rcmail.env.download_link);
// show (sub)menu for download selection
rcmail.command('menu-open', 'zipdownload-menu', e && e.target ? e.target : rcmail.env.download_link, e);
// abort default download action
return false;

293
program/js/app.js
View File

@@ -46,6 +46,7 @@ function rcube_webmail()
this.messages = {};
this.group2expand = {};
this.http_request_jobs = {};
this.menu_stack = new Array();
// webmail client settings
this.dblclick_time = 500;
@@ -235,7 +236,6 @@ function rcube_webmail()
return ref.command('sort', $(this).attr('rel'), this);
});
document.onmouseup = function(e){ return ref.doc_mouse_up(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);
@@ -279,7 +279,7 @@ function rcube_webmail()
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')
@@ -314,8 +314,6 @@ function rcube_webmail()
}
}
document.onmouseup = function(e){ return ref.doc_mouse_up(e); };
// init message compose form
this.init_messageform();
}
@@ -395,7 +393,6 @@ function rcube_webmail()
this.contact_list.highlight_row(this.env.cid);
this.gui_objects.contactslist.parentNode.onmousedown = function(e){ return ref.click_on_list(e); };
document.onmouseup = function(e){ return ref.doc_mouse_up(e); };
$(this.gui_objects.qsearchbox).focusin(function() { ref.contact_list.blur(); });
@@ -561,6 +558,18 @@ function rcube_webmail()
.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 });
@@ -636,8 +645,8 @@ function rcube_webmail()
}
// 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)
@@ -712,9 +721,14 @@ function rcube_webmail()
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':
case 'menu-close':
this.triggerEvent(command, {props:props, originalEvent:event});
return false;
@@ -900,14 +914,14 @@ function rcube_webmail()
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;
@@ -1469,7 +1483,8 @@ function rcube_webmail()
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;
}
@@ -1585,12 +1600,13 @@ function rcube_webmail()
}
};
// 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;
@@ -1604,8 +1620,74 @@ function rcube_webmail()
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)
{
if (this.gui_objects.qsearchbox)
@@ -2707,12 +2789,12 @@ function rcube_webmail()
};
// 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)
@@ -2729,12 +2811,12 @@ function rcube_webmail()
};
// 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()))
@@ -3938,7 +4020,7 @@ function rcube_webmail()
// 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, '');
@@ -6736,17 +6818,15 @@ function rcube_webmail()
};
// 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 = '#';
@@ -6754,33 +6834,30 @@ function rcube_webmail()
// 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);
});
@@ -6792,23 +6869,157 @@ function rcube_webmail()
// 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.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 (keyboard && obj.data('opener')) {
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)
{

6
program/js/common.js
View File

@@ -297,7 +297,6 @@ is_keyboard: function(e)
*/
keyboard_only: function(e)
{
console.log(e);
return rcube_event.is_keyboard(e) ? true : rcube_event.cancel(e);
},
@@ -607,6 +606,11 @@ if (!String.prototype.startsWith) {
};
}
// array utility function
Array.prototype.last = function() {
return this[this.length-1];
}
// jQuery plugin to emulate HTML5 placeholder attributes on input elements
jQuery.fn.placeholder = function(text) {
return this.each(function() {

4
skins/larry/includes/mailtoolbar.html
View File

@@ -20,7 +20,7 @@
<div id="forwardmenu" class="popupmenu" aria-hidden="true">
<h3 id="aria-label-forwardmenu" class="voice">Forwarding options</h3>
<ul class="toolbarmenu" role="menu" aria-labelledby="aria-label-forwardmenu">
<ul id="forwardmenu-menu" class="toolbarmenu" role="menu" aria-labelledby="aria-label-forwardmenu">
<li role="menuitem"><roundcube:button command="forward-inline" label="forwardinline" prop="sub" classAct="forwardlink active" class="forwardlink" /></li>
<li role="menuitem"><roundcube:button command="forward-attachment" label="forwardattachment" prop="sub" classAct="forwardattachmentlink active" class="forwardattachmentlink" /></li>
<roundcube:container name="forwardmenu" id="forwardmenu" />
@@ -29,7 +29,7 @@
<div id="replyallmenu" class="popupmenu" aria-hidden="true">
<h3 id="aria-label-replyallmenu" class="voice">Reply-all options</h3>
<ul class="toolbarmenu" role="menu" aria-labelledby="aria-label-replyallmenu">
<ul id="replyallmenu-menu" class="toolbarmenu" role="menu" aria-labelledby="aria-label-replyallmenu">
<li role="menuitem"><roundcube:button command="reply-all" label="replyall" prop="sub" class="replyalllink" classAct="replyalllink active" /></li>
<li role="menuitem"><roundcube:button command="reply-list" label="replylist" prop="sub" class="replylistlink" classAct="replylistlink active" /></li>
<roundcube:container name="replyallmenu" id="replyallmenu" />

5
skins/larry/templates/compose.html
View File

@@ -27,7 +27,7 @@
<roundcube:if condition="config:enable_spellcheck" />
<span class="dropbutton">
<roundcube:button command="spellcheck" type="link" class="button spellcheck disabled" classAct="button spellcheck" classSel="button spellcheck pressed" label="spellcheck" title="checkspelling" tabindex="2" />
<a href="#languages" class="dropbuttontip" id="spellmenulink" onclick="UI.toggle_popup('spellmenu',event);return false" aria-haspopup="true" tabindex="2"></a>
<a href="#languages" class="dropbuttontip" id="spellmenulink" onclick="UI.toggle_popup('spellmenu',event);return false" aria-haspopup="true" tabindex="2">Select Spell Language</a>
</span>
<roundcube:endif />
<roundcube:button name="addattachment" type="link" class="button attach" label="attach" title="addattachment" onclick="UI.show_uploadform(event);return false" aria-haspopup="true" tabindex="2" />
@@ -77,7 +77,7 @@
<div id="composeheaders" role="region" aria-labelledby="aria-label-composeheaders">
<h2 id="aria-label-composeheaders" class="voice">Message headers</h2>
<a href="#options" id="composeoptionstoggle" class="moreheaderstoggle"><span class="iconlink" title="<roundcube:label name='options' />"></span></a>
<a href="#options" id="composeoptionstoggle" class="moreheaderstoggle" title="<roundcube:label name='options' />"><span class="iconlink"></span></a>
<table class="headers-table compose-headers">
<tbody>
@@ -167,6 +167,7 @@
<!-- message compose body -->
<div id="composeview-bottom">
<div id="composebodycontainer">
<label for="composebody" class="voice">Message Body</label>
<roundcube:object name="composeBody" id="composebody" form="form" cols="70" rows="20" tabindex="1" />
</div>
<div id="compose-attachments" class="rightcol" role="region">

6
skins/larry/templates/mail.html
View File

@@ -39,10 +39,10 @@
<h2 id="aria-label-searchform" class="voice">Email message search form</h2>
<label for="quicksearchbox" class="voice">Email search input</label>
<roundcube:object name="searchform" id="quicksearchbox" />
<roundcube:button name="searchmenulink" id="searchmenulink" class="iconbutton searchoptions" onclick="UI.toggle_popup('searchmenu',event);return false" title="searchmod" label="options" aria-haspopup="true" aria-owns="searchmenu-menu" />
<roundcube:button command="menu-open" prop="searchmenu" id="searchmenulink" class="iconbutton searchoptions" title="searchmod" label="options" aria-haspopup="true" aria-owns="searchmenu-menu" />
<roundcube:button command="reset-search" id="searchreset" class="iconbutton reset" title="resetsearch" content="Reset" />
<div id="searchmenu" class="popupmenu">
<div id="searchmenu" class="popupmenu" data-editable="true">
<h3 id="aria-label-searchmenu" class="voice"><roundcube:label name="searchmod" /></h3>
<ul class="toolbarmenu" id="searchmenu-menu" role="menu" aria-labelledby="aria-label-searchmenu">
<li role="menuitem"><label><input type="checkbox" name="s_mods[]" value="subject" id="s_mod_subject" onclick="UI.set_searchmod(this)" /> <span><roundcube:label name="subject" /></span></label></li>
@@ -237,7 +237,7 @@
<br style="clear:both" />
<div class="formbuttons">
<roundcube:button command="menu-save" id="listmenusave" type="input" class="button mainaction" label="save" />
<roundcube:button command="menu-close" id="listmenucancel" type="input" class="button" label="cancel" />
<roundcube:button command="menu-close" prop="messagelistmenu" id="listmenucancel" type="input" class="button" label="cancel" />
</div>
</div>

247
skins/larry/ui.js
View File

@@ -20,21 +20,16 @@ function rcube_mail_ui()
searchmenu: { editable:1, callback:searchmenu },
attachmentmenu: { },
listoptions: { editable:1 },
dragmenu: { sticky:1 },
groupmenu: { above:1 },
mailboxmenu: { above:1 },
spellmenu: { callback: spellmenu },
// toggle: #1486823, #1486930
'attachment-form': { editable:1, above:1, toggle:!bw.ie&&!bw.linux },
'upload-form': { editable:1, toggle:!bw.ie&&!bw.linux }
'folder-selector': { iconized:1 }
};
var me = this;
var mailviewsplit;
var compose_headers = {};
var prefs;
var focused_popup;
var popup_keyboard_active = false;
// export public methods
this.set = setenv;
@@ -358,55 +353,11 @@ function rcube_mail_ui()
screen.css('min-width', $('.toolbar').width() + $('#quicksearchbar').width() + $('#searchfilter').width() + 30);
}
$(document.body)
.bind('mouseup', body_mouseup)
.bind('keydown', popup_keypress);
$('iframe').load(function(e){
// this = iframe
try {
var doc = this.contentDocument ? this.contentDocument : this.contentWindow ? this.contentWindow.document : null;
$(doc).mouseup(body_mouseup);
}
catch (e) {
// catch possible "Permission denied" error in IE
};
})
.contents().mouseup(body_mouseup);
// don't use $(window).resize() due to some unwanted side-effects
window.onresize = resize;
resize();
}
/**
* Handler for mouse-up events on the document body.
* This will close all open popup menus
*/
function body_mouseup(e)
{
var config, obj, target = e.target;
if (target.className == 'inner')
target = e.target.parentNode;
for (var id in popups) {
obj = popups[id];
config = popupconfig[id];
if (obj.is(':visible')
&& target.id != id+'link'
&& target != obj.get(0) // check if scroll bar was clicked (#1489832)
&& !config.toggle
&& (!config.editable || !target_overlaps(target, obj.get(0)))
&& (!config.sticky || !rcube_mouse_is_over(e, obj.get(0)))
&& !$(target).is('.folder-selector-link')
) {
var myid = id+'';
window.setTimeout(function() { show_popupmenu(myid, false); }, 10);
}
}
}
/**
* Update UI on window resize
*/
@@ -600,145 +551,33 @@ function rcube_mail_ui()
*/
function toggle_popup(popup, e, config)
{
show_popup(popup, undefined, config, rcube_event.is_keyboard(e));
// auto-register menu object
if (config || !popupconfig[popup])
add_popup(popup, config);
return rcmail.command('menu-open', popup, e.target, e);
}
/**
* (Deprecated) trigger for popup menus
*/
function show_popup(popup, show, config, keyboard)
function show_popup(popup, show, config)
{
// auto-register menu object
if (config || !popupconfig[popup])
add_popup(popup, config);
var visible = show_popupmenu(popup, show, keyboard),
config = popupconfig[popup];
if (typeof config.callback == 'function')
config.callback(visible);
}
/**
* Show/hide a specific popup menu
*/
function show_popupmenu(popup, show, keyboard)
{
var obj = popups[popup],
config = popupconfig[popup],
ref = $(config.link ? config.link : '#'+popup+'link'),
above = config.above;
if (!obj) {
obj = popups[popup] = $('#'+popup);
obj.appendTo(document.body); // move them to top for proper absolute positioning
}
if (!obj || !obj.length)
return false;
if (typeof show == 'undefined')
show = obj.is(':visible') ? false : true;
else if (config.toggle && show && obj.is(':visible'))
show = false;
if (show && ref.length) {
var parent = ref.parent(),
win = $(window),
pos;
if (parent.hasClass('dropbutton'))
ref = parent;
config = popupconfig[popup] || {};
var ref = $(config.link ? config.link : '#'+popup+'link'),
pos = ref.offset();
ref.offsetHeight = ref.outerHeight();
if (!above && pos.top + ref.offsetHeight + obj.height() > win.height())
above = true;
if (pos.left + obj.width() > win.width())
pos.left = win.width() - obj.width() - 12;
if (ref.has('.inner'))
ref = ref.children('.inner');
obj.css({ left:pos.left, top:(pos.top + (above ? -obj.height() : ref.offsetHeight)) });
}
else if (!show && keyboard && ref.length) {
ref.focus();
}
obj[show?'show':'hide']().attr('aria-hidden', show?'false':'true');
popup_keyboard_active = show && keyboard;
if (popup_keyboard_active) {
focused_popup = popup;
obj.find('a,input:not(:disabled)').not('[aria-disabled=true]').first().focus();
}
else {
focused_popup = null;
}
return show;
}
/**
* Handler for keyboard events on active popups
*/
function popup_keypress(e)
{
var target = e.target || {},
keyCode = rcube_event.get_keycode(e);
if (e.keyCode != 27 && (!popup_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
popup_focus_item(mod = keyCode == 38 || keyCode == 63232 ? -1 : 1);
break;
case 9: // tab
if (focused_popup) {
var mod = rcube_event.get_modifier(e);
if (!popup_focus_item(mod == SHIFT_KEY ? -1 : 1)) {
show_popup(focused_popup, false, undefined, true);
}
}
return rcube_event.cancel(e);
case 27: // esc
for (var id in popups) {
if (popups[id].is(':visible'))
show_popup(id, false, undefined, true);
}
break;
}
return true;
}
/**
* Helper method to move focus to the next/prev popup menu item
*/
function popup_focus_item(dir)
{
var obj, mod = dir < 0 ? 'prevAll' : 'nextAll', limit = dir < 0 ? 'last' : 'first';
if (focused_popup && (obj = popups[focused_popup])) {
return obj.find(':focus').closest('li')[mod](':has(:not([aria-disabled=true]))').find('a,input')[limit]().focus().length;
}
return 0;
}
/**
*
*/
function target_overlaps(target, elem)
{
while (target.parentNode) {
if (target.parentNode == elem)
return true;
target = target.parentNode;
}
return false;
// fire command with simulated mouse click event
return rcmail.command('menu-open',
{ menu:popup, show:show },
ref.get(0),
$.Event('click', { target:ref.get(0), pageX:pos.left, pageY:pos.top, clientX:pos.left, clientY:pos.top }));
}
@@ -824,14 +663,51 @@ function rcube_mail_ui()
}
/**** popup callbacks ****/
/**** popup menu callbacks ****/
/**
* Handler for menu-open and menu-close events
*/
function menu_toggle(p)
{
if (p && p.props && p.props.menu == 'attachmentmenu')
show_popupmenu('attachmentmenu', undefined, rcube_event.is_keyboard(p.originalEvent));
else
if (p && p.name == 'messagelistmenu') {
show_listoptions(p);
}
else if (p) {
// adjust menu position according to config
var config = popupconfig[p.name] || {},
ref = $(config.link || '#'+p.name+'link'),
visible = p.obj && p.obj.is(':visible'),
above = config.above;
// fix position according to config
if (p.obj && visible && ref.length) {
var parent = ref.parent(),
win = $(window), pos;
if (parent.hasClass('dropbutton'))
ref = parent;
if (config.above || ref.hasClass('dropbutton')) {
pos = ref.offset();
p.obj.css({ left:pos.left+'px', top:(pos.top + (config.above ? -p.obj.height() : ref.outerHeight()))+'px' });
}
}
// add the right classes
if (p.obj && config.iconized) {
p.obj.children('ul').addClass('iconized');
}
// apply some data-attributes from menu config
if (p.obj && config.editable)
p.obj.attr('data-editable', 'true');
// trigger callback function
if (typeof config.callback == 'function') {
config.callback(visible, p);
}
}
}
function searchmenu(show)
@@ -884,12 +760,11 @@ function rcube_mail_ui()
rcmail.command('menu-open', {menu: 'attachmentmenu', id: id}, elem, event);
}
function spellmenu(show)
function spellmenu(show, p)
{
var k, link, li,
lang = rcmail.spellcheck_lang(),
menu = popups.spellmenu,
ul = $('ul', menu);
ul = $('ul', p.obj);
if (!ul.length) {
ul = $('<ul class="toolbarmenu selectable" role="menu">');
@@ -901,7 +776,7 @@ function rcube_mail_ui()
.bind('click keypress', function(e) {
if (e.type != 'keypress' || rcube_event.get_keycode(e) == 13) {
rcmail.spellcheck_lang_set($(this).data('lang'));
show_popupmenu('spellmenu', false, rcube_event.is_keyboard(e))
rcmail.hide_menu('spellmenu', e);
return false;
}
});
@@ -910,7 +785,7 @@ function rcube_mail_ui()
li.appendTo(ul);
}
ul.appendTo(menu);
ul.appendTo(p.obj);
}
// select current language