added drag sorting...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-10 03:53:12 +03:00
parent 5a52210b18
commit 8dfc1426a9
2 changed files with 35 additions and 16 deletions

View File

@ -92,9 +92,10 @@ var restoreScroll = function(){
- crop stack (a-la ImageGrid.Viewer) - crop stack (a-la ImageGrid.Viewer)
- actions: - actions:
- "from selection" - "from selection"
- Gallery: drag-n-drop - <s>Gallery: drag-n-drop</s>
- <s>drop files/images</s> -- add loading indicator - <s>drop files/images</s> -- add loading indicator
- drag to sort - <s>drag to sort</s>
- styling...
- <s>Gallery: remove image</s> - <s>Gallery: remove image</s>
- UI: mark images for deletion + delete marked - UI: mark images for deletion + delete marked
- <s>Gallery: serialize / deserialize</s> - <s>Gallery: serialize / deserialize</s>

View File

@ -752,14 +752,29 @@ var Gallery = {
.addEventListener('click', function(evt){ .addEventListener('click', function(evt){
that.unmark_current that.unmark_current
&& (that.current = null) }) && (that.current = null) })
// drag/drop... // drag/drop: sort...
// XXX add a local drag mode... // XXX should we support multi-drag???
var dragged
this.dom
.addEventListener('dragstart', function(evt){
var i = that.images.indexOf(evt.target)
if(i >= 0){
dragged = evt.target } })
this.dom
.addEventListener('dragenter', function(evt){
var i = that.images.indexOf(evt.target)
if(i >= 0){
var target = evt.target
evt.offsetX < evt.target.offsetWidth / 2 ?
target.after(dragged)
: target.before(dragged) } })
this.dom this.dom
.addEventListener('dragover', function(evt){ .addEventListener('dragover', function(evt){
evt.preventDefault() evt.preventDefault()
evt.stopPropagation() evt.stopPropagation()
evt.dataTransfer.dropEffect = 'copy' evt.dataTransfer.dropEffect = 'copy' }, false)
}, false) // drag/drop: files...
// XXX handle serilized data...
this.dom this.dom
.addEventListener('drop', function(evt){ .addEventListener('drop', function(evt){
evt.preventDefault() evt.preventDefault()
@ -776,8 +791,11 @@ var Gallery = {
Promise.all(files Promise.all(files
.map(function(file){ .map(function(file){
if(!file.type.match('image.*')){ // XXX handle serilized data...
return [] } // XXX
// images...
if(file.type.match('image.*')){
if(file.path){ if(file.path){
return file.path return file.path
} else { } else {
@ -785,7 +803,7 @@ var Gallery = {
var reader = new FileReader() var reader = new FileReader()
reader.onload = function(f){ reader.onload = function(f){
resolve(f.target.result) } resolve(f.target.result) }
reader.readAsDataURL(file) }) } }) reader.readAsDataURL(file) }) } } })
.flat()) .flat())
.then( .then(
function(images){ function(images){