X-Git-Url: http://www.average.org/gitweb/?p=mkgallery.git;a=blobdiff_plain;f=include%2Fgallery.js;h=a870a03eb3d138aa4693df1c8a00beb305061d63;hp=5cd2b5d9261718c67b0c160bbabda9739e336ca2;hb=dc476cc5961e6326e9a922f9eb8b1220a6d7ae41;hpb=f8281d2d6eaaa20f2c65d9753a2870df1310fd1a

diff --git a/include/gallery.js b/include/gallery.js
index 5cd2b5d..a870a03 100644
--- a/include/gallery.js
+++ b/include/gallery.js
@@ -5,123 +5,64 @@
         http://www.average.org/mkgallery/
 
 	Uses mootools (1.2) http://www.mootools.net/
-	Uses slideshow http://www.phatfusion.net/slideshow/
+	Uses multibox http://www.phatfusion.net/multibox/
+	Inspired by slideshow http://www.phatfusion.net/slideshow/
 */
 
 /*
 	Use slideshow classes with the index generated by mkgallery.pl
 */
 
-var showControls = new Class({
-
-	getOptions: function(){
-		return {
-			next: $empty,
-			prev: $empty,
-			stop: $empty,
-			play: $empty,
-			exit: $empty,
-		}
-	},
-
-	initialize: function(name,options){
-		this.setOptions(this.getOptions(), options)
-
-		this.container = $(name)
-
-		var buttons = ['prev','stop','play','next','exit','comm']
-		buttons.each(function(el){
-			var sub = new Element('div')
-			if (this.options[el]) {
-				sub.addEvent('click', function() {
-					this.options[el]()
-				}.bind(this))
-			}
-			sub.addClass('controlButton').setProperties({
-				id: el,
-				name: el,
-			}).injectInside(this.container)
-		},this)
-	},
-
-})
-showControls.implement(new Options)
-
-/* Make overlay window and start slideshow */
-function showImage(id,doplay) {
-	var i=rimgs[id]
-	/* alert('show id='+id+' index='+i+' doplay='+doplay) */
-	showwin.show()
-	show.play(i)
-	if (!doplay) {
-		show.stop()
-	}
-	return false
-}
-
-/* Stop slideshow and return to index page */
-function showStop() {
-	show.quit()
-	showwin.hide()
-	return false
-}
-
-/* List of lists of img variations. Each image variation is a three-element  */
-/* array: [width, height, url]. Index of the outer array is the global ID.   */
-var vimgs=[]
-/*
- * [
- *  [ id, title, [
- *                [ width, height, url ]
- *                ...
- *               ]
- *   ...
- *  ]
- *  ...
- * ]
-*/
-/* resolve string ID to index No which is the index in vimgs[] array */
-var rimgs=[]
-
 /* Initialize everything, to be called on domready */
 function init_gallery() {
-	$$('.conceal').each(function(el){
-		el.setStyle('display', 'none')
-	})
-	$$('a.infoBox').each(function(el){
-		var url=el.get('href')
-		el.set('href',url+'?conceal')
-	})
-	$$('a.showStart').each(function(el){
-		el.addEvent('click', showImage.bind(el,[el.get('id'),1]))
-	})
-	$$('a.showImage').each(function(el){
-		el.addEvent('click', showImage.bind(el,[el.get('id'),0]))
-	})
+
+	/* List of lists of img variations. Each image variation is
+	 * a three-element array: [width, height, url]. Index of the
+	 * outer array is the global ID.
+	 *
+	 * [
+	 *  [ id, title, [
+	 *                [ width, height, url ]
+	 *                ...
+	 *               ]
+	 *   ...
+	 *  ]
+	 *  ...
+	 * ]
+	*/
+	var vimgs=[];
+
+	/* resolve string ID to index No which is the index in vimgs[] array */
+	var rimgs=[];
+
+	/* Populate images list */
+
 	$$('div.varimages').each(function(el,i){
-		rimgs[el.id] = i
-		vimgs[i] = []
+		rimgs[el.id] = i;
+		vimgs[i] = [el.id, el.title, []];
 		el.getElements('a').each(function(ael,j){
-			dim = /(\d+)[^\d](\d+)/.exec(ael.text)
-			w = dim[1]
-			h = dim[2]
-			vimgs[i][j]=[w,h,ael.href,el.id,el.title]
-		})
-	})
+			dim = /(\d+)[^\d](\d+)/.exec(ael.text);
+			w = dim[1];
+			h = dim[2];
+			vimgs[i][2][j]=[w,h,ael.href];
+		});
+	});
 
 			/* debugging output
-	var msg='loaded '+vimgs.length+' image descriptions:'
+	var msg='loaded '+vimgs.length+' image descriptions:';
 	vimgs.each(function(vimg,i){
-		msg+='\nid='+i
-		vimg.each(function(vimg,i){
-			msg+='\n     w='+vimg[0]+' h='+vimg[1]+' url='+vimg[2]
-		})
-	})
-	alert(msg)
+		msg+='\nid='+i+' ('+vimg[0]+') title='+vimg[1];
+		vimg[2].each(function(vv,i){
+			msg+='\n     w='+vv[0]+' h='+vv[1]+' url='+vv[2];
+		});
+	});
+	alert(msg);
 			/* end debugging output */
 
