var Container = document.getElementById("map");
var Option = {
  center: new kakao.maps.LatLng(33.450701, 126.570667),
  level: 5,
};

var map = new kakao.maps.Map(Container, Option);
resizeMap();
relayout();

function resizeMap() {
  var Container = document.getElementById("map");
  Container.style.width = "400px";
  Container.style.height = "300px";
}

function relayout() {
  map.relayout();
}

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function (position) {
    var latitude = position.coords.latitude,
      longitude = position.coords.longitude;
    var Position = new kakao.maps.LatLng(latitude, longitude);
    var message = '<div style="padding:5px;font-size:12px;">현위치</div>'
    displayMarker(Position, message);
  });
}


function displayMarker(Position, message) {
  var marker = new kakao.maps.Marker({
    map: map,
    position: Position,
  });
  var iwContent = message;
  var iwRemoveable = false;
 
  var infowindow = new kakao.maps.InfoWindow({
    content: iwContent,
    removable: iwRemoveable,
  });

  infowindow.open(map, marker);

  map.setCenter(Position);
  function getParameterByName(name, url = window.location.href) {
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
      results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return "";
    return decodeURIComponent(results[2].replace(/\+/g, " "));
  }

  
  var infowindow = new kakao.maps.InfoWindow({zIndex:1});
  
  var geocoder = new kakao.maps.services.Geocoder();
  geocoder.addressSearch('경기도 수원영통구 영통동 영통로 460', function(result, status) {
     if (status === kakao.maps.services.Status.OK) {
        var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
        apart1message = "영통로 460"
        displayMarker2(result[0], apart1message);
        displayapart("apart1", apart1message);
        coords.extend(new kakao.maps.Latlng(result[0].y, result[0].x));
    } 
  });

  searchAddrFromCoords(map.getCenter(), displayCenterInfo);
  function searchAddrFromCoords(coords, callback) {
    // 좌표로 행정동 주소 정보를 요청합니다
    geocoder.coord2RegionCode(coords.getLng(), coords.getLat(), callback);         
}
function displayCenterInfo(result, status) {
  if (status === kakao.maps.services.Status.OK) {
      var infoDiv = document.getElementById('you');
      infoDiv.innerHTML = result[0].address_name;
  }    
}

  function displayapart(str, message) {
    var _str = document.getElementById(str);
    _str.innerText = message;
  }

  function displayMarker2(place, apart1message) {
      var marker = new kakao.maps.Marker({
          map: map,
          position: new kakao.maps.LatLng(place.y, place.x) 
      });
      kakao.maps.event.addListener(marker, 'mouseover', function() {
          infowindow.setContent('<div style="padding:5px;font-size:12px;">' + apart1message + '</div>');
          infowindow.open(map, marker);
      });
      kakao.maps.event.addListener(marker, 'mouseout', function() {
        infowindow.close();
    });
  }

  //다음 페이지에서 입력값 받아오기
  var salary = getParameterByName("salary");
  var expenditure = getParameterByName("expenditure");
  var year = "3"; //값 받아오기 전 기본값으로 설정
  var div = document.getElementById("info");
  div.innerText = `${salary}만원의 월급과 ${expenditure}만원의 지출을 유지하면 당신은 ${year}년 후 아래의 집을 구매할 수 있습니다.`;
}