﻿var staticMapMarkup = function(){};
staticMapMarkup.MapTypes = ["roadmap","hybrid","satellite","terrain"]; //&maptype=terrain
staticMapMarkup.defMapType = "roadmap";
staticMapMarkup.defSize = "400x400";
staticMapMarkup.defBaseUrl = "http://maps.google.com/staticmap";
staticMapMarkup.key = "";
staticMapMarkup.findPos = function (obj){ var curleft = curtop = 0; if (obj.offsetParent) { do { curleft += obj.offsetLeft; curtop += obj.offsetTop; } while (obj = obj.offsetParent); } return [curleft,curtop]; };
staticMapMarkup.buildUrl = function (baseUrl,dictArgs,key){ baseUrl += "?"; for (var a in dictArgs) baseUrl += (a + "=" + dictArgs[a] + "&"); return baseUrl + "key=" + key; };
staticMapMarkup.Init = function(key){
// static map maker: http://gmaps-samples.googlecode.com/svn/trunk/simplewizard/makestaticmap.html
// http://www.google.com/staticmap ?center=17.458727,78.36374 &markers=17.458727,78.36374,red &zoom=13 &size=450x250 &key=...

 this.key = key;
/*
  <div id="smap" style="width:420px;height:400px; position:absolute; right:40px; top:40px; background-image:url('smap/close.png'); background-repeat:no-repeat; background-position:top right; cursor:pointer;">
   <img src="test/smap.png" width="400" height="400" alt="google map: xxx" style="border:1px solid blue;" />
  </div>
*/


 var smap = document.createElement("div");
 smap.id = "smapContainer";
 smap.style.width = staticMapMarkup.defSize.split("x")[0] + "px";
 smap.style.height = staticMapMarkup.defSize.split("x")[1] + "px";
 smap.style.visibility = "hidden";
 smap.style.position = "absolute";
 smap.style.right = "40px";
 //smap.style.top = "40px";
 smap.style.backgroundImage = "url('smap/close.png')";
 smap.style.backgroundRepeat = "no-repeat";
 smap.style.backgroundPosition = "top right";
 smap.style.cursor = "pointer";
 smap.onclick = function(e) { 
  e = e || window.event;
  var target = e.srcElement || e.target;
  target.style.visibility = "hidden";
  target.innerHTML = "";
 };
 smap.show = function(e) {
  e = e || window.event;
  var target = e.srcElement || e.target;
  if (!target.img)
  {
   var img = document.createElement("img");
   img.style.border = "solid 1px #00F";
   img.src = staticMapMarkup.buildUrl(staticMapMarkup.defBaseUrl,target.smapArgs,staticMapMarkup.key);
   img.style.width = target.smapArgs["size"].split("x")[0] + "px";
   img.style.height = target.smapArgs["size"].split("x")[1] + "px";
   target.img = img;
  }
  smap.style.width = parseInt(target.smapArgs["size"].split("x")[0]) + 20 + "px";
  smap.style.height = parseInt(target.smapArgs["size"].split("x")[1]) + "px";
  smap.appendChild(target.img);
  smap.style.top = staticMapMarkup.findPos(target)[1] + "px";
  smap.style.visibility = "visible";
  
 };
 document.body.appendChild(smap);
 
 var as = document.getElementsByTagName("a");
 for (var i=0; i < as.length; i++)
 {
  if (as[i].getAttribute("smap:href"))
  {
   var dict = {};
   dict.size = staticMapMarkup.defSize;
   dict.maptype = "roadmap";
   var args = as[i].getAttribute("smap:href").split("&");
   for (var a in args) dict[args[a].split("=")[0]] = args[a].split("=")[1];
  // var iUrl = buildUrl(staticMapMarkup.defBaseUrl,dict);
  //  as[i].iUrl = iUrl;
   as[i].smapArgs = dict;
   as[i].onclick = smap.show;
   as[i].className = "smap_xLnk";
  }
 }

};

/*
function buildUrl(baseUrl,dictArgs,key)
{
 baseUrl += "?";
 for (var a in args) baseUrl += (a + "=" + dictArgs[a] + "&");
 return baseUrl + "key=" + key;
}
*/

