/*
Copyright (c) 2007, Parosweb O.E. All rights reserved.
version: 2007-08-10
*/

////////////////////////////////////////////////////////////////////////////////
// Shortcuts ///////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
var $U = YAHOO.util;
var $D = YAHOO.util.Dom;
var $E = YAHOO.util.Event;


////////////////////////////////////////////////////////////////////////////////
// Details Object //////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
function SyDetails() {
	this.sId = 'rtls_table';
	this.sDNavId = 'sy_details_nav';
	this.sMaskId = 'sy_details_mask';
	this.sCloseId = 'sy_details_close';
	this.oMask   = false;
	
	// gallery ids
	this.sGalleryId     = 'sy_gallery';
	this.sThumbsId      = 'sy_thumbs';
	this.sThumbsSlideId = 'sy_thumbs_table';
	this.sImgId         = 'sy_img';
	this.sThumbsNavBack = 'sy_thback';
	this.sThumbsNavNext = 'sy_thnext';

	// contact ids
	this.sContactId     = 'sy_email';
	this.sContactForm   = 'sy_ocontact_form';
	this.sContactCId    = 'sy_ocontact_cancel';
	this.sContactSId    = 'sy_ocontact_submit';

	// loading
	this.sLoadId = 'sy_details_load';
	this.oLoad = false;
	this.sLoad =  '<img src="/interface/ic-indicator.gif" alt="" width="16" height="16" /><br />';
	this.sLoad += 'Loading ... Please wait.';
	this.sSucc =  '<img src="/interface/ic-indicator.gif" alt="" width="16" height="16" /><br />';
	this.sSucc += 'E-mail sent successfully.';
	//<div style="opacity: 0.6; display: block;" id="sy_details_mask">&nbsp;</div>
	//<div id="sy_details_load">
	//	<img src="/interface/ic-indicator.gif" alt="" width="16" height="16" /><br />
	//	Loading ... Please wait.
	//</div>
	
	// img loading
	this.sILoadId = 'sy_img_load';
	this.oILoad = false;
	this.sILoad =  '<img src="/interface/ic-indicator.gif" alt="" width="16" height="16" />';
	//<div id="sy_img_load">
	//	<img src="/interface/ic-indicator.gif" alt="" width="16" height="16" />
	//</div>
}
SyDetails.version = '2007-08-10';
SyDetails.ident   = 'SyDetails';

// init ////////////////////////////////////////////////////////////////////////
SyDetails.prototype.init = function() {
	var o = this;
	$E.on( o.sId, 'mouseover', o.rowHandler, o, true );
	$E.on( o.sId, 'mouseout', o.rowHandler, o, true );
	$E.on( o.sId, 'click', o.rowHandler, o, true );
}
// rowHandler //////////////////////////////////////////////////////////////////
SyDetails.prototype.rowHandler = function( e ) {
	var o = this;
	$E.stopEvent( e );
	var oE = $E.getTarget( e );
	while ( oE.id != o.sId ) {
		if( oE.nodeName.toUpperCase()=='TR' && oE.parentNode.nodeName.toUpperCase()=='TBODY' ) {
			if ( e.type=='mouseover' ) {
				o.toggleClass( oE, 'sel', 'add' );
			}
			else if ( e.type=='mouseout' ) {
				o.toggleClass( oE, 'sel', 'rem' );
			}
			else if ( e.type=='click' ) {
				var oA = $D.getElementsByClassName('thlink','a',oE)[0];
				// new
				var aUrl = oA.id.split('__');
				var aVars = aUrl[1].split('_');
				
				var sUrl = '/'+aVars[4]+'rentals-directory/details/'+aUrl[0]+'/index-ax.html'
				sUrl += '?idx='+aVars[0]+'&page='+aVars[1]+'&sort='+aVars[2]
				if ( aVars[3]==1 ) { sUrl += '&desc=1' }
				if ( oA.href.search( /\?qs=/ )>0 ) {
					var aHref = oA.href.split( '?' );
					sUrl += '&' + aHref[1];
				}
				// old
				//var sUrl = oA.href;
				//sUrl = sUrl.replace( /\.html/,'-ax.html' );
				$E.removeListener( o.sId );
				$D.removeClass( oE, 'sel' );
				o.showDetails( sUrl );
			}
			break;
		} else { 
			oE = oE.parentNode; 
		}
	}
}
// navHandler //////////////////////////////////////////////////////////////////
SyDetails.prototype.navHandler = function( e ) {
	var o = this;
	$E.stopEvent( e );
	var oE = $E.getTarget( e );
	while ( oE.id != o.sDNavId ) {
		if( oE.nodeName.toUpperCase()=='A' && oE.href.search(/^java/)==-1 ) {
			var sUrl = oE.href;
			sUrl = sUrl.replace( /\.html/,'-ax.html' );
			$E.removeListener( o.sThumbsId );
			o.showDetails( sUrl, true );
			break;
		} else { 
			oE = oE.parentNode; 
		}
	}
}

