X-Git-Url: http://www.average.org/gitweb/?p=mkgallery.git;a=blobdiff_plain;f=include%2Fgallery.js;h=3dcc3c2201a7088a931e74bf40c3d9e8fa9c319d;hp=40707fe1eb8afc94062155745280c5ecdf8fb896;hb=b28da5acd20f0d611ecd7fae9ed6942c239adda6;hpb=0605e5404527fedc6da3fafbf8c7da1536aadd2c diff --git a/include/gallery.js b/include/gallery.js index 40707fe..3dcc3c2 100644 --- a/include/gallery.js +++ b/include/gallery.js @@ -14,19 +14,23 @@ var showWindow = new Class({ getOptions: function(){ return { + embed: [], zIndex: 2, container: document.body, onClick: $empty, } }, - initialize: function(div,options){ + initialize: function(name,options){ this.setOptions(this.getOptions(), options) this.options.container = $(this.options.container) - this.div = $(div) - this.div.setStyles({ + this.container = new Element('div').addClass(name). + setProperties({ + id: name, + name: name, + }).setStyles({ position: 'absolute', left: '0px', top: '0px', @@ -34,10 +38,19 @@ var showWindow = new Class({ zIndex: this.options.zIndex, overflow: 'hidden', display: 'none' - }) - this.div.addEvent('click', function(){ + }).addEvent('click', function(){ this.options.onClick() - }.bind(this)) + }.bind(this)).injectInside(this.options.container); + + this.embedded = [] + this.options.embed.each(function(el){ + var sub = new Element('div') + sub.addClass(el).setProperties({ + id: el, + name: el, + }).injectInside(this.container) + this.embedded.push(sub) + },this) this.position() @@ -47,30 +60,64 @@ var showWindow = new Class({ position: function(){ if(this.options.container == document.body){ - var h = window.getHeight()+'px' - var s = window.getScrollTop()+'px' - this.div.setStyles({top: s, height: h}) + this.h = window.getHeight() + this.s = window.getScrollTop() }else{ var myCoords = this.options.container.getCoordinates() - this.div.setStyles({ - top: myCoords.top+'px', - height: myCoords.height+'px', - left: myCoords.left+'px', - width: myCoords.width+'px' - }) + this.h = myCoords.height + this.s = myCoords.top } + this.container.setStyles({ + top: this.s+'px', + height: this.h+'px' + }) }, show: function(){ - this.div.setStyles({display: 'block'}) + this.container.setStyle('display', 'block') }, hide: function(){ - this.div.setStyles({display: 'none'}) + this.container.setStyle('display', 'none') } }) showWindow.implement(new Options) +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] @@ -85,7 +132,7 @@ function showImage(id,doplay) { /* Stop slideshow and return to index page */ function showStop() { - show.stop() + show.quit() showwin.hide() /* var img = show.newImage.getElement('img'); @@ -142,14 +189,13 @@ function init_gallery() { el.addEvent('click', showImage.bind(el,[el.get('id'),0])) }) $$('div.varimages').each(function(el,i){ - var id=el.id - rimgs[id]=i - vimgs[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] + vimgs[i][j]=[w,h,ael.href,el.id,el.title] }) }) /* debugging output @@ -177,18 +223,31 @@ function init_gallery() { } ibox = new multiBox('infoBox', iboxparams) - var winparms = {} - showwin = new showWindow('slideshowWindow',winparms) + var winparms = { + /* onClick: showStop, /* temporarily */ + embed: ['slideshowControls'], + } + showwin = new showWindow('slideshowContainer',winparms) var showparms = { wait: 3000, effect: 'fade', duration: 1000, loop: false, - thumbnails: true, - onClick: function(i){alert(i)} + 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()}, } - show = new slideShow('slideshowContainer','slideshowThumbnail',showparms) + ctl = new showControls('slideshowControls',ctlparams) parsedurl = parseUrl(document.URL) /* alert('Anchor: '+parsedurl['anchor']+'\nURL: '+document.URL) */