Added file creation dialog

This commit is contained in:
Aleksander Machniak 2015-10-15 11:14:06 +02:00
parent 13b717c5c5
commit 8706209a72
5 changed files with 159 additions and 27 deletions

View file

@ -352,25 +352,14 @@ function kolab_files_folder_create_dialog()
$('form', dialog).submit(kolab_dialog_submit_handler);
// build parent selector
select.append($('<option>').val('').text('---'));
$.each(file_api.env.folders, function(i, f) {
var n, option = $('<option>'), name = escapeHTML(f.name);
for (n=0; n<f.depth; n++)
name = '&nbsp;&nbsp;&nbsp;' + name;
option.val(i).html(name).appendTo(select);
if (i == file_api.env.folder)
option.attr('selected', true);
});
kolab_files_folder_select_element(select, {empty: true});
};
// folder edit dialog
function kolab_files_folder_edit_dialog()
{
var dialog = $('#files-folder-edit-dialog'),
buttons = {}, options = [],
buttons = {},
separator = file_api.env.directory_separator,
arr = file_api.env.folder.split(separator),
folder = arr.pop(),
@ -408,17 +397,7 @@ function kolab_files_folder_edit_dialog()
$('form', dialog).submit(kolab_dialog_submit_handler);
// build parent selector
options.push($('<option>').val('').text('---'));
$.each(file_api.env.folders, function(i, f) {
var n, name = escapeHTML(f.name);
for (n=0; n<f.depth; n++)
name = '&nbsp;&nbsp;&nbsp;' + name;
options.push($('<option>').val(i).html(name));
});
select.append(options).val(path);
kolab_files_folder_select_element(select, {selected: path, empty: true});
};
// folder mounting dialog
@ -517,6 +496,72 @@ function kolab_files_file_edit_dialog(file)
});
};
// file creation dialog
function kolab_files_file_create_dialog()
{
var dialog = $('#files-file-create-dialog'),
buttons = {},
type_select = $('select[name="type"]', dialog),
select = $('select[name="parent"]', dialog).html(''),
input = $('input[name="name"]', dialog).val('');
buttons[rcmail.gettext('kolab_files.create')] = function () {
var folder = select.val(), type = type_select.val(), name = input.val();
if (!name || !folder)
return;
if (!/\.[a-z0-9]{1,5}$/.test(name)) {
name += '.' + rcmail.env.file_extensions[type];
}
name = folder + file_api.env.directory_separator + name;
file_api.file_create(name, type);
kolab_dialog_close(this);
};
buttons[rcmail.gettext('kolab_files.cancel')] = function () {
kolab_dialog_close(this);
};
// Fix submitting form with Enter
$('form', dialog).submit(kolab_dialog_submit_handler);
// show dialog window
kolab_dialog_show(dialog, {
title: rcmail.gettext('kolab_files.createfile'),
buttons: buttons,
button_classes: ['mainaction']
});
// build folder selector
kolab_files_folder_select_element(select);
};
// builds folder selector options
kolab_files_folder_select_element = function(select, params)
{
var options = [],
selected = params && params.selected ? params.selected : file_api.env.folder;
if (params && params.empty)
options.push($('<option>').val('').text('---'));
$.each(file_api.env.folders, function(i, f) {
var n, name = escapeHTML(f.name);
for (n=0; n<f.depth; n++)
name = '&nbsp;&nbsp;&nbsp;' + name;
options.push($('<option>').val(i).html(name));
});
select.empty().append(options);
if (selected)
select.val(selected);
};
function kolab_dialog_show(content, params, onopen)
{
params = $.extend({
@ -1104,6 +1149,11 @@ rcube_webmail.prototype.files_set_quota = function(p)
this.set_quota(p);
};
rcube_webmail.prototype.files_create = function()
{
kolab_files_file_create_dialog();
};
rcube_webmail.prototype.folder_create = function()
{
kolab_files_folder_create_dialog();
@ -1257,6 +1307,8 @@ function kolab_files_ui()
else if (first)
rcmail.folder_list.select(first);
rcmail.enable_command('files-create', true);
// add tree icons
// this.folder_list_tree(this.env.folders);
@ -2205,6 +2257,25 @@ function kolab_files_ui()
}
};
// file(s) create request
this.file_create = function(file, type)
{
this.req = this.set_busy(true, 'kolab_files.filecreating');
this.request('file_create', {file: file, 'content-type': type, content: ''}, 'file_create_response');
};
// file(s) create response handler
this.file_create_response = function(response)
{
if (!this.response(response))
return;
// @TODO: we could update metadata instead
this.file_list();
// @TODO: open the file for editing if editable
};
// file(s) rename request
this.file_rename = function(oldfile, newfile)
{

View file

@ -133,6 +133,7 @@ class kolab_files_engine
'folder-auth-options'=> array($this, 'folder_auth_options'),
'file-search-form' => array($this, 'file_search_form'),
'file-edit-form' => array($this, 'file_edit_form'),
'file-create-form' => array($this, 'file_create_form'),
'filelist' => array($this, 'file_list'),
'filequotadisplay' => array($this, 'quota_display'),
));
@ -325,10 +326,10 @@ class kolab_files_engine
$attrib['id'] = 'file-edit-form';
}
$input_name = new html_inputfield(array('id' => 'file-name', 'name' => 'name', 'size' => 30));
$input_name = new html_inputfield(array('id' => 'file-edit-name', 'name' => 'name', 'size' => 30));
$table = new html_table(array('cols' => 2, 'class' => 'propform'));
$table->add('title', html::label('file-name', rcube::Q($this->plugin->gettext('filename'))));
$table->add('title', html::label('file-edit-name', rcube::Q($this->plugin->gettext('filename'))));
$table->add(null, $input_name->show());
$out = $table->show();
@ -344,6 +345,54 @@ class kolab_files_engine
return $out;
}
/**
* Template object for file_create form
*/
public function file_create_form($attrib)
{
$attrib['name'] = 'file-create-form';
if (empty($attrib['id'])) {
$attrib['id'] = 'file-create-form';
}
$input_name = new html_inputfield(array('id' => 'file-create-name', 'name' => 'name', 'size' => 30));
$select_parent = new html_select(array('id' => 'file-create-parent', 'name' => 'parent'));
$select_type = new html_select(array('id' => 'file-create-type', 'name' => 'type'));
$table = new html_table(array('cols' => 2, 'class' => 'propform'));
// @TODO: get this list from Chwala API
$types = array(
'application/vnd.oasis.opendocument.text' => 'odt',
'text/plain' => 'txt',
'text/html' => 'html',
);
foreach (array_keys($types) as $type) {
list ($app, $label) = explode('/', $type);
$label = preg_replace('/[^a-z]/', '', $label);
$select_type->add($this->plugin->gettext('type.' . $label), $type);
}
$table->add('title', html::label('file-create-name', rcube::Q($this->plugin->gettext('filename'))));
$table->add(null, $input_name->show());
$table->add('title', html::label('file-create-type', rcube::Q($this->plugin->gettext('type'))));
$table->add(null, $select_type->show());
$table->add('title', html::label('folder-parent', rcube::Q($this->plugin->gettext('folderinside'))));
$table->add(null, $select_parent->show());
$out = $table->show();
// add form tag around text field
if (empty($attrib['form'])) {
$out = $this->rc->output->form_tag($attrib, $out);
}
$this->plugin->add_label('create', 'cancel', 'filecreating', 'createfile');
$this->rc->output->add_gui_object('file-create-form', $attrib['id']);
$this->rc->output->set_env('file_extensions', $types);
return $out;
}
/**
* Template object for file search form in "From cloud" dialog
*/