// showDetails /////////////////////////////////////////////////////////////////
SyDetails.prototype.showDetails = function( sUrl, bDnav ) {
	var o = this;
	o.showMask();
	if ( !o.oDetails ) {
		o.oDetails = document.createElement( 'div' );
		o.oDetails.id = 'sy_odetails';
		o.oDetails.innerHTML = '&nbsp;';
		$D.setStyle( o.oDetails, 'display', 'none' );
		o.appendElement( o.oLoad, o.oDetails );
	}
	var t1 = setTimeout( function() {
		if ( bDnav ) {
			$D.addClass( o.oLoad, 'dnav' );
		}
		$D.setStyle( o.oLoad, 'display', 'block' );
	}, 100 );
	var t2 = setTimeout( function() {  
		$U.Connect.asyncRequest( 'GET', sUrl, {
			success:o.onSuccess,
			failure:o.onFailure,
			scope:o
		} );
	}, 600 );
}
SyDetails.prototype.onSuccess = function( oAjax ) {
	var o = this;
	o.oDetails.innerHTML = oAjax.responseText;
	$D.setStyle( o.oLoad, 'display', 'none' );
	$D.removeClass( o.oLoad, 'dnav' );
	$E.on( o.sDNavId, 'click', o.navHandler, o, true );
	$D.setStyle( o.oDetails, 'display', 'block' );
	$E.on( o.sContactId, 'click', o.showContact, o, true );
	$E.on( o.sCloseId, 'click', o.onClose, o, true );
	// Gallery Init //
	o.galleryInit();
}
SyDetails.prototype.onFailure = function( oAjax ) {
	var o = this;
	o.hideDetails();
	alert( 'failure' );
}
SyDetails.prototype.onClose = function(e) {
	var o = this;
	$E.stopEvent(e);
	$E.removeListener( o.sDNavId );
	$E.removeListener( o.sThumbsId );
	o.hideDetails();
}

// hideDetails /////////////////////////////////////////////////////////////////
SyDetails.prototype.hideDetails = function() {
	var o = this;
	$D.setStyle( o.oDetails, 'display', 'none' );
	o.oDetails.innerHTML = '&nbsp;';
	o.hideMask();
	o.init();
}

// initMask ////////////////////////////////////////////////////////////////////
SyDetails.prototype.initMask = function() {
	var o = this;
	if ( !o.oMask ) {
		o.oMask = document.createElement( 'div' );
		o.oMask.id = o.sMaskId;
		o.oMask.innerHTML = '&nbsp;';
		$D.setStyle( o.oMask, 'opacity', '0' );
		$D.setStyle( o.oMask,'display', 'none' );
		o.prependElement( $D.get( 'rtls_table' ), o.oMask );
	}
	if ( !o.oLoad ) {
		o.oLoad = document.createElement( 'div' );
		o.oLoad.id = o.sLoadId;
		o.oLoad.innerHTML = o.sLoad;
		$D.setStyle( o.oLoad,'display', 'none' );
		o.appendElement( o.oMask, o.oLoad );
	}
}
// showMask ////////////////////////////////////////////////////////////////////
SyDetails.prototype.showMask = function() {
	var o = this;
	o.initMask();
	if ( $D.getStyle( o.oMask,'display' )=='block' ) { return; }
	$D.setStyle( o.oMask,'display', 'block' );
	var Fade = new $U.Anim( o.sMaskId, { opacity:{ from:0, to:0.6 } }, 0.3, $U.Easing.easeOut );
	Fade.animate();
	Fade.onComplete.subscribe( function() {
		$E.on( o.sMaskId, 'click', o.hideDetails, o, true );
	} );
}
// hideMask ////////////////////////////////////////////////////////////////////
SyDetails.prototype.hideMask = function() {
	var o = this;
	var Fade = new $U.Anim( o.sMaskId, { opacity:{ from:0.6, to:0 } }, 0.3, $U.Easing.easeOut );
	Fade.animate();
	Fade.onComplete.subscribe( function() {
		$D.setStyle( o.oMask, 'display', 'none' );
    $E.removeListener( o.oMask, 'click' );
	} );
}



