/*
	AJAX-Top-Angebote-Scroller

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

	Letzte Änderung:
	- JeDu (2010-05-10)

	Beispielaufruf:

		mdxTopOfferInit({
			mKey:'1-12626-389844',
			sizes:{
				bg:{     width:798, height:135, src:'/userdata/11111/layout/topscroller/bg-sample.gif' },
				button:{ width:45,  height:63,  src:'/userdata/11111/layout/topscroller/buttons-sample.gif' },
				frame:{  width:137, height:123, src:'/userdata/11111/layout/topscroller/frame-sample.png' },
				img:{    width:121, height:75, x:8, y:8 }
			},
			pages:5,
			vehicle:{
				filter:'sparse_mode=1',
				link:'http://module.modix.de/go.to/modix/3/fahrzeuge.html?chiffre=[chiffre]&referrer=topscroller_ajax',
				target:'_blank',
				title:function (vehicle) { return '<b>' + mdxStripText(vehicle['manufacturer']['#'] + ' ' + (vehicle['ctype']['#'] == '1' ? vehicle['model']['@value'] : ''), 14, '...') + '</b><br>' + (vehicle['price']['#'] == '0' ? 'Preis auf Anfrage' : mdxFormatNumber(vehicle['price']['#']) + ' &euro;'); },
				style:'padding-top:88px; padding-left:10px; text-align:left;'
			},
			noRequest:false,
			noOffersText:'Zu den gewählten Suchkriterien stehen keine Angebote mit Bild zur Verfügung.'
		});

	Alte Variante zur Konfiguration (NICHT MEHR VERWENDEN!):

		var mdxMKey = '1-12626-389844';

		var mdxTopOfferSizes = {
			bg:{     width:798, height:135, src:'/userdata/11111/layout/topscroller/bg-sample.gif' },
			button:{ width:45,  height:63,  src:'/userdata/11111/layout/topscroller/buttons-sample.gif' },
			frame:{  width:137, height:123, src:'/userdata/11111/layout/topscroller/frame-sample.png' },
			img:{    width:121, height:75, x:8, y:8 }
		};
		var mdxTopOfferTitleStyle = 'padding-top:88px; padding-left:10px; text-align:left;';
		var mdxTopOfferPages = 5;

		var mdxTopOfferVehicleFilter = 'sparse_mode=1';
		var mdxTopOfferVehicleLink = 'http://module.modix.de/go.to/modix/3/fahrzeuge.html?chiffre=[chiffre]&referrer=topscroller_ajax';
		var mdxTopOfferVehicleTitle = "'<b>' + mdxStripText(vehicle['manufacturer']['#'] + ' ' + (vehicle['ctype']['#'] == '1' ? vehicle['model']['@value'] : ''), 14, '...') + '</b><br>' + (vehicle['price']['#'] == '0' ? 'Preis auf Anfrage' : mdxFormatNumber(vehicle['price']['#']) + ' &euro;')";
		var mdxTopOfferLangId = 'de';

		mdxTopOfferInit();

	Konfiguration der Ausgabe-Elemente:
		element:{
			container:'topOfferContainer',
			table:'topOfferTable',
			buttonLeft:'topOfferButtonLeft',
			buttonLeftElem:'topOfferButtonLeftElem',
			buttonRight:'topOfferButtonRight',
			buttonRightElem:'topOfferButtonRightElem'
		}

	Alternativer VehicleLink für Portalseiten:

		var mdxTopOfferVehicleLink = [
			{ 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]' }
		];

	Alternativer VehicleTitle als Funktion:

		var mdxTopOfferVehicleTitle = function (vehicle) {
			return '<b>' + mdxStripText(vehicle['manufacturer']['#'] + ' ' + (vehicle['ctype']['#'] == '1' ? vehicle['model']['@value'] : ''), 14, '...') + '</b><br>' + (vehicle['price']['#'] == '0' ? 'Preis auf Anfrage' : mdxFormatNumber(vehicle['price']['#']) + ' &euro;');
		}
*/

