wip

[mkgallery.git] / include / gallery.js

diff --git a/include/gallery.js b/include/gallery.js
index 3c2e1f3d2445326ec22164102ca839dcd6b602fb..5cd2b5d9261718c67b0c160bbabda9739e336ca2 100644 (file)
--- a/include/gallery.js
+++ b/include/gallery.js
@@ -1,35 +1,171 @@
-function showIbox(iboxid) {
- var ibox = document.getElementById(iboxid);
- var wwidth;
- var wheight;
- var bwidth = 400;
- var bheight = 300;
- if (self.innerWidth)
- {
-  wwidth = self.innerWidth;
-  wheight = self.innerHeight;
- }
- else if (document.documentElement && document.documentElement.clientWidth)
- {
-  wwidth = document.documentElement.clientWidth;
-  wheight = document.documentElement.clientHeight;
- }
- else if (document.body)
- {
-  wwidth = document.body.clientWidth;
-  wheight = document.body.clientHeight;
- }
- ibox.style.width = bwidth + "px";
- ibox.style.height = bheight + "px";
- ibox.style.left = ((wwidth - bwidth) / 2) + "px";
- ibox.style.top = ((wheight - bheight) / 2) + "px";
- // alert('wwidth='+wwidth+'; bwidth='+bwidth+'; wheight='+wheight+'; bheight='+bheight);
- ibox.zIndex = '0';
- ibox.style.display = 'block';
- return false;
+/*
+       $Id$
+
+        This is a part of mkgallery.pl suite
+        http://www.average.org/mkgallery/
+
+       Uses mootools (1.2) http://www.mootools.net/
+       Uses 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
 }
-function HideIbox(iboxid) {
- var ibox = document.getElementById(iboxid);
- ibox.zIndex = '1000';
- ibox.style.display = 'none';
+
+/* 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]))
+       })
+       $$('div.varimages').each(function(el,i){
+               rimgs[el.id] = i
+               vimgs[i] = []
+               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]
+               })
+       })
+
+                       /* debugging output
+       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)
+                       /* end debugging output */
+
+       var ovlparams = {}
+       ovl = new overlay(ovlparams)
+
+       var iboxparams = {
+               overlay: ovl,
+               showNumbers: false,
+               showControls: true,
+               openFromLink: false,
+               movieWidth: 640,
+               movieHeight: 480,
+               descClassName: 'infoBoxDesc',
+       }
+       ibox = new multiBox('infoBox', iboxparams)
+
+       var winparms = {
+               /* onClick: showStop,  /* temporarily */
+               embed: ['slideshowControls'],
+       }
+       showwin = new showWindow('slideshowContainer',winparms)
+
+       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)
+
+       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)
+
+       parsedurl = parseUrl(document.URL)
+       /* alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL) */
+       if ($chk(parsedurl['anchor'])){
+               showImage(parsedurl['anchor'],0)
+       }
+}
+
+/* Initialization */
+window.addEvent('domready',init_gallery)