if (!window.idxFormats)
	idxFormats = [];

function idx_format_details(){
	this.imageWidth = 175;
	this.imageHeight = 120;
	this.ratio = this.imageWidth/this.imageHeight
	
	CSSRule ('.idxProperty',{width:'600px',height:'185px',padding:'5px',position:'relative'})
	CSSRule ('.idxProperty',{backgroundColor:'#f1f1f1',borderBottom:'2px solid #999',marginBottom:'3px',fontFamily:'Verdana, Arial, Helvetica, sans-serif',fontSize:'11px'},{insertOnly:true})
	CSSRule ('.idxFav',{backgroundColor:'#045256',borderBottom:'2px solid #032c2e'},{insertOnly:true})
	CSSRule ('.idxProperty .banner',{position:'absolute',zIndex:10})
	CSSRule ('.idxProperty .banner',{width:'95px',height:'82px',left:'0px',top:'0px'})
	CSSRule ('.idxProperty .reducedprice',{position:'absolute',width:'90px',height:'25px',left:'88px',top:'102px'},{insertOnly:true})
	CSSRule ('.idxProperty .fLink',{color:'#2f8589',textDecoration:'underline',cursor:'pointer',cursor:'hand'},{insertOnly:true})
	CSSRule ('.idxFav .fLink',{color:'lightyellow',textDecoration:'underline',cursor:'pointer',cursor:'hand'},{insertOnly:true})
	CSSRule ('.idxProperty .fav',{cssFloat:'left',styleFloat:'left',width:'15px',height:'15px',marginTop:'8px',marginLeft:'5px',cursor:'hand',cursor:'pointer'})
	CSSRule ('.idxProperty .left',{cssFloat:'left',styleFloat:'left',marginRight:'5px',overflow:'hidden',padding:'3px'})
	CSSRule ('.idxProperty .left',{backgroundColor:'white',textAlign:'center',width:'179px',height:'152px'},{insertOnly:true})
	CSSRule ('.idxProperty .left .nophoto',{position:'relative',width:'175px',height:'120px',border:'1px solid #CCC',overflow:'hidden',backgroundImage:'url(/wwwroot/t/tricityidx/formats/images/nophoto.jpg)'})
	CSSRule ('.idxProperty .left .address',{width:'175px'})
	CSSRule ('.idxProperty .left .address .street',{cssFloat:'left',styleFloat:'left',lineHeight:'125%',paddingTop:'4px;',fontSize:'10px'})
	CSSRule ('.idxProperty .left .address .street',{width:'145px',height:'30px'},{insertOnly:true})
	CSSRule ('.idxProperty .right',{cssFloat:'right',styleFloat:'right',width:'400px'})
	CSSRule ('.idxProperty .right .header',{height:'30px'})
	CSSRule ('.idxProperty .right .header',{color:'#666'},{insertOnly:true})
	CSSRule ('.idxProperty .right .header .price',{cssFloat:'left',styleFloat:'left',width:'100px',padding:'3px',height:'22px'})
	CSSRule ('.idxProperty .right .header .price',{color:'#666',fontWeight:'bold',textAlign:'left'},{insertOnly:true})
	CSSRule ('.idxFav .right .header .price',{color:'white',fontWeight:'bold',textAlign:'left'},{insertOnly:true})
	CSSRule ('.idxProperty .right .header .property_types',{cssFloat:'left',styleFloat:'left',width:'280px',padding:'3px',height:'22px'})
	CSSRule ('.idxProperty .right .header .property_types',{color:'#666',fontSize:'10px',textAlign:'right'},{insertOnly:true})
	CSSRule ('.idxFav .right .header .property_types',{color:'white'},{insertOnly:true})
	CSSRule ('.idxProperty .right .description',{textAlign:'justify',color:'black'})
	CSSRule ('.idxFav .right .description',{textAlign:'justify',color:'white'})
	CSSRule ('.idxProperty .right .items',{height:'90px',overflow:'hidden'},{insertOnly:true})
	CSSRule ('.idxProperty .item_name',{color:'#666',fontWeight:'bold',textAlign:'left',fontSize:'11px'},{insertOnly:true})
	CSSRule ('.idxFav .item_name',{color:'white',fontWeight:'bold',textAlign:'left',fontSize:'11px'},{insertOnly:true})
	CSSRule ('.idxProperty .item',{color:'#666',fontWeight:'normal',textAlign:'left',fontSize:'11px'},{insertOnly:true})
	CSSRule ('.idxFav .item',{color:'white'},{insertOnly:true})
	CSSRule ('.idxProperty .right .col1',{cssFloat:'left',styleFloat:'left',width:'49%',height:'96px'})
	CSSRule ('.idxProperty .right .col1',{color:'#666',fontWeight:'bold',textAlign:'left',paddingTop:'7px'},{insertOnly:true})
	CSSRule ('.idxProperty .right .col2',{cssFloat:'left',styleFloat:'left',width:'49%',height:'96px',color:'#666',textAlign:'right',paddingTop:'7px'})
	CSSRule ('.idxProperty .right .footer',{height:'27px'})
	CSSRule ('.idxProperty .right .footer',{color:'#443b2a'},{insertOnly:true})
	CSSRule ('.idxProperty .right .footer .idx_logo',{cssFloat:'left',styleFloat:'left',width:'59px',padding:'3px',height:'22px',textAlign:'left'},{insertOnly:true})
	CSSRule ('.idxProperty .right .footer .company',{cssFloat:'left',styleFloat:'left',width:'200px',padding:'3px',paddingTop:'6px',color:'#666',height:'22px',textAlign:'left',lineHeight:'135%',fontSize:'8px'},{insertOnly:true})
	CSSRule ('.idxFav .right .footer .company',{color:'white'})
	CSSRule ('.idxProperty .right .footer .more_details',{cssFloat:'left',styleFloat:'left',width:'114px',padding:'3px',color:'#666',height:'22px',fontSize:'10px',textAlign:'right'},{insertOnly:true})
	
	CSSRule ('.idxProperty .right .footer .more_details .more_info',{cssFloat:'right',styleFloat:'right',width:'80px',height:'31px',fontSize:'10px',fontWeight:'bold',textAlign:'center',lineHeight:'31px',textDecoration:'underline',cursor:'pointer'})
	CSSRule ('.idxProperty .right .footer .more_details .more_info',{backgroundImage:'url(/wwwroot/t/tricityidx/formats/images/moreinfo_ira.jpg)',color:'white'},{insertOnly:true})
	
	CSSRule ('.idxFav .right .footer .more_details .more_info',{cssFloat:'right',styleFloat:'right',width:'80px',height:'31px',fontSize:'10px',fontWeight:'bold',textAlign:'center',lineHeight:'31px',textDecoration:'underline',cursor:'pointer',cursor:'hand'})
	CSSRule ('.idxFav .right .footer .more_details .more_info',{backgroundImage:'url(/wwwroot/t/tricityidx/formats/images/moreinfo_ira_fav.jpg)',color:'#045256'},{insertOnly:true})
	CSSRule ('.idxProperty .right .footer .more_details .more_info .link',{paddingLeft:'0px'},{insertOnly:true})
	
	CSSRule ('.idxProperty .legal',{cssFloat:'left',styleFloat:'left',height:'20px',width:'600px'})
	CSSRule ('.idxProperty .legal',{paddingTop:'3px',lineHeight:'20px',fontSize:'10px',color:'#666'},{insertOnly:true})
	CSSRule ('.idxFav .legal',{cssFloat:'left',styleFloat:'left',height:'20px',width:'600px'})
	CSSRule ('.idxFav .legal',{paddingTop:'3px',lineHeight:'20px',fontSize:'10px',color:'#7ad1d5'},{insertOnly:true})
	
	CSSRule ('.brochureDiv',{position:'absolute',visibility:'hidden',overflow:'auto'});
	CSSRule ('.descDiv',{position:'absolute',visibility:'hidden',overflow:'auto'});
	
	CSSRule ('.print',{display:'none'});
	CSSRule ('.noprint',{display:'block'});
	
	this.load = function(elm,controlObj){
		if(!window.brochureDiv){
			brochureDiv = $(document.createElement('div'));
			brochureDiv.className = 'brochureDiv';
			document.body.appendChild(brochureDiv);
		}
		
		var c, s, hb, fb, ac, yb, imgPath;
		var x = controlObj.dataArray;
		var images = controlObj.images;
		
		var a=[];
		var favs = controlObj.favs;
		var day = 1000*60*60*24;
		for (var i=controlObj.start; i <= controlObj.end ;i++){
			var f = favs && favs[x[i].PROPID];
			var pd = x[i].PRICEDATE && (new Date() - x[i].PRICEDATE.getTime()) / day <= 7			
			var z = this.propStatus(pd,f);
			//if (favs && favs[x[i].PROPID]){
			if (f){
				c = 'idxFav';
				s = 'star_on';
			}
			else{
				c = '';
				s = 'star_off';
			}
			
			hb = x[i].HALFBATHS || '---';
			fb = x[i].FULLBATHS || '---';
			ac = x[i].ACRES || '---';
			yb = x[i].YEARB || '---';

			if(idxBoardsX[x[i].BOARDID])
				var imagePath = idxBoardsX[x[i].BOARDID].IMAGEPATH;

			a.push('<div class="idxProperty '+c+'" i="'+i+'" f="'+(!!f || '')+'"  pd="'+(pd || '')+'" >');
			a.push('	<div class="banner">');
			a.push('		<img class="bannerImage cImage" style="display:'+z[1]+'"  src="/wwwroot/t/tricityidx/formats/images/'+z[0]+'">');
			a.push('	</div>');
			a.push('	<div class="left">');
			a.push('		<div class="nophoto"></div>');
			a.push('		<div class="address">');
			a.push('			<div class="fav"><img class="star" src="/wwwroot/t/tricityidx/images/'+s+'.gif" /></div>');
			a.push('			<div class="street">'+x[i].STREETDIR+' '+x[i].STREETNUM+' '+x[i].STREETNAME+'<br>'+iraCitiesX[x[i].CITY_ID].CITY+', '+x[i].ZIP+'</div>');
			a.push('		</div>');
			a.push('	</div>');
			a.push('	<div class="right">');
			a.push('		<div class="header">');
			a.push('			<div class="price">$'+x[i].PRICE.format()+'</div>');
			a.push('			<div class="property_types">'+x[i].ATTR.join(", ")+'</div>');
			a.push('		</div>');
			a.push('		<div class="items" id="prop_'+x[i].PROPID+'_info">');			
			a.push('			<div class="description">'+x[i].PROPDESC+'</div>');
			a.push('			<div class="col1">');
			a.push('				<table width="100%" border="0" cellspacing="0" cellpadding="2">');
			a.push('					<tr>');
			a.push('						<td width="60%" class="item_name">MLS #</td>');
			a.push('						<td class="item">'+x[i].BOARDID+x[i].MLS+'</td>');
			a.push('					</tr>');
			a.push('					<tr>');
			a.push('						<td class="item_name">Bedrooms</td>');
			a.push('						<td class="item">'+x[i].BEDROOMS+'</td>');
			a.push('					</tr>');
			a.push('					<tr>');
			a.push('						<td class="item_name">Full/Half Baths</td>');
			a.push('						<td class="item">'+fb+' / '+hb+'</td>');
			a.push('					</tr>');
			a.push('				</table>');
			a.push('			</div>');
			a.push('			<div class="col2">');
			a.push('				<table width="100%" border="0" cellspacing="0" cellpadding="2">');
			a.push('					<tr>');
			a.push('						<td width="60%" class="item_name">Acres</td>');
			a.push('						<td class="item">'+ac+'</td>');
			a.push('					</tr>');
			a.push('					<tr>');
			a.push('						<td class="item_name">Sq. Ft.</td>');
			a.push('						<td class="item">'+x[i].SQFEET+'</td>');
			a.push('					</tr>');
			a.push('					<tr>');
			a.push('						<td class="item_name">Year Built</td>');
			a.push('						<td class="item">'+yb+'</td>');	
			a.push('					</tr>');
			a.push('				</table>');
			a.push('			</div>');
			a.push('		</div>');
			a.push('		<div class="footer">');
			a.push('			<div class="idx_logo"><img src="/wwwroot/t/tricityidx/formats/images/idx_baycity.jpg"></div>');
			a.push('			<div class="company"><div  class="fLink popupEmail" style="font-size:12px;padding-bottom:3px;" >Get more information.</div>Listed by: '+x[i].LISTINGCOMPANYNAME+'</div>');
			a.push('			<div class="more_details" align="center"><div class="more_info brochure"><div class="link brochure">Details</div></div></div>');
			a.push('		</div>');
			a.push('	</div>');
			a.push('	<div class="legal">Information not legally guaranteed. All items should be independently verified.</div>');
			a.push('</div>');
		}

		elm.innerHTML = a.join('');

		var myimg = elm.getElementsByClassName('bannerImage')[0];
		var photos = elm.getElementsByClassName('nophoto');
		
		for (var ii=0;ii<photos.length;ii++){
			var myElm = photos[ii];
			while (!myElm.hasClassName('idxProperty')){
				myElm = $(myElm.parentNode);
			}
			
			var i = myElm.getAttribute('i')
			Event.observe(myElm.getElementsByClassName('star')[0],'click',function(obj){
				var pd = this.getAttribute('pd');

				this.setAttribute('f',!eval(this.getAttribute('f')))
				
				var f = eval(this.getAttribute('f'));

				var img = this.getElementsByClassName('bannerImage')[0];
				var a = obj.propStatus(pd,f)

				img.style.display = a[1];
				img.src = '/wwwroot/t/tricityidx/formats/images/'+a[0];
			}.bind(myElm,this))
			if (images[x[i].PROPID]){
				photos[ii].appendChild(images[x[i].PROPID])
				myElm.getElementsByClassName('banner')[0].addClassName('cImage');
			}
			else {
				var banner = myElm.getElementsByClassName('cImage')[0]
				banner.removeClassName('cImage')
			}
		}
		
		var descriptions = elm.getElementsByClassName('description');
		var fontS = parseInt(descriptions[0].getStyle('font-size'))
		var Padding = parseInt(descriptions[0].getStyle('padding') || 0)
		var lineHeight = fontS + Padding + fontS*.25
		var h = lineHeight*2

		for (var i=0;i<descriptions.length;i++){
			b = descriptions[i].innerHTML.split(' ');
			while (descriptions[i].offsetHeight>h){
				b.pop()
				descriptions[i].innerHTML = b.join(' ')+'... <span class="fLink brochure">more</span>'
			}
		}
	}
	this.propStatus = function(pd, f){
		var bannerDisplay = '';
		var bannerSrc = '';
		if (pd && f) {
			bannerSrc = 'banner_favorite_reduced.png';
		} else if (pd) {
			bannerSrc = 'banner_reduced_price.png';
		} else if (f) {
			//bannerSrc = 'banner_favorite.png';
			//bannerSrc = 'moreinfo_ira.jpg';
			bannerSrc = 'banner_favorite.png';
		} else {
			bannerDisplay = 'none';
		}
		return [bannerSrc,bannerDisplay]
	}
	this.name = 'Details';
}
idxFormats.push(new idx_format_details)