'
);
}
// ─────────────────────────────────────────────────────
// ДОБАВЛЯЕМ МАРКЕРЫ НА КАРТУ (с кластеризацией)
// ─────────────────────────────────────────────────────
function addMarkersToMap() {
// Создаём группу кластеров
clusterGroup = L.markerClusterGroup({
// При каком радиусе (в пикселях) маркеры объединяются в кластер
maxClusterRadius: 60,
// Иконка кластера — синий круг с количеством
iconCreateFunction: function (cluster) {
var count = cluster.getChildCount();
var size = count < 10 ? 38 : count < 50 ? 46 : 54;
return L.divIcon({
html:
'
' + count + '
',
className: 'apt-cluster',
iconSize: [size, size],
iconAnchor: [size / 2, size / 2],
});
},
animate: true,
spiderfyOnMaxZoom: true, // при максимальном зуме раскрывает кластер паучком
showCoverageOnHover: false, // не показывать область охвата кластера
zoomToBoundsOnClick: true, // при клике на кластер — приближаемся
});
// Добавляем каждую квартиру как маркер
apartments.forEach(function (apt) {
var marker = L.marker([apt.lat, apt.lng], {
icon: createPriceIcon(apt.price, false),
});
// Привязываем попап к маркеру
marker.bindPopup(buildPopupHTML(apt), {
maxWidth: 250,
className: 'apt-popup',
});
// Сохраняем ссылку на маркер по id квартиры
markerMap[apt.id] = marker;
// По клику на маркер — подсвечиваем карточку в каталоге
marker.on('click', function () {
highlightCard(apt);
});
// Добавляем маркер в группу кластеров
clusterGroup.addLayer(marker);
});
// Добавляем всю группу на карту
map.addLayer(clusterGroup);
}
// ─────────────────────────────────────────────────────
// СИНХРОНИЗАЦИЯ: карточка → маркер
// Клик по карточке каталога → карта летит к квартире
// ─────────────────────────────────────────────────────
function wireCardToMarkerSync() {
apartments.forEach(function (apt) {
apt.cardEl.addEventListener('click', function (e) {
// Если кликнули по ссылке внутри карточки — не перехватываем
if (e.target.tagName === 'A') return;
// Летим к квартире на карте и открываем попап
map.setView([apt.lat, apt.lng], 15, { animate: true });
var marker = markerMap[apt.id];
if (marker) marker.openPopup();
// Обновляем иконки: выбранная — синяя, остальные — белые
setActiveMarker(apt.id);
// Прокручиваем страницу к карте (удобно на мобильных)
var mapEl = document.getElementById(CONFIG.mapId);
if (mapEl) mapEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
});
});
}
// ─────────────────────────────────────────────────────
// ПОДСВЕТКА КАРТОЧКИ при клике на маркер карты
// ─────────────────────────────────────────────────────
function highlightCard(apt) {
// Снимаем подсветку со всех карточек
document.querySelectorAll('.' + CONFIG.activeClass)
.forEach(function (el) { el.classList.remove(CONFIG.activeClass); });
// Подсвечиваем нужную карточку
apt.cardEl.classList.add(CONFIG.activeClass);
// Прокручиваем список к этой карточке
apt.cardEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
// ─────────────────────────────────────────────────────
// СМЕНА АКТИВНОГО МАРКЕРА
// ─────────────────────────────────────────────────────
function setActiveMarker(activeId) {
apartments.forEach(function (apt) {
var marker = markerMap[apt.id];
if (marker) {
// Активный маркер — синий, остальные — белые
marker.setIcon(createPriceIcon(apt.price, apt.id === activeId));
}
});
}
// ─────────────────────────────────────────────────────
// ФИЛЬТРАЦИЯ квартир по комнатам и цене
// ─────────────────────────────────────────────────────
function initFilters() {
// Вешаем обработчики на селекторы фильтров
var roomsEl = document.getElementById('filter-rooms');
var priceMaxEl = document.getElementById('filter-price-max');
var resetBtn = document.getElementById('filter-reset');
if (roomsEl) roomsEl.addEventListener('change', applyFilters);
if (priceMaxEl) priceMaxEl.addEventListener('change', applyFilters);
if (resetBtn) resetBtn.addEventListener('click', function () {
if (roomsEl) roomsEl.value = '';
if (priceMaxEl) priceMaxEl.value = '';
applyFilters();
});
}
function applyFilters() {
var rooms = document.getElementById('filter-rooms')?.value || '';
var priceMax = document.getElementById('filter-price-max')?.value || '';
apartments.forEach(function (apt) {
var show = true;
// Проверяем фильтр по комнатам
if (rooms && String(apt.rooms) !== rooms) show = false;
// Проверяем фильтр по максимальной цене
if (priceMax && apt.price > parseInt(priceMax)) show = false;
var marker = markerMap[apt.id];
if (marker) {
// Показываем или скрываем маркер на карте
if (show) {
clusterGroup.addLayer(marker);
} else {
clusterGroup.removeLayer(marker);
}
}
// Показываем или скрываем карточку в каталоге
apt.cardEl.style.display = show ? '' : 'none';
});
}
// ─────────────────────────────────────────────────────
// АВТОМАСШТАБ — показываем все квартиры на карте
// ─────────────────────────────────────────────────────
function fitMapToAllMarkers() {
if (apartments.length === 0) return;
if (apartments.length === 1) {
// Одна квартира — просто центрируемся на ней
map.setView([apartments[0].lat, apartments[0].lng], 15);
return;
}
// Несколько квартир — вписываем все в экран
var group = L.featureGroup(
apartments.map(function (a) { return L.marker([a.lat, a.lng]); })
);
// pad(0.15) добавляет 15% отступ по краям
map.fitBounds(group.getBounds().pad(0.15));
}
// ─────────────────────────────────────────────────────
// ЗАПУСКАЕМ ПОСЛЕ ЗАГРУЗКИ СТРАНИЦЫ
// ─────────────────────────────────────────────────────
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', start);
} else {
// DOM уже загружен (Tilda иногда вызывает скрипты поздно)
start();
}
})(); // конец IIFE — изолированная область видимости