include/gallery.js

   1 /*
   2         $Id$
   3
   4         This is a part of mkgallery.pl suite
   5         http://www.average.org/mkgallery/
   6
   7         Uses mootools (1.2) http://www.mootools.net/
   8         Uses slideshow http://www.phatfusion.net/slideshow/
   9 */
  10
  11 /*
  12         Use slideshow classes with the index generated by mkgallery.pl
  13 */
  14
  15 var showControls = new Class({
  16
  17         getOptions: function(){
  18                 return {
  19                         next: $empty,
  20                         prev: $empty,
  21                         stop: $empty,
  22                         play: $empty,
  23                         exit: $empty,
  24                 }
  25         },
  26
  27         initialize: function(name,options){
  28                 this.setOptions(this.getOptions(), options)
  29
  30                 this.container = $(name)
  31
  32                 var buttons = ['prev','stop','play','next','exit','comm']
  33                 buttons.each(function(el){
  34                         var sub = new Element('div')
  35                         if (this.options[el]) {
  36                                 sub.addEvent('click', function() {
  37                                         this.options[el]()
  38                                 }.bind(this))
  39                         }
  40                         sub.addClass('controlButton').setProperties({
  41                                 id: el,
  42                                 name: el,
  43                         }).injectInside(this.container)
  44                 },this)
  45         },
  46
  47 })
  48 showControls.implement(new Options)
  49
  50 /* Make overlay window and start slideshow */
  51 function showImage(id,doplay) {
  52         var i=rimgs[id]
  53         /* alert('show id='+id+' index='+i+' doplay='+doplay) */
  54         showwin.show()
  55         show.play(i)
  56         if (!doplay) {
  57                 show.stop()
  58         }
  59         return false
  60 }
  61
  62 /* Stop slideshow and return to index page */
  63 function showStop() {
  64         show.quit()
  65         showwin.hide()
  66         return false
  67 }
  68
  69 /* List of lists of img variations. Each image variation is a three-element  */
  70 /* array: [width, height, url]. Index of the outer array is the global ID.   */
  71 var vimgs=[]
  72 /*
  73  * [
  74  *  [ id, title, [
  75  *                [ width, height, url ]
  76  *                ...
  77  *               ]
  78  *   ...
  79  *  ]
  80  *  ...
  81  * ]
  82 */
  83 /* resolve string ID to index No which is the index in vimgs[] array */
  84 var rimgs=[]
  85
  86 /* Initialize everything, to be called on domready */
  87 function init_gallery() {
  88         $$('.conceal').each(function(el){
  89                 el.setStyle('display', 'none')
  90         })
  91         $$('a.infoBox').each(function(el){
  92                 var url=el.get('href')
  93                 el.set('href',url+'?conceal')
  94         })
  95         $$('a.showStart').each(function(el){
  96                 el.addEvent('click', showImage.bind(el,[el.get('id'),1]))
  97         })
  98         $$('a.showImage').each(function(el){
  99                 el.addEvent('click', showImage.bind(el,[el.get('id'),0]))
 100         })
 101         $$('div.varimages').each(function(el,i){
 102                 rimgs[el.id] = i
 103                 vimgs[i] = []
 104                 el.getElements('a').each(function(ael,j){
 105                         dim = /(\d+)[^\d](\d+)/.exec(ael.text)
 106                         w = dim[1]
 107                         h = dim[2]
 108                         vimgs[i][j]=[w,h,ael.href,el.id,el.title]
 109                 })
 110         })
 111
 112                         /* debugging output
 113         var msg='loaded '+vimgs.length+' image descriptions:'
 114         vimgs.each(function(vimg,i){
 115                 msg+='\nid='+i
 116                 vimg.each(function(vimg,i){
 117                         msg+='\n     w='+vimg[0]+' h='+vimg[1]+' url='+vimg[2]
 118                 })
 119         })
 120         alert(msg)
 121                         /* end debugging output */
 122
 123         var ovlparams = {}
 124         ovl = new overlay(ovlparams)
 125
 126         var iboxparams = {
 127                 overlay: ovl,
 128                 showNumbers: false,
 129                 showControls: true,
 130                 openFromLink: false,
 131                 movieWidth: 640,
 132                 movieHeight: 480,
 133                 descClassName: 'infoBoxDesc',
 134         }
 135         ibox = new multiBox('infoBox', iboxparams)
 136
 137         var winparms = {
 138                 /* onClick: showStop,  /* temporarily */
 139                 embed: ['slideshowControls'],
 140         }
 141         showwin = new showWindow('slideshowContainer',winparms)
 142
 143         var showparms = {
 144                 wait: 3000,
 145                 effect: 'fade',
 146                 duration: 1000,
 147                 loop: false,
 148                 thumbnails: false,
 149                 onClick: function(i){alert(i)},
 150                 comment: 'comm',
 151         }
 152         show = new slideShow('slideshowContainer',vimgs,showparms)
 153
 154         var ctlparams = {
 155                 next: function(){show.next()},
 156                 prev: function(){show.previous()},
 157                 stop: function(){show.stop()},
 158                 play: function(){show.play()},
 159                 exit: function(){showStop()},
 160         }
 161         ctl = new showControls('slideshowControls',ctlparams)
 162
 163         parsedurl = parseUrl(document.URL)
 164         /* alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL) */
 165         if ($chk(parsedurl['anchor'])){
 166                 showImage(parsedurl['anchor'],0)
 167         }
 168 }
 169
 170 /* Initialization */
 171 window.addEvent('domready',init_gallery)