// JavaScript Document

function deleteTravelersWindow(marker)
{
	var divId = marker.TravelersWindow
	if (divId)
	{
		var div = document.getElementById(divId);
    if (div != null)
    {
			map.DeleteControl(div);
			marker.TravelersWindow = null;
		}
	}
}	

function addTravelersWindow(marker, agent, width) 
{
	var shape = marker.GetShapeByIndex(0);
	var pts = shape.GetPoints();		
	var pixelLocation = map.LatLongToPixel(pts[0]);	
	var zIndex = shape.GetZIndex();
	var bingBaseUrl = 'http://www.bing.com/maps/default.aspx?v=2&rtp=';

	agent_ = agent;
	agentID_ = agent.id;
	width_ = (width ? width + 'px' : 'auto');
	marker_ = marker;
	var a = agent_;
	a.agency = a.agency.replace(/\`/g, "\'");		
	var address =  Url.encode(a.address1+', '+a.city+', '+a.state+' '+a.zip);
	var wu = a.web;
	if ((null != wu) && (wu.indexOf("http") < 0))
		wu = "http://" + wu;
	
	html_ = '<span class="company">' + a.agency + '</span><br />';
	html_ += '<br /><span class="street-address">' + a.address + '</span><br />';
	html_ += '<span class="locality">' + a.city + ', </span><span class="region">'+a.state+'</span> <span class="postal-code">' + a.zip + '</span><br />';
	if(a.phone){html_ += '<span class="tel">Phone: ' + a.phone + '</span><br />'};
	if(a.fax){html_ += '<span class="tel">Fax: ' + a.fax + '</span><br />'};
	if(a.web){html_ += '<span class="name"><a class="content" href="javascript:var a=window.open(\'' + wu + '\');">Visit Website</a></span><br />'};
	if(a.email){html_ += '<span class="name"><a class="content" href="mailto:' + a.email + '?cc=inquiry@travelers.com">' + a.email + '</a></span><br />'};
	html_ += '<span class="name">Get directions: <a class="content" href="#">To here</a> &#183; <a class="content" href="#">From here</a></span><br />';
	html2_ = '<h3 class="company">' + a.agency + '</h3>';
	html2_ += '<ul id="infoAddress">';
	html2_ += '<li class="street-address">' + a.address + '</li>';
	html2_ += '<li class="locality">' + a.city + ', '+a.state+' '+ a.zip + '</li>';
	if(a.phone){html2_ += '<li class="tel">Phone: ' + a.phone + '</li>'};
	if(a.fax){html2_ += '<li class="tel">Fax: ' + a.fax + '</li>'};
	if(a.web){html2_ += '<li class="link"><a class="content" href="javascript:var a=window.open(\'' + wu + '\');">Visit Website</a></li>'};
	if(a.email){html2_ += '<li class="link">Email: <a class="content" href="mailto:' + a.email + '?cc=inquiry@travelers.com">' + a.email + '</a></li>'};

	html2_ += '<li class="link">Get directions: <strong><a id="toHere" class="content" href="javascript:var a=window.open(\'';
	html2_ += bingBaseUrl + '~adr.' + address + '\');';
	html2_ += '">To here</a></strong> &#183; <strong><a id="fromHere" class="content" href="javascript:var a=window.open(\'';
	html2_ += bingBaseUrl + 'adr.' + address + '\');';
	html2_ += '">From here</a></strong></li>';
	html2_ += '</ul>';
	
	var div = addControls(agentID_, pixelLocation, html_, html2_, width_);
	marker.TravelersWindow = div;
}

function addControls(agentID_, pixelLocation, html_, html2_, width_)
{
	//get the content div
	var content = document.createElement("span");
	content.innerHTML = html_;
	content.style.font = '10px verdana';
	content.style.textAlign = 'left';
	content.style.margin = '0';
	content.style.padding = '0';
	content.style.border = '0';
	content.style.display = 'inline';
	
	if(!width_ || width_=='auto' || width_ <= 0) {
		content.style.minWidth = '10px';
		content.style.maxWidth = '500px';
		content.style.width = 'auto';
	}else{
		content.style.width = width_ + 'px';
	}

	content.style.visibility='hidden';
	map.AddControl(content);

	//retrieve the rendered width and height
	var contentWidth = content.offsetWidth+45;
	var contentHeight = content.offsetHeight+15;
	//remove the content from the map
	content.parentNode.removeChild(content);
	content.style.visibility='visible';
	content.innerHTML = html2_;
	//set width and height to ensure they remain the same as drawn
	content.style.width = contentWidth+'px';
	content.style.height = contentHeight+'px';
	content.style.position = 'absolute';
	content.style.left = '48px';
	content.style.top = '28px';
	content.style.background = 'white';
	width_ = contentWidth;
	var wrapper = document.createElement("div");
	//append the content so the wrapper is above
	wrapper.appendChild(content);
	var wrapperParts = {
		l:{l:24, t:53, w:24, h:(contentHeight-23)},
		r:{l:(contentWidth+48), t:53, w:62, h:(contentHeight-23)},
		t:{l:61, t:0, w:contentWidth, h:28},
		tr:{l:(contentWidth+48), t:0, w:62, h:53},
		tl:{l:0, t:0, w:61, h:53},
		bl:{l:0, t:(contentHeight+28), w:36, h:23},
		b:{l:36, t:(contentHeight+28), w:(contentWidth+55), h:23},
		br:{l:(contentWidth+91), t:(contentHeight+28), w:19, h:23}
	};

  var closeHref = document.createElement("a");
  closeHref.setAttribute("href", "javascript:clearTravelersWindow();");

	//create the image DOM objects
	for (i in wrapperParts) {
		var img = document.createElement('img');
		
		// load the image from your local image directory
		// based on the property name of the wrapperParts object
		img.src = '/findagent/img/infowindow/' + i + '.png';
		
		// set the appropriate positioning attributes
		img.style.position = 'absolute';
		img.style.top = wrapperParts[i].t+'px';
		img.style.left = wrapperParts[i].l+'px';
		img.style.width = wrapperParts[i].w+'px';
		img.style.height = wrapperParts[i].h+'px';
		img.setAttribute('border', '0');
		
		if (i == 'tr')
		{
			closeHref.appendChild(img);
			wrapper.appendChild(closeHref); 
		}
		else
			wrapper.appendChild(img);
		wrapperParts[i].img = img;
	}
	
	var div = document.createElement("div");
	div.id = 'tw' + agentID_;
	div.style.display = 'none';
	
	//position the container div for the window
	div.style.position = 'absolute';
	var lp = pixelLocation.x-contentWidth-108;
	var tp = pixelLocation.y-contentHeight-60
	div.style.left = lp + "px";
	div.style.top = tp + "px";
	div.style.border = '0';
	div.style.margin = '0';
	div.style.padding = '0';
	div.style.display = 'block';
	
	//append the styled info window to the container
	div.appendChild(wrapper);
	
	map.AddControl(div);

	//pan if necessary so it shows on the screen
	var view = map.GetMapView();
	var topLeft = view.TopLeftLatLong;
	var topLeftP = map.LatLongToPixel(topLeft);
	var mapSWx = parseInt(topLeftP.x);
	var mapNEy = parseInt(topLeftP.y);
		
	var panX = 0;
	var panY = 0;
	if(div.offsetTop < mapNEy){
		//top of the window is above the top edge of the map container
		panY = mapNEy - div.offsetTop + 150;
	}
	if(div.offsetLeft-118 < mapSWx){
		panX = (div.offsetLeft-40) - mapSWx;
	}
	if(panX!=0 || panY!=0){
		map.Pan(panX,-panY);	
	
		if (panX!=0) div.style.left = (lp-panX+72) + "px";
		if (panY!=0) div.style.top = (tp+panY+128) + "px";
	}

	return div.id;
}
