Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-07-13 03:27:39 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Bugfix: droppable area (folders) failed to scroll

Browse source
This commit is contained in:
djmaze 2020-08-23 21:58:30 +02:00
parent b0942a7ff7
commit 0ccfa6a9b1
2 changed files with 30 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

67
dev/External/ko.js vendored
View file

@ -249,10 +249,11 @@ ko.bindingHandlers.draggable = {
Utils = require('Common/Utils'); Utils = require('Common/Utils');
if (!Globals.bMobileDevice) { if (!Globals.bMobileDevice) {
const triggerZone = 100, const triggerZone = 50,
scrollSpeed = 3, scrollSpeed = 3,
fAllValueFunc = fAllBindingsAccessor(), fAllValueFunc = fAllBindingsAccessor(),
droppableSelector = fAllValueFunc && fAllValueFunc.droppableSelector ? fAllValueFunc.droppableSelector : '', selector = fAllValueFunc ? fAllValueFunc.droppableSelector : '',
droppable = selector ? document.querySelector(selector) : null,
conf = { conf = {
distance: 20, distance: 20,
handle: '.dragHandle', handle: '.dragHandle',
@ -263,61 +264,47 @@ ko.bindingHandlers.draggable = {
stop: null, stop: null,
helper: null helper: null
}; };
let bcr;
if (droppableSelector) { if (droppable) {
conf.drag = (event) => { conf.drag = event => {
$(droppableSelector).each(function() { if (droppable.scrollTopMax) {
const $this = $(this), // eslint-disable-line no-invalid-this clearInterval(droppable.timerScroll);
offset = $this.offset(), if (droppable.scrollTop
bottomPos = offset.top + $this.height(); && bcr.top < event.clientY
&& bcr.top + triggerZone > event.clientY)
clearInterval($this.data('timerScroll')); {
$this.data('timerScroll', false); droppable.timerScroll = setInterval(() => droppable.scrollTop -= scrollSpeed, 10);
if (event.pageX >= offset.left && event.pageX <= offset.left + $this.width()) {
if (event.pageY >= bottomPos - triggerZone && event.pageY <= bottomPos) {
const moveUp = () => {
$this.scrollTop($this.scrollTop() + scrollSpeed);
};
$this.data('timerScroll', setInterval(moveUp, 10));
moveUp();
} }
else if (droppable.scrollTop < droppable.scrollTopMax
if (event.pageY >= offset.top && event.pageY <= offset.top + triggerZone) { && bcr.bottom > event.clientY
const moveDown = () => { && bcr.bottom - triggerZone < event.clientY)
$this.scrollTop($this.scrollTop() - scrollSpeed); {
}; droppable.timerScroll = setInterval(() => droppable.scrollTop += scrollSpeed, 10);
}
$this.data('timerScroll', setInterval(moveDown, 10)); else {
moveDown(); clearInterval(droppable.timerScroll);
} }
} }
});
}; };
conf.stop = () => { conf.stop = () => clearInterval(droppable.timerScroll);
$(droppableSelector).each(function() {
const $this = $(this); // eslint-disable-line no-invalid-this
clearInterval($this.data('timerScroll'));
$this.data('timerScroll', false);
});
};
} }
conf.helper = (event) => fValueAccessor()(event && event.target ? ko.dataFor(event.target) : null); conf.helper = event => fValueAccessor()(event && event.target ? ko.dataFor(event.target) : null);
$(element) $(element)
.draggable(conf) .draggable(conf)
.on('mousedown.koDraggable', () => { .on('mousedown.koDraggable', () => {
Utils.removeInFocus(); Utils.removeInFocus();
bcr = droppable ? droppable.getBoundingClientRect() : null;
}); });
ko.utils.domNodeDisposal.addDisposeCallback(element, () => { ko.utils.domNodeDisposal.addDisposeCallback(element, () =>
$(element) $(element)
.off('mousedown.koDraggable') .off('mousedown.koDraggable')
.draggable('destroy'); .draggable('destroy')
}); );
} }
} }
}; };

2
rainloop/v/0.0.0/app/templates/Views/User/MailMessageList.html
View file

@ -198,7 +198,7 @@
<div class="listEmptySearchList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' !== messageListSearch()"> <div class="listEmptySearchList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' !== messageListSearch()">
<span class="i18n" data-i18n="MESSAGE_LIST/EMPTY_SEARCH_LIST"></span> <span class="i18n" data-i18n="MESSAGE_LIST/EMPTY_SEARCH_LIST"></span>
</div> </div>
<div data-bind="draggable: dragAndDronHelper, droppableSelector: '.b-folders .content.g-scrollbox'"> <div data-bind="draggable: dragAndDronHelper, droppableSelector: '.b-folders .b-content'">
<div class="messageListPlace" data-bind="template: { name: messageListItemTemplate(), foreach: messageList }"></div> <div class="messageListPlace" data-bind="template: { name: messageListItemTemplate(), foreach: messageList }"></div>
</div> </div>
</div> </div>