// Mootools 1.2 thumbnail scroll
// (c)2010 Standupweb

// uses mootools core + Fx.Scroll from mootools more
var SwHTicker = new Class({
    Implements: [Options, Events],
    options: {
		speed: 500, // scrolling speed in pixel/second
		delay: 300, // waiting time between 2 scrolls (in ms), default value: 300
		url: "http://www.merlin-ub.at/admin/module/ticker/getHTickerContent.php", //  URL where to get the folder content via JSON request
		transition: Fx.Transitions.linear,
		path:"daten/2/module/ticker"
	},
	mainDiv: null,
	scrollDiv: null,
	scrollFx: null,
	status: 2,
	dirContent:null,
    initialize: function(el, options){
		this.setOptions(options);
		this.mainDiv = $(el);
		if (!this.mainDiv) {
			alert ('swHticker.js: div with id "'+el+'" not found.');
			return;
		}
		// init
		this.initDirContent();
	},
	initDirContent: function() {
		// get the directory content
		// see getDirectoryContent.php for a description of the object returned 
        var jsonRequest = new Request.JSON({
            url: this.options.url,
            onSuccess: function(dirContent){
                if (dirContent) {
                    this.dirContent = dirContent;
	                this.initSlideshow();
                }
            }.bind(this)}).get({ 'path': this.options.path });
    },
	initSlideshow: function() {
		// init
    	var fileList = this.dirContent.fileList,
    		self = this;
    	// create image array
    	var imageArray = new Array();
    	if (fileList) fileList.each (function (filename) {
    		imageArray.push("http://"+window.location.host+"/"+self.options.path + "/" + filename)
    	});
		this.progressTemplate = 'Loading images {x} of ' + imageArray.length;
    	// load images
		var loader = new Asset.images(imageArray, {
			onComplete: function() {
				// put images into thumbnail tape
				var left = 0;
				var containerDiv = new Element ('div', {styles:{position:'relative', height: 30}});
				self.nbPic = imageArray.length;
				imageArray.each(function(im, i) {
					var image = new Element('img',{src:im});
					image.store('index', i);
					/*image.addEvents({
						'mouseenter': function(img){
							if (self.scrollFx) self.scrollFx.pause();
						},
						'mouseleave': function(img){
							if (self.scrollFx && self.status!=1) self.scrollFx.resume();
						}
					}); */
					left+=image.width+35;
					containerDiv.grab(image);
				}, self);
				// need a scroll container for the container 
				self.scrollDiv = new Element('div',{styles:{position:'absolute', width:self.mainDiv.getStyle('width'), overflow:'hidden'}});
				containerDiv.setStyle('width', left);
				self.scrollDiv.grab(containerDiv);
				// reflow!
				self.mainDiv.grab(self.scrollDiv);
				// create scrolling buttons
				if (left>self.mainDiv.getSize().x) {
					/*var rewind = new Element('div',{'class': 'left-arrow', styles:{position:'absolute', 'margin-left':(self.mainDiv.getSize().x-83)}});
					var forward = new Element('div',{'class': 'right-arrow', styles:{position:'absolute', 'margin-left':(self.mainDiv.getSize().x-34)}});
					var pause = new Element('div',{'class': 'pause', styles:{position:'absolute', 'margin-left':(self.mainDiv.getSize().x-58)}});
					// add mouse events
					rewind.addEvents({
						click: function (){ 
							if (self.status==1) self.scrollToNext();
							if (self.status!='0') {
								self.status = 0;
								rewind.addClass('selected');
								forward.removeClass('selected');
								pause.removeClass('selected');
								self.scrollFx.cancel();
								self.scrollToNext();
							}
						}
					});
					pause.addEvents({
						click: function (){ 
							if (self.status!='1') {
								self.status = 1;
								pause.addClass('selected');
								forward.removeClass('selected');
								rewind.removeClass('selected');
								self.scrollFx.cancel();
							}
						}
					});
					forward.addEvents({
						click: function (){
							if (self.status==1) self.scrollToNext();
							if (self.status!='2') {
								self.status = 2;
								forward.addClass('selected');
								rewind.removeClass('selected');
								pause.removeClass('selected');
								self.scrollFx.cancel();
								self.scrollToNext();
							}
						}
					}); 
					// reflow!!!
					self.mainDiv.grab(rewind);
					self.mainDiv.grab(pause);
					self.mainDiv.grab(forward);
					// select default playback state
					rewind.addClass('selected'); */
					// init FX
			        self.scrollFx = new Fx.Scroll(self.scrollDiv, {
			        	transition: self.options.transition,
			        	duration: 500,
			        	onComplete: function() {
			        		var container = self.scrollDiv.getFirst();
			        		var scrollX = self.scrollDiv.getScroll().x; 
			        		if (self.status==0) {
			        			if (scrollX!=0) {
				        			container.getFirst().inject(container);
				        			self.scrollDiv.scrollTo(0,0);
			        			}
			        		} else {
			        			if (scrollX==0) {
			            			var nextElToScroll = container.getLast(); 
			            	        nextElToScroll.inject(container, 'top');
			            	        self.scrollDiv.scrollTo(nextElToScroll.getSize().x+35, 0);
			        			}
			        		}
			        		self.scrollToNext.delay(self.options.delay, self);
			        	}
			        });
			        self.scrollDiv.scrollTo(0,0);
					// start scrolling
			        self.scrollToNext();
				}
			}
		});
	},
    scrollToNext: function(){
		var container = this.scrollDiv.getFirst();
        var scrollValue = 0;
		if (this.status==0) {
			scrollValue = container.getFirst().getSize().x+35;
		}
        this.scrollFx.options.duration = this.options.speed*Math.abs(scrollValue-this.scrollDiv.getScroll().x);
        this.scrollFx.start(scrollValue, 0);
    }
});