const zuerich_bounds = {
  north: 47.41590970260092,
  south: 47.315703309031846,
  west: 8.45742642179812,
  east: 8.600047733589026,
};

function initMap() {
  const map = new google.maps.Map(document.getElementById('map'), {
  mapId: "fd4581e1612d9ef",
  center: {lat: 47.38109493760974, lng: 8.521861488204763},
  restriction: {
      latLngBounds: zuerich_bounds,
      strictBounds: false,
    },
  zoom: 13,
  disableDefaultUI: true,
  gestureHandling: "greedy",

});
infoWindow = new google.maps.InfoWindow();
addMarkers();










function addMarkers(){

  let  url = "system/alleInfosHolen.php";
  fetch(url)
    .then((response) => {
      return response.json();
    })
    .then((markerData) => {
     for (let i = 0; i < markerData.length; i++) {
       if (markerData[i].sichtbarkeit = 1) {
         const marker = new google.maps.Marker({
             position: {lat: markerData[i].koordinatenLat, lng: markerData[i].koordinatenLng},
             map: map,
             title: markerData[i].titel,
             icon: {
               url: "/images/ort.png",
               scaledSize: new google.maps.Size(38+(markerData[i].likes), 38+(markerData[i].likes)),
             },
             animation: google.maps.Animation.DROP,

           });


         marker.addListener("click", () => {
          ideeAnzeigen(markerData[i]);
          
          openOverlay();
          
         })
       }
       else {

       }
     }
    })
    .catch(function(error) {
      console.log('Error!: ' + error.message);
    });
  }

// NEUE IDEE ERFASSEN

map.addListener("click", (mapsMouseEvent) => {
  newMarker(mapsMouseEvent.latLng);

  setTimeout(() => {
    openOverlay();
  }, 800);
  

  formularErstellen(mapsMouseEvent.latLng);
})


function newMarker(mousePosition) {
  const newMarker = new google.maps.Marker({

      position: mousePosition,
      map: map,
      animation: google.maps.Animation.DROP,

    });

    newMarker.setMap(map);

    let icon = {url:"/images/ort.png", size: new google.maps.Size(30, 30)};

    newMarker.setIcon("/images/newMarker.jpg");

    $("#cancel").click(function() {
      newMarker.setMap(null);
    })

}


// CHANCEL location_button

// LOCATION BUTTON

  let location_button = document.getElementById("currentLocation");
  // map.controls[google.maps.ControlPosition.TOP_CENTER].push("location_button");
  location_button.addEventListener("click", () => {
  // Try HTML5 geolocation.
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(
      (position) => {
        const pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude,
        };

        const marker = new google.maps.Marker({
            position: pos,
            map: map,
            icon: {
              url: "/images/current_location.png",
            animation: google.maps.Animation.DROP,
            scaledSize: new google.maps.Size(50, 50)
        }});

        map.setCenter(pos);
      },
      () => {
        handleLocationError(true, infoWindow, map.getCenter());
      }
    );
  } else {
    // Browser doesn't support Geolocation
    handleLocationError(false, infoWindow, map.getCenter());
  }

});
}