-	var ovlparams = {}
-	ovl = new overlay(ovlparams)
+	/* Initialize objects */
+
+	var ovlparams = {};
+	ovl = new overlay(ovlparams);
 
 	var iboxparams = {
 		overlay: ovl,
@@ -131,41 +72,67 @@ function init_gallery() {
 		movieWidth: 640,
 		movieHeight: 480,
 		descClassName: 'infoBoxDesc',
-	}
-	ibox = new multiBox('infoBox', iboxparams)
+	};
+	ibox = new multiBox('infoBox', iboxparams);
 
 	var winparms = {
-		/* onClick: showStop,  /* temporarily */
-		embed: ['slideshowControls'],
-	}
-	showwin = new showWindow('slideshowContainer',winparms)
+		tohide: 'indexContainer',
+	};
+	var showwin = new showWindow('slideshowContainer',winparms);
+
+	var ctlparams = {
+	};
+	var ctl = new Controls('slideshowControls','slideshowContainer',
+				ctlparams);
 
 	var showparms = {
-		wait: 3000,
-		effect: 'fade',
-		duration: 1000,
-		loop: false, 
-		thumbnails: false,
-		onClick: function(i){alert(i)},
-		comment: 'comm',
-	}
-	show = new slideShow('slideshowContainer',vimgs,showparms)
+		cbStart: function(){ showwin.show(); },
+		cbExit: function(){ showwin.hide(); },
+	};
+	var show = new Show(vimgs,showwin,ctl,showparms);
+
+	document.addEvent('keypress', function(ev){
+		if (ev.key == 'esc') {
+			show.exit();
+		} else if (ev.key == 'left') {
+			show.prev();
+		} else if (ev.key == 'right') {
+			show.next();
+		} else if (ev.key == 'space') {
+			show.toggleplay();
+		} else {
+			/* alert('keypress: '+ev.key); */
+		}
+	});
 
-	var ctlparams = {
-		next: function(){show.next()},
-		prev: function(){show.previous()},
-		stop: function(){show.stop()},
-		play: function(){show.play()},
-		exit: function(){showStop()},
-	}
-	ctl = new showControls('slideshowControls',ctlparams)
+	/* Update HTML */
 
-	parsedurl = parseUrl(document.URL)
-	/* alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL) */
+	$$('.conceal').each(function(el){
+		el.setStyle('display', 'none');
+	});
+	$$('a.infoBox').each(function(el){
+		var url=el.get('href');
+		el.set('href',url+'?conceal');
+	});
+
+	$$('a.showStart').each(function(el){
+		el.addEvent('click',
+				show.start.bind(show,[rimgs[el.get('id')],1]));
+	});
+	$$('a.showImage').each(function(el){
+		el.addEvent('click',
+				show.start.bind(show,[rimgs[el.get('id')],0]));
+	});
+
+	/* Determine if we need to go directly into show mode */
+
+	parsedurl = parseUrl(document.URL);
+	/* alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL); */
 	if ($chk(parsedurl['anchor'])){
-		showImage(parsedurl['anchor'],0)
+		show.start(rimgs[parsedurl['anchor']],0);
 	}
 }
 
 /* Initialization */
-window.addEvent('domready',init_gallery)
+window.addEvent('domready',init_gallery);
+