now serialization supports both attrs and classes...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

grid-n-view.html

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

grid-n-view.js

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