function SetOpacity(object,opacityPct)
{
	// IE.
	object.style.filter = 'alpha(opacity=' + opacityPct + ')';
	// Old mozilla and firefox
	object.style.MozOpacity = opacityPct/100;
	// Everything else.
	object.style.opacity = opacityPct/100;
}

function ChangeOpacity(id,msDuration,msStart,fromO,toO)
{
	var element=document.getElementById(id);
	var opacity = element.style.opacity * 100;
	var msNow = (new Date()).getTime();
	opacity = fromO + (toO - fromO) * (msNow - msStart) / msDuration;
	if (opacity<0) 
		SetOpacity(element,0)
	else if (opacity>100)
		SetOpacity(element,100)
	else
	{
		SetOpacity(element,opacity);
		element.timer = window.setTimeout("ChangeOpacity('" + id + "'," + msDuration + "," + msStart + "," + fromO + "," + toO + ")",1);
	}
}

function FadeInImage(foregroundID,newImage,backgroundID)
{
	var foreground=document.getElementById(foregroundID);
	if (backgroundID)
	{
		var background=document.getElementById(backgroundID);
		if (background)
		{
		background.style.backgroundImage = 'url(' + foreground.src + ')';
		background.style.backgroundRepeat = 'no-repeat';
		}
	}
	SetOpacity(foreground,0.3);
	foreground.src = newImage;
	if (foreground.timer) window.clearTimeout(foreground.timer); 
	var startMS = (new Date()).getTime();
	foreground.timer = window.setTimeout("ChangeOpacity('" + foregroundID + "',3000," + startMS + ",0,200)",10);
}


function rectangleFunction() {
	var links = ["https://tharpa.com/us/cd-sale?utm_source=tharpa-banners&utm_medium=display&utm_content=rectangle&utm_campaign=centre-banners-CD-PROMO-11-2020","https://tharpa.com/us/living-meditation?utm_source=tharpa-banners&utm_medium=display&utm_content=rectangle&utm_campaign=centre-banners-Tharpa-24hrTara-2020-04-01","https://tharpa.com/us/my-book?utm_source=tharpa-banners&utm_medium=display&utm_content=rectangle&utm_campaign="];

    
    
    
    
	 
    
        var images = ["https://api.kadampa.org/images/banners/tharpas/cd-promotion-centre-ad-banners-rectangle-180x150.jpg","https://api.kadampa.org/images/banners/tharpas/dedicate-15-minutes-2020-rectangle-180x150.jpg","https://api.kadampa.org/images/banners/tharpas/UK-landing-page-centre-banners-transform-lives-rectangle-180x150_1.jpg"];
    

	var i = 1;
	var mouseOntheAd = false;

	// If bannerImage_4 and bannerLink_4 are null, we need to create this elements
	if (document.getElementById("bannerImage_4") == null & document.getElementById("bannerLink_4") == null) {

		// Creation of bannerLink
		var bannerLink_4 = document.createElement("a");
		bannerLink_4.id = "bannerLink_4";
		bannerLink_4.className = "largerectangle";
		bannerLink_4.href = "https://tharpa.com/us/cd-sale?utm_source=tharpa-banners&utm_medium=display&utm_content=rectangle&utm_campaign=centre-banners-CD-PROMO-11-2020";

		// Creation of bannerImage_4
		var bannerImage_4 = document.createElement("img");
		bannerImage_4.id = "bannerImage_4";
		bannerImage_4.alt = "Promotion 1";
        var src = "";
        
        
        
        
        
        
            src = "https://api.kadampa.org/images/banners/tharpas/cd-promotion-centre-ad-banners-rectangle-180x150.jpg"
        
        bannerImage_4.src = src;

		// Associate bannerImage_4 to bannerLink_4
		bannerLink_4.appendChild(bannerImage_4); 
			
		// Add elements to the empty div 
        var parentDiv = document.getElementById("TharpaAd_4"); 
        var currentDiv = document.getElementById("KadampaFestivalsAds_4")
        parentDiv.insertBefore(bannerLink_4, currentDiv);
	}

	// Interval to change the ads every 12 seconds
	var renew = setInterval(function(){

		// If i is superior to the number of redirection links : set i to 0
		if (links.length == i) {i=0;}
		

		// Asynchronous script to check if the mouse is over or out of the ads
		setTimeout(() => {
		
			// Take bannerImage_4 element
			var bannerImage_4 = document.getElementById('bannerImage_4');
			
			// Use mouse event to know if the mouse is over
			bannerImage_4.onmouseover = function(e) {  
				mouseOntheAd = true;
			}
			
			// Use mouse event to know if the mouse is out
			bannerImage_4.onmouseout = function(e) { 
				mouseOntheAd = false;
			}

		}, 20);

		console.log(mouseOntheAd)
		
		// Only if the the mouse is over, change the ads
		if (mouseOntheAd === false) {
			// Change the bannerImage_4 with transition and bannerLink_4
			FadeInImage("bannerImage_4",images[i],"KadampaFestivalsAds_4")
			document.getElementById("bannerLink_4").href = links[i]; 
			i++;
		}       
	},12000);
}
	
rectangleFunction();