View file

@ -44,6 +44,7 @@ $labels['save'] = 'Save';
$labels['savefile'] = 'Save file';
$labels['printfile'] = 'Print file';
$labels['fileedit'] = 'File properties';
$labels['createfile'] = 'Create a file';
$labels['collection_audio'] = 'Audio';
$labels['collection_video'] = 'Video';
@ -67,6 +68,7 @@ $labels['saveallnotice'] = 'Successfully saved $n file(s).';
$labels['saveallerror'] = 'Saving $n file(s) failed.';
$labels['attacherror'] = 'Failed to attach file(s) from the cloud';
$labels['fileupdating'] = 'Updating file...';
$labels['filecreating'] = 'Creating file...';
$labels['filemoving'] = 'Moving file(s)...';
$labels['filecopying'] = 'Copying file(s)...';
$labels['filedeleting'] = 'Deleting file(s)...';
@ -93,6 +95,7 @@ $labels['arialabelquicksearchbox'] = 'Search input';
$labels['arialabellistoptions'] = 'Files list options';
$labels['arialabelfolderoptions'] = 'Folder actions';
$labels['arialabelfileeditform'] = 'File editing form';
$labels['arialabelfilecreateform'] = 'File creation form';
$labels['arialabelfilelist'] = 'List of files';
$labels['arialabelfoldercreateform'] = 'Folder creation form';
$labels['arialabelfoldereditform'] = 'Folder editing form';
@ -105,4 +108,6 @@ $labels['arialabelfilesavedialog'] = 'File(s) saving dialog';
$labels['arialabelfileprops'] = 'File properties';
$labels['arialabelfilecontent'] = 'File content';
?>
$labels['type.plain'] = 'Plain Text Document';
$labels['type.vndoasisopendocumenttext'] = 'Text Document (ODF)';
$labels['type.html'] = 'HTML Document';

