make consistent options menu in mail and addressbook

dev_contacts
PhilW 6 years ago
parent f438bba101
commit ccb029c997

@ -2,7 +2,7 @@
/* Author: Philip Weir */
$labels = array();
$labels['swipeactions'] = 'Swipe actions';
$labels['swipeoptions'] = 'Swipe options';
$labels['swipeleft'] = 'Swipe left';
$labels['swiperight'] = 'Swipe right';
$labels['swipedown'] = 'Swipe down';

@ -2,7 +2,7 @@
/* Author: Philip Weir */
$labels = array();
$labels['swipeactions'] = 'Swipe actions';
$labels['swipeoptions'] = 'Swipe options';
$labels['swipeleft'] = 'Swipe left';
$labels['swiperight'] = 'Swipe right';
$labels['swipedown'] = 'Swipe down';

@ -1,5 +1,5 @@
<fieldset class="swipe-menu">
<legend><roundcube:label name="swipe.swipeactions" /></legend>
<div id="swipeoptionsmenu" class="popupmenu propform" role="dialog" aria-labelledby="aria-label-listoptions">
<h3 id="aria-label-listoptions" class="voice"><roundcube:label name="swipe.swipeoptions" /></h3>
<div class="form-group row swipeoptions-left">
<label for="swipeoptions-left" class="col-form-label col-sm-4"><roundcube:label name="swipe.swipeleft" /></label>
<div class="col-sm-8">
@ -18,4 +18,4 @@
<roundcube:object name="swipeoptionslist" type="select" direction="down" />
</div>
</div>
</fieldset>
</div>

