// promotion images


function toggleNewsletter() {
	// Effect.toggle('id_of_element', 'slide', { delay: 0.5 });
	Effect.toggle('subscribe', 'blind', { duration: 0.2 });

}

function saveNewsletter(name,email) {
	url = '/sources/php/a_saveNewsletter.php?email='+email+'&name='+name;
	new Ajax.Request(url, { method: 'get', onSuccess: function(transport) {
		if (transport.responseText > 0) { 
			retxt = 'Email address saved'; 
			Effect.BlindUp('subscribe', { duration: 0.2, delay: 1 });
			$('subscribe_txt').update(retxt);
		} else {
			retxt = 'Invalid email address'; 
	    	$('subscribe_txt').update(retxt);
		}
   		}
	});

}

function homeInit() {
	actualImageIndexNr = 0;
	resizeScreen();
	initAutoChange();
}

function initAutoChange() {		
	setTimeout("autoChange()",10000);
}	

function autoChange() {
	++actualImageIndexNr;
	if (actualImageIndexNr > promotionImageList.length - 1) {
		actualImageIndexNr = 0;
	}
	changePromotionImage(actualImageIndexNr);
	initAutoChange();
}

function resizeScreen() {
	imgResize('promotionImage');
}

function imgResize(id) {
	windowHeigth = window.innerHeight;
	windowWidth = window.innerWidth;
	imgWidth = windowWidth - 240;
	imgHeight = Math.round(0.625 * imgWidth);
	if (imgHeight < windowHeigth) {
		imgHeight = windowHeigth;
		imgWidth = Math.round(1.6 * imgHeight);
		offsetHeight = 0;
		offsetWidth = (windowWidth -240 -imgWidth) / 2 + 240;
	} else {
		offsetHeight = (windowHeigth -imgHeight) / 2;
		offsetWidth = 240;
	}
	$(id).setStyle({
			width: imgWidth+'px',
			height: imgHeight+'px',
		top: offsetHeight+'px',
		left: offsetWidth+'px'
	});
}

function changePromotionImage(imageIndexNr) {
	new Effect.Fade('promotionImage', { duration: 0.5, afterFinish: function()
		{
			$('promotionImageContainer').innerHTML = '<img src="'+promotionImageList[imageIndexNr]+'" id="promotionImage" alt="sire promotion" />';
			imgResize('promotionImage');
			new Effect.Appear('promotionImage', { duration: 1.5, queue: { scope: 'imagescope', position: 'end' } } );
		}} );
}

function preloader(imageArray) {
	var i = 0;
	imageObj = new Image();
	var l = imageArray.length - 1;
	for(i=0; i<=l; i++) {
		imageObj.src=imageArray[i];
	}
}


// product images


function activateImageSubmit() {
	alert('hoi');
	$('imageSubmit').removeClassName('inactive');
}

function updateProductImage(inIndex) {	
	fadeDuration = 0.2;
	appearDuration = 0.7;
	imageName = imageList[inIndex];
	thumbId = "t"+inIndex;
	
	$('productImage').fade({ duration: fadeDuration, afterFinish: function(){
	   $('productImage').observe("load", function(){
	  		setThumb(thumbId); 
		   	$('productImage').appear({duration: appearDuration});  
	   });	
	   $('productImage').writeAttribute('src', ''); 
	   $('productImage').writeAttribute('src', imageName); 	   
	   $('productImage').setStyle({ height: "435px", width:"auto"});   
     } 
	}); 
   	imageListIndex = inIndex;
   	return false;
}


function setThumb(inID) {
	var ts = $$('#detailThumbs a.selected');
	ts[0].removeClassName('selected');
	$(inID).addClassName('selected');
}

function prevImage() {
	if(imageListIndex == 0) {
		imageListIndex = imageList.length-1; }
	else {
		imageListIndex--; }
	updateBigImage(imageListIndex);
	return false;
}

function nextImage() {
	if(imageListIndex == imageList.length-1) {
		imageListIndex = 0; }
	else {
		imageListIndex++; }
	updateBigImage(imageListIndex);
	return false;
}

function hideImage(inEntryID) {
	new Effect.Fade(inEntryID, {duration:.4, queue: { position: 'end', scope: inEntryID, limit:2 }});
}

function showImage(inEntryID) {
	setTimeout(function(){new Effect.Appear(inEntryID, {duration:.6, queue: { position: 'end', scope: inEntryID, limit:1 }})},700);
}


/*
function hideImage(inEntryID) {
	$(inEntryID).fade({duration: 0.7, queue: { position: 'end', scope: inEntryID, limit:1 }});  
}

function showImage(inEntryID) {
	$(inEntryID).appear({duration: 0.7, queue: { position: 'end', scope: inEntryID, limit:1 }});  
}
*/


/*

<script type="text/javascript">
var RollIt = {
    timeout : null,
    showPopup : function(){
        clearTimeout(this.timeout);
        if($('rollit').style.display == 'none'){
            this.timeout = setTimeout(function(){new Effect.BlindDown('rollit', {duration:.3, fps:40})},400);
        }
    },
    hidePopup : function(){
        if($('rollit').style.display == 'none'){
            clearTimeout(this.timeout);
        }else{
            this.timeout = setTimeout(function(){new Effect.BlindUp('rollit', {duration:.3, fps:40})},300);
        }
    }    
}
</script>

<div style="padding: 10px; background: #fff999;">
<a href="#" onclick="hoverThumbnail.showImage('e_37')" onmouseout="hoverThumbnail.showImage('e_37')" onmouseover="hoverThumbnail.hideImage('e_37')">Roll over Me</a>
</div>

<div id="rollit" style="display:none; background: #ff9999;" onmouseout="RollIt.hidePopup('rollit')" onmouseover="RollIt.showPopup('rollit')"> 

<h3 style="margin: 0;">Roll It</h3>
By keeping your mouse hovering over this div or over the link that made it appear, it will stay open.

<br/><br/>
But, if you roll away from this div, it will roll back up.
</div>

<div style="background: #fff999; padding: 10px;">
  Here's a bunch of other content
</div>
*/