$(document).ready(function () {
  let map;
  let placemark;

  $('.on-map-btn').on('click', function () {
    const longitude = parseFloat($(this).data('longitude'));
    const latitude = parseFloat($(this).data('latitude'));
    const name = $(this).data('name');

    $('#newBmapModal').fadeIn();

    ymaps.ready(function () {
      if (!map) {
        map = new ymaps.Map('map_canvas', {
          center: [latitude, longitude],
          zoom: 15,
        });
      } else {
        map.setCenter([latitude, longitude]);
      }

      if (placemark) {
        map.geoObjects.remove(placemark);
      }

      placemark = new ymaps.Placemark(
        [latitude, longitude],
        {
          balloonContent: `<div style="font-size: 14px;">${name}</div>`,
        },
        {
          balloonCloseButton: false,
          openBalloonOnClick: false,
          hideIconOnBalloonOpen: false,
        }
      );

      map.geoObjects.add(placemark);

      placemark.balloon.open();
    });
  });

  $('#newBmapModal').on('click', function (e) {
    if ($(e.target).is('#newBmapModal')) {
      $('#newBmapModal').fadeOut();
    }
  });
  $('#nwbd-closer').on('click', function (e) {
    if ($(e.target).is('#nwbd-closer')) {
      $('#newBmapModal').fadeOut();
    }
  });
});