diff --git a/grid-n-view.html b/grid-n-view.html
index 45d33fc..bc740f8 100644
--- a/grid-n-view.html
+++ b/grid-n-view.html
@@ -43,9 +43,11 @@
- "make view from selection"
- close view
- multiple view stack
-- Gallery: drop images
-- Gallery: drag to sort
-- Gallery: remove image
+- Gallery: drag-n-drop
+ - drop files/images
+ - drag to sort
+- Gallery: remove image
+ - mark images for deletion + delete marked
- Gallery: serialize / deserialize
- Lightbox: navigation (keyboard / mouse)
- Lightbox: fullscreen mode
diff --git a/grid-n-view.js b/grid-n-view.js
index cbe7187..039035f 100644
--- a/grid-n-view.js
+++ b/grid-n-view.js
@@ -523,6 +523,7 @@ var Gallery = {
var {url, ...data} = data }
var elem = document.createElement('img')
elem.src = url
+ elem.setAttribute('draggable', 'true')
for(var [key, value] of Object.entries(data)){
value
&& elem.setAttribute(key, value) }
@@ -556,11 +557,23 @@ var Gallery = {
&& (res[key] = value) }
return res }) },
- // XXX
- remove: function(){
- // XXX
+ remove: function(...images){
+ if(images.includes('all')){
+ return this.clear() }
+ // NOTE: we need to remove images from the end so as not to be
+ // affected by shifed indexes...
+ images
+ .sort()
+ .reverse()
+ for(var img of images){
+ typeof(img) == 'number' ?
+ this.images.at(img)?.remove()
+ : img instanceof Element ?
+ (this.images.contains(img)
+ && img.remove())
+ : null }
return this
- },
+ .update() },
clear: function(){
this.dom.querySelector('.images').innerHTML = ''
return this },
@@ -603,6 +616,10 @@ var Gallery = {
// XXX
})
+ // XXX
+ for(var img of this.images){
+ img.setAttribute('draggable', 'true') }
+
// handle resizing...
new ResizeObserver(
function(elems){
@@ -650,6 +667,9 @@ var Lightbox = {
this.gallery.dom.classList.add('lightboxed')
return this },
hide: function(){
+ this.gallery.exit_fullscreen_on_lightbox_close
+ && document.fullscreenElement
+ && document.exitFullscreen()
this.gallery.dom.classList.remove('lightboxed')
return this },
toggle: function(){
@@ -715,9 +735,6 @@ var Lightbox = {
this.dom.querySelector('.close')
.addEventListener('click', function(evt){
evt.stopPropagation()
- that.gallery.exit_fullscreen_on_lightbox_close
- && document.fullscreenElement
- && document.exitFullscreen()
that.hide() })
this.dom.querySelector('.fullscreen')
.addEventListener('click', function(evt){