/**
* A simple JavaScript image loaderimage loader
* @author Cuong Tham
* @url http://thecodecentral.com/2008/02/21/a-useful-javascript-image-loader
* @usage
* var loader = new ImageLoader('IMAGE_URL');
* //set event handler
* loader.loadEvent = function(url, image){
*   //action to perform when the image is loaded
*   document.body.appendChild(image);
* }
* loader.load();
*/

// source: http://snipplr.com/view.php?codeview&id=561
// Cross-browser implementation of element.addEventListener()
function addListener(element, type, expression, bubbling) {
	bubbling = bubbling || false;
	if(window.addEventListener)	{ // Standard
		element.addEventListener(type, expression, bubbling);
		return true;
	} else if(window.attachEvent) { // IE
		element.attachEvent('on' + type, expression);
		return true;
	} else return false;
}

var ImageLoader = function(url) {
	this.url = url;
	this.image = null;
	this.loadEvent = null;
};

ImageLoader.prototype = {
	load:function() {
		this.image = document.createElement('img');
		var url = this.url;
		var image = this.image;
		var loadEvent = this.loadEvent;
		addListener(this.image, 'load', function(e) {
			if(loadEvent != null) {
				loadEvent(url, image);
			}
		}, false);
		this.image.src = this.url;
	},
	getImage:function() {
		return this.image;
	}
};

// Bild laden Produktseite
function loadImageInfo(id_elm, new_image, new_function) {
	if(getImageName(document.getElementById(id_elm).style.backgroundImage) != getImageName(new_image)) {
		var loader = new ImageLoader(new_image);
		
		//document.getElementById('loading').style.display = "block";
		
		loader.loadEvent = function(url, image)	{
			//document.getElementById('loading').style.display = "none";
			
			document.getElementById(id_elm).style.backgroundImage = 'url(' + image.src + ')'; // Bild tauschen
			
			// Neue Funktion für Link setzen. Eigentlich müßte man nur URL für onclick ändern, aber damit Breite und Höhe für popWindow()
			// zentral in product_info.html gepflegt werden kann, wird hier die komplette Funktion übergeben bzw. neu gesetzt.
			// document.getElementById('linkImg').onclick = new Function("return popWindow('" + new_url + "',884,916,'yes')");
			document.getElementById('linkImg').onclick = new Function(new_function);
		}
		loader.load();
	}
}

// Bild laden Popup
function loadImagePopup(id_elm, img_nr) {
	if(g_current_image_nr != img_nr) g_current_image_nr = img_nr;
	
	new_image = g_thumbs_content[g_current_image_nr - 1].info_image;
	
	if(getImageName(document.getElementById(id_elm).style.backgroundImage) != getImageName(new_image)) {
		var loader = new ImageLoader(new_image);
		
		document.getElementById('loading').style.display = "block";
		
		loader.loadEvent = function(url, image)	{
			document.getElementById('loading').style.display = "none";
			
			document.getElementById(id_elm).style.backgroundImage = 'url(' + image.src + ')'; // Bild tauschen
			
			// Thumbnail Navigation Bild zurück
			if(g_current_image_nr == 1) {
				document.getElementById('thumbPrevLink').style.display = 'none';
				document.getElementById('thumbPrevLow').style.display = 'block'; // Platzhalter einblenden
			} else if(document.getElementById('thumbPrevLink').style.display == 'none') {
				document.getElementById('thumbPrevLink').style.display = 'block';
				document.getElementById('thumbPrevLow').style.display = 'none'; // Platzhalter ausblenden
			}
			
			// Thumbnail Navigation Bild weiter
			if(g_current_image_nr == g_thumbs_content.length) {
				document.getElementById('thumbNextLink').style.display = 'none';
				document.getElementById('thumbNextLow').style.display = 'block';  // Platzhalter einblenden
			} else if(document.getElementById('thumbNextLink').style.display == 'none') {
				document.getElementById('thumbNextLink').style.display = 'block';
				document.getElementById('thumbNextLow').style.display = 'none';  // Platzhalter ausblenden
			}
			
			// Neue Bildnummer anzeigen
			setText('thumbImgNr', img_nr);
		}
		loader.load();
	}
}

// Thumbnail Navigation Popup
function thumbNavigation(id_elm, type) {
	if(type == 'prev' && g_current_image_nr > 1) {
		g_current_image_nr--;
	} else if(type == 'next' && g_current_image_nr < g_thumbs_content.length) {
		g_current_image_nr++;	
	}
	loadImagePopup(id_elm, g_current_image_nr);
}

function getImageName(bg_image) {
	return bg_image.substring(bg_image.lastIndexOf("/") + 1, bg_image.lastIndexOf("."));
}

function setText(tag_id, text) {
	var t = document.getElementById(tag_id);
	while(t.firstChild) t.removeChild(t.firstChild);
	t.appendChild(document.createTextNode(text));
}