// JavaScript Document
var current_dev=1;
var firstTimeDev = 0;
var totalImages = 0;
var timer = 8000;
var speed = 100;
var pause = 100;


function rotateDevelopments(){

	if(firstTimeDev == 0 ){
	  firstTimeDev++;
	  var images = document.getElementById('dev_image').getElementsByTagName('img');	
	  totalImages = images.length;
    }
    else{
	  changeDevelopment('next',totalImages); 
    }

	setTimeout("rotateDevelopments()", timer);
}

function changeDevelopment(option,total_devs, delay){
	
	var changeTo = current_dev;

	if(option=="previous" && current_dev>1){
		changeTo--;
	}	
	else if(option=="previous" && current_dev==1){
		changeTo=total_devs;
	}	

	if(option=="next" && current_dev<total_devs){
		changeTo++;
	}	
	else if(option=="next" && current_dev==total_devs){
		changeTo=1;
	}	

	var div_image = document.getElementById("dev_"+current_dev);
	var div_imageToChange = document.getElementById("dev_"+changeTo);
	
	var div_title = document.getElementById("dev_title_"+current_dev);
	var div_titleToChange = document.getElementById("dev_title_"+changeTo);

	var div_link = document.getElementById("dev_link_"+current_dev);
	var div_linkToChange = document.getElementById("dev_link_"+changeTo);

	var div_instructions = document.getElementById("instructions_"+current_dev);
	var div_instructionsToChange = document.getElementById("instructions_"+changeTo);

	startBlending(div_image, div_imageToChange, speed, pause);

	div_link.style.display='none';
	div_linkToChange.style.display='block';

	setOpacity(div_title,0);
	div_title.style.display='none';
	setOpacity(div_titleToChange,0);
	div_titleToChange.style.display='block';
	continueFadeImage(div_titleToChange, 0, speed, pause);

	setOpacity(div_instructions,0);
	div_instructions.style.display='none';
	setOpacity(div_instructionsToChange,0);
	div_instructionsToChange.style.display='block';
	continueFadeImage(div_instructionsToChange, 0, speed, pause);

	current_dev = changeTo;
	
}


//make image a block-element and set the caption
function startBlending(currentImage, nextImage, speed, pause, caption, id ) {

	currentImage.parentNode.style.backgroundImage = "url("+currentImage.src+")";

	setOpacity(currentImage,0);
	currentImage.style.display='none';
	
	setOpacity(nextImage,0);
	nextImage.style.display='block';


	continueFadeImage(nextImage, 0, speed, pause, caption);

    if(caption != null) {
		url = document.getElementById('siteURL').value;
		
		var linkSection = document.getElementById("propertyLinkSection");
		var	opacity = 100;
		
		textProperty = document.getElementById('textProperty'+nextImage.alt).value; 
		linkProperty = url +"property/"+nextImage.alt+".html";
		titleProperty = nextImage.title;
		
		continueFadeLink(linkSection, opacity, speed, pause, caption, textProperty, linkProperty, titleProperty );
   }
}


//set a decreased opacity
function continueFadeLink(linkSection, opacity, speed, pause, caption, textProperty, linkProperty, titleProperty ) {
    opacity = opacity - 10;
    if (opacity >= 0) {
    setOpacity(linkSection,opacity);
	setTimeout(function() {continueFadeLink(linkSection, opacity, speed, pause, caption, textProperty, linkProperty, titleProperty)}, speed);
    }
    else if(opacity <= 0){
    	document.getElementById(caption).innerHTML = textProperty;
		document.getElementById(caption).href = linkProperty; 
		document.getElementById(caption).title = titleProperty;
    	continueBrightenLink(linkSection,opacity, speed, pause);
    } 
}
//set an increased opacity
function continueBrightenLink(linkSection, opacity, speed, pause) {
    opacity = opacity + 10;
    if (opacity <= 100) {
    setOpacity(linkSection,opacity);
	setTimeout(function() {continueBrightenLink(linkSection, opacity, speed, pause)}, speed);
    } 
}


//set an increased opacity and check if the image is done blending
function continueFadeImage(image, opacity, speed, pause, caption) {

    opacity = opacity + 5;
    if (opacity < 103) {
	setTimeout(function() {fadeImage(image, opacity, speed, pause, caption)}, speed);

    } 
}

//set the opacity to a new value and continue the fading
function fadeImage(image, opacity, speed, pause, caption) {
    setOpacity(image,opacity);
    continueFadeImage(image, opacity, speed, pause, caption);
}
//set the opacity of an element to a specified value
function setOpacity(obj, o) {
    obj.style.opacity = (o / 100);
    obj.style.MozOpacity = (o / 100);
    obj.style.KhtmlOpacity = (o / 100);
    obj.style.filter = 'alpha(opacity=' + o + ')';
}