exercise

before.js

var markerInfo = [
        //MONDAYS
    {
    "location": "City Hall Plaza - Fisher Park",       "latitude": "42.360082",
    "longitude": "-71.058880",
    "day": "Mondays"
    },
        // TUESDAYS & THURSDAYS
        {
    "location": "South End - Harrison Avenue and East Concord Street by BMC",      
    "latitude": "42.336209",
    "longitude": "-71.072912",
    "day": "Tuesdays & Thursdays"
    },
        //  WEDNESDAYS & FRIDAYS
        {
    "location": "Back Bay - Trinity Place",             "latitude": "42.348605",
    "longitude": "-71.075381",
    "day": "Wednesdays & Fridays"
    },
        //SATURDAYS
        {
    "location": "Dudley Square at Dudley Street",       "latitude": "42.328354",
    "longitude": "-71.078709",
    "day": "Saturdays"
    }
];

var myLatlng1 = new google.maps.LatLng(42.360082, -71.058880);
var myLatlng2 = new google.maps.LatLng(42.336209, -71.072912);
var myLatlng3 = new google.maps.LatLng(42.348605, -71.075381);
var myLatlng4 = new google.maps.LatLng(42.328354, -71.078709);

var mapOptions = {
  zoom: 13,
  center: myLatlng3, 
  mapTypeId: google.maps.MapTypeId.ROADMAP,
  styles: [ { 
        "featureType": "administrative",
        "elementType": "labels.text.fill",
        "stylers": [
            {
                "color": "#1e5631"
            }
        ]
    },
    {
        "featureType": "landscape",
        "elementType": "all",
        "stylers": [
            {
                "color": "#f2f2f2"
            }
        ]
    },
    {
        "featureType": "landscape",
        "elementType": "geometry.fill",
        "stylers": [
            {
                "color": "#eff6e3"
            }
        ]
    },
    {
        "featureType": "poi",
        "elementType": "all",
        "stylers": [
            {
                "visibility": "off"
            }
        ]
    },
    {
        "featureType": "poi.park",
        "elementType": "geometry.fill",
        "stylers": [
            {
                "color": "#D5EBC3"
            },
            {
                "visibility": "on"
            }
        ]
    },
    {
        "featureType": "road",
        "elementType": "all",
        "stylers": [
            {
                "saturation": -100
            },
            {
                "lightness": 45
            },
            {
                "visibility": "simplified"
            }
        ]
    },
    {
        "featureType": "road.highway",
        "elementType": "all",
        "stylers": [
            {
                "visibility": "simplified"
            }
        ]
    },
    {
        "featureType": "road.highway",
        "elementType": "geometry.fill",
        "stylers": [
            {
                "color": "#FFD478"
            },
            {
                "visibility": "simplified"
            }
        ]
    },
    {
        "featureType": "road.highway",
        "elementType": "labels.text",
        "stylers": [
            {
                "color": "#4e4e4e"
            }
        ]
    },
    {
        "featureType": "road.arterial",
        "elementType": "geometry.fill",
        "stylers": [
            {
                "color": "#f4f4f4"
            }
        ]
    },
    {
        "featureType": "road.arterial",
        "elementType": "labels.text.fill",
        "stylers": [
            {
                "color": "#787878"
            }
        ]
    },
    {
        "featureType": "road.arterial",
        "elementType": "labels.icon",
        "stylers": [
            {
                "visibility": "off"
            }
        ]
    },
    {
        "featureType": "transit",
        "elementType": "all",
        "stylers": [
            {
                "visibility": "off"
            }
        ]
    },
    {
        "featureType": "water",
        "elementType": "all",
        "stylers": [
            {
                "color": "#eaf6f8"
            },
            {
                "visibility": "on"
            }
        ]
    },
    {
        "featureType": "water",
        "elementType": "geometry.fill",
        "stylers": [
            {
                "color": "#eaf6f8"
            }
        ]
    }
]};

var map = new google.maps.Map(document.getElementById("map"), mapOptions);

var marker1 = new google.maps.Marker({
    position: myLatlng1,
    title: "Mondays"
});

var marker2 = new google.maps.Marker({
    position: myLatlng2,
    title: "Tuesdays & Thursdays"
});

var marker3 = new google.maps.Marker({
    position: myLatlng3,
    title: "Wednesdays & Fridays"
});

var marker4 = new google.maps.Marker({
    position: myLatlng4,
    title: "Saturdays"
});

// To add the marker to the map, call setMap();
marker1.setMap(map);
marker2.setMap(map);
marker3.setMap(map);
marker4.setMap(map);

var content1 = "<div style='font-family: LiSong Pro;'>" + "<h1>MONDAYS</h1>" + "<p style='font-size: 1.25em;'>" + "11AM - 3PM" + "</p>" + "<p style ='font-size: 1.5em;'>" + "City Hall Plaza - Fisher Park" + "<br />" + "</p></div>";
var content2 = "<div style='font-family: LiSong Pro;'>" + "<h1>TUESDAYS & THURSDAYS</h1>" + "<p style='font-size: 1.25em;'>" + "11AM - 3PM" + "</p>" + "<p style='font-size: 1.5em;'>" + "South End - Harrison Avenue and East Concord Street by BMC" + "<br />" + "</p></div>";
var content3 = "<div style='font-family: LiSong Pro;'>" + "<h1>WEDNESDAYS & FRIDAYS</h1>" + "<p style='font-size: 1.25em;'>" + "11AM - 3PM" + "</p>" + "<p style='font-size: 1.5em;'>" + "Back Bay - Trinity Place" + "<br />" + "</p></div>";
var content4 = "<div style='font-family: LiSong Pro;'>" + "<h1>SATURDAYS</h1>" + "<p style='font-size: 1.25em;'>" + "11AM - 3PM" + "</p>" + "<p style='font-size: 1.5em;'>" + "Dudley Square at Dudley Street" + "<br />" + "</p></div>";

var infowindow1 = new google.maps.InfoWindow({
    content: content1
});

var infowindow2 = new google.maps.InfoWindow({
    content: content2
});

var infowindow3 = new google.maps.InfoWindow({
    content: content3
});

var infowindow4 = new google.maps.InfoWindow({
    content: content4
});

marker1.addListener('click', function() {
infowindow1.open(map, marker1);
});

marker2.addListener('click', function() {
infowindow2.open(map, marker2);
});

marker3.addListener('click', function() {
infowindow3.open(map, marker3);
});

marker4.addListener('click', function() {
infowindow4.open(map, marker4);
});

$("#mobile_menu").click(function() {
  $(this).toggleClass("menu-expanded");
});

$(".menu-expanded").click(function() {
    $(this).toggleClass("menu-collapsed");
});