Elastic: Files and sessions list functionality

This commit is contained in:
Aleksander Machniak 2018-04-20 12:48:05 +02:00
parent 460723895b
commit 185d4ab754
5 changed files with 97 additions and 103 deletions

View file

@ -793,7 +793,7 @@ function kolab_files_session_dialog(session)
owner = session.owner_name || session.owner, owner = session.owner_name || session.owner,
title = rcmail.gettext('kolab_files.sessiondialog'), title = rcmail.gettext('kolab_files.sessiondialog'),
content = rcmail.gettext('kolab_files.sessiondialogcontent'), content = rcmail.gettext('kolab_files.sessiondialogcontent'),
button_classes = ['mainaction'], button_classes = ['mainaction edit'],
join_session = function(id) { join_session = function(id) {
var viewer = file_api.file_type_supported('application/vnd.oasis.opendocument.text', rcmail.env.files_caps); var viewer = file_api.file_type_supported('application/vnd.oasis.opendocument.text', rcmail.env.files_caps);
params = {action: 'edit', session: id}; params = {action: 'edit', session: id};
@ -2122,6 +2122,8 @@ function kolab_files_ui()
if (rcmail.busy) if (rcmail.busy)
return; return;
rcmail.triggerEvent('files-folder-select', {folder: folder});
var is_collection = folder.match(/^folder-collection-(.*)$/), var is_collection = folder.match(/^folder-collection-(.*)$/),
collection = RegExp.$1 || null; collection = RegExp.$1 || null;

View file

@ -174,6 +174,7 @@ $labels['arialabelfileprops'] = 'File properties';
$labels['arialabelfilecontent'] = 'File content'; $labels['arialabelfilecontent'] = 'File content';
$labels['arialabelfileeditdialog'] = 'File editing dialog'; $labels['arialabelfileeditdialog'] = 'File editing dialog';
$labels['arialabelsessionslist'] = 'List of document editing sessions'; $labels['arialabelsessionslist'] = 'List of document editing sessions';
$labels['arialabelsessionslistoptions'] = 'Sessions list options';
$labels['arialabelfilerenameform'] = 'File rename form'; $labels['arialabelfilerenameform'] = 'File rename form';
$labels['arialabelfilesessiondialog'] = 'Document editing session'; $labels['arialabelfilesessiondialog'] = 'Document editing session';
$labels['arialabelcollaborators'] = 'List of document editors'; $labels['arialabelcollaborators'] = 'List of document editors';

View file

@ -76,6 +76,16 @@
optionsmenuIcon="true" aria-labelledby="aria-label-sessionslist" data-label-msg="listempty" /> optionsmenuIcon="true" aria-labelledby="aria-label-sessionslist" data-label-msg="listempty" />
</div> </div>
</div> </div>
<div class="footer toolbar" role="toolbar">
<div id="listcontrols" class="listselectors">
<roundcube:button id="fileslistmenu-link" name="fileslistmenu-link"
type="link" onclick="kolab_files_listoptions('files')"
label="options" class="button settings" innerClass="inner" />
<roundcube:button id="sessionslistmenu-link" name="sessionslistmenu-link"
type="link" onclick="kolab_files_listoptions('sessions')"
label="options" class="button hidden settings" innerClass="inner" />
</div>
</div>
</div> </div>
<form id="filesuploadform" class="smart-upload"></form> <form id="filesuploadform" class="smart-upload"></form>
@ -125,7 +135,8 @@
</ul> </ul>
</div> </div>
<div id="fileslistoptions-menu" class="propform popupmenu" data-editable="true" role="dialog" aria-labelledby="aria-label-fileslistoptions"> <roundcube:add_label name="kolab_files.arialabellistoptions" />
<div id="fileslistoptions" class="propform popupmenu" role="dialog" aria-labelledby="aria-label-fileslistoptions">
<h3 id="aria-label-fileslistoptions" class="voice"><roundcube:label name="kolab_files.arialabellistoptions" /></h3> <h3 id="aria-label-fileslistoptions" class="voice"><roundcube:label name="kolab_files.arialabellistoptions" /></h3>
<roundcube:if condition="!in_array('kolab_files_sort_col', (array)config:dont_override)" /> <roundcube:if condition="!in_array('kolab_files_sort_col', (array)config:dont_override)" />
<div class="form-group row"> <div class="form-group row">
@ -152,38 +163,31 @@
<roundcube:endif /> <roundcube:endif />
</div> </div>
<!-- <roundcube:add_label name="kolab_files.arialabelsessionslistoptions" />
<div id="sessionslistoptions" class="propform popupmenu" data-editable="true" role="dialog" aria-labelledby="aria-label-sessionslistoptions"> <div id="sessionslistoptions" class="propform popupmenu" role="dialog" aria-labelledby="aria-label-sessionslistoptions">
<h3 id="aria-label-sessionslistoptions" class="voice"><roundcube:label name="kolab_files.arialabellistoptions" /></h3> <h3 id="aria-label-sessionslistoptions" class="voice"><roundcube:label name="kolab_files.arialabelsessionslistoptions" /></h3>
<roundcube:if condition="!in_array('kolab_files_sessions_list_cols', (array)config:dont_override)" />
<fieldset class="floating">
<legend><roundcube:label name="listcolumns" /></legend>
<ul class="proplist">
<li><label class="disabled"><input type="checkbox" name="list_col[]" value="options" checked="checked" disabled="disabled" /> <span><roundcube:label name="options" /></span></label></li>
<li><label class="disabled"><input type="checkbox" name="list_col[]" value="name" checked="checked" disabled="disabled" /> <span><roundcube:label name="kolab_files.name" /></span></label></li>
<li><label><input type="checkbox" name="list_col[]" value="owner" /> <span><roundcube:label name="kolab_files.owner" /></span></label></li>
</ul>
</fieldset>
<roundcube:endif />
<roundcube:if condition="!in_array('kolab_files_sessions_sort_col', (array)config:dont_override)" /> <roundcube:if condition="!in_array('kolab_files_sessions_sort_col', (array)config:dont_override)" />
<fieldset class="floating"> <div class="form-group row">
<legend><roundcube:label name="listsorting" /></legend> <label for="listoptions-sortcol" class="col-form-label col-sm-4"><roundcube:label name="listsorting" /></label>
<ul class="proplist"> <div class="col-sm-8">
<li><label><input type="radio" name="sort_col" value="name" /> <span><roundcube:label name="kolab_files.name" /></span></label></li> <select name="sort_col" class="form-control">
</ul> <option value="name"><roundcube:label name="kolab_files.name" /></option>
</fieldset> </select>
</div>
</div>
<roundcube:endif /> <roundcube:endif />
<roundcube:if condition="!in_array('kolab_files_sessions_sort_order', (array)config:dont_override)" /> <roundcube:if condition="!in_array('kolab_files_sessions_sort_order', (array)config:dont_override)" />
<fieldset class="floating"> <div class="form-group row">
<legend><roundcube:label name="listorder" /></legend> <label for="listoptions-sortcol" class="col-form-label col-sm-4"><roundcube:label name="listorder" /></label>
<ul class="proplist"> <div class="col-sm-8">
<li><label><input type="radio" name="sort_ord" value="ASC" /> <span><roundcube:label name="asc" /></span></label></li> <select class="form-control">
<li><label><input type="radio" name="sort_ord" value="DESC" /> <span><roundcube:label name="desc" /></span></label></li> <option value="ASC"><roundcube:label name="asc" /></option>
</ul> <option value="DESC"><roundcube:label name="desc" /></option>
</fieldset> </select>
</div>
</div>
<roundcube:endif /> <roundcube:endif />
</div> </div>
-->
<div id="dragfilemenu" class="popupmenu"> <div id="dragfilemenu" class="popupmenu">
<ul class="toolbarmenu listing" role="menu"> <ul class="toolbarmenu listing" role="menu">

View file

@ -7,68 +7,36 @@ function kolab_files_enable_command(p)
} }
}; };
function kolab_files_show_listoptions(p) function kolab_files_listoptions(type)
{ {
if (!p || !p.name) { var content = $('#' + type + 'listoptions'),
return; width = content.width() + 25,
dialog = content.clone(),
title = rcmail.gettext('kolab_files.arialabel' + (type == 'sessions' ? 'sessions' : '') + 'listoptions'),
close_func = function() { rcmail[type + 'list'].focus(); },
save_func = function(e) {
if (rcube_event.is_keyboard(e.originalEvent)) {
$('#' + type + 'listmenu-link').focus();
} }
if (p.name.match(/^(files|sessions)listmenu$/)) { var col = $('select[name="sort_col"]', dialog).val(),
var type = RegExp.$1; ord = $('select[name="sort_ord"]', dialog).val();
}
else {
return;
}
var $dialog = $('#' + type + 'listoptions'); kolab_files_set_list_options([], col, ord, type);
close_func();
// close the dialog return true;
if ($dialog.is(':visible')) {
$dialog.dialog('close');
return;
}
// set form values
$('input[name="sort_col"][value="'+rcmail.env[type + '_sort_col']+'"]', $dialog).prop('checked', true);
$('input[name="sort_ord"][value="DESC"]', $dialog).prop('checked', rcmail.env[type + '_sort_order'] == 'DESC');
$('input[name="sort_ord"][value="ASC"]', $dialog).prop('checked', rcmail.env[type + '_sort_order'] != 'DESC');
// set checkboxes
$('input[name="list_col[]"]').each(function() {
$(this).prop('checked', $.inArray(this.value, rcmail.env[type + '_coltypes']) != -1);
});
$dialog.dialog({
modal: true,
resizable: false,
closeOnEscape: true,
close: function() { rcmail[type + 'list'].focus(); },
title: null,
minWidth: 400,
width: $dialog.width()+20
}).show();
}; };
function kolab_files_save_listoptions(p) // set form values
{ $('select[name="sort_col"]', dialog).val(rcmail.env[type + '_sort_col'] || 'name');
if (!p || !p.originalEvent) { $('select[name="sort_ord"]', dialog).val(rcmail.env[type + '_sort_order'] == 'DESC' ? 'DESC' : 'ASC');
return;
}
if (p.originalEvent.target.id.match(/^(files|sessions)listmenusave$/)) { dialog = rcmail.simple_dialog(dialog, title, save_func, {
var type = RegExp.$1; cancel_func: close_func,
} closeOnEscape: true,
else { minWidth: 400,
return; width: width
} });
var dialog = $('#' + type + 'listoptions').dialog('close');
var sort = $('input[name="sort_col"]:checked', dialog).val(),
ord = $('input[name="sort_ord"]:checked', dialog).val(),
cols = $('input[name="list_col[]"]:checked', dialog)
.map(function() { return this.value; }).get();
kolab_files_set_list_options(cols, sort, ord, type);
}; };
@ -88,11 +56,18 @@ if (rcmail.env.action == 'open' || rcmail.env.action == 'edit') {
}); });
} }
} }
else {
rcmail.addEventListener('files-folder-select', function(p) {
var is_sess = p.folder == 'folder-collection-sessions';
$('#fileslistmenu-link, #layout > .content > .header > a.toggleselect, #layout > .content > .header > .searchbar')[is_sess ? 'hide' : 'show']();
$('#sessionslistmenu-link')[is_sess ? 'removeClass' : 'addClass']('hidden');
// set list header title for mobile
// $('#layout > .content > .header > .header-title').text($('#files-folder-list li.selected a.name:first').text());
});
}
$(document).ready(function() { $(document).ready(function() {
rcmail.addEventListener('menu-open', kolab_files_show_listoptions);
rcmail.addEventListener('menu-save', kolab_files_save_listoptions);
rcmail.addEventListener('menu-close', kolab_files_show_listoptions);
$('#toolbar-menu a.button.save').parent().hide(); $('#toolbar-menu a.button.save').parent().hide();

View file

@ -121,11 +121,11 @@ a.button.saveas:before {
} }
td.name { td.name {
position: relative;
} }
td.mtime { td.mtime {
width: 10em; width: 11em;
} }
td.size { td.size {
@ -133,13 +133,25 @@ a.button.saveas:before {
width: 6em; width: 6em;
} }
tbody tr.session > td.options span { tr.session > td.name {
padding-right: 2em;
&:after {
&:extend(.font-icon-class);
content: @fa-var-users;
color: @color-black-shade-border;
position: absolute;
right: .25em;
top: 0;
}
} }
tbody tr.session.invited > td.options span { tr.session.invited > td.name:after {
color: @color-success;
} }
tbody tr.session.owner > td.options span { tr.session.owner > td.name:after {
color: @color-black;
} }
} }