// galleryHandler //////////////////////////////////////////////////////////////
SyDetails.prototype.galleryInit = function() {
	var o = this;
	$E.on( o.sThumbsId, 'click', o.galleryHandler, o, true );
}
SyDetails.prototype.galleryHandler = function( e ) {
	var o = this;
	o.oImg = $D.get( o.sImgId );
	$E.stopEvent( e );
	var oE = $E.getTarget( e );
	while ( oE.id != o.sThumbsId ) {
		// thumbnail clicked on
		if( oE.nodeName.toUpperCase()=='IMG' ) {
			o.sSrc = oE.src;
			o.sSrc = o.sSrc.replace( /\-tn\.jpg/,'.jpg' );
			if ( o.oImg.src != o.sSrc ) {
				//var img = new Image();
				var img = document.createElement('img');
				o.showImgLoad();
				img.src = o.sSrc;
				$E.addListener( img, 'load', function() { 
					var t1 = setTimeout( function() {
						o.oImg.src = o.sSrc; 
						o.hideImgLoad();
					}, 300 );
				}, o, true );				
			}
			break;
		// thumbnail nav
		} else if( oE.nodeName.toUpperCase()=='A' && ( oE.id==o.sThumbsNavBack || oE.id==o.sThumbsNavNext ) ) {
			oTable = $D.get( o.sThumbsSlideId );
			var r = $D.getRegion( oTable );
			var w = r.right-r.left;
			var l = parseInt( $D.getStyle( oTable, 'left' ) );
			var Move = false;
			if ( oE.id==o.sThumbsNavBack && l<0 ) {
					Move = new $U.Anim( o.sThumbsSlideId, { left:{ from:l, to:(l+375) } }, 0.3, $U.Easing.easeOut );
					o.thNav( w, l+375 );	
			} else if ( oE.id==o.sThumbsNavNext && w>(Math.abs(l)+375) ) {
					Move = new $U.Anim( o.sThumbsSlideId, { left:{ from:l, to:(l-375) } }, 0.3, $U.Easing.easeOut );
					o.thNav( w, l-375 );
			}
			if ( Move ) {
				$E.removeListener( o.sThumbsId );
				Move.animate();
				Move.onComplete.subscribe( o.galleryInit, o, true );
			}
			break;
		} else {
			oE = oE.parentNode;
		}
	}
}
SyDetails.prototype.thNav = function( w, l ) {
	var o = this;
	if ( l==0 ) {
		$D.addClass( o.sThumbsNavBack, 'na' );
	} else {
		$D.removeClass( o.sThumbsNavBack, 'na' );
	}
	if ( ( Math.abs(l)+375 ) >= w ) {
		$D.addClass( o.sThumbsNavNext, 'na' );
	} else {
		$D.removeClass( o.sThumbsNavNext, 'na' );
	}
}
// ImgLoad /////////////////////////////////////////////////////////////////////
SyDetails.prototype.initImgLoad = function() {
	var o = this;
	o.oILoad = $D.get( o.sILoadId );
	if ( !o.oILoad ) {
		o.oILoad = document.createElement( 'div' );
		o.oILoad.id = o.sILoadId;
		o.oILoad.innerHTML = o.sILoad;
		$D.setStyle( o.oILoad,'display', 'none' );
		var img = $D.get( o.sImgId );
		o.appendElement( img, o.oILoad );
	}
}
// showImgLoad /////////////////////////////////////////////////////////////////
SyDetails.prototype.showImgLoad = function() {
	var o = this;
	o.initImgLoad();
	$D.setStyle( o.oILoad,'display', 'block' );
}
// hideImgLoad /////////////////////////////////////////////////////////////////
SyDetails.prototype.hideImgLoad = function() {
	var o = this;
	$D.setStyle( o.oILoad,'display', 'none' );
}



