added .remove(..) + tweaking fullscreen mode...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-07-28 21:23:00 +03:00
parent 0ff97ccb6f
commit cafb50054c
2 changed files with 29 additions and 10 deletions

View File

@ -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
- <s>Gallery: remove image</s>
- mark images for deletion + delete marked
- <s>Gallery: serialize / deserialize</s>
- <s>Lightbox: navigation (keyboard / mouse)</s>
- <s>Lightbox: fullscreen mode</s>

View File

@ -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){