var mail = {
	_requests : {},
	_request_max_id : {},
	//photoPath : 'http://www.hongkonghomes.com/tmp/pro_info/',
	photoPath : 'http://images.hongkonghomes.com/listing/loadPropertyPhoto.php?',
	current_scroll_top : 0,
	shield : null,
	enableShield : false,
	
	// width of mainTable
	mainTableWidth : 789,
	
	// send Enquiry, share property ------------------------------------------------------------
	enquiry : null,
	enquiry_container : null,
	enquiry_content : null,
	enquiry_property : null,
	
	sMail : null,
	sMail_container : null,
	sMail_content : null,
	sMail_property : null,
	
	// width of white region inside outer div
	maxWidth : 416,
	minWidth : 416,
	
	// 
	maxPropertyHeight : 211,
	minPropertyHeight : 105,
	propertyWidth : 320,
	
	
	// ttl height of outer div include outer border
	maxHeight : 645,
	minHeight : 310,
	
	// outer border size
	borderTop : 26,
	borderLeft : 26,
	borderRight : 27,
	borderBottom : 27,
	
	// spacing between browser and clipboard
	marginTop : 105,
	marginBottom : 30,
	
	// white space of clipboard (
	innerBorderLeft : 48,
	innerBorderRight : 48,
	
	// size of clipboard header
	innerBorderImgTop : 30,
	innerBorderImgHeight : 18,
	innerBorderSpacing : 14,
	// end of send Enquiry, share property ----------------------------------------------------
	
	ie : (document.all && !window.opera),

	// general function -------------------------------------------------------------------------
	// set attribute
	extend : function (el, attribs) {
		for (var x in attribs) el[x] = attribs[x];
		return el;
	},
	
	// set style
	setStyles : function (el, styles) {
		for (var x in styles) {
			if (this.ie && x == 'opacity')
			{
				if (styles[x] > 0.99) el.style.removeAttribute('filter');
				else el.style.filter = 'alpha(opacity='+ (styles[x] * 100) +')';
			}
			else
			{
				el.style[x] = styles[x];
			}
		}
	},

	// get size of browser
	getPageSize : function ()
	{
		var d = document, w = window, iebody = d.compatMode && d.compatMode != 'BackCompat' ? d.documentElement : d.body;
		var b = d.body;
		
		var xScroll = (w.innerWidth && w.scrollMaxX) ? w.innerWidth + w.scrollMaxX : Math.max(b.scrollWidth, b.offsetWidth),
			yScroll = (w.innerHeight && window.scrollMaxY) ? w.innerHeight + w.scrollMaxY : Math.max(b.scrollHeight, b.offsetHeight),
			pageWidth = this.ie ? iebody.scrollWidth : (d.documentElement.clientWidth || self.innerWidth),
			pageHeight = this.ie ? Math.max(iebody.scrollHeight, iebody.clientHeight) : (d.documentElement.clientHeight || self.innerHeight);
		
		var width = this.ie ? iebody.clientWidth : (d.documentElement.clientWidth || self.innerWidth),
			height = this.ie ? iebody.clientHeight : self.innerHeight;
		
		return {
			pageWidth: Math.max(pageWidth, xScroll),				// total document width
			pageHeight: Math.max(pageHeight, yScroll),				// total document height
			width: width,											// width of view part
			height: height,											// height of view part
			scrollLeft: this.ie ? iebody.scrollLeft : pageXOffset,	// scrolled left
			scrollTop: this.ie ? iebody.scrollTop : pageYOffset		// scrolled top
		}
	},

	// function to create element
	createElement : function (tag, attribs, styles, parent, nopad)
	{
		var el = document.createElement(tag);
		if (attribs) this.extend(el, attribs);
		if (styles) this.setStyles(el, styles);
		if (parent) parent.appendChild(el);
		if (nopad) this.setStyles(el, {padding: 0, border: 'none', margin: 0});
		return el;
	},
	
	// function to add event listener
	addEventListener : function (el, event, func)
	{
		try {
			
			el.addEventListener(event, func, false);
		} catch (e) {
			// ie
			try {
				el.detachEvent('on'+ event, func);
				el.attachEvent('on'+ event, func);
			} catch (e) {
				el['on'+ event] = func;
			}
		} 
	},
	
	// generate xmlhttprequest element
	getHttpRequestObj : function ()
	{
		var xmlhttp = null;
		
		if (window.XMLHttpRequest)
		{ // Mozilla, etc.
			xmlhttp = new XMLHttpRequest();
		}
		else if (window.ActiveXObject)
		{ // IE
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
		
		return xmlhttp;
	},
	
	setResponseListener : function (action, listener)
	{
		var new_idx = null;
		if (!this._requests[action])
		{
			new_idx = 0;
			this._requests[action] = [];
		}
		else
		{
			new_idx = this._requests[action].length;
		}
		
		if (!this._request_max_id[action])
			this._request_max_id[action] = 1;
		else
			this._request_max_id[action]++;
		
		this._requests[action][new_idx] = {};
		this._requests[action][new_idx]['id'] = this._request_max_id[action];
		this._requests[action][new_idx]['listener'] = listener;
		this._requests[action][new_idx]['http_request'] = this.getHttpRequestObj();
		this._requests[action][new_idx]['http_request'].onreadystatechange = this.responseHandler;
		
		return new_idx;
	},
	
	responseHandler : function ()
	{
		for (var action in mail._requests)
		{
			for (var i = 0; i < mail._requests[action].length; i++)
			{
				if (i < 0)
					break;
				
				var http_request = mail._requests[action][i]['http_request'];
				var listener = mail._requests[action][i]['listener'];
				var req_id = mail._requests[action][i]['id'];
				var sys_mail_type = mail._requests[action][i]['sys_mail_type'];
				
				if (http_request.readyState == 4)
				{
					var response = null;
					var is_xml_response = false;
					if (http_request.status == 200 || http_request.status == 304)
					{
						response = http_request.responseText;
					}
					
					//checkConnection(response, is_xml_response);
					mail._requests[action].splice(i, 1);
					i--;
					
					listener(response, action, req_id, sys_mail_type);
				}
			}
		}
	},
	
	xmlhttpChange : function(response, action ,req_id, sys_mail_type)
	{
		if (response == null)
			return false;
		
		response = eval('('+response+')');
		
		if (action == 'enquiry')
		{
			if(response.error == '1' || response.error == '2' || response.error == '3')
			{
				alert('Connection Failed. Please try again later.');
			}
			else
			{
				mail.loadSelectedItems(response, req_id, action, sys_mail_type);
			}
		}
		else if (action == 'sMail')
		{
			if(response.error == '1' || response.error == '2' || response.error == '3')
			{
				alert('Connection Failed. Please try again later.');
			}
			else
			{
				mail.loadSelectedItems(response, req_id, action, sys_mail_type);
			}
		}
		else if (action == 'send_enquiry')
		{
			if(response.error == '1' || response.error == '2' || response.error == '3')
			{
				mail.createEnquirySentContent(mail.enquiry_content, false);
				alert('Send Failed. Please try again later.');
			}
			else
			{
				mail.createEnquirySentContent(mail.enquiry_content, true);
			}
		}
		else if (action == 'send_sMail')
		{
			if(response.error == '1' || response.error == '2' || response.error == '3')
			{
				mail.createSMailSentContent(mail.sMail_content, false);
				alert('Send Failed. Please try again later.');
			}
			else
			{
				mail.createSMailSentContent(mail.sMail_content, true);
			}
		}
	},
	
	loadSelectedItems : function (json, req_id, req_type, sys_mail_type)
	{
		json.sys_mail_type = sys_mail_type;
		
		if (req_type == 'enquiry')
		{
			if(this.sMail != null)
			{
				this.sMail.style.visibility = 'hidden';
				this.sMail.style.display = 'none';
			}
			
			if(!this.enquiry)
			{
				this.enquiryInitialize(json);
			}
			else
			{
				this.createEnquiryContent(this.enquiry_content, json);
			}
			
			this.enquiry.style.visibility = 'visible';
			this.enquiry.style.display = 'inline';
		}
		else if (req_type == 'sMail')
		{
			if(this.enquiry != null)
			{
				this.enquiry.style.visibility = 'hidden';
				this.enquiry.style.display = 'none';
			}
			
			if(!this.sMail)
			{
				this.sMailInitialize(json);
			}
			else
			{
				this.createSMailContent(this.sMail_content, json);
			}
			
			this.sMail.style.visibility = 'visible';
			this.sMail.style.display = 'inline';
		}
		
		// hide select input in ie
		if(this.ie)
		{
			var select = document.getElementsByTagName('select');
			
			for(var i = 0; i < select.length; i++)
			{
				if (req_type == 'enquiry')
				{
					if(select[i].id != 'm_m' && select[i].id != 'm_d' && select[i].id != 'm_y')
					{
						if(select[i].style.visibility == 'visible')
							select[i].style.visibility = 'hidden';
						else
							select[i].style.display = 'none';
					}
					else
					{
						select[i].style.visibility = 'visible';
					}
				}
				else if (req_type == 'sMail')
				{
					if(select[i].id != 's_reci')
					{
						if(select[i].style.visibility == 'visible')
							select[i].style.visibility = 'hidden';
						else
							select[i].style.display = 'none';
					}
					else
					{
						select[i].style.visibility = 'visible';
					}
				}
			}
		}
		
		if(this.enableShield)
		{
			if(this.ie)
			{
				document.body.scroll = 'no';
			}
			else
			{
				this.current_scroll_top = document.body.scrollTop;
				document.body.scrollTop = 0;
				
				document.body.style.overflow='hidden';
			}
		}
		
		this.setPositionAndSize();
	},
	// end of general function -------------------------------------------------------------------------
	
	
	// function for mail div  ---------------------------------------------------------------------------
	
	// set the size and position of Mail
	setPositionAndSize : function()
	{
		if (this.enquiry || this.sMail)
		{
			var page = this.getPageSize();
			
			var p_menu = document.getElementById('p_menu');
			var offsetLeft = getOffsetfunction(p_menu, true) + p_menu.offsetWidth;
			
			if (this.sMail)
			{
				if (this.sMail.style.visibility == 'visible')
				{
					if(this.sMail_property.offsetHeight > this.maxPropertyHeight)
					{
						this.sMail_property.style.height = this.maxPropertyHeight + 'px';
					}
					else
					{
						this.sMail_property.style.height = '';
					}

					var offsetLeftM = parseInt((this.mainTableWidth - this.sMail.offsetWidth) / 2) + offsetLeft;
					this.sMail.style.left = offsetLeftM + 'px';
				}
			}
			
			if (this.enquiry)
			{
				if (this.enquiry.style.visibility == 'visible')
				{
					if(this.enquiry_property.offsetHeight > this.maxPropertyHeight)
					{
						this.enquiry_property.style.height = this.maxPropertyHeight + 'px';
					}
					else
					{
						this.enquiry_property.style.height = '';
					}
					var offsetLeftE = parseInt((this.mainTableWidth - this.enquiry.offsetWidth) / 2) + offsetLeft;
					this.enquiry.style.left = offsetLeftE + 'px';
				}
			}
		}
	},
	
	// sMail Function ---------------------------------------------------------------
	setSMailRecipient : function(value)
	{
		// check which input has value
		var i, j;
		var startIndex = 1;
		var endIndex = parseInt(value);
		
		for(i = endIndex + 1; i < 6; i++)
		{
			if(trim(document.getElementById('s_to_name_' + i).value) != '' || trim(document.getElementById('s_to_email_' + i).value) != '')
			{
				for(j = startIndex; j < endIndex; j++)
				{
					if(trim(document.getElementById('s_to_name_' + j).value) == '' && trim(document.getElementById('s_to_email_' + j).value) == '')
					{
						document.getElementById('s_to_name_' + j).value = document.getElementById('s_to_name_' + i).value;
						document.getElementById('s_to_email_' + j).value = document.getElementById('s_to_email_' + i).value;
						startIndex = j + 1;
					}
				}
			}
		}
		
		// show input
		for(i = 1; i < parseInt(value) + 1; i++)
		{
			document.getElementById('s_to_name_' + i).style.display = 'inline';
			document.getElementById('s_to_email_' + i).style.display = 'inline';
		}
		
		// hidden input
		for(i = parseInt(value) + 1; i < 6; i++)
		{
			document.getElementById('s_to_name_' + i).value = '';
			document.getElementById('s_to_email_' + i).value = '';
			
			document.getElementById('s_to_name_' + i).style.display = 'none';
			document.getElementById('s_to_email_' + i).style.display = 'none';
		}
	},
	
	sendSMail : function(button)
	{
		var i;
		var index = 1;
		var type = 'send_sMail';
		var criteria = '';
		var valiate_to = false;
		
		if(trim(document.getElementById('s_fr_name').value) == '')
		{
			alert('Please enter your Name');
			document.getElementById('s_fr_name').focus();
			return false;
		}
		
		if(trim(document.getElementById('s_fr_email').value) == '')
		{
			alert('Please enter your Email Address');
			document.getElementById('s_fr_email').focus();
			return false;
		}
		
		
		
		for(i = 1; i < parseInt(document.getElementById('s_reci').value) + 1; i++)
		{
			if(trim(document.getElementById('s_to_name_' + i).value) != '')
			{
				valiate_to = false;
				if(trim(document.getElementById('s_to_email_' + i).value) != '')
				{
					valiate_to = true;
				}
				else
				{
					i++;
					break;
				}
			}
			else if(trim(document.getElementById('s_to_email_' + i).value) != '')
			{
				valiate_to = false;
				if(trim(document.getElementById('s_to_name_' + i).value) != '')
				{
					valiate_to = true;
				}
				else
				{
					i++;
					break;
				}
			}
		}
		
		
		
		if(!valiate_to)
		{
			i--;
			alert('Please enter both your friend\'s Name and Email Address');
			document.getElementById('s_to_email_' + i).focus();
			return false;
		}
		
		criteria += '&s_fr_name=' + encodeURIComponent(trim(document.getElementById('s_fr_name').value));
		criteria += '&s_fr_email=' + encodeURIComponent(trim(document.getElementById('s_fr_email').value));
		
		for(i = 1; i < parseInt(document.getElementById('s_reci').value) + 1; i++)
		{
			if(trim(document.getElementById('s_to_name_' + i).value) != '' && trim(document.getElementById('s_to_email_' + i).value) != '')
			{
				criteria += '&s_to_name_' + index + '=' + encodeURIComponent(document.getElementById('s_to_name_'+ i).value);
				criteria += '&s_to_email_'+ index + '=' + encodeURIComponent(document.getElementById('s_to_email_' + i).value);
				
				index++;
			}
		}
		
		//criteria += '&s_message=' + document.getElementById('s_message').value.replace(/&/g, '__amp__').replace(/\n/g, '__br__').replace(/%/g, '__ps__').replace(/\$/g, '__mm__').replace(/\\/g, '\\\\');
		criteria += '&s_message=' + encodeURIComponent(document.getElementById('s_message').value);
		criteria += '&s_reci=' + (index - 1);
		criteria += '&s_proid=' + document.getElementById('s_proid').value;
		criteria += '&s_type=' + document.getElementById('s_type').value;
		criteria += '&s_sys_mail_type=' + document.getElementById('s_sys_mail_type').value;
		
		button.onclick = null;
		
		//prompt('',criteria);
		var idx = this.setResponseListener(type, mail.xmlhttpChange);
		this._requests[type][idx]['sys_mail_type'] = 0;
		this._requests[type][idx]['http_request'].open('POST', '/property/shareProperty.action', true);
		this._requests[type][idx]['http_request'].setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		this._requests[type][idx]['http_request'].send(criteria);
	},
	
	createSMailProperty : function(container, json)
	{
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var property = this.createElement('div', null, null, container);
		
		var pro_ids = '';
		var item_type = ''
		
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, null, property, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var tr, td, img;
		for(var i = 0; i < json.items.length; i++)
		{
			
			if(pro_ids != '')
			{
				pro_ids += ',';
				item_type += ',';
			}
			
			pro_ids += json.items[i].pro_id;
			item_type += json.items[i].item_type;
			
			if(i > 0)
			{
				// add rule
				tr = this.createElement('tr', null, null, tbody);
				td = this.createElement('td', {colSpan : 2}
				, {
					background: 'url(/common/images/clipboard/rule2.gif)'
					, width : '298px'
					, height : '21px'
				} , tr);
			}
			
			tr = this.createElement('tr', null, null, tbody);
			
			// photo
			td = this.createElement('td', null, {width : '124px'}, tr);
			img = this.createElement('img'
					, {
						//src : this.photoPath + json.items[i].pro_id + '/' + json.items[i].prop_photo
						src : this.photoPath + 'photo=' + json.items[i].rf_code + '&index=' + json.items[i].cover_photo
						, border : 0
					}
					, {
						width : '112px'
						, height : '84px'
					}, td);
			
			// property info
			td = this.createElement('td', {className : 'schResult', vAlign : 'top'}, {width : '175px'}, tr);
			td.appendChild(document.createTextNode(json.items[i].build_name_eng));
			this.createElement('br', null, null, td);
			if(json.items[i].build_name_eng != json.items[i].build_name_big5)
			{
				td.appendChild(document.createTextNode(json.items[i].build_name_big5));
				this.createElement('br', null, null, td);
			}
			td.appendChild(document.createTextNode(json.items[i].pvc_name_eng));
			this.createElement('br', null, null, td);
			
			if(!isNaN(json.items[i].unit_size) && json.items[i].unit_size > '0')
				td.appendChild(document.createTextNode(formatCurrency(json.items[i].unit_size, 3, 0) + ' sq.ft.'));
			else
				td.appendChild(document.createTextNode('--'));
			this.createElement('br', null, null, td);
			
			if (json.items[i].item_type == 'buy')
			{
				if(!isNaN(json.items[i].price_ask) && json.items[i].price_ask > '0')
				{
					td.appendChild(document.createTextNode('Price HK$' + formatCurrency(json.items[i].price_ask, 3, 0)));
				}
				else
				{
					td.appendChild(document.createTextNode('--'));
				}
			}
			else if (json.items[i].item_type == 'rent')
			{
				if(!isNaN(json.items[i].rental_ask) && json.items[i].rental_ask > '0')
				{
					td.appendChild(document.createTextNode('Rental HK$' + formatCurrency(json.items[i].rental_ask, 3, 0)));
				}
				else
				{
					td.appendChild(document.createTextNode('--'));
				}
			}
		}
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 's_proid'
				, name : 's_proid'
				, value : pro_ids
			}
			, null, td);
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 's_type'
				, name : 's_type'
				, value : item_type
			}
			, null, td);
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 's_sys_mail_type'
				, name : 's_sys_mail_type'
				, value : json.sys_mail_type
			}
			, null, td);
	},
	
	createSMailContent : function(container, json)
	{
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var form = this.createElement('form', {id : 'sMail_form', name : 'sMail_form', action : '', method : 'post', onsubmit : 'return false;'} , null, container);
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, form, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var i, tr, td, img, div, span, input, select, option, textarea;
		
		// from img
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		img = this.createElement('img'
			,{
				src : '/common/images/clipboard/from.gif'
			}
			,{
				width : '27px'
				, height : '11px'
			}
			, td);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {className : 'schResult'}, tr);
		
		var innerTable = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, td, true);
		var innerTbody = this.createElement('tbody', null, null, innerTable);
		var innerTr = this.createElement('tr', null, null, innerTbody);
		
		// from name
		var innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Name'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		this.createElement('br', null, null, innerTd);
		input = this.createElement('input'
			,{
				type : 'text'
				, id : 's_fr_name'
				, name : 's_fr_name'
				, value : ''
			}
			, {
				width : '152px'
			}
			, innerTd);
		
		// colspacing spacing 
		innerTd = this.createElement('td', null, {width : '16px'}, innerTr);
		
		// from email
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Email'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		this.createElement('br', null, null, innerTd);
		input = this.createElement('input'
			,{
				type : 'text'
				, id : 's_fr_email'
				, name : 's_fr_email'
				, value : ''
			}
			, {
				width : '152px'
			}
			, innerTd);
		
		// row spacing in innerTable
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', {colSpan : '3'}, {height : '10px'}, innerTr);
		
		// To img
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', {colSpan : '3'}, {height : '10px'}, innerTr);
		img = this.createElement('img'
			,{
				src : '/common/images/clipboard/to.gif'
			}
			,{
				width : '11px'
				, height : '11px'
			}
			, innerTd);
		
		span = this.createElement('span', null, {className : 'schResult'}, innerTd);
		span.appendChild(document.createTextNode('\u00a0\u00a0\u00a0\u00a0\u00a0No. of recipient(s)'));
		
		select = this.createElement('select', {id : 's_reci', onchange : new Function('mail.setSMailRecipient(this.value);') }, {visibility : 'visible', fontSize: '11px'}, innerTd);
		for (i = 1; i < 6; i++)
			option = this.createElement('option', {value : i, text : i, innerText : i}, null, select);
		
		
		// row spacing in innerTable
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', {colSpan : '3'}, {height : '10px'}, innerTr);
		
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Name'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		
		// colspacing spacing 
		innerTd = this.createElement('td', null, {width : '16px'}, innerTr);
		
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Email'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', null, {className : 'schResult', width : '152px'}, innerTr);
		
		// to name
		for(i = 1; i < 6; i++)
		{
			input = this.createElement('input'
				,{
					type : 'text'
					, id : 's_to_name_' + i
					, name : 's_to_name_' + i
					, value : ''
				}
				, {
					width : '152px'
				}
				, innerTd);
			
			if (i > 1)
				input.style.display = 'none';
		}
		// colspacing spacing 
		innerTd = this.createElement('td', null, {width : '16px'}, innerTr);
		
		innerTd = this.createElement('td', null, {className : 'schResult', width : '152px'}, innerTr);
		// to email
		for(i = 1; i < 6; i++)
		{
			input = this.createElement('input'
				,{
					type : 'text'
					, id : 's_to_email_' + i
					, name : 's_to_email_' + i
					, value : ''
				}
				, {
					width : '152px'
				}
				, innerTd);
			
			if (i > 1)
				input.style.display = 'none';
		}
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// message
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		td.appendChild(document.createTextNode('Message'));
		this.createElement('br', null, null, td);
		textarea = this.createElement('textarea'
			,{
				id : 's_message'
				, name : 's_message'
				, rows : '3'
			}
			, {
				width : this.propertyWidth + 'px'
			} 
			, td);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// property
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		td.appendChild(document.createTextNode('Property'));
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, { border : '1px solid #b3b3b3'}, tr);
		
		this.sMail_property = this.createElement('div', null, {overflow: 'auto', /*height : this.maxPropertyHeight + 'px', */ padding : '10px'}, null);
		this.createSMailProperty(this.sMail_property, json);
		td.appendChild(this.sMail_property);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, null, tr);
		
		img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_send.gif'
				, onclick : new Function('mail.sendSMail(this)')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
			}
			, td);
		
		span = this.createElement('span', null, {width : '10px', paddingLeft : '10px'}, td);
		span.appendChild(document.createTextNode('\u00a0'));
		
		img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_cancel.gif'
				, onclick : new Function('mail.doClose("sMail")')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
			}
			, td);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
	},
	
	createSMailSentContent : function (container, success)
	{
		var email_src = new Array();
		var i;
		for (i = 0; i < 5; i++)
		{
			email_src.push(trim(document.getElementById('s_to_email_' + (i + 1)).value));
		}
		
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, container, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var tr = this.createElement('tr', null, null, tbody);
		var td = this.createElement('td', {className : 'schResult'}, null, tr);
		
		if(success)
		{
			td.appendChild(document.createTextNode('Thank you!'));
			this.createElement('br', null, null, td);
			td.appendChild(document.createTextNode('Your message has been sent to following Emails:'));
			
			for (i = 0; i < 5; i++)
			{
				if(email_src[i] != '')
				{
					this.createElement('br', null, null, td);
					td.appendChild(document.createTextNode('\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0' + email_src[i]));
				}
			}
		
		}
		else
		{
			td.appendChild(document.createTextNode('Sorry!'));
			this.createElement('br', null, null, td);
			td.appendChild(document.createTextNode('Send Failed. Please try again later.'));
		}
		
		// spacing
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// close
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, null, tr);
		var img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_close.gif'
				, onclick : new Function('mail.doClose("sMail");')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
			}
			, td);
		
		// spacing
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '380px'}, tr);
	},
	
	sMailInitialize : function(json)
	{
		this.sMail = this.createElement('div'
			, {
				id : 'mai'
			}
			, {
				position : 'absolute'
				, left : '0px'
				, top : this.marginTop + 'px'
				, zIndex : '15'
				, display : 'none'
				, visibility : 'hidden'
			}
			, document.body, true);
			
		if(this.enableShield)
		{
			if(this.shield == null)
			{
				var pageSize = this.getPageSize();
			
				this.shield = this.createElement('div', null
					, {
						position : 'absolute'
						, left : '0px'
						, top : '0px'
						, zIndex : '13'
						, display : 'none'
						, opacity : '0.4'
						, height : pageSize.pageHeight + 'px'
						, width : (pageSize.pageWidth + 25) + 'px' // handler scroll bar width
					}
					, document.body);
			}
		}
		
		this.sMail.appendChild(this.createOuterDiv(json, 'sMail'));
	},
	// end of sMail Function ---------------------------------------------------------------
	
	
	
	
	
	
	// enquiry Function ---------------------------------------------------------------
	sendEnquiry : function(button)
	{
		var type = 'send_enquiry';
		var criteria = '';
		
		var m_titles = document.getElementsByName('m_title');
		for(var i = 0; i < m_titles.length; i++)
		{
			if(m_titles[i].checked)
			{
				criteria += 'm_title=' + m_titles[i].value;
				break;
			}
		}
		
		if(trim(document.getElementById('m_name').value) == '')
		{
			alert('Please enter your Name');
			document.getElementById('m_name').focus();
			return false;
		}
		
		if(trim(document.getElementById('m_email').value) == '')
		{
			alert('Please enter your Email Address');
			document.getElementById('m_email').focus();
			return false;
		}
		
		if(trim(document.getElementById('m_contact').value) == '')
		{
			alert('Please enter your Contact Number');
			document.getElementById('m_contact').focus();
			return false;
		}
		
		criteria += '&m_name=' + encodeURIComponent(trim(document.getElementById('m_name').value));
		criteria += '&m_email=' + encodeURIComponent(trim(document.getElementById('m_email').value));
		criteria += '&m_contact=' + encodeURIComponent(trim(document.getElementById('m_contact').value));
		//criteria += '&m_message=' + document.getElementById('m_message').value.replace(/&/g, '__amp__').replace(/\n/g, '__br__').replace(/%/g, '__ps__').replace(/\$/g, '__mm__').replace(/\\/g, '\\\\');
		criteria += '&m_message=' + encodeURIComponent(trim(document.getElementById('m_message').value));
		criteria += '&m_proid=' + document.getElementById('m_proid').value;
		criteria += '&m_type=' + document.getElementById('m_type').value;
		criteria += '&m_d=' + document.getElementById('m_d').value;
		criteria += '&m_m=' + document.getElementById('m_m').value;
		criteria += '&m_y=' + document.getElementById('m_y').value;
		criteria += '&m_sys_mail_type=' + document.getElementById('m_sys_mail_type').value;
		
		//prompt('',criteria);
		button.onclick = null;
		
		var idx = this.setResponseListener(type, mail.xmlhttpChange);
		this._requests[type][idx]['http_request'].open('POST', '/property/testEmail.action', true);
		this._requests[type][idx]['http_request'].setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		this._requests[type][idx]['http_request'].send(criteria);
	},
	
	createEnquiryProperty : function(container, json)
	{
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var enquiry_property = this.createElement('div', null, null, container);
		
		var pro_ids = '';
		var item_type = ''
		
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, null, enquiry_property, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var tr, td, img;
		for(var i = 0; i < json.items.length; i++)
		{
			if(pro_ids != '')
			{
				pro_ids += ',';
				item_type += ',';
			}
			
			pro_ids += json.items[i].pro_id;
			item_type += json.items[i].item_type;
			
			if(i > 0)
			{
				// add rule
				tr = this.createElement('tr', null, null, tbody);
				td = this.createElement('td', {colSpan : 2}
				, {
					background: 'url(/common/images/clipboard/rule2.gif)'
					, width : '298px'
					, height : '21px'
				} , tr);
			}
			
			tr = this.createElement('tr', null, null, tbody);
			
			// photo
			td = this.createElement('td', null, {width : '124px'}, tr);
			img = this.createElement('img'
					, {
						//src : this.photoPath + json.items[i].pro_id + '/' + json.items[i].prop_photo
						src : this.photoPath + 'photo=' + json.items[i].rf_code + '&index=' + json.items[i].cover_photo
						, border : 0
					}
					, {
						width : '112px'
						, height : '84px'
					}, td);
			
			// property info
			td = this.createElement('td', {className : 'schResult', vAlign : 'top'}, {width : '175px'}, tr);
			td.appendChild(document.createTextNode(json.items[i].build_name_eng));
			this.createElement('br', null, null, td);
			if(json.items[i].build_name_eng != json.items[i].build_name_big5)
			{
				td.appendChild(document.createTextNode(json.items[i].build_name_big5));
				this.createElement('br', null, null, td);
			}
			td.appendChild(document.createTextNode(json.items[i].pvc_name_eng));
			this.createElement('br', null, null, td);
			
			if(!isNaN(json.items[i].unit_size) && json.items[i].unit_size > '0')
				td.appendChild(document.createTextNode(formatCurrency(json.items[i].unit_size, 3, 0) + ' sq.ft.'));
			else
				td.appendChild(document.createTextNode('--'));
			this.createElement('br', null, null, td);
			
			if (json.items[i].item_type == 'buy')
			{
				if(!isNaN(json.items[i].price_ask) && json.items[i].price_ask > '0')
				{
					td.appendChild(document.createTextNode('Price HK$' + formatCurrency(json.items[i].price_ask, 3, 0)));
					this.createElement('br', null, null, td);
				}
				else
				{
					//td.appendChild(document.createTextNode('--'));
				}
			}
			else if (json.items[i].item_type == 'rent')
			{
				if(!isNaN(json.items[i].rental_ask) && json.items[i].rental_ask > '0')
				{
					td.appendChild(document.createTextNode('Rental HK$' + formatCurrency(json.items[i].rental_ask, 3, 0)));
				}
				else
				{
					//td.appendChild(document.createTextNode('--'));
				}
			}
		}
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 'm_proid'
				, name : 'm_proid'
				, value : pro_ids
			}
			, null, td);
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 'm_type'
				, name : 'm_type'
				, value : item_type
			}
			, null, td);
		
		var input = this.createElement('input'
			, {
				type : 'hidden'
				, id : 'm_sys_mail_type'
				, name : 'm_sys_mail_type'
				, value : json.sys_mail_type
			}
			, null, td);
	},
	
	createEnquiryContent : function(container, json)
	{
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var form = this.createElement('form', {id : 'enquiry_form', name : 'enquiry_form', action : '', method : 'post', onsubmit : 'return false;'} , null, container);
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, form, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var i, tr, td, img, div, span, input, select, option, textarea;
		
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		td.appendChild(document.createTextNode('Got questions or interested in scheduling a viewing? Please fill in the form below, our agents will conatct you very shortly.'));
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// title
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		
		if(document.uniqueID)
		{
			// ie
			input = document.createElement("<input type='radio' id='m_title_mr' name='m_title'  value='Mr' />");   
			td.appendChild(input);   
		}
		else
		{
			// non ie
			input = this.createElement('input'
				,{
					type : 'radio'
					, id : 'm_title_mr'
					, name : 'm_title'
					, value : 'Mr'
				}
				, null, td);
		}  
		td.appendChild(document.createTextNode('Mr'));
		
		
		if(document.uniqueID)
		{
			// ie
			input = document.createElement("<input type='radio' id='m_title_miss' name='m_title'  value='Miss' />");   
			td.appendChild(input);   
		}
		else
		{
			// non ie
			input = this.createElement('input'
				,{
					type : 'radio'
					, id : 'm_title_miss'
					, name : 'm_title'
					, value : 'Miss'
				}
				, null, td);
		}
		td.appendChild(document.createTextNode('Miss'));
		
		
		if(document.uniqueID)
		{
			// ie
			input = document.createElement("<input type='radio' id='m_title_mrs' name='m_title'  value='Mrs' />");   
			td.appendChild(input);   
		}
		else
		{
			// non ie
			input = this.createElement('input'
				,{
					type : 'radio'
					, id : 'm_title_mrs'
					, name : 'm_title'
					, value : 'Mrs'
				}
				, null, td);
		}
		td.appendChild(document.createTextNode('Mrs'));
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {className : 'schResult'}, tr);
		
		var innerTable = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, td, true);
		var innerTbody = this.createElement('tbody', null, null, innerTable);
		var innerTr = this.createElement('tr', null, null, innerTbody);
		
		// name
		var innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Name'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		this.createElement('br', null, null, innerTd);
		input = this.createElement('input'
			,{
				type : 'text'
				, id : 'm_name'
				, name : 'm_name'
				, value : ''
			}
			, {
				width : '152px'
			}
			, innerTd);
		
		// colspacing spacing 
		innerTd = this.createElement('td', null, {width : '16px'}, innerTr);
		
		// Email
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Email'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		this.createElement('br', null, null, innerTd);
		input = this.createElement('input'
			,{
				type : 'text'
				, id : 'm_email'
				, name : 'm_email'
				, value : ''
			}
			, {
				width : '152px'
			}
			, innerTd);
		
		// row spacing in innerTable
		innerTr = this.createElement('tr', null, null, innerTbody);
		innerTd = this.createElement('td', {colSpan : '3'}, {height : '10px'}, innerTr);
		
		
		innerTr = this.createElement('tr', null, null, innerTbody);
		
		// Contact No.
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Contact No.'));
		span = this.createElement('span', null, {color : 'red'}, innerTd);
		span.appendChild(document.createTextNode('*'));
		this.createElement('br', null, null, innerTd);
		input = this.createElement('input'
			,{
				type : 'text'
				, id : 'm_contact'
				, name : 'm_contact'
				, value : ''
			}
			, {
				width : '152px'
			}
			, innerTd);
		
		// colspacing spacing 
		innerTd = this.createElement('td', null, {width : '16px'}, innerTr);
		
		var date = new Date();
		// Year Month Day
		innerTd = this.createElement('td', null, {className : 'schResult'}, innerTr);
		innerTd.appendChild(document.createTextNode('Preferred Viewing Date'));
		this.createElement('br', null, null, innerTd);
		// Month
		select = this.createElement('select'
			,{
				id : 'm_m'
				, name : 'm_m'
			}
			, {
				width : '48'
				, visibility : 'visible'
			}
			, innerTd);
		
		option = this.createElement('option', {value : '01', text : 'Jan', innerText : 'Jan'}, null, select);
		option = this.createElement('option', {value : '02', text : 'Feb', innerText : 'Feb'}, null, select);
		option = this.createElement('option', {value : '03', text : 'Mar', innerText : 'Mar'}, null, select);
		option = this.createElement('option', {value : '04', text : 'Apr', innerText : 'Apr'}, null, select);
		option = this.createElement('option', {value : '05', text : 'May', innerText : 'May'}, null, select);
		option = this.createElement('option', {value : '06', text : 'Jun', innerText : 'Jun'}, null, select);
		option = this.createElement('option', {value : '07', text : 'Jul', innerText : 'Jul'}, null, select);
		option = this.createElement('option', {value : '08', text : 'Aug', innerText : 'Aug'}, null, select);
		option = this.createElement('option', {value : '09', text : 'Sep', innerText : 'Sep'}, null, select);
		option = this.createElement('option', {value : '10', text : 'Oct', innerText : 'Oct'}, null, select);
		option = this.createElement('option', {value : '11', text : 'Nov', innerText : 'Nov'}, null, select);
		option = this.createElement('option', {value : '12', text : 'Dec', innerText : 'Dec'}, null, select);
		
		select.options[date.getMonth()].selected = true;
		
		span = this.createElement('span', null, {width : '4px'}, innerTd);
		span.appendChild(document.createTextNode('\u00a0'));
		// Day
		select = this.createElement('select'
			,{
				id : 'm_d'
				, name : 'm_d'
			}
			, {
				width : '40'
				, visibility : 'visible'
			}
			, innerTd);
		
		for(i = 1; i < 32; i++)
		{
			option = this.createElement('option'
				,{
					value : i
					, text : i
					, innerText : i
				}
				, null, select);
			
			if(i < 10)
				option.value = '0' + i;
			
			if (i == date.getDate())
			{
				option.selected = true;
			}
		}
		span = this.createElement('span', null, {width : '4px'}, innerTd);
		span.appendChild(document.createTextNode('\u00a0'));
		// Year
		select = this.createElement('select'
			,{
				id : 'm_y'
				, name : 'm_y'
			}
			, {
				width : '54'
				, visibility : 'visible'
			}
			, innerTd);
		for(i = 0; i < 2; i++)
		{
			option = this.createElement('option'
				,{
					value : date.getFullYear() + i
					, text : date.getFullYear() + i
					, innerText : date.getFullYear() + i
				}
				, null, select);
			
			if (i == 0)
			{
				option.selected = true;
			}
		}
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// message
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		td.appendChild(document.createTextNode('Message'));
		this.createElement('br', null, null, td);
		textarea = this.createElement('textarea'
			,{
				id : 'm_message'
				, name : 'm_message'
				, rows : '3'
			}
			, {
				width : this.propertyWidth + 'px'
			} 
			, td);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// property
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, null, tr);
		td.appendChild(document.createTextNode('Property'));
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {className : 'schResult'}, { border : '1px solid #b3b3b3'}, tr);
		
		this.enquiry_property = this.createElement('div', null, {overflow: 'auto', /*height : this.maxPropertyHeight + 'px',*/ padding : '10px'}, null);
		this.createEnquiryProperty(this.enquiry_property, json);
		td.appendChild(this.enquiry_property);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, null, tr);
		
		img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_send.gif'
				, onclick : new Function('mail.sendEnquiry(this)')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
			}
			, td);
		
		span = this.createElement('span', null, {width : '10px', paddingLeft : '10px'}, td);
		span.appendChild(document.createTextNode('\u00a0'));
		
		img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_cancel.gif'
				, onclick : new Function('mail.doClose("enquiry")')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
				, paddingLeft : '10px'
			}
			, td);
		
		// spacing 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
	},
	
	createEnquirySentContent : function (container, success)
	{
		while(container.childNodes.length > 0)
		{
			container.removeChild(container.childNodes[0]);
		}
		
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, {width : this.propertyWidth + 'px'}, container, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		var tr = this.createElement('tr', null, null, tbody);
		var td = this.createElement('td', {className : 'schResult'}, null, tr);
		
		if(success)
		{
			td.appendChild(document.createTextNode('Thank you!'));
			this.createElement('br', null, null, td);
			td.appendChild(document.createTextNode('Your enuiry has been sent. We will contact you very shortly.'));
		}
		else
		{
			td.appendChild(document.createTextNode('Sorry!'));
			this.createElement('br', null, null, td);
			td.appendChild(document.createTextNode('Send Failed. Please try again later.'));
		}
		
		// spacing
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '10px'}, tr);
		
		// close
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, null, tr);
		var img = this.createElement('img' 
			, {
				src : '/common/images/clipboard/btn_close.gif'
				, onclick : new Function('mail.doClose("enquiry");')
			}
			, {
				width : '64px'
				, height : '21px'
				, cursor : 'pointer'
			}
			, td);
		
		// spacing
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : '380px'}, tr);
	},
	
	enquiryInitialize : function(json)
	{
		this.enquiry = this.createElement('div'
			, {
				id : 'enq'
			}
			, {
				position : 'absolute'
				, left : '0px'
				, top : this.marginTop + 'px'
				, zIndex : '15'
				, display : 'none'
				, visibility : 'hidden'
			}
			, document.body, true);
			
		if(this.enableShield)
		{
			if(this.shield == null)
			{
				var pageSize = this.getPageSize();
			
				this.shield = this.createElement('div', null
					, {
						position : 'absolute'
						, left : '0px'
						, top : '0px'
						, zIndex : '13'
						, display : 'none'
						, opacity : '0.4'
						, height : pageSize.pageHeight + 'px'
						, width : (pageSize.pageWidth + 25) + 'px' // handler scroll bar width
					}
					, document.body);
			}
		}
		
		this.enquiry.appendChild(this.createOuterDiv(json, 'enquiry'));
	},
	// end of enquiry Function ---------------------------------------------------------------
	
	createContainerDiv : function(json, type) 
	{
		var img_src, img_width;
		
		if (type == 'sMail')
		{
			img_src = '/common/images/clipboard/hd_share_property.gif';
			img_width = '110px';
		}
		else if (type == 'enquiry')
		{
			img_src = '/common/images/clipboard/hd_send_enquiry.gif';
			img_width = '97px';
		}
		
		var container = this.createElement('div'
			, null
			, {
				background : 'white'
				, width : this.maxWidth + 'px'
			});
		
		// title of table
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, null, container, true);
		var tbody = this.createElement('tbody', null, null, table);
		
		// row 1
		var tr = this.createElement('tr', null, null, tbody);
		var td = this.createElement('td'
			, {
				rowSpan : 4
			}
			, {
				width : this.innerBorderLeft + 'px'
			}, tr);
		td = this.createElement('td', null
			, {
				width : (this.maxWidth - this.innerBorderLeft - this.innerBorderRight) + 'px'
				, height : this.innerBorderImgTop + 'px'
			}, tr);
		
		td = this.createElement('td'
			, {
				rowSpan : 4
			}
			, {
				width : this.innerBorderRight + 'px'
			}, tr);
		
		// row 2 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', {vAlign : 'bottom'}, {height : this.innerBorderImgHeight + 'px'}, tr);
		
		var img = this.createElement('img'
			, {
				src : img_src
				, boder : 0
			}
			, {
				width : img_width
				, height : '18px'
			}
			, td);
		
		// row 3 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, {height : this.innerBorderSpacing + 'px'}, tr);
		
		// row 4 
		tr = this.createElement('tr', null, null, tbody);
		td = this.createElement('td', null, null, tr);
		
		if (type == 'sMail')
		{
			this.sMail_container = container;
			
			this.sMail_content = this.createElement('div'
			, {
				
			}
			, {
				width : this.propertyWidth + 'px'
			}, td, true);
			
			this.createSMailContent(this.sMail_content, json);
		}
		else if (type == 'enquiry')
		{
			this.enquiry_container = container;
			
			this.enquiry_content = this.createElement('div'
				, {
					
				}
				, {
					width : this.propertyWidth + 'px'
				}, td, true);
			
			this.createEnquiryContent(this.enquiry_content, json);
		}
		
		return container;
	},

	createOuterDiv : function(json, type)
	{
		var table = this.createElement('table', {cellPadding: 0, cellSpacing: 0, border : 0}, null, null, true);
		
		var tbody = this.createElement('tbody', null, null, table);
		
		// row 1
		var tr = this.createElement('tr', null, null, tbody);
		var td = this.createElement('td', null,
			{
				width : this.borderLeft + 'px'
				, height : this.borderTop + 'px'
				, backgroundImage : 'url("/common/images/pop_up_layer/top.png")'
			}, tr);
			
		td = this.createElement('td', null
			, {
				width: this.maxWidth + 'px'
				, backgroundImage : 'url("/common/images/pop_up_layer/top.png")'
			}
			, tr);
			
		td = this.createElement('td'
			, {
				onclick : new Function('mail.doClose("' + type + '");')
				, title : 'click to close the clipboard'
			}
			, {
				width : this.borderRight + 'px'
				, backgroundImage : 'url("/common/images/pop_up_layer/close.png")'
				, cursor : 'pointer'
			}
			, tr);
		
		// row 2 
		tr = this.createElement('tr', null, null, tbody);
		
		td = this.createElement('td', null
			, {
				backgroundImage : 'url("/common/images/pop_up_layer/top.png")'
			}
			, tr);
		
		td = this.createElement('td', null
			, {
				//height : this.getContentHeight() + 'px'
			}, tr);
		td.appendChild(this.createContainerDiv(json, type));
		
		td = this.createElement('td', null
			, {
				backgroundImage : 'url("/common/images/pop_up_layer/right.png")'
			}
			, tr);
		
		// row 3
		tr = this.createElement('tr', null, null, tbody);
		
		td = this.createElement('td'
			, {
				colSpan : 2
			}
			, {
				backgroundImage : 'url("/common/images/pop_up_layer/btm.png")',
				height : this.borderBottom + 'px'
			}
			, tr);
		
		td = this.createElement('td', null
			, {
				backgroundImage : 'url("/common/images/pop_up_layer/right_corner.png")'
			}
			, tr);

		return table;
	},
	
	
	showMail : function(criteria, type)
	{
		// make xmlhttpRequest
		var pro_ids = criteria[0];
		var item_type = criteria[1];
		var sys_mail_type = 1;
		
		if (criteria[2] == 1 && type == 'enquiry')
		{
			sys_mail_type = 7;
		}
		else if (criteria[2] == 1 && type == 'sMail')
		{
			sys_mail_type = 8;
		}
		else if (criteria[2] == 2 && type == 'enquiry')
		{
			sys_mail_type = 7;
		}
		else if (criteria[2] == 2 && type == 'sMail')
		{
			sys_mail_type = 8;
		}
		
		var idx = this.setResponseListener(type, mail.xmlhttpChange);
		
		this._requests[type][idx]['sys_mail_type'] = sys_mail_type;
		this._requests[type][idx]['http_request'].open('POST', '/clipboard/showClipItem.action', true);
		this._requests[type][idx]['http_request'].setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		this._requests[type][idx]['http_request'].send('pro_ids=' + pro_ids + '&item_type=' + item_type + '&mail_type=' + type);
		
	},
	// end of sMail Functions -----------------------------------------------------------
	

	doClose : function(type)
	{
		if (type == 'sMail')
		{
			this.sMail.style.visibility = 'hidden';
			this.sMail.style.display = 'none';
		}
		else if (type == 'enquiry')
		{
			this.enquiry.style.visibility = 'hidden';
			this.enquiry.style.display = 'none';
		}
		
		// show select input in ie
		if (this.ie)
		{
			var select = document.getElementsByTagName('select');
			for (var i = 0; i < select.length; i++)
			{
				// show select box in enquiry
				if(select[i].style.visibility == 'hidden')
					select[i].style.visibility = 'visible';
				
				// if both sMail and enquiry close, show select box in main page
				
				if((this.sMail == null || (this.sMail != null && this.sMail.style.visibility == 'hidden')) &&
					(this.enquiry == null || (this.enquiry != null && this.enquiry.style.visibility == 'hidden')) &&
					(cp.clipboard == null || (cp.clipboard != null && cp.clipboard.style.visibility == 'hidden')) )
				{
					select[i].style.display = 'inline';
				}
			}
		}
		
		if(this.enableShield)
		{
			this.shield.style.display = 'none';
			
			if(this.ie)
			{
				document.body.scroll = '';
			}
			else
			{
				document.body.scrollTop = this.current_scroll_top;
				document.body.style.overflow='';
			}
		}
	}
};

mail.addEventListener(window, 'resize', function()
{
	mail.setPositionAndSize();
});