@ -5,35 +5,6 @@
@import (reference) "../../../../skins/elastic/styles/variables";
@import (reference) "../../../../skins/elastic/styles/mixins";
#listoptions-menu {
overflow-y: auto;
margin: -0.5em -1em;
padding: .75em 1.25em;
&::-webkit-scrollbar {
-webkit-appearance: none;
}
&::-webkit-scrollbar:vertical {
width: .6rem;
}
&::-webkit-scrollbar:horizontal {
height: .6rem;
}
&::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, .4);
border-radius: .3rem;
border: 2px solid #fff;
}
> fieldset.swipe-menu {
display: none;
margin-top: 1.5rem;
}
}
#swipe-action {
position: absolute;
display: flex;
@ -212,25 +183,17 @@
display: none;
}
html.layout-small,
html.layout-phone {
html.layout-small.touch,
html.layout-phone.touch {
.toolbar {
a.button {
&.swipe {
display: inline-block;
&:before {
content: @fa-var-hand-point-up;
content: @fa-var-hand-pointer;
}
}
}
}
}
fieldset.swipe-menu {
margin: .25em;
legend {
display: none;
}
}

@ -316,19 +316,26 @@ rcube_webmail.prototype.swipe = {
});
},
setup_options: function() {
$.each(rcmail.env.swipe_actions, function(direction, action) {
var option_input = $('.swipeoptions-' + direction).find('select,input');
if (option_input.is('input[type="radio"]')) {
option_input.filter('[value="' + action + '"]').prop('checked', true);
save_options: function(dialog) {
var post = {};
$.each(['left', 'right', 'down'], function() {
var option_input = $('.swipeoptions-' + this, dialog).find('select,input').first();
if ($(option_input).is('input[type="radio"]')) {
selector = 'input[name="swipe_' + this + '"]:checked';
}
else if (option_input.is('select') && option_input.first().children('option').length > 0) {
option_input.val(action);
else if ($(option_input).is('select')) {
selector = 'select[name="swipe_' + this + '"]';
}
else {
$('.swipeoptions-' + direction).hide();
if ($(selector, dialog).val() != rcmail.env.swipe_actions[this]) {
rcmail.env.swipe_actions[this] = $(selector, dialog).val();
post['swipe_' + this] = rcmail.env.swipe_actions[this];
}
});
if (!$.isEmptyObject(post))
rcmail.http_post('plugin.swipe.save_settings', post);
}
};
@ -349,6 +356,27 @@ $(document).ready(function() {
rcmail.swipe.parent = list_container;
rcmail.swipe.parent.prepend(swipe_action.hide());
rcmail.register_command('plugin.swipe.options', function() {
var dialog = $('#swipeoptionsmenu').clone(true);
$.each(rcmail.env.swipe_actions, function(direction, action) {
var option_input = $('.swipeoptions-' + direction, dialog).find('select,input');
if (option_input.is('input[type="radio"]')) {
option_input.filter('[value="' + action + '"]').prop('checked', true);
}
else if (option_input.is('select') && option_input.first().children('option').length > 0) {
option_input.val(action);
}
else {
$('.swipeoptions-' + direction, dialog).hide();
}
});
rcmail.show_popup_dialog(dialog, rcmail.get_label('swipeoptions', 'swipe'), [
{ text: rcmail.get_label('save'), 'class': 'mainaction save', click: function(e, ui, dialog) { rcmail.swipe.save_options(this); (rcmail.is_framed() ? parent.$ : $)(dialog || this).dialog('close'); } },
{ text: rcmail.get_label('cancel'), 'class': 'cancel', click: function(e, ui, dialog) { (rcmail.is_framed() ? parent.$ : $)(dialog || this).dialog('close'); } }
]);
}, !rcmail.env.swipe_list.draggable);
// down swipe on list container
var swipe_config = {
'source_obj': rcmail.swipe.parent,
@ -393,14 +421,6 @@ $(document).ready(function() {
return false;
}
});
rcmail.register_command('plugin.swipe.options', function() {
rcmail.show_popup_dialog($('#swipeoptions').clone(), rcmail.get_label('swipeactions', 'swipe'), [
{ text: rcmail.get_label('save'), 'class': 'mainaction save', click: function(e, ui, dialog) { rcmail.set_list_options(); (rcmail.is_framed() ? parent.$ : $)(dialog || this).dialog('close'); } },
{ text: rcmail.get_label('cancel'), 'class': 'cancel', click: function(e, ui, dialog) { (rcmail.is_framed() ? parent.$ : $)(dialog || this).dialog('close'); } }
]);
rcmail.swipe.setup_options();
}, true);
}
});
@ -435,56 +455,5 @@ $(document).ready(function() {
rcmail.swipe.init(swipe_config);
});
// save swipe options
rcmail.set_list_options_core = rcmail.set_list_options;
rcmail.set_list_options = function(cols, sort_col, sort_order, threads, layout) {
var post = {};
$.each(['left', 'right', 'down'], function() {
var option_input = $('.swipeoptions-' + this).find('select,input').first();
if ($(option_input).is('input[type="radio"]')) {
selector = 'input[name="swipe_' + this + '"]:checked';
}
else if ($(option_input).is('select')) {
selector = 'select[name="swipe_' + this + '"]';
selector += $(selector).length > 1 ? ':visible' : '';
}
if ($(selector).val() != rcmail.env.swipe_actions[this]) {
rcmail.env.swipe_actions[this] = $(selector).val();
post['swipe_' + this] = rcmail.env.swipe_actions[this];
}
});
if (!$.isEmptyObject(post))
rcmail.http_post('plugin.swipe.save_settings', post);
rcmail.set_list_options_core(cols, sort_col, sort_order, threads, layout);
};
}
// show swipe options in the list options menu
rcmail.addEventListener('beforemenu-open', function(name) {
if (name == rcmail.env.swipe_menuname) {
var menu_obj = $('.swipe-menu');
if (!rcmail.env.swipe_list.draggable && menu_obj.find('select > option,input').length > 0) {
if (bw.edge)
menu_obj.find('.swipeoptions-down').hide();
menu_obj.show();
}
else {
menu_obj.hide();
}
}
});
// set the values swipe options menu
// done in menu-open not beforemenu-open because of Elastic's Bootstrap popovers
rcmail.addEventListener('menu-open', function(p) {
if (p.name == rcmail.env.swipe_menuname && $('.swipe-menu').is(':visible')) {
rcmail.swipe.setup_options();
}
});
});

@ -86,43 +86,32 @@ class swipe extends rcube_plugin
$this->include_stylesheet($this->local_skin_path() . '/swipe.css');
$this->include_script('swipe.js');
$this->rcube->output->add_label('swipe.swipeactions', 'swipe.markasflagged', 'swipe.markasunflagged', 'swipe.markasread',
$this->rcube->output->add_label('swipe.swipeoptions', 'swipe.markasflagged', 'swipe.markasunflagged', 'swipe.markasread',
'swipe.markasunread', 'refresh', 'moveto', 'reply', 'replyall', 'forward', 'select', 'swipe.deselect', 'compose');
$this->rcube->output->add_handler('swipeoptionslist', array($this, 'options_list'));
if ($this->rcube->task == 'mail') {
$this->add_hook('template_container', array($this, 'options_menu'));
}
elseif ($this->rcube->task == 'addressbook') {
$this->add_button(array(
'command' => 'plugin.swipe.options',
'type' => 'link',
'class' => 'button swipe',
'title' => 'swipe.swipeactions',
'innerclass' => 'inner',
'label' => 'swipe.swipeactions'
), 'toolbar');
$this->add_hook('render_page', array($this, 'options_menu'));
}
$this->options_menu();
}
}
}
public function options_menu($args)
public function options_menu()
{
if ($args['name'] == 'listoptions' || ($this->rcube->task == 'addressbook' && $args['write'])) {
// add additional menus from skins folder to list options menu
if ($this->_allowed_action('*')) {
// add swipe actions link to the menu
$this->add_button(array(
'command' => 'plugin.swipe.options',
'type' => 'link',
'class' => 'button swipe disabled',
'classact' => 'button swipe',
'title' => 'swipe.swipeoptions',
'innerclass' => 'inner',
'label' => 'swipe.swipeoptions'
), 'toolbar'); // Using 'listcontrols' would be better but container does not exist in addressbook template
// add swipe actions popup menu
$html = $this->rcube->output->just_parse("<roundcube:include file=\"$this->menu_file\" skinpath=\"plugins/swipe\" />");
if ($this->rcube->task == 'addressbook') {
$html = html::div(array('id' => 'swipeoptions', 'class' => 'popupmenu'), $html);
$args['content'] = str_replace('</body>', $html . '</body>', $args['content']);
}
else {
$args['content'] .= $html;
}
return $args;
$this->rcube->output->add_footer($html);
}
}

Loading…
Cancel
Save