jQuery(document).ready(function() {
  legendInfo = {
    "Voice & EVDO Data": "js/green.jpg",
    "Voice Only": "js/red.jpg",
    "Roaming": "js/yellow.jpg",
    "No Coverage": "js/white.jpg"
  };
  legendSpacers = [ 280, 430, 530, 630 ]

  var legendDiv = document.createElement("DIV");
  legendDiv.style.marginTop = "3px";

  var x = 0
  for (var legendItem in legendInfo) {
    var legendItemDiv = document.createElement("DIV");
    legendItemDiv.style.position = "relative";
    legendItemDiv.setAttribute("style", "float: left");

    var legendColorBox = document.createElement("IMG");
    legendColorBox.src = legendInfo[legendItem];
    legendColorBox.style.height = "14px";
    legendColorBox.style.width = "25px";
    legendColorBox.style.position = "absolute";
    legendColorBox.style.left = legendSpacers[x] + "px";

    var legendLabel = document.createElement("DIV");
    legendLabel.innerHTML = legendItem;
    legendLabel.style.fontSize = "10px";
    legendLabel.style.color = "#333";
    legendLabel.style.height = "20px";
    legendLabel.style.position = "absolute";
    legendLabel.style.left = (35 + legendSpacers[x]) + "px";
    legendLabel.style.marginTop = "1px";
    legendLabel.style.zIndex = 50;

    legendItemDiv.appendChild(legendColorBox);
    legendItemDiv.appendChild(legendLabel);

    legendDiv.appendChild(legendItemDiv);
    x++;
  }
  document.getElementById("legend1").appendChild(legendDiv);
});

OpenLayers.ImgPath = "MapImg/";

CM.beginViewer({
  mapElement: "map_area1",
  server: "http://-tgom6c.p0.cellmaps.com/",
  protocol: "skt",
  //server: "http://quartz.americanroamer.com/",
  //protocol: "skt2",
  layer: "na_pageplus",
  scales: "na",
  bounds: "world",
  userBounds: "northamerica",
  initialCenter: [ -10700000, 4600000 ],
  initialZoom: 4,
  copyrights: { "NAVTEQ": "", "American Roamer": "Coverage" },
  geocodeServer: "http://-tgom6c.p0.cellmaps.com/",
  deadSimpleSearch: { textDiv: "search_input1", button: "search_go1", icon: new OpenLayers.Icon("images/pushpin.png", new OpenLayers.Size(15, 27), new OpenLayers.Pixel(-1, -25)) },
  //deadSimpleSearch: { textDiv: "search_input", button: "search_go", pushpin: false },
  searchNotFound: function()
  {
    jQuery("#search_input1").effect("highlight", { color: "#ff0000", queue: false });
  },
  searchPopupBackground: "#EEFFEE",
  loaded: function()
  {
    
  },
  controls: [
    new OpenLayers.Control.MouseDefaults(),
    new CellMaps.Control.CMZoomBar({
      minDisplayZoom: 3
    }),
    new CellMaps.Control.CursorEnforcer({cursor:"url(http://content-cdn.cellmaps.com/common/images/hand_plain.cur), move"}),
    new CellMaps.Control.ZoomEnforcer({minZoom: 3, maxZoom: 16})
  ]
});