angular.module('mobility').controller('MapController', function(
  $scope,
  $cordovaGeolocation,
  $stateParams,
  $ionicModal,
  $ionicPopup,
  LocationsService,
  InstructionsService,
  Incidents
  ) {
    /**
     * Once state loaded, get put map on scope.
     */
    $scope.$on("$stateChangeSuccess", function() {

      //Initialize map properties
      $scope.map = {
        defaults: {
          tileLayer: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
          maxZoom: 18,
          zoomControlPosition: 'bottomleft'
        },
        markers : {},
        events: {
          map: {
            enable: ['context'],
            logic: 'emit'
          }
        }
      };
      //bring all incidents into scope
      $scope.incidents = Incidents.all();
      var incident_num = 1; 
      $scope.incidents.forEach(function (incident, index, array) {
        var marker = {
          lat: incident.lat,
          lng: incident.lng,
          message: incident.type + "\nArea: " + incident.area + "\nAddress: " + incident.address
        }
        if(marker.lat !== null || marker.lng !== null){
          $scope.map.markers["Incident" + incident_num] = marker;
        }
        incident_num++;
        console.log($scope.map.markers);
      });


      $scope.goTo();


    });



    /**
     * Center map on specific saved location
     * @param locationKey
     */
    $scope.goTo = function(locationKey) {

      // var location = LocationsService.savedLocations[locationKey];
      var location = LocationsService;

      $scope.map.center  = {
        lat : location.lat,
        lng : location.lng,
        zoom : 11
      };

      // $scope.map.markers[locationKey] = {
      //   lat:location.lat,
      //   lng:location.lng,
      //   message: location.name,

      //   focus: true,
      //   draggable: false
      // };

    };

    /**
     * Center map on user's current position
     */
    // $scope.locate = function(){

    //   $cordovaGeolocation
    //     .getCurrentPosition()
    //     .then(function (position) {
    //       $scope.map.center.lat  = position.coords.latitude;
    //       $scope.map.center.lng = position.coords.longitude;
    //       $scope.map.center.zoom = 15;

    //       $scope.map.markers.now = {
    //         lat:position.coords.latitude,
    //         lng:position.coords.longitude,
    //         message: "You Are Here",
    //         focus: true,
    //         draggable: false
    //       };

    //     }, function(err) {
    //       // error
    //       console.log("Location error!");
    //       console.log(err);
    //     });

    // };

  });
@@ -137,16 +137,28 @@
 cPopup,%0A
+  $compile,%0A
   Locati
@@ -883,183 +883,352 @@
 var 
-marker = %7B%0A          lat: incident.lat,%0A          lng: incident.lng,%0A          message: incident.type + %22%5CnArea: %22 + incident.area + %22%5CnAddress: %22 + incident.address%0A        %7D
+html = %22%3Ch5 class='incident_type'%3E%22 + incident.type + %22%3C/h5%3E%22%0A          + %22%3Cp%3EArea: %22 + incident.area + %22%3C/p%3E%22%0A          + %22%3Cp%3EAddress: %22 + incident.address + %22%3C/p%3E%22;%0A        var marker = %7B%0A          lat: incident.lat,%0A          lng: incident.lng,%0A          message: html%0A        %7D%0A        //Only add to list of markers if there are coordinates
 %0A   
@@ -1384,49 +1384,8 @@
 ++;%0A
-        console.log($scope.map.markers);%0A
     
@@ -1387,25 +1387,24 @@
 %0A      %7D);%0A%0A
-%0A
       $scope
@@ -1413,17 +1413,16 @@
 oTo();%0A%0A
-%0A
     %7D);%0A
@@ -1538,27 +1538,16 @@
 unction(
-locationKey
 ) %7B%0A%0A   

Add messages to inital markers that are loaded