github-mirrors/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2025-04-22 21:17:18 -04:00
Code Issues Projects Releases Packages Wiki Activity

Fix drag-and-drop and scrolling on mobile devices

Browse source 
Use drag handles on "miniscreens" whenever useful, this is especially useful on
mobile device. This should hopefully fix https://github.com/wekan/wekan/issues/2947.
While at it, simplify the condition

 Utils.isMiniScreen() ||
   (!Utils.isMiniScreen() && showDesktopDragHandles)

 to

  Utils.isMiniScreen() || showDesktopDragHandle
This commit is contained in:
Marc Hartmayer 2020-04-23 02:09:01 +02:00
parent 981ed546f1
commit 6476503137
5 changed files with 12 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

5
client/components/boards/boardBody.js
View file

@ -205,7 +205,7 @@ BlazeComponent.extendComponent({
} else {
showDesktopDragHandles = false;
}
if (!Utils.isMiniScreen() && showDesktopDragHandles) {
if (Utils.isMiniScreen() || showDesktopDragHandles) {
$swimlanesDom.sortable({
handle: '.js-swimlane-header-handle',
});
@ -215,9 +215,8 @@ BlazeComponent.extendComponent({
});
}
// Disable drag-dropping if the current user is not a board member or is miniscreen
// Disable drag-dropping if the current user is not a board member
$swimlanesDom.sortable('option', 'disabled', !userIsMember());
$swimlanesDom.sortable('option', 'disabled', Utils.isMiniScreen());
});
function userIsMember() {

4
client/components/cards/minicard.jade
View file

@ -4,8 +4,8 @@ template(name="minicard")
class="{{#if isLinkedBoard}}linked-board{{/if}}"
class="minicard-{{colorClass}}")
if isMiniScreen
//.handle
// .fa.fa-arrows
.handle
.fa.fa-arrows
unless isMiniScreen
if showDesktopDragHandles
.handle

6
client/components/lists/list.js
View file

@ -129,7 +129,7 @@ BlazeComponent.extendComponent({
showDesktopDragHandles = false;
}
if (!Utils.isMiniScreen() && showDesktopDragHandles) {
if (Utils.isMiniScreen() || showDesktopDragHandles) {
$cards.sortable({
handle: '.handle',
});
@ -143,8 +143,8 @@ BlazeComponent.extendComponent({
$cards.sortable(
'option',
'disabled',
// Disable drag-dropping when user is not member/is miniscreen
!userIsMember() || Utils.isMiniScreen(),
// Disable drag-dropping when user is not member
!userIsMember(),
// Not disable drag-dropping while in multi-selection mode
// MultiSelection.isActive() || !userIsMember(),
);

3
client/components/lists/listHeader.jade
View file

@ -30,10 +30,9 @@ template(name="listHeader")
if canSeeAddCard
a.js-add-card.fa.fa-plus.list-header-plus-icon
a.fa.fa-navicon.js-open-list-menu
//a.list-header-handle.handle.fa.fa-arrows.js-list-handle
else
a.list-header-menu-icon.fa.fa-angle-right.js-select-list
//a.list-header-handle.handle.fa.fa-arrows.js-list-handle
a.list-header-handle.handle.fa.fa-arrows.js-list-handle
else if currentUser.isBoardMember
if isWatching
i.list-header-watch-icon.fa.fa-eye

9
client/components/swimlanes/swimlanes.js
View file

@ -111,7 +111,7 @@ function initSortable(boardComponent, $listsDom) {
showDesktopDragHandles = false;
}
if (!Utils.isMiniScreen() && showDesktopDragHandles) {
if (Utils.isMiniScreen() || showDesktopDragHandles) {
$listsDom.sortable({
handle: '.js-list-handle',
});
@ -126,8 +126,8 @@ function initSortable(boardComponent, $listsDom) {
$listsDom.sortable(
'option',
'disabled',
// Disable drag-dropping when user is not member/is worker/is miniscreen
!userIsMember() || Meteor.user().isWorker() || Utils.isMiniScreen(),
// Disable drag-dropping when user is not member/is worker
!userIsMember() || Meteor.user().isWorker(),
// Not disable drag-dropping while in multi-selection mode
// MultiSelection.isActive() || !userIsMember(),
);
@ -188,8 +188,7 @@ BlazeComponent.extendComponent({
}
const noDragInside = ['a', 'input', 'textarea', 'p'].concat(
Utils.isMiniScreen() ||
(!Utils.isMiniScreen() && showDesktopDragHandles)
Utils.isMiniScreen() || showDesktopDragHandles
? ['.js-list-handle', '.js-swimlane-header-handle']
: ['.js-list-header'],
);