/**
 * @author Marco Alionso Ramirez, marco@onemarco.com
 * @addon Kevin Downey kdowney@cars.com
 * @version 2.2
 * The Tooltip class is an addon designed for the Google
 * Maps GMarker class.
 */

/**
 * @constructor
 * @param {GMarker} marker
 * @param {String} content
 * @param {Number} padding
 */
function Tooltip(marker, content, padding, type){
	this.marker = marker;
	this.content = content;
	this.padding = padding;
	this.type = type;
	this.div = null;
	this.map = null;
	this.imgOffset = 50;
	this.innerContainer = null;
	this.bubbleTable = null;
	this.bubble_close = null;
	this.bubble_cone = null;
}

Tooltip.prototype = new GOverlay();

Tooltip.prototype.initialize = function(map){

	this.div = document.createElement("div");
	this.innerContainer = this.div.cloneNode(false);
	
	this.bubbleTable = document.createElement("table");
	this.bubbleTable.cellPadding = "0";
	this.bubbleTable.cellSpacing = "0";
	this.bubbleTable.border = "0";
	var contentTable = this.bubbleTable.cloneNode(false);
	contentTable.width = "100%";
	contentTable.style.height = "72px";
	this.bubbleTable.width = this.type == 'n' || this.type == 'i'?'350' : '250';
	this.bubbleTable.className = 'dealermap_bubble_table';	
	
	var bubbleTableBody = document.createElement("tbody");
	this.bubbleTable.appendChild(bubbleTableBody);
	var contentTableBody = document.createElement("tbody");
	contentTable.appendChild(contentTableBody);

	
	var firstRow = document.createElement('tr');
	bubbleTableBody.appendChild(firstRow);
	var secondRow = document.createElement('tr');
	bubbleTableBody.appendChild(secondRow);
	var thirdRow = document.createElement('tr');
	bubbleTableBody.appendChild(thirdRow);
	var forthRow = document.createElement('tr');
	bubbleTableBody.appendChild(forthRow);
	var contentRow = document.createElement('tr');
	contentRow.vAlign = "top";
	contentTableBody.appendChild(contentRow);

	
	var firstRowFirstCell = document.createElement('td');
	firstRowFirstCell.className = 'dealermap_bubble_tl';
	firstRow.appendChild(firstRowFirstCell);
	var firstRowSecondCell = document.createElement('td');
	firstRowSecondCell.width = this.type == 'n' || this.type == 'i'?'334' : '234';
	firstRowSecondCell.className = 'dealermap_bubble_tm';
	firstRow.appendChild(firstRowSecondCell);
	var firstRowThirdCell = document.createElement('td');
	firstRowThirdCell.className = 'dealermap_bubble_tr';
	firstRow.appendChild(firstRowThirdCell);

	this.bubble_close = this.div.cloneNode(false);
	this.bubble_close.className = 'dealermap_bubble_close';
	
	var contentRowFirstCell = document.createElement('td');
	contentRow.appendChild(contentRowFirstCell);
	contentRowFirstCell.appendChild(this.innerContainer);
	var contentRowSecondCell = document.createElement('td');
	contentRow.appendChild(contentRowSecondCell);
	contentRowSecondCell.align = "right";
	contentRowSecondCell.appendChild(this.bubble_close);
	
	var secondRowCell = document.createElement('td');
	secondRowCell.colSpan = "3";
	secondRowCell.className = 'dealermap_bubble_m';
	secondRowCell.appendChild(contentTable);
	secondRow.appendChild(secondRowCell);

	var thirdRowFirstCell = document.createElement('td');
	thirdRowFirstCell.className = 'dealermap_bubble_bl';
	thirdRow.appendChild(thirdRowFirstCell);
	var thirdRowSecondCell = document.createElement('td');
	thirdRowSecondCell.className = 'dealermap_bubble_bm';
	thirdRowSecondCell.width = this.type == 'n' || this.type == 'i'?'334' : '234';
	thirdRow.appendChild(thirdRowSecondCell);
	var thirdRowThirdCell = document.createElement('td');
	thirdRowThirdCell.className = 'dealermap_bubble_br';
	thirdRow.appendChild(thirdRowThirdCell);

	var bubble_cone_img=document.createElement("img");
	bubble_cone_img.setAttribute('src', '/images/dealer_maps/bubble_cone.png');
	bubble_cone_img.className = 'dealermap_bubble_cone_image';
	
	this.bubble_cone=document.createElement("div");
	this.bubble_cone.style.paddingLeft = this.type == 'n' || this.type == 'i'?'88px' : '40px';
	this.bubble_cone.appendChild(bubble_cone_img);

	var forthRowCell = document.createElement('td');
	forthRowCell.colSpan = "3";
	forthRowCell.className = 'dealermap_bubble_cone';
	forthRowCell.appendChild(this.bubble_cone);
	forthRow.appendChild(forthRowCell);
	
	var point = this.div.cloneNode(false);
	this.div.appendChild(this.bubbleTable);
	this.div.appendChild(point);
	this.div.style.position = 'absolute';
	this.div.style.visibility = 'hidden';

	this.shadowQuadrants = [{},{},{},{}]
	this.shadowQuadrants[0].div = document.createElement('div');
	this.shadowQuadrants[0].div.style.position = 'absolute';
	this.shadowQuadrants[0].div.style.overflow = 'hidden';
	this.shadowQuadrants[0].img = createPngElement('/maps/images/tooltip_shadow.png');
	this.shadowQuadrants[0].img.style.position = 'absolute';
	this.shadowQuadrants[0].div.appendChild(this.shadowQuadrants[0].img);
	this.shadowQuadrants[1].div = this.shadowQuadrants[0].div.cloneNode(false);
	this.shadowQuadrants[1].img = this.shadowQuadrants[0].img.cloneNode(true);
	this.shadowQuadrants[1].div.appendChild(this.shadowQuadrants[1].img);
	this.shadowQuadrants[2].div = this.shadowQuadrants[0].div.cloneNode(false);
	this.shadowQuadrants[2].img = this.shadowQuadrants[0].img.cloneNode(true);
	this.shadowQuadrants[2].div.appendChild(this.shadowQuadrants[2].img);
	this.shadowQuadrants[3].div = this.shadowQuadrants[0].div.cloneNode(false);
	this.shadowQuadrants[3].img = this.shadowQuadrants[0].img.cloneNode(true);
	this.shadowQuadrants[3].div.appendChild(this.shadowQuadrants[3].img);

	this.shadowQuadrants[0].div.style.right = '0px';
	this.shadowQuadrants[0].div.style.top = '0px';
	this.shadowQuadrants[0].img.style.top = '0px';
	this.shadowQuadrants[0].img.style.right = '0px';
	this.shadowQuadrants[1].div.style.left = '0px';
	this.shadowQuadrants[1].div.style.top = '0px';
	this.shadowQuadrants[1].img.style.top = '0px';
	this.shadowQuadrants[2].div.style.left = '0px';
	this.shadowQuadrants[2].div.style.bottom = '0px';
	this.shadowQuadrants[2].img.style.bottom = '0px';
	this.shadowQuadrants[2].img.style.left = '0px';
	this.shadowQuadrants[3].div.style.right = '0px';
	this.shadowQuadrants[3].div.style.bottom = '0px';
	this.shadowQuadrants[3].img.style.bottom = '0px';

	this.shadow = this.div.cloneNode(false);
	this.shadow.appendChild(this.shadowQuadrants[0].div);
	this.shadow.appendChild(this.shadowQuadrants[1].div);
	this.shadow.appendChild(this.shadowQuadrants[2].div);
	this.shadow.appendChild(this.shadowQuadrants[3].div);


	var child = typeof this.content == 'string' ?
		document.createTextNode(this.content) :
		this.content;

	map.getPane(G_MAP_FLOAT_PANE).appendChild(this.div);
	map.getPane(G_MAP_MARKER_SHADOW_PANE).appendChild(this.shadow);
	this.map = map;
}

