half-fix for iphone drive grid/list toggle

This commit is contained in:
ansuz 2021-05-04 18:55:34 +05:30
parent c127fc5843
commit 260fa16058
2 changed files with 47 additions and 30 deletions

View File

@ -606,7 +606,7 @@
} }
} }
.cp-app-drive-content-list { div.cp-app-drive-content-list {
.cp-app-drive-element-grid { .cp-app-drive-element-grid {
display: none; display: none;
} }
@ -896,7 +896,8 @@
.cp-toolbar-bottom { .cp-toolbar-bottom {
.cp-toolbar-bottom-right { .cp-toolbar-bottom-right {
.fa-history { order: 50; } .fa-history { order: 50; }
.fa-list, .fa-th-large { order: 25; } // .fa-list, .fa-th-large,
.cp-drive-viewmode-button { order: 25; }
#cp-app-drive-toolbar-context-mobile, #cp-app-drive-toolbar-contextbuttons { order: 0; } #cp-app-drive-toolbar-context-mobile, #cp-app-drive-toolbar-contextbuttons { order: 0; }
#cp-app-drive-toolbar-context-mobile { #cp-app-drive-toolbar-context-mobile {
.fa { margin: 0 !important; } .fa { margin: 0 !important; }

View File

@ -122,8 +122,8 @@ define([
var $trashEmptyIcon = $('<span>', {"class": "fa fa-trash-o"}); var $trashEmptyIcon = $('<span>', {"class": "fa fa-trash-o"});
//var $collapseIcon = $('<span>', {"class": "fa fa-minus-square-o cp-app-drive-icon-expcol"}); //var $collapseIcon = $('<span>', {"class": "fa fa-minus-square-o cp-app-drive-icon-expcol"});
var $expandIcon = $('<span>', {"class": "fa fa-plus-square-o cp-app-drive-icon-expcol"}); var $expandIcon = $('<span>', {"class": "fa fa-plus-square-o cp-app-drive-icon-expcol"});
var $listIcon = $('<button>', {"class": "fa fa-list"}); //var $listIcon = $('<button>', {"class": "fa fa-list"});
var $gridIcon = $('<button>', {"class": "fa fa-th-large"}); //var $gridIcon = $('<button>', {"class": "fa fa-th-large"});
var $sortAscIcon = $('<span>', {"class": "fa fa-angle-up sortasc"}); var $sortAscIcon = $('<span>', {"class": "fa fa-angle-up sortasc"});
var $sortDescIcon = $('<span>', {"class": "fa fa-angle-down sortdesc"}); var $sortDescIcon = $('<span>', {"class": "fa fa-angle-down sortdesc"});
var $closeIcon = $('<span>', {"class": "fa fa-times"}); var $closeIcon = $('<span>', {"class": "fa fa-times"});
@ -2407,36 +2407,52 @@ define([
return $box; return $box;
}; };
var getOppositeViewMode = function (viewMode) {
viewMode = viewMode || getViewMode();
var newViewMode = viewMode === 'grid'? 'list': 'grid';
return newViewMode;
};
// Create the button allowing the user to switch from list to icons modes // Create the button allowing the user to switch from list to icons modes
var createViewModeButton = function ($container) { var createViewModeButton = function ($container) {
var $listButton = $listIcon.clone(); var viewMode = getViewMode();
var $gridButton = $gridIcon.clone(); var gridIcon = h('button.fa.fa-th-large', { title: Messages.fm_viewGridButton });
var listIcon = h('button.fa.fa-list', { title: Messages.fm_viewListButton });
$listButton.click(function () { var $button = $(h('span.cp-drive-viewmode-button', [
$gridButton.show(); gridIcon,
$listButton.hide(); listIcon
setViewMode('list'); ]));
$('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-grid'); var $gridIcon = $(gridIcon);
$('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-list'); var $listIcon = $(listIcon);
Feedback.send('DRIVE_LIST_MODE'); var showMode = function (mode) {
}); if (mode === 'grid') {
$gridButton.click(function () { $gridIcon.hide();
$listButton.show(); $listIcon.show();
$gridButton.hide();
setViewMode('grid');
$('#' + FOLDER_CONTENT_ID).addClass('cp-app-drive-content-grid');
$('#' + FOLDER_CONTENT_ID).removeClass('cp-app-drive-content-list');
Feedback.send('DRIVE_GRID_MODE');
});
if (getViewMode() === 'list') {
$listButton.hide();
} else { } else {
$gridButton.hide(); $listIcon.hide();
$gridIcon.show();
} }
$listButton.attr('title', Messages.fm_viewListButton); };
$gridButton.attr('title', Messages.fm_viewGridButton); setViewMode(viewMode || 'grid');
$container.append($listButton).append($gridButton); showMode(viewMode);
$button.click(function (e) {
console.error(e);
var viewMode = getViewMode();
var newViewMode = getOppositeViewMode(viewMode);
setViewMode(newViewMode);
showMode(newViewMode);
var $folder = $('#' + FOLDER_CONTENT_ID);
if (newViewMode === 'list') {
$folder.removeClass('cp-app-drive-content-grid').addClass('cp-app-drive-content-list');
Feedback.send('DRIVE_LIST_MODE');
} else {
$folder.addClass('cp-app-drive-content-grid').removeClass('cp-app-drive-content-list');
Feedback.send('DRIVE_GRID_MODE');
}
});
$container.append($button);
}; };
var emptyTrashModal = function () { var emptyTrashModal = function () {
var ownedInTrash = manager.ownedInTrash(); var ownedInTrash = manager.ownedInTrash();