Improve card positioning when dragging

fixes #307
fixes #236

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2017-12-08 15:00:40 +01:00
committed by Julius Härtl
parent 84502db00b
commit 28208f168d
2 changed files with 14 additions and 8 deletions

View File

@@ -150,8 +150,15 @@ input.input-inline {
} }
} }
} }
} }
// styles to provide a drop zone in empty stacks
.as-sortable-un-selectable {
.card-list {
min-height: 96px;
}
}
#innerBoard { #innerBoard {
padding: 10px; padding: 10px;

View File

@@ -250,9 +250,9 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
$scope.refreshData(); $scope.refreshData();
}); });
}, },
scrollableContainer: '#board', scrollableContainer: '#innerBoard',
containerPositioning: 'relative', containerPositioning: 'relative',
containment: '#board', containment: '#innerBoard',
longTouch: true, longTouch: true,
// auto scroll on drag // auto scroll on drag
dragMove: function (itemPosition, containment, eventObj) { dragMove: function (itemPosition, containment, eventObj) {
@@ -262,14 +262,14 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
var targetX = eventObj.pageX - (offset.left || container.scrollLeft()); var targetX = eventObj.pageX - (offset.left || container.scrollLeft());
var targetY = eventObj.pageY - (offset.top || container.scrollTop()); var targetY = eventObj.pageY - (offset.top || container.scrollTop());
if (targetX < offset.left) { if (targetX < offset.left) {
container.scrollLeft(container.scrollLeft() - 50); container.scrollLeft(container.scrollLeft() - 25);
} else if (targetX > container.width()) { } else if (targetX > container.width()) {
container.scrollLeft(container.scrollLeft() + 50); container.scrollLeft(container.scrollLeft() + 25);
} }
if (targetY < offset.top) { if (targetY < offset.top) {
container.scrollTop(container.scrollTop() - 50); container.scrollTop(container.scrollTop() - 25);
} else if (targetY > container.height()) { } else if (targetY > container.height()) {
container.scrollTop(container.scrollTop() + 50); container.scrollTop(container.scrollTop() + 25);
} }
} }
}, },
@@ -289,8 +289,7 @@ app.controller('BoardController', function ($rootScope, $scope, $stateParams, St
}, },
scrollableContainer: '#board', scrollableContainer: '#board',
containerPositioning: 'relative', containerPositioning: 'relative',
containment: '#board', containment: '#innerBoard',
longTouch: true,
dragMove: function (itemPosition, containment, eventObj) { dragMove: function (itemPosition, containment, eventObj) {
if (eventObj) { if (eventObj) {
var container = $("#board"); var container = $("#board");