Use default toolbar in drive

pull/1/head
yflory 5 years ago
parent d02a012e39
commit 6427413c7f

@ -805,6 +805,19 @@
} }
.cp-toolbar-bottom {
.cp-toolbar-bottom-right {
.fa-history { order: 50; }
.fa-list, .fa-th-large { order: 25; }
#cp-app-drive-toolbar-context-mobile, #cp-app-drive-toolbar-contextbuttons { order: 0; }
#cp-app-drive-toolbar-contextbuttons {
height: @variables_bar-height;
display: flex;
align-items: center;
}
}
}
/* Toolbar */ /* Toolbar */
#cp-app-drive-toolbar { #cp-app-drive-toolbar {

@ -556,6 +556,7 @@ define([
APP.origin = priv.origin; APP.origin = priv.origin;
APP.hideDuplicateOwned = Util.find(priv, ['settings', 'drive', 'hideDuplicate']); APP.hideDuplicateOwned = Util.find(priv, ['settings', 'drive', 'hideDuplicate']);
APP.closed = false; APP.closed = false;
APP.toolbar = driveConfig.toolbar;
var $readOnly = $(h('div#cp-app-drive-edition-state.cp-app-drive-content-info-box', Messages.readonly)); var $readOnly = $(h('div#cp-app-drive-edition-state.cp-app-drive-content-info-box', Messages.readonly));
@ -582,7 +583,7 @@ define([
var $tree = APP.$tree = $("#cp-app-drive-tree"); var $tree = APP.$tree = $("#cp-app-drive-tree");
var $content = APP.$content = $("#cp-app-drive-content"); var $content = APP.$content = $("#cp-app-drive-content");
var $appContainer = $(".cp-app-drive-container"); var $appContainer = $(".cp-app-drive-container");
var $driveToolbar = $("#cp-app-drive-toolbar"); var $driveToolbar = APP.toolbar.$bottom;
var $contextMenu = createContextMenu().appendTo($appContainer); var $contextMenu = createContextMenu().appendTo($appContainer);
var $contentContextMenu = $("#cp-app-drive-context-content"); var $contentContextMenu = $("#cp-app-drive-context-content");
@ -2237,8 +2238,12 @@ define([
window.addEventListener("resize", collapseDrivePath); window.addEventListener("resize", collapseDrivePath);
var treeResizeObserver = new MutationObserver(collapseDrivePath); var treeResizeObserver = new MutationObserver(collapseDrivePath);
treeResizeObserver.observe($("#cp-app-drive-tree")[0], {"attributes": true}); treeResizeObserver.observe($("#cp-app-drive-tree")[0], {"attributes": true});
// XXX
/*
var toolbarButtonAdditionObserver = new MutationObserver(collapseDrivePath); var toolbarButtonAdditionObserver = new MutationObserver(collapseDrivePath);
$(function () { toolbarButtonAdditionObserver.observe($("#cp-app-drive-toolbar")[0], {"childList": true, "subtree": true}); }); $(function () { toolbarButtonAdditionObserver.observe($("#cp-app-drive-toolbar")[0], {"childList": true, "subtree": true}); });
*/
// Create the title block with the "parent folder" button // Create the title block with the "parent folder" button
@ -2367,16 +2372,16 @@ define([
var $gridButton = $gridIcon.clone(); var $gridButton = $gridIcon.clone();
$listButton.click(function () { $listButton.click(function () {
$gridButton.removeClass('cp-app-drive-toolbar-active'); $gridButton.show();
$listButton.addClass('cp-app-drive-toolbar-active'); $listButton.hide();
setViewMode('list'); setViewMode('list');
$('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-grid'); $('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-grid');
$('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-list'); $('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-list');
Feedback.send('DRIVE_LIST_MODE'); Feedback.send('DRIVE_LIST_MODE');
}); });
$gridButton.click(function () { $gridButton.click(function () {
$listButton.removeClass('cp-app-drive-toolbar-active'); $listButton.show();
$gridButton.addClass('cp-app-drive-toolbar-active'); $gridButton.hide();
setViewMode('grid'); setViewMode('grid');
$('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-grid'); $('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-grid');
$('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-list'); $('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-list');
@ -2384,9 +2389,9 @@ define([
}); });
if (getViewMode() === 'list') { if (getViewMode() === 'list') {
$listButton.addClass('cp-app-drive-toolbar-active'); $listButton.hide();
} else { } else {
$gridButton.addClass('cp-app-drive-toolbar-active'); $gridButton.hide();
} }
$listButton.attr('title', Messages.fm_viewListButton); $listButton.attr('title', Messages.fm_viewListButton);
$gridButton.attr('title', Messages.fm_viewGridButton); $gridButton.attr('title', Messages.fm_viewGridButton);
@ -3002,20 +3007,16 @@ define([
// Drive content toolbar // Drive content toolbar
var createToolbar = function () { var createToolbar = function () {
var $toolbar = $driveToolbar; var $toolbar = APP.toolbar.$bottom;
$toolbar.html(''); APP.toolbar.$bottomL.html('');
$('<div>', {'class': 'cp-app-drive-toolbar-leftside'}).appendTo($toolbar); APP.toolbar.$bottomR.html('');
$('<div>', {'class': 'cp-app-drive-path cp-unselectable'}).appendTo($toolbar);
$('<div>', {'class': 'cp-app-drive-toolbar-filler'}).appendTo($toolbar);
var $rightside = $('<div>', {'class': 'cp-app-drive-toolbar-rightside'})
.appendTo($toolbar);
if (APP.histConfig && (APP.loggedIn || !APP.newSharedFolder)) { if (APP.histConfig && (APP.loggedIn || !APP.newSharedFolder)) {
// ANON_SHARED_FOLDER // ANON_SHARED_FOLDER
var $hist = common.createButton('history', true, {histConfig: APP.histConfig}); var $hist = common.createButton('history', true, {histConfig: APP.histConfig});
$rightside.append($hist); APP.toolbar.$bottomR.append($hist);
} }
if (APP.$burnThisDrive) { if (APP.$burnThisDrive) {
$rightside.append(APP.$burnThisDrive); APP.toolbar.$bottomR.append(APP.$burnThisDrive);
} }
return $toolbar; return $toolbar;
}; };
@ -3514,10 +3515,10 @@ define([
if (mode) { if (mode) {
$dirContent.addClass(getViewModeClass()); $dirContent.addClass(getViewModeClass());
} }
createViewModeButton($toolbar.find('.cp-app-drive-toolbar-rightside')); createViewModeButton(APP.toolbar.$bottomR);
} }
if (inTrash) { if (inTrash) {
createEmptyTrashButton($toolbar.find('.cp-app-drive-toolbar-rightside')); createEmptyTrashButton(APP.toolbar.$bottomR);
} }
var $list = $('<ul>').appendTo($dirContent); var $list = $('<ul>').appendTo($dirContent);
@ -3536,27 +3537,27 @@ define([
// NewButton can be undefined if we're in read only mode // NewButton can be undefined if we're in read only mode
if (!readOnlyFolder) { if (!readOnlyFolder) {
createNewButton(isInRoot, $toolbar.find('.cp-app-drive-toolbar-leftside')); createNewButton(isInRoot, APP.toolbar.$bottomL);
} }
if (sfId) { if (sfId) {
createShareButton(sfId, $toolbar.find('.cp-app-drive-toolbar-leftside')); createShareButton(sfId, APP.toolbar.$bottomL);
} }
createTitle($toolbar.find('.cp-app-drive-path'), path); createTitle($toolbar.find('.cp-app-drive-path'), path); // XXX
if (APP.mobile()) { if (APP.mobile()) {
var $context = $('<button>', { var $context = $('<button>', {
id: 'cp-app-drive-toolbar-context-mobile' id: 'cp-app-drive-toolbar-context-mobile'
}); });
$context.append($('<span>', {'class': 'fa fa-caret-down'})); $context.append($('<span>', {'class': 'fa fa-caret-down'}));
$context.appendTo($toolbar.find('.cp-app-drive-toolbar-rightside')); $context.appendTo(APP.toolbar.$bottomR);
$context.click(function (e) { $context.click(function (e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var $li = findSelectedElements(); var $li = findSelectedElements();
if ($li.length !== 1) { if ($li.length !== 1) {
$li = findDataHolder($tree.find('.cp-app-drive-element-active')); $li = findDataHolder($tree.find('.cp-toolbar-button-active'));
} }
// Close if already opened // Close if already opened
if ($('.cp-contextmenu:visible').length) { if ($('.cp-contextmenu:visible').length) {
@ -3568,7 +3569,7 @@ define([
}); });
} else { } else {
var $contextButtons = $('<span>', {'id' : 'cp-app-drive-toolbar-contextbuttons'}); var $contextButtons = $('<span>', {'id' : 'cp-app-drive-toolbar-contextbuttons'});
$contextButtons.appendTo($toolbar.find('.cp-app-drive-toolbar-rightside')); $contextButtons.appendTo(APP.toolbar.$bottomR);
} }
updateContextButton(); updateContextButton();

@ -15,7 +15,6 @@
<div id="cp-app-drive-tree"> <div id="cp-app-drive-tree">
</div> </div>
<div id="cp-app-drive-content-container"> <div id="cp-app-drive-content-container">
<div id="cp-app-drive-toolbar"></div>
<div id="cp-app-drive-connection-state" style="display: none"></div> <div id="cp-app-drive-connection-state" style="display: none"></div>
<div id="cp-app-drive-edition-state" class="cp-app-drive-content-info-box" style="display: none"></div> <div id="cp-app-drive-edition-state" class="cp-app-drive-content-info-box" style="display: none"></div>
<div id="cp-app-drive-content" tabindex="2"></div> <div id="cp-app-drive-content" tabindex="2"></div>

@ -201,10 +201,8 @@ define([
sfCommon: common, sfCommon: common,
$container: APP.$bar $container: APP.$bar
}; };
var toolbar = APP.toolbar = Toolbar.create(configTb); var toolbar = Toolbar.create(configTb);
var $rightside = toolbar.$rightside;
$rightside.html(''); // Remove the drawer if we don't use it to hide the toolbar
var $displayName = APP.$bar.find('.' + Toolbar.constants.username); var $displayName = APP.$bar.find('.' + Toolbar.constants.username);
metadataMgr.onChange(function () { metadataMgr.onChange(function () {
var name = metadataMgr.getUserData().name || Messages.anonymous; var name = metadataMgr.getUserData().name || Messages.anonymous;
@ -274,6 +272,7 @@ define([
updateObject: updateObject, updateObject: updateObject,
updateSharedFolders: updateSharedFolders, updateSharedFolders: updateSharedFolders,
history: history, history: history,
toolbar: toolbar,
APP: APP APP: APP
}); });

@ -319,6 +319,7 @@ define([
updateSharedFolders: updateSharedFolders, updateSharedFolders: updateSharedFolders,
$limit: APP.usageBar && APP.usageBar.$container, $limit: APP.usageBar && APP.usageBar.$container,
toolbar: APP.toolbar,
APP: driveAPP, APP: driveAPP,
edPublic: APP.teamEdPublic, edPublic: APP.teamEdPublic,
editKey: teamData.secondaryKey editKey: teamData.secondaryKey
@ -509,7 +510,6 @@ define([
h('div.cp-app-drive-container', {tabindex:0}, [ h('div.cp-app-drive-container', {tabindex:0}, [
h('div#cp-app-drive-tree'), h('div#cp-app-drive-tree'),
h('div#cp-app-drive-content-container', [ h('div#cp-app-drive-content-container', [
h('div#cp-app-drive-toolbar'),
h('div#cp-app-drive-connection-state', {style: "display: none;"}, Messages.disconnected), h('div#cp-app-drive-connection-state', {style: "display: none;"}, Messages.disconnected),
h('div#cp-app-drive-content', {tabindex:2}) h('div#cp-app-drive-content', {tabindex:2})
]) ])
@ -1313,8 +1313,7 @@ define([
sfCommon: common, sfCommon: common,
$container: $bar $container: $bar
}; };
var toolbar = Toolbar.create(configTb); var toolbar = APP.toolbar = Toolbar.create(configTb);
toolbar.$rightside.hide(); // hide the bottom part of the toolbar
// Update the name in the user menu // Update the name in the user menu
var $displayName = $bar.find('.' + Toolbar.constants.username); var $displayName = $bar.find('.' + Toolbar.constants.username);
metadataMgr.onChange(function () { metadataMgr.onChange(function () {

Loading…
Cancel
Save