function mdxTopOfferInit(config)
{
	function confError(variable) { return 'Die Konfiguration ist unvollständig.<br>' + variable + ' nicht gesetzt.'; }

	if (typeof config !== 'object') {
		// Alte Variante mit globalen Variablen
		var config = {
			mKey:(typeof mdxMKey !== 'undefined' ? mdxMKey : undefined),
			sizes:(typeof mdxTopOfferSizes !== 'undefined' ? mdxTopOfferSizes : undefined),
			pages:(typeof mdxTopOfferPages !== 'undefined' ? mdxTopOfferPages : undefined),
			vehicle:{
				filter:(typeof mdxTopOfferVehicleFilter !== 'undefined' ? mdxTopOfferVehicleFilter : undefined),
				link:(typeof mdxTopOfferVehicleLink !== 'undefined' ? mdxTopOfferVehicleLink : undefined),
				title:(typeof mdxTopOfferVehicleTitle !== 'undefined' ? mdxTopOfferVehicleTitle : undefined),
				style:(typeof mdxTopOfferTitleStyle !== 'undefined' ? mdxTopOfferTitleStyle : undefined)
			},
			langId:(typeof mdxTopOfferLangId !== 'undefined' ? mdxTopOfferLangId : undefined)
		}
	}

	if (typeof config.element != 'object') { config.element = {}; }
	if (typeof config.element.container != 'object') { config.element.container = document.getElementById(typeof config.element.container === 'string' ? config.element.container : 'topOfferContainer' ); }
	if (typeof config.element.table != 'object') { config.element.table = document.getElementById(typeof config.element.table === 'string' ? config.element.table : 'topOfferTable' ); }
	if (typeof config.element.buttonLeft != 'object') { config.element.buttonLeft = document.getElementById(typeof config.element.buttonLeft === 'string' ? config.element.buttonLeft : 'topOfferButtonLeft' ); }
	if (typeof config.element.buttonLeftElem != 'object') { config.element.buttonLeftElem = document.getElementById(typeof config.element.buttonLeftElem === 'string' ? config.element.buttonLeftElem : 'topOfferButtonLeftElem' ); }
	if (typeof config.element.buttonRight != 'object') { config.element.buttonRight = document.getElementById(typeof config.element.buttonRight === 'string' ? config.element.buttonRight : 'topOfferButtonRight' ); }
	if (typeof config.element.buttonRightElem != 'object') { config.element.buttonRightElem = document.getElementById(typeof config.element.buttonRightElem === 'string' ? config.element.buttonRightElem : 'topOfferButtonRightElem' ); }

	if (typeof config.noRequest != 'boolean') { config.noRequest = false; }

	if (typeof config.mKey != 'string' || config.mKey.length < 5) { config.element.container.innerHTML = confError('mKey'); return; }

	if (typeof config.sizes != 'object') { config.element.container.innerHTML = confError('sizes'); return; }
	if (typeof config.sizes.bg != 'object') { config.element.container.innerHTML = confError('sizes.bg'); return; }
	if (typeof config.sizes.bg.width != 'number') { config.element.container.innerHTML = confError('sizes.bg.width'); return; }
	if (typeof config.sizes.bg.height != 'number') { config.element.container.innerHTML = confError('sizes.bg.height'); return; }

	if (typeof config.sizes.button != 'object') { config.element.container.innerHTML = confError('sizes.button'); return; }

	if (typeof config.sizes.button.width != 'number') { config.element.container.innerHTML = confError('sizes.button.width'); return; }
	if (typeof config.sizes.button.height != 'number') { config.element.container.innerHTML = confError('sizes.button.height'); return; }
	if (typeof config.sizes.button.src != 'string') { config.element.container.innerHTML = confError('sizes.button.src'); return; }

	if (typeof config.sizes.frame != 'object') { config.element.container.innerHTML = confError('sizes.frame'); return; }
	if (typeof config.sizes.frame.width != 'number') { config.element.container.innerHTML = confError('sizes.frame.width'); return; }
	if (typeof config.sizes.frame.height != 'number') { config.element.container.innerHTML = confError('sizes.frame.height'); return; }
	if (typeof config.sizes.frame.src == 'string') {
		config.sizes.frame.src = [config.sizes.frame.src];
	} else if (typeof config.sizes.frame.src != 'object' || !config.sizes.frame.src.length) { config.element.container.innerHTML = confError('sizes.frame.src'); return; }

	if (typeof config.sizes.img != 'object') { config.element.container.innerHTML = confError('sizes.img'); return; }
	if (typeof config.sizes.img.width != 'number') { config.element.container.innerHTML = confError('sizes.img.width'); return; }
	if (typeof config.sizes.img.height != 'number') { config.element.container.innerHTML = confError('sizes.img.height'); return; }
	if (typeof config.sizes.img.x != 'number') { config.element.container.innerHTML = confError('sizes.img.x'); return; }
	if (typeof config.sizes.img.y != 'number') { config.element.container.innerHTML = confError('sizes.img.y'); return; }

	if (typeof config.vehicle.style != 'string') { config.element.container.innerHTML = confError('vehicle.style'); return; }
	if (typeof config.vehicle.link != 'string' && (typeof config.vehicle.link != 'object' || !config.vehicle.link.length)) { config.element.container.innerHTML = confError('vehicle.link'); return; }
	if (typeof config.pages != 'number') { config.pages = 5; }

	if (typeof config.vehicle.title === 'undefined') { config.vehicle.title = function () { return ''; }; }
	if (typeof config.vehicle.filter === 'undefined') { config.vehicle.filter = ''; }
	if (typeof config.langId === 'undefined') { config.langId = 'de'; }

	var vehiclesPerPage = Math.floor((config.sizes.bg.width - (2 * config.sizes.button.width)) / config.sizes.frame.width);
	var frameSpace = Math.floor(((config.sizes.bg.width - (2 * config.sizes.button.width)) - (vehiclesPerPage * config.sizes.frame.width)) / vehiclesPerPage);
	var pageWidth = (config.sizes.frame.width + frameSpace) * vehiclesPerPage;
	var currentPos = 0.0;
	var finalPos = 0.0;
	var scrollInterval = null;

	config.element.table.style.width = + config.sizes.bg.width + 'px';
	config.element.table.style.height = + config.sizes.bg.height + 'px';

	config.element.buttonLeft.style.width = (config.sizes.bg.width - config.sizes.button.width - pageWidth) + 'px';
	config.element.buttonLeftElem.style.width = config.sizes.button.width + 'px';
	config.element.buttonLeftElem.style.height = config.sizes.button.height + 'px';

	config.element.buttonRight.style.width = config.sizes.button.width + 'px';
	config.element.buttonRightElem.style.width = config.sizes.button.width + 'px';
	config.element.buttonRightElem.style.height = config.sizes.button.height + 'px';

	if (config.sizes.bg.src) {
		config.element.buttonLeft.style.background = 'url("' + config.sizes.bg.src + '") no-repeat left 0';
		config.element.container.style.background = 'url("' + config.sizes.bg.src + '") no-repeat center 0';
		config.element.buttonRight.style.background = 'url("' + config.sizes.bg.src + '") no-repeat right 0';
	}

	config.element.table.style.visibility = 'visible';

	if (!config.noRequest) {
		httpRequest('/soap/kfz/?gw=search&limit=' + (vehiclesPerPage * config.pages) + '&' + (config.vehicle.filter != '' ? config.vehicle.filter : 'sparse_mode=1') + '&has_pic=1&mdx_v1=' + config.sizes.img.width + '&random=1&allow_no_price=1&mkey=' + config.mKey + '&xsl=http://content.modix.de/userdata/11111/layout/xhr/xml2json.xsl&preventCache=' + (new Date()).getTime(), function (json) {
			json = json['market'];

			if (json['found']['#'] == '0') {
				if (typeof config.noOffersText === 'string') {
					config.element.container.innerHTML = 'Zu den gewählten Suchkriterien stehen keine Angebote mit Bild zur Verfügung.';
					return;
				} else {
					switch (config.langId.substr(0, 2)) {
						case 'en':
							config.element.container.innerHTML = 'No offers available at the moment.';
							break;
						case 'fr':
						case 'frbe':
							config.element.container.innerHTML = 'Pas d´offres disponibles pour le moment.';
							break;
						case 'nl':
						case 'nlbe':
							 config.element.container.innerHTML = 'Geen aanbiedingen beschikbaar op dit ogenblik.';
							break;
						default:
							config.element.container.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 = new Array();
			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.sizes.img.width) {
						vehicleList.push({
							chiffre:vehicle['@id'],
							title:(typeof config.vehicle.title === 'function' ? config.vehicle.title.call(mdxFunctions, vehicle) : eval(config.vehicle.title)),
							img:vehicle['imagelist']['@url'] + file['@folder'] + '/' + file['#'],
							dkey:vehicle['client_id']['#']
						});
						break;
					}
				}
			}

			if (vehicleList.length < (vehiclesPerPage * config.pages)) {
				var vehicleListCount = vehicleList.length;
				for (var i = vehicleListCount; i < (vehiclesPerPage * config.pages); i++) {
					vehicleList.push(vehicleList[i % vehicleListCount]);
				}
			}

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

			var frameBackgroundCode = [];
			if (config.sizes.frame.src) {
				if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && typeof document.body.style.filter == "string" && !window.XMLHttpRequest){
					/* IE6 */
					for (var i = 0; i < config.sizes.frame.src.length; i++) {
						frameBackgroundCode.push(' filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + config.sizes.frame.src[i] + '\', sizingMethod=\'crop\');');
					}
				} else {
					/* all other browsers */
					for (var i = 0; i < config.sizes.frame.src.length; i++) {
						frameBackgroundCode.push(' background:url(\'' + config.sizes.frame.src[i] + '\') no-repeat 0 0;');
					}
				}
			}

			out = '';
			for (var i = 0; i < vehicleList.length; i++) {
				out += '<div style="float:left; text-align:left; width:' + (config.sizes.frame.width + frameSpace) + 'px; height:' + config.sizes.frame.height + 'px; background:url(\'' + vehicleList[i].img + '\') no-repeat ' + (Math.floor(frameSpace / 2) + config.sizes.img.x) + 'px ' + config.sizes.img.y + 'px;">';
				if (typeof config.vehicle.link == 'string') {
					out += '   <a href="' + config.vehicle.link.replace('[chiffre]', vehicleList[i].chiffre) + '" style="display:block; cursor:pointer; outline:none; margin-left:' + Math.floor(frameSpace / 2) + 'px; width:' + config.sizes.frame.width + 'px; height:' + config.sizes.frame.height + 'px;' + frameBackgroundCode[i % frameBackgroundCode.length] + '" onmouseover="this.style.backgroundPosition = \'0 -' + config.sizes.frame.height + 'px\';" onmouseout="this.style.backgroundPosition = \'0 0\';"' + (config.vehicle.target ? ' target="' + config.vehicle.target + '"' : '')+ '>';
				} else if (typeof config.vehicle.link == 'object') {
					for (var j = 0; j < config.vehicle.link.length; j++) {
						if (config.vehicle.link[j].dkey == vehicleList[i].dkey) {
							out += '   <a href="' + config.vehicle.link[j].link.replace('[chiffre]', vehicleList[i].chiffre) + '" style="display:block; cursor:pointer; outline:none; margin-left:' + Math.floor(frameSpace / 2) + 'px; width:' + config.sizes.frame.width + 'px; height:' + config.sizes.frame.height + 'px;' + frameBackgroundCode[i % frameBackgroundCode.length] + '" onmouseover="this.style.backgroundPosition = \'0 -' + config.sizes.frame.height + 'px\';" onmouseout="this.style.backgroundPosition = \'0 0\';"' + (config.vehicle.link[j].target ? ' target="' + config.vehicle.link[j].target + '"' : '')+ '>';
							break;
						}
					}
					if (j == config.vehicle.link.length) {
						out += '   <a style="display:block; cursor:default; outline:none; margin-left:' + Math.floor(frameSpace / 2) + 'px; width:' + config.sizes.frame.width + 'px; height:' + config.sizes.frame.height + 'px;' + frameBackgroundCode[i % frameBackgroundCode.length] + '" onmouseover="this.style.backgroundPosition = \'0 -' + config.sizes.frame.height + 'px\';" onmouseout="this.style.backgroundPosition = \'0 0\';">';
					}
				}
				out += '      <span style="display:block; ' + config.vehicle.style + '">' + vehicleList[i].title + '</span>';
				out += '   </a>'
				out += '</div>'
			}
			if (typeof config.element.contentId != 'string' || document.getElementById(config.element.contentId) === null) {
				for (var i = 0; i < 1000; i++) {
					config.element.contentId = 'topOfferContent' + i.toString();
					if (document.getElementById(config.element.contentId) === null) { break; }
				}
			}
			config.element.container.innerHTML = '<div style="width:' + pageWidth + 'px; position:relative; overflow:hidden;"><div id="' + config.element.contentId + '" style="position:relative; width:' + (vehiclesPerPage * (config.pages + 1) * (config.sizes.frame.width + frameSpace)) + 'px;">' + out + '<div style="clear:both;"></div></div></div>';

			config.element.buttonLeftElem.style.background = 'url("' + config.sizes.button.src + '") no-repeat 0 0';
			config.element.buttonLeftElem.style.cursor = 'pointer';
			addEvent(config.element.buttonLeftElem, 'mouseover', function () { this.style.backgroundPosition = '0 -' + config.sizes.button.height + 'px'; });
			addEvent(config.element.buttonLeftElem, 'mouseout', function () { this.style.backgroundPosition = '0 0'; });
			addEvent(config.element.buttonLeftElem, 'click', function () { finalPos -= pageWidth; mdxTopOfferAutoScroller(); });

			config.element.buttonRightElem.style.background = 'url("' + config.sizes.button.src + '") no-repeat -' + config.sizes.button.width + 'px 0';
			config.element.buttonRightElem.style.cursor = 'pointer';
			addEvent(config.element.buttonRightElem, 'mouseover', function () { this.style.backgroundPosition = '-' + config.sizes.button.width + 'px -' + config.sizes.button.height + 'px'; });
			addEvent(config.element.buttonRightElem, 'mouseout', function () { this.style.backgroundPosition = '-' + config.sizes.button.width + 'px 0'; });
			addEvent(config.element.buttonRightElem, 'click', function () { finalPos += pageWidth; mdxTopOfferAutoScroller(); });
		},
		function (e) {
			if (!e.sys_msg) {
				switch (config.langId.substr(0, 2)) {
					case 'en':
						config.element.container.innerHTML = 'An error has occured while loading the vehicle data.<br>(' + e.sys_msg + ')';
						break;
					case 'fr':
					case 'frbe':
							 config.element.container.innerHTML = 'Une erreur s´est produite lors du téléchargement des données des véhicules.<br>(' + e.sys_msg + ')';
						break;
					case 'nl':
					case 'nlbe':
							config.element.container.innerHTML = 'Een fout heeft zich voorgedaan tijdens het laden van de voertuiggegevens.<br>(' + e.sys_msg + ')';
						break;
					default:
						config.element.container.innerHTML = 'Beim Abrufen des Fahrzeugangebots ist ein Fehler auftreten.<br>(' + e.sys_msg + ')';
				}
			}
		}, { 'langId':config.langId, 'cache':true });
	} else {
		config.element.buttonLeftElem.style.background = 'url("' + config.sizes.button.src + '") no-repeat 0 0';
		config.element.buttonLeftElem.style.cursor = 'pointer';
		addEvent(config.element.buttonLeftElem, 'mouseover', function () { this.style.backgroundPosition = '0 -' + config.sizes.button.height + 'px'; });
		addEvent(config.element.buttonLeftElem, 'mouseout', function () { this.style.backgroundPosition = '0 0'; });
		addEvent(config.element.buttonLeftElem, 'click', function () { finalPos -= pageWidth; mdxTopOfferAutoScroller(); });

		config.element.buttonRightElem.style.background = 'url("' + config.sizes.button.src + '") no-repeat -' + config.sizes.button.width + 'px 0';
		config.element.buttonRightElem.style.cursor = 'pointer';
		addEvent(config.element.buttonRightElem, 'mouseover', function () { this.style.backgroundPosition = '-' + config.sizes.button.width + 'px -' + config.sizes.button.height + 'px'; });
		addEvent(config.element.buttonRightElem, 'mouseout', function () { this.style.backgroundPosition = '-' + config.sizes.button.width + 'px 0'; });
		addEvent(config.element.buttonRightElem, 'click', function () { finalPos += pageWidth; mdxTopOfferAutoScroller(); });
	}

	/* Locale functions */
	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);
		}
	}

	function mdxTopOfferAutoScroller() {
		if (scrollInterval == null) { scrollInterval = setInterval(mdxTopOfferAutoScroller, 30); }
		if (!document.getElementById(config.element.contentId)) {
			clearInterval(scrollInterval);
			scrollInterval = null;
			return;
		}

		var i = (finalPos - currentPos) / (vehiclesPerPage * 2);
		if (
			(currentPos < finalPos && i < 0.1) ||
			(currentPos > finalPos && i > -0.1)
		) {
			currentPos = finalPos;
			clearInterval(scrollInterval);
			scrollInterval = null;
		} else {
			currentPos += i;
		}

		var newPos = -((currentPos + (pageWidth * config.pages)) % (pageWidth * config.pages));
		if (newPos > 0) {
			newPos -= (pageWidth * config.pages);
			currentPos += (pageWidth * config.pages);
			finalPos += (pageWidth * config.pages);
		}
		document.getElementById(config.element.contentId).style.left = Math.round(newPos) + 'px';
	}
}