X-Git-Url: http://www.average.org/gitweb/?p=mkgallery.git;a=blobdiff_plain;f=include%2Fshow.js;h=5016928d2c1cef6718a1298260954e8616a3e461;hp=065898393fb3dcec995800df564f7961041726d9;hb=2442719e0866f7733d1b171307d1a39ffdb8b8cf;hpb=84036a64eb5be457cfa21450ddc7da596eec8bbc diff --git a/include/show.js b/include/show.js index 0658983..5016928 100644 --- a/include/show.js +++ b/include/show.js @@ -43,6 +43,7 @@ var Show = new Class({ cbExit: function(){ alert('show exit undefined'); }, percentage: 98, delay: 5000, + fxduration: 200, } }, @@ -59,16 +60,30 @@ var Show = new Class({ curr: {}, next: {}, }; +/* + * thescripts.com/forum/thread170365.html + */ + var hashpos = document.URL.search(/#/); + if (hashpos > 0) { + this.baseurl = document.URL.slice(0,hashpos); + } else { + this.baseurl = document.URL + } + this.updatecoords(); - this.previd = -1; - this.ondisplay = new Element('img'). + this.prevdisplay = new Element('img'). + set('class', 'mainformat'). + setProperty('alt', 'Current Image'). + setStyle('opacity', 0). + injectInside(this.container.container); + this.ondisplay = this.prevdisplay.clone(). injectInside(this.container.container); this.loadingdiv = new Element('div'). addClass('loading').setStyles({ position: 'absolute', top: 0, left: 0, - zIndex: 3, + zIndex: 4, display: 'none', width: this.coords.width, height: this.coords.height, @@ -92,7 +107,7 @@ var Show = new Class({ if (this.currentid > 0) { this.show(this.currentid-1); } else { - alert('show.prev called beyond first element'); + /* alert('show.prev called beyond first element'); */ } }, @@ -109,18 +124,26 @@ var Show = new Class({ this.controls.running(1); }, + toggleplay: function(){ + if (this.isplaying) { this.stop(); } + else { this.play(); } + }, + next: function(){ if (this.currentid < this.vimgs.length-1) { this.show(this.currentid+1); } else { - alert('show.next called beyond last element'); + /* alert('show.next called beyond last element'); */ } }, exit: function(){ if (this.isplaying) { $clear(this.timer); } + this.prevdisplay.setStyle('display', 'none'); + this.ondisplay.setStyle('display', 'none'); this.stopfx(); this.options.cbExit(); + document.location.href = this.baseurl; }, comm: function(){ @@ -133,6 +156,7 @@ var Show = new Class({ this.options.cbStart(); this.isplaying = play; this.controls.running(this.isplaying); + this.updatecoords(); this.show(id); return false; /* to make it usable from href links */ }, @@ -141,7 +165,6 @@ var Show = new Class({ show: function(id){ /* alert('called show.show('+id+')'); */ - this.previd = this.currentid; this.currentid = id; var newcache = { prev: (id > 0)?this.prepare(id-1):{}, @@ -156,8 +179,9 @@ var Show = new Class({ this.pendingload = true; this.showloading(); } + document.location.href = this.baseurl+'#'+this.vimgs[id][0]; this.controls.info(id,this.vimgs.length, - this.vimgs[id][0], + '#'+this.vimgs[id][0], this.vimgs[id][1]); }, @@ -218,8 +242,28 @@ var Show = new Class({ var newstyle = this.calcsize(cachel); var newimg = cachel.img.clone(); newimg.setStyles(newstyle); + newimg.setStyles({ + zIndex: 3, + opacity: 0, + }); + this.prevdisplay.dispose(); + this.prevdisplay = this.ondisplay.clone(). + setStyle('zIndex', 2).injectInside(this.container.container); newimg.replaces(this.ondisplay); this.ondisplay = newimg; + this.effect(); + }, + + effect: function(){ + this.fx = new Fx.Tween(this.ondisplay, { + duration: this.options.fxduration, + }); + this.fx.addEvent('complete',this.displaycomplete.bind(this)); + this.fx.start('opacity', 0, 1); + }, + + displaycomplete: function(){ + this.prevdisplay.setStyle('display', 'none'); if (this.isplaying) { this.timer = this.autonext.delay(this.delay,this); } @@ -269,6 +313,7 @@ var Show = new Class({ }, stopfx: function(){ + if (this.fx) this.fx.cancel(); }, updatecoords: function(){