Search spinner and 'no result'
yflory
parent
f421a7099d
commit
f3f1fd1c81
|
|
@ -227,16 +227,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
|
||||
color: @cryptpad_color_grey;
|
||||
opacity: 1; /* Firefox */
|
||||
}
|
||||
:-ms-input-placeholder { /* Internet Explorer 10-11 */
|
||||
color: @cryptpad_color_grey;
|
||||
}
|
||||
::-ms-input-placeholder { /* Microsoft Edge */
|
||||
color: @cryptpad_color_grey;
|
||||
}
|
||||
.tools_placeholder-color(@cryptpad_color_grey);
|
||||
|
||||
span.cp-password-container {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -222,7 +222,7 @@
|
|||
|
||||
|
||||
#cp-app-drive-search {
|
||||
display: flex;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
max-width: 400px;
|
||||
font-size: 30px;
|
||||
|
|
@ -230,7 +230,7 @@
|
|||
input {
|
||||
background: transparent;
|
||||
color: @colortheme_drive-color;
|
||||
.tools_placeholder-color(@colortheme_drive-color);
|
||||
.tools_placeholder-color(@cryptpad_color_grey);
|
||||
outline-width: 0px;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
|
|
@ -256,7 +256,19 @@
|
|||
color: @colortheme_drive-color;
|
||||
}
|
||||
}
|
||||
|
||||
.cp-app-drive-search-spinner {
|
||||
display: inline-flex;
|
||||
color: @colortheme_drive-color;
|
||||
font-size: 40px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.cp-app-drive-search-noresult {
|
||||
font-size: 30px;
|
||||
padding: 15px;
|
||||
font-style: italic;
|
||||
color: @cryptpad_color_grey;
|
||||
}
|
||||
|
||||
|
||||
/* TREE */
|
||||
|
|
|
|||
|
|
@ -2,13 +2,9 @@
|
|||
&::-webkit-input-placeholder { /* WebKit, Blink, Edge */
|
||||
color: @color;;
|
||||
}
|
||||
&:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
&::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
|
||||
color: @color;
|
||||
opacity: 1;
|
||||
}
|
||||
&::-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: @color;
|
||||
opacity: 1;
|
||||
opacity: 1; /* Firefox */
|
||||
}
|
||||
&:-ms-input-placeholder { /* Internet Explorer 10-11 */
|
||||
color: @color;
|
||||
|
|
|
|||
|
|
@ -234,9 +234,9 @@ define([
|
|||
return LS;
|
||||
};
|
||||
|
||||
var getViewModeClass = function () {
|
||||
var getViewModeClass = function (forceList) {
|
||||
var mode = APP.store[LS_VIEWMODE];
|
||||
if (mode === 'list') { return 'cp-app-drive-content-list'; }
|
||||
if (mode === 'list' || forceList) { return 'cp-app-drive-content-list'; }
|
||||
return 'cp-app-drive-content-grid';
|
||||
};
|
||||
var getViewMode = function () {
|
||||
|
|
@ -3230,6 +3230,7 @@ define([
|
|||
|
||||
var $input = APP.Search.$input = $('<input>', {
|
||||
id: 'cp-app-drive-search-input',
|
||||
placeholder: Messages.fm_searchName,
|
||||
type: 'text',
|
||||
draggable: false,
|
||||
tabindex: 1,
|
||||
|
|
@ -3288,69 +3289,87 @@ define([
|
|||
$input.focus();
|
||||
});
|
||||
|
||||
$list.closest('#cp-app-drive-content-folder').addClass('cp-app-drive-content-list');
|
||||
var filesList = manager.search(value);
|
||||
var sortable = {};
|
||||
var sortableFolders = [];
|
||||
filesList.forEach(function (r) {
|
||||
// if r.id === null, then it's a folder, not a file
|
||||
r.paths.forEach(function (path) {
|
||||
if (!r.inSharedFolder &&
|
||||
APP.hideDuplicateOwned && manager.isDuplicateOwned(path)) { return; }
|
||||
var _path = path.slice();
|
||||
var key = path.pop();
|
||||
var root = manager.find(path);
|
||||
var obj = {
|
||||
path: path,
|
||||
_path: _path,
|
||||
key: key,
|
||||
root: root,
|
||||
data: r.data
|
||||
};
|
||||
if (manager.isFolder(root[key])) {
|
||||
sortableFolders.push(obj);
|
||||
return;
|
||||
}
|
||||
sortable[root[key]] = obj;
|
||||
var $spinnerContainer = $(h('div.cp-app-drive-search-spinner')).appendTo($list);
|
||||
|
||||
var spinner = UI.makeSpinner($spinnerContainer);
|
||||
if (typeof(value) == "string" && value.trim()) {
|
||||
spinner.spin();
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
setTimeout(function () {
|
||||
//$list.closest('#cp-app-drive-content-folder').addClass('cp-app-drive-content-list');
|
||||
var filesList = manager.search(value);
|
||||
if (!filesList.length) {
|
||||
Messages.fm_noResult = "No result found"; // XXX
|
||||
$list.append(h('div.cp-app-drive-search-noresult', Messages.fm_noResult));
|
||||
spinner.hide();
|
||||
return;
|
||||
}
|
||||
var sortable = {};
|
||||
var sortableFolders = [];
|
||||
filesList.forEach(function (r) {
|
||||
// if r.id === null, then it's a folder, not a file
|
||||
r.paths.forEach(function (path) {
|
||||
if (!r.inSharedFolder &&
|
||||
APP.hideDuplicateOwned && manager.isDuplicateOwned(path)) { return; }
|
||||
var _path = path.slice();
|
||||
var key = path.pop();
|
||||
var root = manager.find(path);
|
||||
var obj = {
|
||||
path: path,
|
||||
_path: _path,
|
||||
key: key,
|
||||
root: root,
|
||||
data: r.data
|
||||
};
|
||||
if (manager.isFolder(root[key])) {
|
||||
sortableFolders.push(obj);
|
||||
return;
|
||||
}
|
||||
sortable[root[key]] = obj;
|
||||
});
|
||||
});
|
||||
});
|
||||
var _folders = sortElements(true, [ROOT], sortableFolders, null, !getSortFolderDesc(), true);
|
||||
var sortableKeys = Object.keys(sortable).map(Number);
|
||||
var _files = sortElements(false, [ROOT], sortableKeys, APP.store[SORT_FILE_BY], !getSortFileDesc(), true);
|
||||
var _folders = sortElements(true, [ROOT], sortableFolders, null, !getSortFolderDesc(), true);
|
||||
var sortableKeys = Object.keys(sortable).map(Number);
|
||||
var _files = sortElements(false, [ROOT], sortableKeys, APP.store[SORT_FILE_BY], !getSortFileDesc(), true);
|
||||
|
||||
var addEl = function (obj, folder) {
|
||||
var $element = createElement(obj.path, obj.key, obj.root, folder);
|
||||
$element.addClass('cp-app-drive-element-notrash cp-app-drive-search-result');
|
||||
$element.off('contextmenu');
|
||||
$element.contextmenu(openContextMenu('default'));
|
||||
$element.data('context', 'default');
|
||||
if (folder) {
|
||||
$element.find('.cp-app-drive-element-list').css({
|
||||
visibility: 'hidden'
|
||||
}).text('');
|
||||
}
|
||||
if (manager.isPathIn(obj._path, ['hrefArray'])) {
|
||||
obj._path.pop();
|
||||
obj._path.push(obj.data.title);
|
||||
}
|
||||
var $path = $('<span>', {
|
||||
'class': 'cp-app-drive-search-path'
|
||||
}).appendTo($element.find('.cp-app-drive-element-name'));
|
||||
createTitle($path, obj._path);
|
||||
var addEl = function (obj, folder) {
|
||||
var $element = createElement(obj.path, obj.key, obj.root, folder);
|
||||
$element.addClass('cp-app-drive-element-notrash cp-app-drive-search-result');
|
||||
$element.off('contextmenu');
|
||||
$element.contextmenu(openContextMenu('default'));
|
||||
$element.data('context', 'default');
|
||||
if (folder) {
|
||||
$element.find('.cp-app-drive-element-list').css({
|
||||
visibility: 'hidden'
|
||||
}).text('');
|
||||
}
|
||||
if (manager.isPathIn(obj._path, ['hrefArray'])) {
|
||||
obj._path.pop();
|
||||
obj._path.push(obj.data.title);
|
||||
}
|
||||
var $path = $('<span>', {
|
||||
'class': 'cp-app-drive-search-path'
|
||||
}).appendTo($element.find('.cp-app-drive-element-name'));
|
||||
createTitle($path, obj._path);
|
||||
|
||||
$list.append($element);
|
||||
};
|
||||
if (_folders.length) { getFolderListHeader(true, true).appendTo($list); }
|
||||
_folders.forEach(function (el) {
|
||||
var obj = el;
|
||||
addEl(obj, true);
|
||||
$list.append($element);
|
||||
};
|
||||
if (_folders.length) { getFolderListHeader(true, true).appendTo($list); }
|
||||
_folders.forEach(function (el) {
|
||||
var obj = el;
|
||||
addEl(obj, true);
|
||||
});
|
||||
if (_files.length) { getFileListHeader(true).appendTo($list); }
|
||||
_files.forEach(function (el) {
|
||||
var obj = sortable[el];
|
||||
addEl(obj, false);
|
||||
});
|
||||
setTimeout(collapseDrivePath);
|
||||
spinner.hide();
|
||||
});
|
||||
if (_files.length) { getFileListHeader(true).appendTo($list); }
|
||||
_files.forEach(function (el) {
|
||||
var obj = sortable[el];
|
||||
addEl(obj, false);
|
||||
});
|
||||
setTimeout(collapseDrivePath);
|
||||
};
|
||||
|
||||
var displayRecent = function ($list) {
|
||||
|
|
@ -3606,12 +3625,11 @@ define([
|
|||
|
||||
var $dirContent = $('<div>', {id: FOLDER_CONTENT_ID});
|
||||
$dirContent.data('path', path);
|
||||
if (!isSearch && !isTags) {
|
||||
var mode = getViewMode();
|
||||
if (mode) {
|
||||
$dirContent.addClass(getViewModeClass());
|
||||
if (!isTags) {
|
||||
$dirContent.addClass(getViewModeClass(isSearch));
|
||||
if (!isSearch) {
|
||||
createViewModeButton(APP.toolbar.$bottomR);
|
||||
}
|
||||
createViewModeButton(APP.toolbar.$bottomR);
|
||||
}
|
||||
|
||||
var $list = $('<ul>').appendTo($dirContent);
|
||||
|
|
|
|||
Loading…
Reference in New Issue