wip
[mkgallery.git] / 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)