/*
	AJAX-Fahrzeugbühne

	Getestet mit:
	- Fx3, Fx3.5, IE6, IE7, IE8, Op10, Sf5

	Letzte Änderung:
	- JeDu (2011-03-28)

	Beispielaufruf:

		<div id="vehicleArena" style="position:relative; height:180px; overflow:hidden;">
			<table width="100%" height="100%" cellpadding="0" cellspacing="0"><tr><td style="text-align:center; vertical-align:middle;">Einen Augenblick bitte.<br>Es werden individuelle Angebote für Sie zusammengestellt...</td></tr></table>
		</div>
		<script type="text/javascript" src="/userdata/11111/layout/topoffer/vehiclearena.js"></script>
		<script type="text/javascript">
			mdxVehicleArenaInit({
				element:'vehicleArena',
				layout:{
					background:'#ffffff',
					frame:{
						src:'modix-datadir/kfz/cararena-bg.gif',
						hover:'modix-datadir/kfz/cararena-bg-hover.gif',
						width:172,
						height:172
					},
					vehicle:{
						width:160,
						height:120,
						xOffset:6,
						yOffset:6,
						align:'stretch'
					}
				},
				arena:{
					rearDivisor:1.2,
					rearOpacity:0.6,
					widthMultiplier:200,
					heightMultiplier:3.9918,
					xOffset:0,
					yOffset:-20,
					interval:3000
				},
				title:{
					style:{ paddingBottom:'5px' },
					text:function (vehicle) {
						return '<b>' + vehicle['manufacturer']['#'] + ' ' + vehicle['model']['@value'] + '</b><br>' + (vehicle['km']['#'] > 0 ? this.mdxFormatNumber(vehicle['km']['#']) + ' km, ': '') + (vehicle['reg_date']['#'] != '00.00.0000' ? 'EZ ' + vehicle['reg_date']['#'].substr(3) + ', ': '') + this.mdxFormatNumber(vehicle['price']['#']) + ' &euro;';
					}
				},
				vehicles:{
					mKey:'1-12626-389844',
					filter:'sparse_mode=1',
					maxVehicles:5,
					link:'<mdx_adr(%gruppe_prozessname%,3)>?chiffre=[chiffre]<mdx_ifequal(%mdx_sessionid%,modix)>&request_uid=yes</mdx_ifequal>',
					target:'_blank'
				}
			});
		</script>

	Alternativer VehicleLink für Portalseiten:

		link:[
			{ dkey:'1-4698-71122', link:'http://www.domain1.de/go.to/modix/3/fahrzeuge.html?chiffre=[chiffre]' },
			{ dkey:'1-4698-71650', link:'http://www.domain2.de/go.to/modix/3/fahrzeuge.html?chiffre=[chiffre]' },
			{ dkey:'1-4698-91917', link:'http://www.domain3.de/go.to/modix/3/fahrzeuge.html?chiffre=[chiffre]' }
		];
*/
function mdxVehicleArenaInit(config) {
//	addEvent(window, 'load', function loadEvent() {
		function confError(variable) { return '<table width="100%" height="100%" cellpadding="0" cellspacing="0"><tr><td style="text-align:center; vertical-align:middle;">Die Konfiguration ist unvollständig.<br>' + variable + ' nicht gesetzt.</td></tr></table>'; }

		if (typeof config.element != 'object') { config.element = document.getElementById(typeof config.element === 'string' ? config.element : 'vehicleArena' ); }

		if (typeof config.layout != 'object') { config.element.innerHTML = confError('layout'); return; }
		if (typeof config.layout.background != 'string') { config.element.innerHTML = confError('layout.background'); return; }
		if (typeof config.layout.frame != 'object') { config.element.innerHTML = confError('layout.frame'); return; }
		if (typeof config.layout.frame.src != 'string') { config.element.innerHTML = confError('layout.frame.src'); return; }
		if (typeof config.layout.frame.width != 'number') { config.element.innerHTML = confError('layout.frame.width'); return; }
		if (typeof config.layout.frame.height != 'number') { config.element.innerHTML = confError('layout.frame.height'); return; }
		if (typeof config.layout.vehicle != 'object') { config.element.innerHTML = confError('layout.vehicle'); return; }
		if (typeof config.layout.vehicle.width != 'number') { config.element.innerHTML = confError('layout.vehicle.width'); return; }
		if (typeof config.layout.vehicle.height != 'number') { config.element.innerHTML = confError('layout.vehicle.height'); return; }
		if (typeof config.layout.vehicle.xOffset != 'number') { config.layout.vehicle.xOffset = Math.round((config.layout.frame.width - config.layout.vehicle.width) / 2); }
		if (typeof config.layout.vehicle.yOffset != 'number') { config.layout.vehicle.yOffset = config.layout.vehicle.xOffset; }
		if (typeof config.layout.vehicle.align != 'string') { config.layout.vehicle.align = 'stretch'; } /* stretch, top, center, bottom */

		if (typeof config.arena != 'object') { config.element.innerHTML = confError('arena'); return; }
		if (typeof config.arena.rearDivisor === 'string') { config.arena.rearDivisor = parseFloat(config.arena.rearDivisor); }
		if (typeof config.arena.rearDivisor != 'number' || config.arena.rearDivisor === 0) { config.arena.rearDivisor = 1; }
		if (typeof config.arena.rearOpacity === 'string') { config.arena.rearOpacity = parseFloat(config.arena.rearOpacity); }
		if (typeof config.arena.rearOpacity != 'number') { config.arena.rearOpacity = 0; }
		if (typeof config.arena.xOffset === 'string') { config.arena.xOffset = parseInt(config.arena.xOffset); }
		if (typeof config.arena.xOffset != 'number') { config.arena.xOffset = 0; }
		if (typeof config.arena.yOffset === 'string') { config.arena.yOffset = parseInt(config.arena.yOffset); }
		if (typeof config.arena.yOffset != 'number') { config.arena.yOffset = 0; }
		if (typeof config.arena.interval === 'string') { config.arena.interval = parseInt(config.arena.interval); }
		if (typeof config.arena.interval != 'number') { config.arena.interval = 3000; }

		if (typeof config.title != 'object') { config.element.innerHTML = confError('title'); return; }
		if (typeof config.title.style != 'object') { config.title.style = {}; }
		if (typeof config.title.text != 'function' && config.title.text != 'string') { config.element.innerHTML = confError('title.text'); return; }

		if (typeof config.vehicles != 'object') { config.element.innerHTML = confError('vehicles'); return; }
		if (typeof config.vehicles.mKey != 'string' || config.vehicles.mKey.length === 0) { config.element.innerHTML = confError('vehicles.mKey'); return; }
		if (typeof config.vehicles.filter != 'string') { config.element.innerHTML = confError('vehicles.filter'); return; }
		if (typeof config.vehicles.maxVehicles === 'string') { config.vehicles.maxVehicles = parseInt(config.vehicles.maxVehicles); }
		if (typeof config.vehicles.maxVehicles != 'number' || config.vehicles.maxVehicles === 0) { config.vehicles.maxVehicles = 8; }
		if (typeof config.vehicles.link != 'string' && (typeof config.vehicles.link != 'object' || !config.vehicles.link.length)) { config.element.innerHTML = confError('vehicles.link'); return; }

		if (typeof config.langId === 'undefined') { config.langId = 'de'; }

		if (typeof config.layout.frame.hover === 'string') {
			config.layout.frame.hoverImg = new Image();
			config.layout.frame.hoverImg.src = config.layout.frame.hover;
		}

		httpRequest('/soap/kfz/?gw=search&limit=' + config.vehicles.maxVehicles + '&mkey=' + config.vehicles.mKey + '&has_pic=1&mdx_v1=' + config.layout.vehicle.width + (typeof(config.vehicles.filter) === 'string' && config.vehicles.filter != '' ? '&' + config.vehicles.filter : '') + '&random=1&allow_no_price=1&xsl=/userdata/11111/layout/xhr/xml2json.xsl&preventCache=' + (new Date()).getTime(), function (json) {
			json = json['market'];

			if (json['found']['#'] == '0') {
				switch (config.langId.substr(0, 2)) {
					case 'en':
						config.element.innerHTML = 'No offers available at the moment.';
						break;
					case 'fr':
						config.element.innerHTML = 'Pas d´offres disponibles pour le moment.';
						break;
					case 'nl':
						config.element.innerHTML = 'Momenteel zijn er geen voertuigen in aanbieding.';
						break;
					default:
						config.element.innerHTML = 'Zur Zeit stehen keine Fahrzeugangebote zur Verfügung.';
				}
				return;
			}

			var mdxFunctions = {
				mdxStripText:function (text, len, attach) {
					attach = attach || '';
					var retText = text.substr(0, len);
					return retText + (text != retText ? attach : '');
				},
				mdxFormatNumber:function (num) {
					if (typeof num == 'string') { num = parseFloat(num); }
				
					if (num < 0) {
						var sign = '-';
						num = -num;
					} else {
						var sign = '';
					}

					num = num.toString();

					var decPoint = num.indexOf('.');
					if (decPoint != -1) {
						var intPlaces = num.substr(0, decPoint);
						var decPlaces = num.substr(decPoint + 1);
					} else {
						var intPlaces = num;
						var decPlaces = '';
					}

					if (intPlaces.length > 3) {		
						var intPlacesOut = intPlaces.substr(intPlaces.length - 3);
					} else {
						var intPlacesOut = intPlaces;
					}
					for (var i = intPlaces.length - 6; i >= -2; i -= 3) {
						if (i >= 0) {
							intPlacesOut = intPlaces.substr(i, 3) + '.' + intPlacesOut;
						} else {
							intPlacesOut = intPlaces.substr(0, 3 + i) + '.' + intPlacesOut;
							break;
						}
					}
					return sign + intPlacesOut + (decPoint != -1 ? ',' + decPlaces : '');
				}
			};
			mdxStripText = mdxFunctions.mdxStripText;
			mdxFormatNumber = mdxFunctions.mdxFormatNumber;

			var vehicleList = [];
			var vehicle, file;

			for (var i = 0; i < jsonArrayLength(json['vehicle']); i++) {
				vehicle = jsonArray(json['vehicle'], i);

				for (var j = 0; j < jsonArrayLength(jsonArray(vehicle['imagelist']['img'], 0)['file']); j++) {
					file = jsonArray(jsonArray(vehicle['imagelist']['img'], 0)['file'], j)
					if (file['@size'] == config.layout.vehicle.width) {
						vehicleList.push({
							chiffre:vehicle['@id'],
							title:(typeof config.title.text === 'function' ? config.title.text.call(mdxFunctions, vehicle) : eval(config.title.text)),
							file:vehicle['imagelist']['@url'] + file['@folder'] + '/' + file['#'],
							dkey:vehicle['client_id']['#']
						});
						break;
					}
				}
			}

			var carArenaHalfAngle = Math.round((360 / vehicleList.length) / 2);
			var carArenaCenterX = Math.floor(config.element.offsetWidth / 2) + config.arena.xOffset;
			var carArenaCenterY = Math.floor(config.element.offsetHeight / 2)+ config.arena.yOffset;

			if (typeof config.arena.widthMultiplier != 'number') { config.arena.widthMultiplier = carArenaCenterX - Math.ceil(config.layout.frame.width / 2); }
			if (typeof config.arena.heightMultiplier != 'number') { config.arena.heightMultiplier = carArenaCenterY - Math.ceil(config.layout.frame.height / 2); }

			var carArenaAngle = 90;

			config.element.innerHTML = '';

			var carArenaTitle = document.createElement('div');
			carArenaTitle.style.position = 'absolute';
			carArenaTitle.style.width = config.element.offsetWidth + 'px';
			carArenaTitle.style.textAlign = 'center';
			carArenaTitle.style.left = '0';
			carArenaTitle.style.bottom = '0';
			carArenaTitle.style.zIndex = '200';
			for (var s in config.title.style) {
				carArenaTitle.style[s] = config.title.style[s];
			}
			config.element.appendChild(carArenaTitle);

			var carArenaFog = document.createElement('div');
			carArenaFog.style.position = 'absolute';
			carArenaFog.style.width = config.element.offsetWidth + 'px';
			carArenaFog.style.height = config.element.offsetHeight + 'px';
			carArenaFog.style.background = config.layout.background;
			carArenaFog.style.zIndex = '7';
			carArenaFog.style.opacity = config.arena.rearOpacity;
			carArenaFog.style.MozOpacity = config.arena.rearOpacity;
			carArenaFog.style.KhtmlOpacity = config.arena.rearOpacity;
			carArenaFog.style.filter = "Alpha(style=0, opacity=" + (config.arena.rearOpacity * 100) + ")";
			config.element.appendChild(carArenaFog);

			addEvent(config.element, "selectstart", function () { return false; });
			config.element.style.MozUserSelect = "none";
			config.element.style.KhtmlUserSelect = "none";
			config.element.unselectable = "on";

			var img, frame;
			for (var i = 0; i < vehicleList.length; i++) {
				vehicleList[i].container = document.createElement('div');
				vehicleList[i].img = document.createElement('img');
				vehicleList[i].frame = document.createElement('img');

				vehicleList[i].container.style.position = 'absolute';
				vehicleList[i].container.style.top = '0';
				vehicleList[i].container.style.left = '0';
				vehicleList[i].container.style.width = '0px';
				vehicleList[i].container.style.height = '0px';
				vehicleList[i].container.style.MozTransformOrigin = 'left top';
				vehicleList[i].container.style.WebkitTransformOrigin = 'left top';
				vehicleList[i].container.style.OTransformOrigin = 'left top';

				vehicleList[i].frame.style.position = 'absolute';
				vehicleList[i].frame.style.top = '0';
				vehicleList[i].frame.style.left = '0';
				vehicleList[i].frame.style.width = config.layout.frame.width + 'px';
				vehicleList[i].frame.style.height = config.layout.frame.height + 'px';
				vehicleList[i].frame.src = config.layout.frame.src;

				vehicleList[i].img.style.position = 'absolute';
				vehicleList[i].img.style.top = config.layout.vehicle.xOffset + 'px';
				vehicleList[i].img.style.left = config.layout.vehicle.yOffset + 'px';
				vehicleList[i].img.style.width = config.layout.vehicle.width + 'px';

				switch (config.layout.vehicle.align.toLowerCase()) {
					case 'stretch':
						vehicleList[i].img.style.height = config.layout.vehicle.height + 'px';
						break;
					case 'top':
						addEvent(vehicleList[i].img, 'load', (function (vehicle) { return function () {
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = config.layout.vehicle.height + 'px';
							} else {
							}
						}; })(vehicleList[i]));
						break;
					case 'center':
						addEvent(vehicleList[i].img, 'load', (function (vehicle) { return function () {
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = config.layout.vehicle.height + 'px';
							} else {
								vehicle.img.style.marginTop = Math.floor((config.layout.vehicle.height - vehicle.img.height) / 2) + 'px';
							}
						}; })(vehicleList[i]));
						break;
					case 'bottom':
						addEvent(vehicleList[i].img, 'load', (function (vehicle) { return function () {
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = config.layout.vehicle.height + 'px';
							} else {
								vehicle.img.style.marginTop = (config.layout.vehicle.height - vehicle.img.height) + 'px';
							}
						}; })(vehicleList[i]));
						break;
				}

				vehicleList[i].img.src = vehicleList[i].file;

				if (typeof config.layout.frame.hoverImg != 'undefined') {
					addEvent(vehicleList[i].img, 'mouseover', (function (vehicle) { return function () {
						if (!mouseLeftButton) {
							vehicle.frame.src = config.layout.frame.hoverImg.src;
						}
					}; })(vehicleList[i]));
					addEvent(vehicleList[i].img, 'mouseout', (function (vehicle) { return function () {
						vehicle.frame.src = config.layout.frame.src;
					}; })(vehicleList[i]));
				}			

				if (typeof config.vehicles.link == 'string') {
					vehicleList[i].img.style.cursor = 'pointer';
					addEvent(vehicleList[i].img, 'click', (function (vehicle) { return function () {
						if (mouseLastDiff === 0) {
							window.open(config.vehicles.link.replace('[chiffre]', vehicle.chiffre), (typeof config.vehicles.target == 'string' ? config.vehicles.target : '_self'));
						}
					}; })(vehicleList[i]));
				} else if (typeof config.vehicles.link == 'object') {
					for (var j = 0; j < config.vehicles.link.length; j++) {
						if (config.vehicles.link[j].dkey == vehicleList[i].dkey) {
							vehicleList[i].img.style.cursor = 'pointer';
							addEvent(vehicleList[i].img, 'click', (function (vehicle, j) { return function () {
								window.open(config.vehicles.link[j].link.replace('[chiffre]', vehicle.chiffre), (typeof config.vehicles.link[j].target == 'string' ? config.vehicles.link[j].target : (typeof config.vehicles.target == 'string' ? config.vehicles.target : '_self')));
							}; })(vehicleList[i], j));
							break;
						}
					}
				}

				vehicleList[i].angle = (360 / vehicleList.length) * i;

				vehicleList[i].container.appendChild(vehicleList[i].frame);
				vehicleList[i].container.appendChild(vehicleList[i].img);
				config.element.appendChild(vehicleList[i].container);

				carArenaSetPosition(vehicleList[i]);
			}

			var mouseLeftButton = false, mouseInitPos, mouseLastDiff = 0, mouseAngle = 0;
			function touchStart(e) {
				e = e || window.event;
/*
				if (typeof(e.touches) != 'undefined' && e.touches.length === 1) {
					e.clientX = e.touches[0].clientX;
					e.button = 0;
				}
*/
				if (e.button == 0 || e.button == 1) {
					mouseLeftButton = true;
					mouseInitPos = e.clientX;
					mouseLastDiff = 0;
					mouseAngle = carArenaAngle;

					for (var i = 0; i < vehicleList.length; i++) {
						vehicleList[i].frame.src = config.layout.frame.src;
					}

					if (e.preventDefault) { e.preventDefault(); }
					if (e.stopPropagation) { e.stopPropagation(); }
					e.returnValue = false;
					return false;
				}
			}
			function touchEnd(e) {
				e = e || window.event;
/*
				if (typeof(e.touches) != 'undefined' && e.touches.length === 1) {
					e.clientX = e.touches[0].clientX;
					e.button = 0;
				}
*/
				if (e.button == 0 || e.button == 1) {
					mouseLeftButton = false;

					var fromElement = e.relatedTarget || e.fromElement || false;
					if (carArenaAnimTimeout === null && (fromElement === false || fromElement == elem || !!(elem.compareDocumentPosition(fromElement) & 16))) {
						carArenaAnimTimeout = setTimeout(function() { startScrolling(); }, config.arena.interval);
					}
				}
			}
			addEvent(config.element, 'dragstart', function (e) {
				e = e || window.event;
				if (e.preventDefault) { e.preventDefault(); }
				if (e.stopPropagation) { e.stopPropagation(); }
				e.returnValue = false;
				return false;
			});
			function touchMove(e) {
				e = e || window.event;
/*
				if (typeof(e.touches) != 'undefined' && e.touches.length === 1) {
					e.clientX = e.touches[0].clientX;
					e.button = 0;
				}
*/
				if (mouseLeftButton) {
					var diff = -(e.clientX - mouseInitPos) / 3;
					carArenaAngle += ((diff - mouseLastDiff) + 360) % 360;
					mouseLastDiff = diff;

					for (var i = 0; i < vehicleList.length; i++) {
						carArenaSetPosition(vehicleList[i]);
					}

/*
					if (e.preventDefault) { e.preventDefault(); }
					if (e.stopPropagation) { e.stopPropagation(); }
					e.returnValue = false;
					return false;
*/
				}
			}
			addEvent(config.element, 'mousedown', touchStart);
			addEvent(document, 'mousemove', touchMove);
			addEvent(document, 'mouseup', touchEnd);
