include/gallery.js

   1 /*
   2         This is a part of mkgallery.pl suite
   3         http://www.average.org/mkgallery/
   4
   5         Uses mootools (1.1) http://www.mootools.net/
   6         Uses slideshow http://www.phatfusion.net/slideshow/
   7 */
   8
   9 /*
  10         Slideshow
  11 */
  12
  13 var ShowWindow = new Class({
  14
  15         getOptions: function(){
  16                 return {
  17                         zIndex: 2,
  18                         container: document.body,
  19                         onClick: Class.empty
  20                 };
  21         },
  22
  23         initialize: function(div,options){
  24                 this.setOptions(this.getOptions(), options);
  25
  26                 this.options.container = $(this.options.container);
  27
  28                 this.div = $(div);
  29                 this.div.setStyles({
  30                         position: 'absolute',
  31                         left: '0px',
  32                         top: '0px',
  33                         width: '100%',
  34                         zIndex: this.options.zIndex,
  35                         overflow: 'hidden',
  36                         display: 'none'
  37                 });
  38                 this.div.addEvent('click', function(){
  39                         this.options.onClick();
  40                 }.bind(this));
  41
  42                 this.position();
  43
  44                 window.addEvent('resize', this.position.bind(this));
  45                 window.addEvent('scroll', this.position.bind(this));
  46         },
  47
  48         position: function(){
  49                 if(this.options.container == document.body){
  50                         var h = window.getHeight()+'px';
  51                         var s = window.getScrollTop()+'px';
  52                         this.div.setStyles({top: s, height: h});
  53                 }else{
  54                         var myCoords = this.options.container.getCoordinates();
  55                         this.div.setStyles({
  56                                 top: myCoords.top+'px',
  57                                 height: myCoords.height+'px',
  58                                 left: myCoords.left+'px',
  59                                 width: myCoords.width+'px'
  60                         });
  61                 }
  62         },
  63
  64         show: function(){
  65                 this.div.setStyles({display: 'block'});
  66         },
  67
  68         hide: function(){
  69                 this.div.setStyles({display: 'none'});
  70         }
  71 });
  72 ShowWindow.implement(new Options);
  73
  74 /* Make overlay window and start slideshow */
  75 function run_slideshow(startid) {
  76  showwin.show();
  77  show.stop();
  78  if (startid < 0) {
  79   show.play(0);
  80  } else {
  81   show.play(startid);
  82   show.stop();
  83  }
  84  return false;
  85 }
  86
  87 /* Stop slideshow and return to index page */
  88 function stop_slideshow() {
  89  show.stop();
  90  showwin.hide();
  91  return false;
  92 }
  93
  94 /* List of lists of img variations. Each image variation is a three-element  */
  95 /* array: [width, height, url]. Index of the outer array is the global ID.   */
  96 var vimgs=[]
  97 /*
  98  * [
  99  *  [
 100  *   [width, height, url]
 101  *   ...
 102  *  ]
 103  *  ...
 104  * ]
 105 */
 106 /* Initialize everything, to be called on domready */
 107 function init_gallery() {
 108  $$('div.varimages').each(function(el){
 109   var id=el.id
 110   vimgs[id]=[]
 111   el.getElements('a').each(function(ael,i){
 112    dim = /(\d+)[^\d](\d+)/.exec(ael.text)
 113    w = dim[1]
 114    h = dim[2]
 115    vimgs[id][i]=[w,h,ael.href]
 116   })
 117  })
 118    /* debugging output
 119  var msg='loaded '+vimgs.length+' image descriptions:'
 120  vimgs.each(function(vimg,i){
 121   msg+='\nid='+i
 122   vimg.each(function(vimg,i){
 123    msg+='\n     w='+vimg[0]+' h='+vimg[1]+' url='+vimg[2]
 124   })
 125  })
 126  alert(msg)
 127    /* end debugging output */
 128
 129  var iboxparams = {
 130   useOverlay: true,
 131   showNumbers: false,
 132   openFromLink: false,
 133   descClassName: 'infoboxdesc',
 134  }
 135  ibox = new MultiBox('infobox', iboxparams)
 136
 137  var winparms = {}
 138  showwin = new ShowWindow('slideshowWindow',winparms)
 139
 140  var showparms = {
 141   wait: 3000,
 142   effect: 'fade',
 143   duration: 1000,
 144   loop: true,
 145   thumbnails: true,
 146   onClick: function(i){alert(i)}
 147  }
 148  show = new SlideShow('slideshowContainer','slideshowThumbnail',showparms)
 149
 150  parsedurl = parseUrl(document.URL)
 151  // alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL)
 152  if ($chk(parsedurl['anchor'])){
 153   run_slideshow(parsedurl['anchor'])
 154  }
 155 }
 156
 157 /* Initialization */
 158 window.addEvent('domready',init_gallery)