Tooltip.prototype.div = function(){
	return this.bubble_close;
}

Tooltip.prototype.remove = function(){
	this.div.parentNode.removeChild(this.div);
}

Tooltip.prototype.copy = function(){
	var content = typeof this.content == 'string' ? this.content : this.content.cloneNode(true);
	return new Tooltip(this.marker,content,this.padding);
}

Tooltip.prototype.redraw = function(force){
	if (!force) return;

	//draw tooltip
	var markerPos = this.map.fromLatLngToDivPixel(this.marker.getPoint());
	var iconAnchor = this.marker.getIcon().iconAnchor;
	var xPos = Math.round(markerPos.x - this.div.clientWidth / 2) + this.imgOffset;
	var yPos = markerPos.y - iconAnchor.y - this.div.clientHeight - this.padding + 10;
	this.div.style.top = yPos + 'px';
	this.div.style.left = xPos + 'px';

	//draw shadow
	//calculate shadow location
	shadowAnchor = new GPoint(
		markerPos.x + Math.round((this.marker.getIcon().iconSize.height + this.padding) / 2) - 8,
		markerPos.y - Math.round((this.marker.getIcon().iconSize.height + this.padding) / 2) - 8); //+4

	//calculate shadow dimenstions
	var shadowSize = new GSize(this.div.clientWidth + Math.round(this.div.clientHeight / 2) + 8,
		Math.round(this.div.clientHeight / 2) + 10);
	if(shadowSize.width % 2 == 1) shadowSize.width--;
	if(shadowSize.height % 2 == 1) shadowSize.height--;

	//apply shodaw location and dimensions
	this.shadow.style.left = ( (shadowAnchor.x - (shadowSize.width - shadowSize.height - 10 )/ 2)  + this.imgOffset) + 'px';
	this.shadow.style.top = (shadowAnchor.y - shadowSize.height) + 'px';
	this.shadow.style.width = (shadowSize.width) + 'px';
	this.shadow.style.height =  shadowSize.height + 'px';

	//get quadrant dimensions
	var qHeight = shadowSize.height / 2;
	var qOddWidth = shadowSize.height > shadowSize.width ?
		shadowSize.height / 2:
		(shadowSize.width) / 2;
	var qEvenWidth = shadowSize.width - qOddWidth;

	//apply quadrant dimensions, calculate and apply Q2 and Q4 image offsets
	this.shadowQuadrants[0].div.style.width = qOddWidth + 'px';
	this.shadowQuadrants[0].div.style.height = qHeight + 'px';

	this.shadowQuadrants[1].div.style.width = qEvenWidth + 'px';
	this.shadowQuadrants[1].div.style.height = qHeight + 'px';
	this.shadowQuadrants[1].img.style.left = -(160 - shadowSize.height) + 'px';

	this.shadowQuadrants[2].div.style.width = qOddWidth + 'px';
	this.shadowQuadrants[2].div.style.height = qHeight + 'px';

	this.shadowQuadrants[3].div.style.width = qEvenWidth + 'px';
	this.shadowQuadrants[3].div.style.height = qHeight + 'px';
	this.shadowQuadrants[3].img.style.right = -(160 - shadowSize.height) +'px';

//	var region = { left: this.shadowQuadrants[1].img.style.left, right: this.shadowQuadrants[3].img.style.right, top: this.shadowQuadrants[1].img.style.top, bottom: this.shadowQuadrants[3].img.style.bottom};
//
//	var markers = [{}];
//
//	//Calculate the bounding area for shadow, bring any overlays forward
//	if( region.left   >= marker.left   &&
//      region.right  <= marker.right  &&
//      region.top    >= marker.top    &&
//      region.bottom <= marker.bottom) {
//		//

//	}


}

Tooltip.prototype.show = function(){
	this.div.style.visibility = 'visible';
	this.shadow.style.visibility = 'visible';
}

Tooltip.prototype.hide = function(){
	this.div.style.visibility = 'hidden';
	this.shadow.style.visibility = 'hidden';
}

//Update the text inside tooltip
Tooltip.prototype.updateContent = function(content, size){
	switch(size){
		case 2:
			this.bubble_cone.style.paddingLeft = "88px";
			break;
		case 1:
			this.bubble_cone.style.paddingLeft = "40px";
			break;
		default:
			this.bubble_cone.style.paddingLeft = "40px";
			break;
	}
	this.innerContainer.innerHTML = content;

}

//utility function for png compatibility in IE6
var IS_IE = false;
var IS_LT_IE7;
var IE_js_v;
//@cc_on IS_IE = true;
//@cc_on IS_LT_IE7 = @_jscript_version <= 5.7;

function createPngElement(src){
	var img = document.createElement('img');
	img.setAttribute('src',src);
	if(IS_IE && IS_LT_IE7){
		img.style.visibility = 'hidden';
		var div = document.createElement('div');
		div.appendChild(img);
		div.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\',sizingMethod=\'crop\')';
		return div;
	}
	return img;
}