View file

@ -44,6 +44,7 @@
background-image: url(../../../../skins/larry/images/buttons.png);
}
#filestoolbar a.button.create,
#filestoolbar a.button.edit {
background-position: center -173px;
}
@ -330,6 +331,7 @@
#files-dialog,
#files-compose-dialog,
#files-file-edit-dialog,
#files-file-create-dialog,
#files-folder-mount-dialog,
#files-folder-auth-dialog,
#files-folder-create-dialog,

View file

@ -19,6 +19,7 @@
<roundcube:button command="files-upload" type="link" class="button upload disabled" classAct="button upload" classSel="button upload pressed" label="kolab_files.upload" title="kolab_files.uploadfile" />
</form>
<roundcube:button command="files-get" type="link" class="button get disabled" classAct="button get" classSel="button get pressed" label="kolab_files.get" title="kolab_files.getfile" />
<roundcube:button command="files-create" type="link" class="button create disabled" classAct="button create" classSel="button create pressed" label="kolab_files.create" title="kolab_files.createfile" />
<roundcube:button command="files-open" type="link" class="button open disabled" classAct="button open" classSel="button open pressed" label="kolab_files.view" title="kolab_files.viewfile" />
<roundcube:button command="files-delete" type="link" class="button delete disabled" classAct="button delete" classSel="button delete pressed" label="delete" title="kolab_files.deletefile" />
</div>
@ -94,6 +95,10 @@
<h3 id="aria-label-fileeditform" class="voice"><roundcube:label name="kolab_files.arialabelfileeditform" /></h3>
<roundcube:object name="file-edit-form" />
</div>
<div id="files-file-create-dialog" role="dialog" aria-labelledby="aria-label-filecreateform" aria-hidden="true">
<h3 id="aria-label-filecreateform" class="voice"><roundcube:label name="kolab_files.arialabelfilecreateform" /></h3>
<roundcube:object name="file-create-form" />
</div>
<div id="files-folder-auth-dialog" role="dialog" aria-labelledby="aria-label-folderauthform" aria-hidden="true">
<h3 id="aria-label-folderauthform" class="voice"><roundcube:label name="kolab_files.arialabelfolderauthform" /></h3>
<roundcube:object name="folder-auth-options">