var viewer = new Class({ mode: 'rand', modes: ['alpha'], sizes: { w: 269, h: 166 }, fxOptions: { duration: 1500 }, interval: 4000, initialize: function(a, b) { if (b) for (var o in b) this[o] = b[o]; if (this.buttons) { this.buttons.previous.addEvent('click', this.previous.bind(this, [true])); this.buttons.next.addEvent('click', this.next.bind(this, [true])) } this._current = 0; this._previous = null; this.items = a.setStyle('display', 'none'); this.items[this._current].setStyle('display', 'block'); this.disabled = false; this.attrs = { left: ['left', -this.sizes.w, 0, 'px'], top: ['top', -this.sizes.h, 0, 'px'], right: ['left', this.sizes.w, 0, 'px'], bottom: ['top', this.sizes.h, 0, 'px'], alpha: ['opacity', 0, 1, ''] }; this.rand = this.mode == 'rand'; this.sequence = typeof (this.mode) == 'object' ? this.mode : false; this.curseq = 0; this.timer = null }, walk: function(n, b) { if (this._current !== n && !this.disabled) { this.disabled = true; if (b) { this.stop() } if (this.rand) { this.mode = this.modes.getRandom() } else if (this.sequence) { this.mode = this.sequence[this.curseq]; this.curseq += this.curseq + 1 < this.sequence.length ? 1 : -this.curseq } this._previous = this._current; this._current = n; var a = this.attrs[this.mode].associate(['p', 'f', 't', 'u']); for (var i = 0; i < this.items.length; i++) { if (this._current === i) { this.items[i].setStyles($extend({ 'display': 'block', 'z-index': '2' }, JSON.decode('{"' + a.p + '":"' + a.f + a.u + '"}'))) } else if (this._previous === i) { this.items[i].setStyles({ 'z-index': '1' }) } else { this.items[i].setStyles({ 'display': 'none', 'z-index': '0' }) } } this.items[n].set('tween', { onComplete: this.onComplete.bind(this) }).tween(a.p, a.f, a.t) } }, play: function(a) { this.stop(); if (!a) { this.next() } this.timer = this.next.periodical(this.interval, this, [false]) }, stop: function() { $clear(this.timer) }, next: function(a) { this.walk(this._current + 1 < this.items.length ? this._current + 1 : 0, a) }, previous: function(a) { this.walk(this._current > 0 ? this._current - 1 : this.items.length - 1, a) }, onComplete: function() { this.disabled = false; this.items[this._previous].setStyle('display', 'none'); if (this.onWalk) this.onWalk(this._current) } });