var movingBannerCtrl = {
	IMG_PREFIX: 'moving_banner_img_',
	width: 940,
	height: 60,
	marginX: 0,
	marginY: 0,
	imgBase: null,
	images: [
		{"name":"huth.jpg",					"frames":1,	"width": 45},
		{"name":"Karl Hecke.jpg",			"frames":56,"width": 48},
		{"name":"braun.jpg",				"frames":1,	"width": 45},
		{"name":"frey.jpg",					"frames":1,	"width": 45},
		{"name":"Alex Werkmeiste.jpg",		"frames":47,"width": 46},
		{"name":"schenk.jpg",				"frames":1,	"width": 45},
		{"name":"schneider.jpg",			"frames":1,	"width": 45},
		{"name":"Martin Zwickenpflu.jpg",	"frames":47,"width": 47},
		{"name":"rodewald.jpg",				"frames":1,	"width": 45},
		{"name":"pfanner.jpg",				"frames":1,	"width": 45},
		{"name":"Hans Fraunhofe.jpg",		"frames":47,"width": 45},
		{"name":"frohlich.jpg",				"frames":1,	"width": 45},
		{"name":"elfinger.jpg",				"frames":1,	"width": 45},
		{"name":"Stefan Muelle.jpg",		"frames":54,"width": 47},
		{"name":"glaetzner.jpg",			"frames":1,	"width": 45},
		{"name":"kammerlocher.jpg",			"frames":1,	"width": 45},
		{"name":"Andy Bolleie.jpg",			"frames":33,"width": 43},
		{"name":"eder.jpg",					"frames":1,	"width": 45},
		{"name":"kunz.jpg",					"frames":1,	"width": 45},
		{"name":"Christian Ho.jpg",			"frames":40,"width": 44},
		{"name":"gruber.jpg",				"frames":1,	"width": 40}
	],
	
	holder: null,
	imgs: [],
	
	log: function() {
		for(var i = 0; i < arguments.length; ++i) {
			if(console && console.log) {
				console.log(arguments[i]);
			} else {
				document.write(arguments[i]);
			}
		}
	},
	
	init: function(imagesBaseUrl, elementId) {
		
		movingBannerCtrl.baseUrl = imagesBaseUrl;
		var d = document.getElementById(elementId);
		if(!d) {
			movingBannerCtrl.log('Error finding element with ID "' + elementId + '"');
			return;
		}
		
		var h = document.createElement('div');
		
		h.style.margin = "0px";
		h.style.padding = "0px";
		h.style.display = "block";
		h.style.width = (movingBannerCtrl.width + 10) + 'px';
		h.style.height = (movingBannerCtrl.height) + 'px';
		
		// h.setAttribute('style',
			// 'margin: 0px; '+
			// 'padding: 0px; padding: 1px solid red; overflow: hidden;'+
			// 'display: block; '+
			// 'width: ' + (2 * movingBannerCtrl.width) + 'px; '+
			// 'height: '+ (2 * movingBannerCtrl.height) + 'px'
		// );
		
		
		
		var info,
			img,
			url,
			css,
			offx = 0;
			
		for(var i = 0; i < movingBannerCtrl.images.length; ++i) {
			
			info = movingBannerCtrl.images[i];
			img = document.createElement('div');
			img.baseX = movingBannerCtrl.marginX + offx;
			img.baseY = movingBannerCtrl.marginY;
			img.id = movingBannerCtrl.IMG_PREFIX + i;
			
			url = (imagesBaseUrl == null || imagesBaseUrl.length == 0 ? '': imagesBaseUrl + '/') + info.name;
			
			movingBannerCtrl.imgs.push(img);
			h.appendChild(img);
			
			
			img.style.backgroundImage = 'url(' + escape(url) + ')';
			img.style.backgroundPositon = img.baseX + 'px ' + img.baseY + 'px';
			img.style.backgroundColor = '#ffffff';
			img.style.backgroundRepeat = 'no-repeat';
			img.style.margin = '0px';
			img.style.padding = '0px';
			img.style.overflow = 'hidden';
			img.style.cssFloat = 'left';
			img.style.styleFloat = 'left';
			img.style.width = info.width + 'px';
			img.style.height = movingBannerCtrl.height + 'px';
			
			// css = 'background: url(' + escape(url) + ') no-repeat fixed #ffffff'+
					// ' ' + img.baseX + 'px ' + img.baseY + 'px' +
					// '; margin: 0px; padding: 0px' +
					// '; display: block' +
					// '; float: left' +
					// '; width: ' + info.width + 'px' +
					// '; height: ' + movingBannerCtrl.height + 'px';
			// img.setAttribute('style', css);
			
			offx += info.width;
		}
		
		// d.style.margin = '0px';
		// d.style.padding = '0px';
		d.appendChild(h);
		movingBannerCtrl.holder = h;
		
		movingBannerCtrl.currentImage = 0;
		movingBannerCtrl.currentFrame = 0;
		movingBannerCtrl.animate();
	},
	
	setFrame: function(imageIndex, frameIndex) {
		var info = movingBannerCtrl.images[imageIndex];
		if(!info) {
			//console.log('setFrame: Cant find image index ' + imageIndex);
			return;
		}
		var img = movingBannerCtrl.imgs[imageIndex];
		img.style.backgroundPosition
	},
	
	animate: function() {
		var idx = movingBannerCtrl.currentImage;
		var info = movingBannerCtrl.images[idx];
		var img = movingBannerCtrl.imgs[idx];
		var xx = img.baseX;
		var yy = img.baseY - Math.floor(movingBannerCtrl.currentFrame * movingBannerCtrl.height);
		img.style.backgroundPosition = '0px ' + yy + 'px';
		//console.log('0px ' + yy + 'px');
		setTimeout(movingBannerCtrl.animate, 100);
		
		if(++movingBannerCtrl.currentFrame == info.frames) {
			movingBannerCtrl.currentFrame = 0;
			do {
				++movingBannerCtrl.currentImage;
				if(movingBannerCtrl.images.length == movingBannerCtrl.currentImage) {
					movingBannerCtrl.currentImage = 0;
				}
				info = movingBannerCtrl.images[movingBannerCtrl.currentImage];
			} while(!info || info.frames <= 1);
		}
	}
}