cleanup and notes...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-11 13:28:12 +03:00
parent 08a71c6244
commit 0640c7da14

View File

@ -764,11 +764,12 @@ var Gallery = {
if(i >= 0){ if(i >= 0){
dragged = evt.target dragged = evt.target
dragged.classList.add('dragging') } }) dragged.classList.add('dragging') } })
// NOTE: this prevents jumping back and forth if moving image
// causes a resize that causes the image to move again...
var skip_dragover = false var skip_dragover = false
this.dom this.dom
.addEventListener('dragenter', function(evt){ .addEventListener('dragenter', function(evt){
// NOTE: this prevents jumping back and forth if moving
// image causes a resize that causes the image to
// move again...
if(skip_dragover){ if(skip_dragover){
return } return }
var target = evt.target var target = evt.target
@ -796,8 +797,11 @@ var Gallery = {
// it at the other side ow the wide image but the cursor is // it at the other side ow the wide image but the cursor is
// now over the wide image so to drag back we either need // now over the wide image so to drag back we either need
// to exit it and drag over again (not intuitive) or simply // to exit it and drag over again (not intuitive) or simply
// drag over the oppoiste edge of the wide image (dragleave handler) // drag over the oppoiste edge of the wide image (dragleave
// XXX should we do all the dragging here??? // handler)
// NOTE: we are not implementing the whole drag process here
// because dragging up/down here is far more complicated
// than when doing it in dragover...
this.dom this.dom
.addEventListener('dragleave', function(evt){ .addEventListener('dragleave', function(evt){
if(skip_dragover){ if(skip_dragover){
@ -807,19 +811,20 @@ var Gallery = {
var i = images.indexOf(target) var i = images.indexOf(target)
if(dragged !== target if(dragged !== target
&& i >= 0){ && i >= 0){
var prev = images[i-1]
var next = images[i+1]
// left edge... // left edge...
if(evt.offsetX <= 0){ if(evt.offsetX <= 0){
var prev = images[i-1]
// adjacent image is not on the same offsetTop (edge)
if(prev == null if(prev == null
|| prev.offsetTop != target.offsetTop){ || prev.offsetTop != target.offsetTop){
target.before(dragged) target.before(dragged)
that.updateMarkers() } that.updateMarkers() }
// right edge... // right edge...
} else { } else {
var next = images[i+1]
// adjacent image is not on the same offsetTop (edge)
if(next == null if(next == null
|| next.offsetTop != target.offsetTop){ || next.offsetTop != target.offsetTop){
console.log('RIGHT', target, dragged)
target.after(dragged) target.after(dragged)
that.updateMarkers() } } } }) that.updateMarkers() } } } })
this.dom this.dom