    var map;
    var gdir;
    var geocoder = null;
    var addr;

    function load( ) {
      if (GBrowserIsCompatible()) {
          map = new GMap2(document.getElementById("Gmap"));
          gdir = new GDirections(map);
          geocoder = new GClientGeocoder();

          GEvent.addListener(gdir, "error", handleErrors);

          map.setCenter(new GLatLng(34.086709, -117.921250 ), 11);
          map.addControl(new GLargeMapControl());
          map.addControl(new GMapTypeControl());

          // ========== launch the custom Panel creator a millisecond after the GDirections finishes loading ==========
          // == The delay is required in case we rely on GDirections to perform the initial setCenter ==
          GEvent.addListener(gdir,"load", function() {
            setTimeout('customPanel(map,"map",gdir,document.getElementById("directions"))', 1);
            });
         }
      }

    function setDirections(fromAddress, toAddress, locale) {

	addr = fromAddress;
	if (geocoder) {

          geocoder.getLatLng( fromAddress,
            function(point){
              if (point) {
                gdir.load( point.toUrlValue(6) + " to 34.086709, -117.921250", {"locale": locale, getSteps: true} );
                }
              else {
                alert("The address you typed cannot be found.  It may be new or incorrect.\nPlease refine the address or type a new one.");
                }
             });
          }
        else {
          alert("The Google Geocoder is unavailable right now.\nTry again later.");
          }
        }

    function handleErrors(){
      if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
        alert("The address you typed cannot be found.  It may be new or incorrect.\nPlease refine the address or type a new one.\n\nError code: " + gdir.getStatus().code);
      else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
        alert("Google is having a problem processing your request.  Try again later.\n\n Error code: " + gdir.getStatus().code);
      else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
        alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n\n Error code: " + gdir.getStatus().code);
//      else if (gdir.getStatus().code == G_UNAVAILABLE_ADDRESS)  <--- Doc bug... this is either not defined, or Doc is wrong
//        alert("The geocode for the given address or the route for the given directions query cannot be returned due to legal or contractual reasons.\n Error code: " + gdir.getStatus().code);
      else if (gdir.getStatus().code == G_GEO_BAD_KEY)
        alert("Google can no longer process this request for www.go2faith.com.\n\n Error code: " + gdir.getStatus().code);
      else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
        alert("A directions request could not be successfully parsed.\n Error code: " + gdir.getStatus().code);
      else if ( gdir.getStatus().code == 604 )
        alert("Please specify the starting address.");
      else 
        alert("An unknown error occurred.\n\nError code: " + gdir.getStatus().code);
      }


      // ============ custom direction panel ===============
      function customPanel(map,mapname,dirn,div) {
        var html = "";
      
        // ===== local functions =====

        // === waypoint banner ===
        function waypoint(point, type, address) {
          var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
          html += '<table class="waypoint">';
          html += '  <tr onclick='+target+'>';
          html += '    <td class="icon">';
          html += '      <img src="http://www.google.com/intl/en_ALL/mapfiles/icon-dd-' +type+ '-trans.png">'
          html += '    </td>';
          html += '    <td>';
          html +=        address;
          html += '    </td>';
          html += '  </tr>';
          html += '</table>';
        }

        // === route distance ===
        function routeDistance(dist) {
          html += '<div class="routeDist">' + dist + '</div>';
        }      

        // === step detail ===
        function detail(point, num, description, dist) {
          var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
          html += '<table class="step">';
          if (num%2 == 0) {
	    html += '  <tr onclick=' + target + '>';
            }
          else {
            html += '  <tr class="odd" onclick=' + target + '>';
            }
          html += '    <td class="link">';
          html += '      <a href="javascript:void(0)"> '+num+'. </a>';
          html += '    </td>';
          html += '    <td class="desc">';
          html +=        description;
          html += '    </td>';
          html += '    <td class="dist">';
          html +=        dist;
          html += '    </td>';
          html += '  </tr>';
          html += '</table>';
        }

        // === Copyright tag ===
        function copyright(text) {
          html += '<div class="copyright">' + text + "</div>";
        }

        // === read through the GRoutes and GSteps ===

        for (var i=0; i<dirn.getNumRoutes(); i++) {
          if (i==0) {
            var type="play";
          } else {
            var type="pause";
          }
          var route = dirn.getRoute(i);
          var geocode = route.getStartGeocode();
          var point = route.getStep(0).getLatLng();

          // === Waypoint at the start of each GRoute
          if (i==0) {
            waypoint(point, type, addr);
            }
          else {
            waypoint(point, type, geocode.address);
          }

          routeDistance(route.getDistance().html+" (about "+route.getDuration().html+")");

          for (var j=0; j<route.getNumSteps(); j++) {
            var step = route.getStep(j);
            // === detail lines for each step ===
            detail(step.getLatLng(), j+1, step.getDescriptionHtml(), step.getDistance().html);
          }
        }
        
        // === the final destination waypoint ===   
        var geocode = route.getEndGeocode();
        var point = route.getEndLatLng();
//        waypoint(point, "stop", geocode.address);
        waypoint(point, "stop", "Faith Community Church - 1211 E. Badillo St., West Covina, CA 91790");
                 
        // === the copyright text ===
        copyright(dirn.getCopyrightsHtml());

        // === drop the whole thing into the target div
        div.innerHTML = html;

      } // ============ end of customPanel function ===========