/*
			addEvent(config.element, 'touchstart', touchStart);
			addEvent(document, 'touchmove', touchMove);
			addEvent(document, 'touchend', touchEnd);
*/
			function carArenaSetPosition(vehicle) {
				var x = Math.cos(((carArenaAngle + vehicle.angle) % 360) * (Math.PI / 180)),
				y = Math.sin(((carArenaAngle + vehicle.angle) % 360) * (Math.PI / 180)),
				factor = 1 / (y + ((1 - y) * config.arena.rearDivisor)),
				fWidth = (config.layout.frame.width * factor),
				fHeight = (config.layout.frame.height * factor),
				left = ((x * config.arena.widthMultiplier) + carArenaCenterX) - (fWidth / 2),
				top = ((y * config.arena.heightMultiplier) + carArenaCenterY) - (fHeight / 2);

				if (typeof(window.ActiveXObject) === 'undefined') {
					vehicle.container.style.MozTransform = 'scale(' + factor + ') translate(' + (left / factor) + 'px, ' + (top / factor) + 'px)';
					vehicle.container.style.WebkitTransform = 'scale(' + factor + ') translate(' + (left / factor) + 'px, ' + (top / factor) + 'px)';
					vehicle.container.style.OTransform = 'scale(' + factor + ') translate(' + (left / factor) + 'px, ' + (top / factor) + 'px)';
				} else {
					vehicle.container.style.left = Math.round(left) + 'px';
					vehicle.container.style.top = Math.round(top) + 'px';
					vehicle.frame.style.width = Math.ceil(fWidth) + 'px';
					vehicle.frame.style.height = Math.ceil(fHeight) + 'px';
					vehicle.img.style.left = Math.round(config.layout.vehicle.xOffset * (((y + 1) / 4) + 0.5)) + "px";
					vehicle.img.style.width = Math.ceil(config.layout.vehicle.width * factor) + 'px';
					vehicle.img.style.top = Math.round(config.layout.vehicle.yOffset  * (((y + 1) / 4) + 0.5)) + "px";

					switch (config.layout.vehicle.align.toLowerCase()) {
						case 'stretch':
							vehicle.img.style.height = Math.ceil(config.layout.vehicle.height * factor) + 'px';
							break;
						case 'top':
							vehicle.img.style.height = '';
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = Math.ceil(config.layout.vehicle.height * factor) + 'px';
							} else {
								vehicle.img.style.height = Math.ceil(vehicle.img.height * factor) + 'px';
							}
							break;
						case 'center':
							vehicle.img.style.height = '';
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = Math.ceil(config.layout.vehicle.height * factor) + 'px';
							} else {
								vehicle.img.style.marginTop = Math.ceil(Math.floor((config.layout.vehicle.height - vehicle.img.height) / 2)  * factor) + 'px';
								vehicle.img.style.height = Math.ceil(vehicle.img.height * factor) + 'px';
							}
							break;
						case 'bottom':
							vehicle.img.style.height = '';
							if (vehicle.img.height > config.layout.vehicle.height) {
								vehicle.img.style.height = Math.ceil(config.layout.vehicle.height * factor) + 'px';
							} else {
								vehicle.img.style.marginTop = Math.ceil((config.layout.vehicle.height - vehicle.img.height)  * factor) + 'px';
								vehicle.img.style.height = Math.ceil(vehicle.img.height * factor) + 'px';
							}
							break;
					}
				}

				vehicle.container.style.zIndex = Math.round((y + 1) * 10);

				if ((((carArenaAngle + vehicle.angle) % 360) > (90 - carArenaHalfAngle)) && (((carArenaAngle + vehicle.angle) % 360) < (90 + carArenaHalfAngle))) {
					carArenaTitle.innerHTML = vehicle.title;
				}
			}

			var scrollingInterval = null, scrollingDistances = [0.202332738,0.16186619,0.129492952,0.103594362,0.082875489,0.066300391,0.053040313,0.042432251,0.0339458,0.02715664,0.021725312,0.01738025,0.0139042,0.01112336,0.008898688,0.00711895,0.00569516,0.004556128,0.003644903,0.002915922,1];
			// 0.009846095,0.015390498,0.024051238,0.037587229,0.058732435,0.091750311,0.124787305,0.145932511,0.158264028,0.165184973,0.168473377,1
			// 0.00083, 0.00125, 0.00187, 0.00281, 0.00421, 0.00631, 0.00947, 0.01421, 0.02131, 0.03196, 0.04795, 0.06393, 0.07458, 0.08168, 0.08642, 0.08958, 0.09098, 0.09192, 0.09254, 0.09295, 0.09325, 1

			function startScrolling(carArenaTargetAngle) {
				if (scrollingInterval !== null) { return; }
				if (typeof(carArenaTargetAngle) == 'undefined') {
					// carArenaTargetAngle = carArenaAngle + (360 / vehicleList.length);
					carArenaTargetAngle = ((Math.round((carArenaAngle - 90) / (360 / vehicleList.length)) * (360 / vehicleList.length)) + 90) + (360 / vehicleList.length);
				}
				var carArenaScrollDirection = (carArenaTargetAngle < carArenaAngle ? -1 : 1),
				scrollingDistance = carArenaTargetAngle - carArenaAngle;
				scrollingFrame = 0

				scrollingInterval = setInterval((function (carArenaTargetAngle, scrollingFrame) { return function () {
					carArenaAngle += carArenaScrollDirection * (scrollingDistances[scrollingFrame] * scrollingDistance);
					scrollingFrame++;

					if (
						(carArenaScrollDirection === 1 && carArenaAngle >= carArenaTargetAngle) ||
						(carArenaScrollDirection === -1 && carArenaAngle <= carArenaTargetAngle)
					) {
						clearInterval(scrollingInterval);
						scrollingInterval = null;
						if (!mouseLeftButton) { carArenaAnimTimeout = setTimeout(function() { startScrolling(); }, config.arena.interval); }
						carArenaAngle = (carArenaTargetAngle + 360) % 360;
					}

					for (var i = 0; i < vehicleList.length; i++) {
						carArenaSetPosition(vehicleList[i]);
					}
				} })(carArenaTargetAngle, scrollingFrame), 40);
			}
			var carArenaAnimTimeout = setTimeout(function() { startScrolling(); }, config.arena.interval);

			addEvent(config.element, 'mouseover', function () {
				if (carArenaAnimTimeout != null) {
					clearTimeout(carArenaAnimTimeout);
					carArenaAnimTimeout = null;
				}
			});
			addEvent(config.element, 'mouseout', function () {
				if (carArenaAnimTimeout === null && !mouseLeftButton) {
					carArenaAnimTimeout = setTimeout(function() { startScrolling(); }, config.arena.interval);
				}
			});
		},
		function (e) {
			config.element.style.visibility = 'hidden';

			switch (config.langId.substr(0, 2)) {
				case 'en':
					config.element.innerHTML = 'An error has occured while loading the vehicle data.<br>(' + e.sys_msg + ')';
					break;
				case 'fr':
						 config.element.innerHTML = 'Une erreur s´est produite lors du téléchargement des données des véhicules.<br>(' + e.sys_msg + ')';
					break;
				case 'nl':
						config.element.innerHTML = 'Een fout heeft zich voorgedaan tijdens het laden van de voertuiggegevens.<br>(' + e.sys_msg + ')';
					break;
				default:
					config.element.innerHTML = 'Beim Abrufen des Fahrzeugangebots ist ein Fehler auftreten.<br>(' + e.sys_msg + ')';
			}
		}, { 'langId':config.langId });
//	});

	function addEvent(obj, type, fn) {
		if (obj.attachEvent) {
			obj['e' + type + fn] = fn;
			obj[type + fn] = function() { obj['e' + type + fn](window.event); }
			obj.attachEvent('on' + type, obj[type + fn]);
		} else {
			obj.addEventListener(type, fn, false);
		}
	}
}