
var geocoder;
var bounds;

var markerMap = function( locations, selector, googleMap ) {
    labels  = $$( selector );
    
    // set default center to google
    googleMap.setCenter(new GLatLng(37.4419, -122.1419), 13);
    googleMap.addControl(new GLargeMapControl());
    googleMap.addControl(new GMapTypeControl());
    geocoder = new GClientGeocoder();
    bounds   = new GLatLngBounds();

    // var directions = new GDirections( map );
    locations.each( function( junk, i ) {
        var point  = new GLatLng( locations[i].latitude, locations[i].longitude );
        var marker = new GMarker( point );
        locations[i].point  = point;
        locations[i].marker = marker;

        googleMap.addOverlay( marker );
        bounds.extend( point );
        googleMap.setZoom( googleMap.getBoundsZoomLevel(bounds) );
        googleMap.setCenter( bounds.getCenter() );

        if ( labels[i] != null ) {
            labels[i].addEvent( "click", function( event ) {
                var content = '<div class="googleMap-InfoWindow">';
                content += '<h2>' + locations[i].name + '</h2>';
                content += '<p class="map-address">' + locations[i].address + '</p>';

                if ( locations[i].phones ) {
                    content += '<p class="map-phones">';
                    content += locations[i].phones.join('<br />');
                    content += '</p>';
                }
                content = content + '</div>';
                googleMap.panTo( locations[i].point );
                locations[i].marker.openInfoWindowHtml( content );
            });

            // This will 'click' the tab to which the marker refers.
            GEvent.addListener( marker, "click", function( e ) {
                labels[i].fireEvent( 'click', e );
            });
        }

    });
};