// You MUST declare and provide a value for the collId variable corresponding
// to the Live Maps collection ID you wish to use as a source for the map
// You MUST also include a link prior to this script to the MicrosoftAjax.js 
// file from the Microsoft Ajax Framework, to support the pageLoad event.
// You may OPTIONALLY provide a customIcon variable containing the fully-qualified         
// Url to a custom pushpin icon for your map.

//
        var divs = '<div style="cursor: pointer;" onclick="ZoomToggle(document.getElementById(' 
        divs = divs + "'myMap'" 
        divs = divs + '), this);" id="ZoomIt">Expand +</div>'
        divs = divs + '<div id="myMap" style="position: relative; width: ' + width + '; height: ' + height + ';"></div>'

        document.write(divs)

		var map = null;
		var layerid=1;
        var l;
        var shapeIds = new Array();
        var zoomed = 0;

        function pageLoad(sender, args) {
        	GetMap();
        }
        
		function GetMap()         
		{
            // hack to enable non-ie browsers like Opera
		    var isMSIE = /*@cc_on!@*/false;

		    if (!isMSIE) // Not IE
		    // hack to work around incorrect identification of downlevel browsers
		        Msn.Drawing.Graphic.CreateGraphic = function(f, b) { return new Msn.Drawing.SVGGraphic(f, b) }

			map = new VEMap('myMap');
			map.LoadMap();

			map.SetMapStyle(VEMapStyle.Road);
			AddMyLayer();
			map.HideDashboard();
		}
		
		function AddMyLayer()
		{
			l = new VEShapeLayer();
			var veLayerSpec = new VEShapeSourceSpecification(VEDataType.VECollection, collId, l);
			map.ImportShapeLayerData(veLayerSpec, onFeedLoad);
		}
		
        function onFeedLoad(feed)
        {
            if (customIcon != null)
            {
                var i;
                var count = feed.GetShapeCount();
                for (i=0;i<count;i++)
                {
                    var shape = feed.GetShapeByIndex(i);
                    shapeIds[i] = shape.GetID();
                    shape.SetCustomIcon(customIcon);
                }
            }
        }

                
		function ZoomToggle(mapelement, element) {
		   if(zoomed == 0)
		   {
			   var mapelmt = mapelement;
			   var div = element;
			   //mapelmt.style.position = 'relative';
			   mapelmt.style.border = 'medium black inset';
			   mapelmt.style.width = exWidth;
			   mapelmt.style.height = exHeight;
			   mapelmt.style.zIndex = '42';
			   GetMap();
			   map.ShowDashboard();
			   zoomed = 1;
			   
			   div.innerHTML = 'Restore -';
		   }
		   else
		   {
		       var mapelmt = mapelement;
			   var div = element;
			   //mapelmt.style.position = 'fixed';
			   mapelmt.style.border = '0px';
			   mapelmt.style.width = width;
			   mapelmt.style.height = height;
			   GetMap();
			   zoomed = 0;
			   
			   div.innerHTML = 'Expand +';
		   }
		}