// showContact /////////////////////////////////////////////////////////////////
SyDetails.prototype.showContact = function( e ) {
	var o = this;
	$E.stopEvent( e );
	// prepare div
	var contact = $D.get( 'sy_ocontact' );
	if (!contact) {
		o.oContact = document.createElement( 'div' );
		o.oContact.id = 'sy_ocontact';
		o.oContact.innerHTML = '&nbsp;';
		$D.setStyle( o.oContact, 'display', 'none' );
		$D.addClass( o.oContact, 'cform' );
	}
	var gallery = $D.get( o.sGalleryId );
	o.appendElement( gallery, o.oContact );
	// get url
	var oEmail = $D.get( o.sContactId );
	var sUrl = oEmail.href;
	sUrl = sUrl.replace( /\.html/,'-ax.html' );
	// display load
	o.oLoad.innerHTML = o.sLoad;
	var t1 = setTimeout( function() {
		$D.addClass( o.oLoad, 'dnav' );
		$D.setStyle( o.oLoad, 'display', 'block' );
	}, 100 );
	// start ajax
	var t2 = setTimeout( function() {  
		$U.Connect.asyncRequest( 'GET', sUrl, {
			success:o.onContactSuccess,
			failure:o.onContactFailure,
			scope:o
		} );
	}, 600 );
}
SyDetails.prototype.onContactSuccess = function( oAjax ) {
	var o = this;
	o.oContact.innerHTML = oAjax.responseText;
	
	if ( oAjax.responseText.match( /<\!--success/ ) ) { 
			o.oLoad.innerHTML = o.sSucc;
			var t1 = setTimeout( function() {
				$D.setStyle( o.oLoad, 'display', 'none' );
				$D.removeClass( o.oLoad, 'dnav' );
				$E.removeListener( o.sContactId );
				o.closeContact();
			}, 1000 );
			var t2 = setTimeout( function() {
				o.oLoad.innerHTML = o.sLoad;
			}, 1500 );
	} else {
		$D.setStyle( o.oLoad, 'display', 'none' );
		$D.removeClass( o.oLoad, 'dnav' );
		$D.setStyle( o.oContact, 'display', 'block' );
		$E.removeListener( o.sContactId );
		$E.on( o.sContactId, 'click', o.onContactClose, o, true );
		$E.on( o.sContactCId, 'click', o.onContactClose, o, true );
		$E.on( o.sContactSId, 'click', o.onContactSubmit, o, true );
	}
}
SyDetails.prototype.onContactFailure = function( oAjax ) {
	var o = this;
	o.closeContact();
	alert( 'failure' );
}
SyDetails.prototype.onContactClose = function( e ) {
	var o = this;
	$E.stopEvent(e);
	$E.removeListener( o.sContactId );
	o.closeContact();
}
SyDetails.prototype.closeContact = function() {
	var o = this;
	$D.setStyle( o.oContact, 'display', 'none' );
	o.oContact.innerHTML = '&nbsp;';
	$E.on( o.sContactId, 'click', o.showContact, o, true );
}

SyDetails.prototype.onContactSubmit = function( e ) {
	var o = this;
	$E.stopEvent(e);
	$E.removeListener( o.sContactSId );
	o.oContactForm = $D.get( o.sContactForm );
	var sUrl = o.oContactForm.action;
	sUrl = sUrl.replace( /\.html/,'-ax.html' );
	// display load
	var t1 = setTimeout( function() {
		$D.addClass( o.oLoad, 'dnav' );
		$D.setStyle( o.oLoad, 'display', 'block' );
	}, 100 );
	// start ajax
	$U.Connect.setForm( o.oContactForm );
	var t2 = setTimeout( function() {  
		$U.Connect.asyncRequest( 'POST', sUrl, {
			success:o.onContactSuccess,
			failure:o.onContactFailure,
			scope:o
		} );
	}, 600 );
}



// toggleClass /////////////////////////////////////////////////////////////////
SyDetails.prototype.toggleClass = function( oEl, sClass, act ) {
	if ( !act ) { 
		if ( $D.hasClass( oEl, sClass ) ) {
			$D.removeClass( oEl, sClass );
		} else {
			$D.addClass( oEl, sClass );
		}
	}
	else if ( act=='add' ) {
		$D.addClass( oEl, sClass );
	}
	else if ( act=='rem' ) {
		$D.removeClass( oEl, sClass );
	}
}
// appendElement ///////////////////////////////////////////////////////////////
SyDetails.prototype.appendElement = function( element, addElement ) {
    var father = element.parentNode;
    father.insertBefore( addElement, element.nextSibling );
}
// prependElement //////////////////////////////////////////////////////////////
SyDetails.prototype.prependElement = function( element, addElement ) {
    var father = element.parentNode;
    father.insertBefore( addElement, element );
}


////////////////////////////////////////////////////////////////////////////////
// Base Code ///////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
var oDetails = new SyDetails();
$E.onDOMReady( oDetails.init, oDetails, true );
