/**
Start cycling by calling startFeaturedHomesCycling, which executes callback() on an interval to 
pass the results from featuredHomesJsonSrv.php to updateHomes().

updateHomes() ensures the returned data is sane and then calls updateHome for each set of elements.

updateHome(i) is what does the heavy lifting by orchestrating the transition for all elements

updateText() calls changeText() which is where the text transitions happen

changeText() uses swap() to transition the text fields

swap() fades the back buffer into the front


**/

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 

function getOpac(id){
	var object = document.getElementById(id).style;
    if(object.opacity) return object.opacity;
    if(object.MozOpacity) return object.MozOpacity;
    if(object.KhtmlOpacity) return object.KhtmlOpacity;
    
}

function blendimage(divid, imageid, imagefile, millisec) {
    var speed = Math.round(millisec / 100);

    // Set image as background
    setBgImg(divid,imageid);   
   
    // Wait for bg image to download, then hide front img
    setTimeout("changeOpac(0, '"+imageid+"')",250);
    // Once front image is hidden, replace it
    setTimeout("setImg('"+imageid+"','"+imagefile+"')",275);
    // Wait a bit longer, then fade the image in
	setTimeout("fadein('"+imageid+"',"+speed+")",500);
}

function setImg(imageid,imagefile){
	//make new image
    document.getElementById(imageid).src = imagefile;
}

function setBgImg(divid,imageid){
	//set the current image as background
    document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
}

function fadein(imageid){
	//fade in image
	var timer=0;
    for(i = 0; i <= 100; i+=5) {
        setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * 50));
        timer++;
    }
}

function fadeout(imageid){
	//fade OUT image
	var timer=0;
	
    for(i = 100; i >=0; i-=5) {
        setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * 50));
        timer++;
    }
}

var homes = Array();
function updateHomes(resp){
	eval("homes = "+resp.responseText);	
	// Slight hack to ensure same home doesn't repeat in the same spot if both homes are the same status
	var newID0 = document.getElementById('listing_id0').value;
	var curID0 = homes[0].listingID;
	var newID1 = document.getElementById('listing_id1').value;
	var curID1 = homes[1].listingID;
	
	// If both homes are same status, make
	if((homes[0].status == homes[1].status)){
		if(((curID0 == newID0) || (curID1 == newID1)) && (homes[1] != undefined)) {
			YAHOO.util.Connect.asyncRequest('POST', '/featuredHomesJsonSrv.php', callback);
			return;
		}		
	}else{
		// If they are different types, just ensure they don't both repeat
		if(((curID0 == newID0) && (curID1 == newID1)) && (homes[1] != undefined)){
			YAHOO.util.Connect.asyncRequest('POST', '/featuredHomesJsonSrv.php', callback);
			return;
		}
	}
	
	//alert(curID0+" : "+newID0	+" - "+curID1+" : "+newID1);

	updateHome(0);
	updateHome(1);

}

/**
Call this for each home, will fade the image and text
**/
function updateHome(i){
		
	// build img url
	var home = homes[i];
	var imagefile = "http://listings.myrealpage.com/wps/mylistings/740/ListingImage.get?filename=photo-"+home.imageID+".jpg&listingId="+home.listingID+"&w=150&h=100&fitFully=true";
	var divid = 'blenddiv'+i;
	var imageid = 'homePic'+i;
	

    // Set image as background
    setBgImg(divid,imageid);   
   
    // Wait for bg image to download, then hide front img
    setTimeout("changeOpac(0, '"+imageid+"')",250);
    // Once front image is hidden, replace it
    setTimeout("setImg('"+imageid+"','"+imagefile+"')",275);
    // Wait a bit longer, then fade the image in
	setTimeout("fadein('"+imageid+"')",500);
	
	setTimeout("updateText("+i+",homes["+i+"])",500);
}

function updateText(i,home){
	// TODO check that elements exist;
	var pic = document.getElementById('homePic'+i);
	var picLink = document.getElementById('homePicLink'+i);
	var addrLink = document.getElementById('homeAddrLink'+i);
	var status = document.getElementById('homeStatus'+i);

	// Ensure everything is set
	if(pic == undefined ) { /*alert("pic not found");*/ return; }
	if( picLink == undefined ) { /*alert("piclink not found");*/ return; }
	if( addrLink == undefined ) { /*alert("addrlink not found");*/ return; }
	if( status == undefined ) { /*alert("status not found");*/ return; }
	
	picLink.href = "listings_hafez_view.php?listID="+home.listingID;
	addrLink.href = "listings_hafez_view.php?listID="+home.listingID;
	status.innerHTML = home.status == 1 ? "ACTIVE":"SOLD";
	changeText(home,i);
}

var callback = {
	success: updateHomes,
	failure: function(resp) {}
	
}

function startFeaturedHomesCycling(){
	window.setInterval("YAHOO.util.Connect.asyncRequest('POST', '/featuredHomesJsonSrv.php', callback)",5000); 	
}

/**
Works on a front and back buffer elements
Copies innerHTML from front to back
Sets opacity of front to 0 and back to 100
Assigns new HTML to front buffer
Fades front buffer in over back buffer
**/
function swap(frontid,backid,text){
	var f = document.getElementById(frontid);
	var b = document.getElementById(backid);
	var opac = getOpac (frontid);
	
	b.innerHTML = f.innerHTML;
	changeOpac(0,frontid);
	changeOpac(100,backid);
	
	setTimeout("assignInnerHTML('"+f.id+"','"+text+"')",50);
	setTimeout("fadeout('"+b.id+"')",100);
	setTimeout("fadein('"+f.id+"')",100);
}

function hide(frontid,backid){
	var f = document.getElementById(frontid);
	var b = document.getElementById(backid);
	
	setTimeout("fadeout('"+f.id+"')",100);
	setTimeout("assignInnerHTML('"+f.id+"','')",150);
	setTimeout("assignInnerHTML('"+b.id+"','')",150);
}


function assignInnerHTML(id,html){
	document.getElementById(id).innerHTML = html;
}

function changeText(home,i){
	document.getElementById("listing_id"+i).value=home.listingID;
	swap('address_front'+i,'address_back'+i,home.address);
	
	swap('homeprice_front'+i,'homeprice_back'+i,home.price);
	swap('homearea_front'+i,'homearea_back'+i,home.area);
	
	document.getElementById('statusdesc_front'+i).className = home.status==1 ? "buffer statusdesc active" : "buffer statusdesc sold";
	document.getElementById('statusdesc_back'+i).className = home.status==1 ? "buffer statusdesc active" : "buffer statusdesc sold";
	changeOpac(0,'statusdesc_back'+i); // since new classname has 100% opac
	
	if(home.statusDesc == ""){
		// fade out foreground and background			
		hide('statusdesc_front'+i,'statusdesc_back'+i);
	}else{
		// Regular swap
		swap('statusdesc_front'+i,'statusdesc_back'+i,home.statusDesc);
	}
	
}