Skip to content

Commit df9c074

Browse files
committed
fix(listView): reordering up is more responsive, fix scrolling error
Closes #1202
1 parent d4f9ad0 commit df9c074

File tree

2 files changed

+22
-6
lines changed

2 files changed

+22
-6
lines changed

Diff for: js/views/listView.js

+18-6
Original file line numberDiff line numberDiff line change
@@ -191,9 +191,10 @@
191191
ReorderDrag.prototype = new DragOp();
192192

193193
ReorderDrag.prototype._moveElement = function(e) {
194-
var y = e.gesture.center.pageY -
195-
this._currentDrag.elementHeight +
194+
var y = e.gesture.center.pageY +
196195
this.scrollView.getValues().top -
196+
this.scrollView.__container.offsetTop -
197+
(this._currentDrag.elementHeight / 2) -
197198
this.listEl.offsetTop;
198199
this.el.style[ionic.CSS.TRANSFORM] = 'translate3d(0, '+y+'px, 0)';
199200
};
@@ -223,17 +224,19 @@
223224

224225
ReorderDrag.prototype.drag = ionic.animationFrameThrottle(function(e) {
225226
// We really aren't dragging
227+
var self = this;
226228
if(!this._currentDrag) {
227229
return;
228230
}
229231

230232
var scrollY = 0;
231233
var pageY = e.gesture.center.pageY;
234+
var offset = this.listEl.offsetTop + this.scrollView.__container.offsetTop;
232235

233236
//If we have a scrollView, check scroll boundaries for dragged element and scroll if necessary
234237
if (this.scrollView) {
235-
var container = this.scrollEl;
236238

239+
var container = this.scrollView.__container;
237240
scrollY = this.scrollView.getValues().top;
238241

239242
var containerTop = container.offsetTop;
@@ -242,10 +245,18 @@
242245

243246
if (e.gesture.deltaY < 0 && pixelsPastTop > 0 && scrollY > 0) {
244247
this.scrollView.scrollBy(null, -pixelsPastTop);
248+
//Trigger another drag so the scrolling keeps going
249+
setTimeout(function() {
250+
self.drag(e);
251+
}.bind(this));
245252
}
246253
if (e.gesture.deltaY > 0 && pixelsPastBottom > 0) {
247254
if (scrollY < this.scrollView.getScrollMax().top) {
248255
this.scrollView.scrollBy(null, pixelsPastBottom);
256+
//Trigger another drag so the scrolling keeps going
257+
setTimeout(function() {
258+
self.drag(e);
259+
}.bind(this));
249260
}
250261
}
251262
}
@@ -259,7 +270,7 @@
259270
if(this._isDragging) {
260271
this._moveElement(e);
261272

262-
this._currentDrag.currentY = scrollY + pageY - this._currentDrag.placeholder.parentNode.offsetTop;
273+
this._currentDrag.currentY = scrollY + pageY - offset;
263274

264275
this._reorderItems();
265276
}
@@ -279,13 +290,14 @@
279290
var bottomSibling = siblings[Math.min(siblings.length, index+1)];
280291
var thisOffsetTop = this._currentDrag.currentY;// + this._currentDrag.startOffsetTop;
281292

282-
if(topSibling && (thisOffsetTop < topSibling.offsetTop + topSibling.offsetHeight/2)) {
293+
if(topSibling && (thisOffsetTop < topSibling.offsetTop + topSibling.offsetHeight)) {
283294
ionic.DomUtil.swapNodes(this._currentDrag.placeholder, topSibling);
284295
return index - 1;
285-
} else if(bottomSibling && thisOffsetTop > (bottomSibling.offsetTop + bottomSibling.offsetHeight/2)) {
296+
} else if(bottomSibling && thisOffsetTop > (bottomSibling.offsetTop)) {
286297
ionic.DomUtil.swapNodes(bottomSibling, this._currentDrag.placeholder);
287298
return index + 1;
288299
}
300+
289301
};
290302

291303
ReorderDrag.prototype.end = function(e, doneCallback) {

Diff for: test/html/list.html

+4
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,10 @@ <h1 class="title">Ionic Delete/Option Buttons</h1>
2424
</div>
2525
</ion-header-bar>
2626

27+
<ion-header-bar class="bar-positive bar-assertive bar-subheader">
28+
<h1 class="title">Subheader</h1>
29+
</ion-header-bar>
30+
2731
<ion-content>
2832
<!--
2933
Search bar

0 commit comments

Comments
 (0)