olyakonstantin/gallery
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

now serialization supports both attrs and classes...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-03 18:06:30 +03:00
parent ff90a6deee
commit 277a78dc4f
2 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
grid-n-view.html
View File

@ -32,6 +32,7 @@ body {
var SCROLL_TIMEOUT = 100 var SCROLL_TIMEOUT = 100
// save/restore scroll position... // save/restore scroll position...
// XXX might also be nice to restory current image and selection...
window.addEventListener('beforeunload', function(){ window.addEventListener('beforeunload', function(){
window.scrollX > 0 ? window.scrollX > 0 ?
(sessionStorage.windowScrollX = window.scrollX) (sessionStorage.windowScrollX = window.scrollX)

21
grid-n-view.js
View File

@ -565,8 +565,7 @@ var Gallery = {
return this.updateMarkers() }, return this.updateMarkers() },
show: function(){ show: function(){
this.lightbox.show() return this.showLightbox() },
return this },
showLightbox: function(){ showLightbox: function(){
this.lightbox.show() this.lightbox.show()
return this }, return this },
@ -619,7 +618,10 @@ var Gallery = {
elem.setAttribute('draggable', 'true') elem.setAttribute('draggable', 'true')
for(var [key, value] of Object.entries(data)){ for(var [key, value] of Object.entries(data)){
value value
&& elem.setAttribute(key, value) } // XXX is this a good way to destinguish classes and attrs???
&& (typeof(value) == 'boolean' ?
elem.classList.add(key)
: elem.setAttribute(key, value)) }
elems.push(elem) } elems.push(elem) }
// add to gallery... // add to gallery...
if(index == null){ if(index == null){
@ -634,10 +636,16 @@ var Gallery = {
sibling.after(...elems) sibling.after(...elems)
: sibling.before(...elems) } : sibling.before(...elems) }
return this return this
.updateMarkers()
.update() }, .update() },
__image_attributes__: [ __image_attributes__: [
'caption', 'caption',
], ],
__image_classes__: [
// XXX should this be here or set as a root attribute???
'current',
'marked',
],
// XXX do we handle previews here??? // XXX do we handle previews here???
json: function(images=undefined){ json: function(images=undefined){
var that = this var that = this
@ -650,12 +658,15 @@ var Gallery = {
this.images this.images
: images : images
return images return images
.map(function(img){ .map(function(img, i){
var res = { url: img.src } var res = { url: img.src }
for(var key of that.__image_attributes__){ for(var key of that.__image_attributes__ ?? []){
var value = img.getAttribute(key) var value = img.getAttribute(key)
value value
&& (res[key] = value) } && (res[key] = value) }
for(var key of that.__image_classes__ ?? []){
img.classList.contains(key)
&& (res[key] = true) }
return res }) }, return res }) },
remove: function(...images){ remove: function(...images){