Add temporary folder custom color in drive

This commit is contained in:
ClemDee 2019-06-11 17:40:13 +02:00
parent e52acda334
commit 21300bb030
5 changed files with 51 additions and 5 deletions

View File

@ -21,7 +21,7 @@ www/pad/mediatag-plugin-dialog.js
www/pad/disable-base64.js
www/kanban/jkanban.js
www/kanban/jscolor.js
www/common/jscolor.js
www/common/media-tag-nacl.min.js

View File

@ -385,6 +385,7 @@
"fc_newfolder": "New folder",
"fc_newsharedfolder": "New shared folder",
"fc_rename": "Rename",
"fc_color": "Change color",
"fc_open": "Open",
"fc_open_ro": "Open (read-only)",
"fc_delete": "Move to trash",

View File

@ -17,6 +17,8 @@ define([
'/bower_components/chainpad-listmap/chainpad-listmap.js',
'/customize/messages.js',
'/common/jscolor.js',
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
'less!/drive/app-drive.less',
@ -78,6 +80,7 @@ define([
var faShared = 'fa-shhare-alt';
var faReadOnly = 'fa-eye';
var faRename = 'fa-pencil';
var faColor = 'fa-palette';
var faTrash = 'fa-trash';
var faDelete = 'fa-eraser';
var faProperties = 'fa-database';
@ -329,6 +332,10 @@ define([
'tabindex': '-1',
'data-icon': faRename,
}, Messages.fc_rename)),
h('li', h('a.cp-app-drive-context-color.dropdown-item.cp-app-drive-context-editable', {
'tabindex': '-1',
'data-icon': faColor,
}, Messages.fc_color)),
h('li', h('a.cp-app-drive-context-delete.dropdown-item.cp-app-drive-context-editable', {
'tabindex': '-1',
'data-icon': faTrash,
@ -814,6 +821,32 @@ define([
},0);
};
var pickFolderColor = function ($element, currentColor, cb) {
var jscolorL;
$element[0]._jscLinkedInstance = undefined;
var onchange = function (color) {
cb("#" + color.toString());
};
if (APP.colorPicker) { APP.colorPicker.hide(); }
jscolorL = new window.jscolor($element[0], {showOnClick: false, onFineChange: onchange, valueElement:undefined, styleElement:undefined});
APP.colorPicker = jscolorL;
jscolorL.fromString(currentColor);
jscolorL.show();
};
var getFolderColor = function ($element) {
if ($element.length === 0) { return; }
return $element.find(".cp-app-drive-icon-folder").css("color") || "#000";
};
var setFolderColor = function ($element, color) {
if ($element.length === 0) { return; }
$element.find(".cp-app-drive-icon-folder").css("color", color);
// TODO : save color in folder metadata
};
var filterContextMenu = function (type, paths) {
if (!paths || paths.length === 0) { logError('no paths'); }
@ -860,6 +893,7 @@ define([
}
if ($element.is('.cp-app-drive-element-file')) {
// No folder in files
hide.push('color');
hide.push('newfolder');
if ($element.is('.cp-app-drive-element-readonly')) {
hide.push('open'); // Remove open 'edit' mode
@ -932,7 +966,7 @@ define([
show = ['newfolder', 'newsharedfolder', 'newdoc'];
break;
case 'tree':
show = ['open', 'openro', 'download', 'share', 'rename', 'delete', 'deleteowned', 'removesf',
show = ['open', 'openro', 'download', 'share', 'rename', 'color', 'delete', 'deleteowned', 'removesf',
'newfolder', 'properties', 'hashtag'];
break;
case 'default':
@ -1376,6 +1410,9 @@ define([
$element.on('mousedown', function (e) {
e.stopPropagation();
if (APP.colorPicker) {
APP.colorPicker.hide();
}
});
// Add drop handlers if we are not in the trash and if the element is a folder
@ -2333,7 +2370,7 @@ define([
var roClass = typeof(ro) === 'undefined' ? ' cp-app-drive-element-noreadonly' :
ro ? ' cp-app-drive-element-readonly' : '';
var $element = $('<li>', {
'class': 'cp-app-drive-element cp-app-drive-element-row' + roClass
'class': 'cp-app-drive-element cp-app-drive-element-row' + roClass
});
$element.prepend($icon).dblclick(function () {
openFile(id);
@ -3188,6 +3225,14 @@ define([
if (paths.length !== 1) { return; }
displayRenameInput(paths[0].element, paths[0].path);
}
if ($(this).hasClass("cp-app-drive-context-color")) {
var currentColor = getFolderColor(paths[0].element);
pickFolderColor(paths[0].element, currentColor, function (color) {
paths.forEach(function (p) {
setFolderColor(p.element, color);
});
});
}
else if($(this).hasClass("cp-app-drive-context-delete")) {
if (!APP.loggedIn) {
return void deletePaths(paths);

View File

@ -10,7 +10,7 @@ define([
'/common/modes.js',
'/customize/messages.js',
'/kanban/jkanban.js',
'/kanban/jscolor.js',
'/common/jscolor.js',
'css!/kanban/jkanban.css',
'less!/kanban/app-kanban.less'
@ -281,7 +281,7 @@ define([
//return;
}
kanban.inEditMode = true;
// create a form to enter element
// create a form to enter element
var boardId = $(el.parentNode.parentNode).attr("data-id");
var $item = $('<div>', {'class': 'kanban-item'});
var $input = getInput().val(name).appendTo($item);