/**
 * JavaScript with street gallery image effect
 * @author performance-media.pl
 */ 

/**
 * Function initialize street gallery images
 * Must be run after body onload
 */
function streetGallery_init() {
	var divCollection = document.getElementsByTagName("div");
	
	for(var i=0; divCollection[i] ;i++) {
		if( (divCollection[i].getAttribute('class') != "StreetGalleryCell")
			&& (divCollection[i].getAttribute('className') != "StreetGalleryCell") )	
			{ continue; }
			
		var div = divCollection[i];
		div.onmouseover = function() { streetGallery_showImage(this); }
	}
}

/**
 * Function show selected image by starting SG effect.
 */
function streetGallery_showImage(obj) {
	var data = streetGallery_getDataByDivObject(obj);
	var miniImage = data[0];
	var productUrl = data[1];
	var loadingFlag = 'loading...';
	
	// INIT 
	var divObj = document.getElementById("ProductGalerySelectedImage");
	
	// CHECK IF ANOTHER IMAGE IS ALREADY RUNNING
	// check mutex
	if(divObj.getAttribute('rel') == loadingFlag)
		{ return; }
	
	// INIT DIV STYLE	
	var pos = findPos(obj);	
	divObj.style.left = pos[0]+3+"px";
	divObj.style.top = pos[1]+3+"px";
	divObj.style.width = miniImage.width+"px";
	divObj.style.height = miniImage.height+"px";
	divObj.style.backgroundColor = "#FFF";
	divObj.style.position = "absolute";
	divObj.style.display = "block";
	divObj.style.zIndex = 1000;

	// set mutex
	divObj.setAttribute('rel',loadingFlag);
	
	
	if(productUrl != undefined) {
		divObj.style.cursor = 'pointer';
		divObj.onclick = function() { window.location.href = productUrl; }
	} else {
		divObj.style.cursor = 'none';
		divObj.style.onclick = null;
	}

	// SETTING ID
	var id = obj.getAttribute('id');
	id = id.replace('streetGalleryCell_','');
	
	streetGallery_resizeUp(id);
}

/**
 * Function resize white div under 
 */
function streetGallery_resizeUp(img_id) {
	var divObj = document.getElementById("ProductGalerySelectedImage");
	
	var stepX = 20;
	var stepY = 20;
	var width = parseInt(divObj.style.width) + stepX;
	var height = parseInt(divObj.style.height) + stepY;
	
	// CHECK IF STOP
	if((width >= 300) && (height >= 300)) { 

		// CREATE IMAGE 
		// AND INSERT THEM IN DIV
		var newImg = document.createElement('img');
		newImg.width = 300;
		newImg.style.display = 'none';

		// AFTER LOADING IMAGE ADD METHOD onmouseout - hide image
		// this <- newImg obejct
		newImg.onload = function() { 				
				this.style.display = 'block';
				this.onmouseout = function() 
					{ streetGallery_hideImage(); }
			}
			
		newImg.src = '?section=Image&imageId='+ img_id;
		newImg.title = "kliknij na produkt";
		newImg.alt = "kliknij na produkt";
				
		divObj.appendChild(newImg);
		return; 
	}
		
	// RESIZE DIV
	var pos = findPos(divObj);
	divObj.style.width = width + "px";
	divObj.style.height = height + "px";	
	divObj.style.left = (parseInt(divObj.style.left) - stepX/2) + "px";
	divObj.style.top = (parseInt(divObj.style.top) - stepY/2) + "px";	
	
	setTimeout("streetGallery_resizeUp('" + img_id +"');",25);	
}

/**
 * Function hide street galery image (destroy it)
 */
function streetGallery_hideImage() {
	var divObj = document.getElementById("ProductGalerySelectedImage");
	divObj.style.display = 'none';
	divObj.innerHTML = '';
	
	// CLEAR FLAG / MUTEX
	divObj.setAttribute('rel','');
}

/**
 * Additional function for getting all selected images from 
 * StreetGallery div
 */
function streetGallery_getDataByDivObject(obj) {
	var miniImage;
	var productUrl;
	
	for(var i=0; obj.childNodes[i] ; i++) {
		if(obj.childNodes[i].tagName != "IMG")  
			{ continue; }
			
		var img = obj.childNodes[i];
		if(img.getAttribute('rel') == 'mini')
			{ miniImage = img; } 
			
		if(img.getAttribute('id') != undefined)
			{ productUrl = img.getAttribute('id'); }
	}
	
	return [miniImage , productUrl];
}

bodyOnLoad_addToChain("streetGallery_init();");