add functionality to create new folder in file picker
Signed-off-by: Florian Schunk <florian.schunk@rwth-aachen.de>
This commit is contained in:
Florian Schunk
parent
74197462c0
commit
dba14fac8b
|
|
@ -753,15 +753,18 @@ code {
|
|||
display: inline-flex;
|
||||
float: none;
|
||||
max-height: 44px;
|
||||
max-width:44px;
|
||||
background-color: var(--color-background-dark);
|
||||
border: 1px solid var(--color-border-dark);
|
||||
border-radius: var(--border-radius-pill);
|
||||
position: static;
|
||||
position: relative;
|
||||
|
||||
.icon.icon-add{
|
||||
background-image: var(--icon-add-000);
|
||||
background-size: 16px 16px;
|
||||
max-height:44px;
|
||||
width:44px;
|
||||
margin:0px;
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -770,6 +773,16 @@ code {
|
|||
padding: 0px;
|
||||
position: static;
|
||||
}
|
||||
|
||||
.menu {
|
||||
top:100%;
|
||||
margin:10px;
|
||||
form {
|
||||
display:flex;
|
||||
margin:10px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.filelist-container {
|
||||
|
|
|
|||
|
|
@ -34,6 +34,8 @@
|
|||
position: 'fixed'
|
||||
});
|
||||
|
||||
this.enterCallback = null;
|
||||
|
||||
$(document).on('keydown keyup', function(event) {
|
||||
if (
|
||||
event.target !== self.$dialog.get(0) &&
|
||||
|
|
@ -54,6 +56,11 @@
|
|||
// Enter
|
||||
if(event.keyCode === 13) {
|
||||
event.stopImmediatePropagation();
|
||||
if (self.enterCallback != null) {
|
||||
self.enterCallback();
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
if(event.type === 'keyup') {
|
||||
event.preventDefault();
|
||||
return false;
|
||||
|
|
@ -206,6 +213,12 @@
|
|||
widget: function() {
|
||||
return this.$dialog;
|
||||
},
|
||||
setEnterCallback: function(callback) {
|
||||
this.enterCallback = callback;
|
||||
},
|
||||
unsetEnterCallback: function() {
|
||||
this.enterCallback = null;
|
||||
},
|
||||
close: function() {
|
||||
this._destroyOverlay();
|
||||
var self = this;
|
||||
|
|
|
|||
|
|
@ -205,6 +205,7 @@ var OCdialogs = {
|
|||
}
|
||||
|
||||
var emptyText = t('core', 'No files in here');
|
||||
var newText = t('files', 'New folder');
|
||||
if (type === this.FILEPICKER_TYPE_COPY || type === this.FILEPICKER_TYPE_MOVE || type === this.FILEPICKER_TYPE_COPY_MOVE) {
|
||||
emptyText = t('core', 'No more subfolders in here');
|
||||
}
|
||||
|
|
@ -212,6 +213,8 @@ var OCdialogs = {
|
|||
this.filepicker.loading = true;
|
||||
this.filepicker.filesClient = (OCA.Sharing && OCA.Sharing.PublicApp && OCA.Sharing.PublicApp.fileList)? OCA.Sharing.PublicApp.fileList.filesClient: OC.Files.getClient();
|
||||
|
||||
this.filelist = null;
|
||||
|
||||
$.when(this._getFilePickerTemplate()).then(function($tmpl) {
|
||||
self.filepicker.loading = false;
|
||||
var dialogName = 'oc-dialog-filepicker-content';
|
||||
|
|
@ -229,7 +232,8 @@ var OCdialogs = {
|
|||
self.$filePicker = $tmpl.octemplate({
|
||||
dialog_name: dialogName,
|
||||
title: title,
|
||||
emptytext: emptyText
|
||||
emptytext: emptyText,
|
||||
newtext: newText
|
||||
}).data('path', '').data('multiselect', multiselect).data('mimetype', mimetypeFilter);
|
||||
|
||||
if (modal === undefined) {
|
||||
|
|
@ -254,6 +258,70 @@ var OCdialogs = {
|
|||
self._getGridSettings();
|
||||
}
|
||||
|
||||
var newButton = self.$filePicker.find('.actions.creatable .button-add');
|
||||
OC.registerMenu(newButton,self.$filePicker.find('.menu'),function () {
|
||||
$input.focus();
|
||||
self.$filePicker.ocdialog('setEnterCallback', function() {
|
||||
self.$form.submit();
|
||||
});
|
||||
var newName = $input.val();
|
||||
lastPos = newName.lastIndexOf('.');
|
||||
if (lastPos === -1) {
|
||||
lastPos = newName.length;
|
||||
}
|
||||
$input.selectRange(0, lastPos);
|
||||
});
|
||||
var $form = self.$filePicker.find('.filenameform');
|
||||
var $input = $form.find('input[type=\'text\']');
|
||||
var $submit = $form.find('input[type=\'submit\']');
|
||||
$submit.on('click',function(event) {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
$form.submit();
|
||||
});
|
||||
|
||||
var checkInput = function () {
|
||||
var filename = $input.val();
|
||||
try {
|
||||
if (!Files.isFileNameValid(filename)) {
|
||||
// Files.isFileNameValid(filename) throws an exception itself
|
||||
} else if (self.filelist.find(function(file){return file.name == this;},filename)) {
|
||||
throw t('files', '{newName} already exists', {newName: filename}, undefined, {
|
||||
escape: false
|
||||
});
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
} catch (error) {
|
||||
$input.attr('title', error);
|
||||
$input.tooltip({placement: 'right', trigger: 'manual', 'container': '.newFileMenu'});
|
||||
$input.tooltip('fixTitle');
|
||||
$input.tooltip('show');
|
||||
$input.addClass('error');
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
$form.on('submit', function(event) {
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
if (checkInput()) {
|
||||
var newname = $input.val();
|
||||
self.filepicker.filesClient.createDirectory(self.$filePicker.data('path') + "/" + newname).always(function (status) {
|
||||
self._fillFilePicker(self.$filePicker.data('path') );
|
||||
});
|
||||
OC.hideMenus();
|
||||
self.$filePicker.ocdialog('unsetEnterCallback');
|
||||
self.$filePicker.click();
|
||||
}
|
||||
});
|
||||
$input.keypress(function(event) {
|
||||
if (event.keyCode == 13 || event.which == 13) {
|
||||
$form.submit();
|
||||
}
|
||||
});
|
||||
|
||||
self.$filePicker.ready(function() {
|
||||
self.$fileListHeader = self.$filePicker.find('.filelist thead tr');
|
||||
self.$filelist = self.$filePicker.find('.filelist tbody');
|
||||
|
|
@ -912,6 +980,7 @@ var OCdialogs = {
|
|||
self.$fileListHeader.find('[data-sort=' + self.filepicker.sortField + '] .sort-indicator').addClass('icon-triangle-s');
|
||||
}
|
||||
self.filepicker.filesClient.getFolderContents(dir).then(function(status, files) {
|
||||
self.filelist = files;
|
||||
if (filter && filter.length > 0 && filter.indexOf('*') === -1) {
|
||||
files = files.filter(function (file) {
|
||||
return file.type === 'dir' || filter.indexOf(file.mimetype) !== -1;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,15 @@
|
|||
<div id="{dialog_name}" title="{title}">
|
||||
<span class="dirtree breadcrumb"></span>
|
||||
<span class="actions creatable"><a href="#" class="icon icon-add button"></a></span>
|
||||
<span class="actions creatable"><a href="#" class="icon icon-add button button-add"></a>
|
||||
<nav class="menu popovermenu bubble menu-center newFileMenu">
|
||||
<ul><li>
|
||||
<form class="filenameform">
|
||||
<input type="text" value={newtext}>
|
||||
<input class="icon-confirm" type="submit" value="">
|
||||
</form>
|
||||
</li></ul>
|
||||
</nav>
|
||||
</span>
|
||||
<input type="checkbox" class="hidden-visually" id="picker-showgridview" checked="checked" />
|
||||
<label id="picker-view-toggle" for="picker-showgridview" class="button icon-toggle-filelist"></label>
|
||||
<div class="filelist-container">
|
||||
|
|
|
|||
Loading…
Reference in New Issue