Fix map scroll
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -280,7 +280,7 @@ $klienci_indywidualni = [
|
||||
<br/>
|
||||
<p><strong>Godziny otwarcia</strong></p>
|
||||
<p>
|
||||
Pon. - pt.: 8:00 - 17:00<br/>
|
||||
Pon. - pt.: 9:00 - 17:00<br/>
|
||||
Sob.: Nieczynne<br/>
|
||||
Nd.: Nieczynne
|
||||
</p>
|
||||
@@ -890,6 +890,64 @@ $klienci_indywidualni = [
|
||||
<a href="mailto:zapytania@vidok.com">e-mail: zapytania@vidok.com</a>
|
||||
'
|
||||
],
|
||||
[
|
||||
'id' => 43,
|
||||
'name' => "P.H.U. Dekor",
|
||||
'voivodeship' => $wojewodztwa['swietokrzyskie'],
|
||||
'position' => [
|
||||
'lat' => 50.89316490123651,
|
||||
'lng' => 20.621383677062774
|
||||
],
|
||||
'icon' => "https://maps.google.com/mapfiles/ms/icons/yellow-dot.png",
|
||||
'description' => '
|
||||
<p><strong>
|
||||
ul. Karola Olszewskiego 4,<br/>
|
||||
25-663 Kielce<br/>
|
||||
(obok Dek Meble)
|
||||
</strong></p>
|
||||
<a href="tel:+48413070304">tel.: (41)307 03 04</a>
|
||||
<a href="tel:+48792026026">tel.: +48 792 026 026</a>
|
||||
<a href="tel:+48506118360">tel.: +48 506 118 360</a>
|
||||
<a href="mailto:biuro@dekorkielce.pl">e-mail: biuro@dekorkielce.pl</a>
|
||||
<a href="mailto:dekorkielce@op.pl">e-mail: dekorkielce@op.pl</a>
|
||||
'
|
||||
],
|
||||
[
|
||||
'id' => 44,
|
||||
'name' => "DOMWILL S.C.",
|
||||
'voivodeship' => $wojewodztwa['lubelskie'],
|
||||
'position' => [
|
||||
'lat' => 51.23591612917327,
|
||||
'lng' => 22.57658578434196
|
||||
],
|
||||
'icon' => "https://maps.google.com/mapfiles/ms/icons/yellow-dot.png",
|
||||
'description' => '
|
||||
<p><strong>
|
||||
ul. Wolska 11,<br/>
|
||||
20-411 Lublin<br/>
|
||||
</strong></p>
|
||||
<a href="tel:+48509030249">tel.: +48 509 030 249</a>
|
||||
<a href="mailto:agnieszka@domwill.pl">e-mail: agnieszka@domwill.pl</a>
|
||||
'
|
||||
],
|
||||
[
|
||||
'id' => 45,
|
||||
'name' => "Monteria Grzegorz Stawinoga",
|
||||
'voivodeship' => $wojewodztwa['lubelskie'],
|
||||
'position' => [
|
||||
'lat' => 51.445156853861064,
|
||||
'lng' => 22.60957721133665
|
||||
],
|
||||
'icon' => "https://maps.google.com/mapfiles/ms/icons/yellow-dot.png",
|
||||
'description' => '
|
||||
<p><strong>
|
||||
ul. Przemysłowa 3,<br/>
|
||||
21-100 Lubartów<br/>
|
||||
</strong></p>
|
||||
<a href="tel:+48579637994">tel.: +48 579 637 994</a>
|
||||
<a href="mailto:biuro@monteria.pl">e-mail: biuro@monteria.pl</a>
|
||||
'
|
||||
],
|
||||
];
|
||||
|
||||
$klienci_instytucjonalni = [
|
||||
@@ -1649,105 +1707,6 @@ $klienci_instytucjonalni = [
|
||||
}]
|
||||
}
|
||||
]
|
||||
// styles: [
|
||||
// {
|
||||
// elementType: "geometry",
|
||||
// stylers: [
|
||||
// {
|
||||
// color: "#F4F4F4"
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// elementType: "labels.text.stroke",
|
||||
// stylers: [{
|
||||
// color: "F4F4F4"
|
||||
// }]
|
||||
// },
|
||||
// {
|
||||
// elementType: "labels.text.fill",
|
||||
// stylers: [{
|
||||
// color: "#181C1D"
|
||||
// }]
|
||||
// },
|
||||
|
||||
// // (motorway)
|
||||
// {
|
||||
// featureType: "road.highway",
|
||||
// elementType: "geometry",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // Autostrady
|
||||
// {
|
||||
// featureType: "road.highway",
|
||||
// elementType: "geometry.stroke",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // Kontur autostrady
|
||||
// {
|
||||
// featureType: "road.highway",
|
||||
// elementType: "labels.text.fill",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // tekst
|
||||
|
||||
// // (primary, secondary, local)
|
||||
// {
|
||||
// featureType: "road.arterial",
|
||||
// elementType: "geometry",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // Główne drogi
|
||||
// {
|
||||
// featureType: "road.local",
|
||||
// elementType: "geometry",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // Ulice
|
||||
// {
|
||||
// featureType: "road",
|
||||
// elementType: "labels.text.fill",
|
||||
// stylers: [{
|
||||
// color: "#BABABA"
|
||||
// }]
|
||||
// }, // tekst
|
||||
|
||||
// // Ukryj numery dróg (E40, A4, 92 itp.)
|
||||
// {
|
||||
// featureType: "road",
|
||||
// elementType: "labels.icon",
|
||||
// stylers: [{
|
||||
// visibility: "off"
|
||||
// }]
|
||||
// }, // Ukryj ikony dróg
|
||||
// {
|
||||
// featureType: "road",
|
||||
// elementType: "labels.text",
|
||||
// stylers: [{
|
||||
// visibility: "off"
|
||||
// }]
|
||||
// }, // Ukryj tekst dróg
|
||||
|
||||
// {
|
||||
// featureType: "water",
|
||||
// elementType: "geometry",
|
||||
// stylers: [{
|
||||
// color: "#F4F4F4"
|
||||
// }]
|
||||
// }, // Woda
|
||||
// {
|
||||
// featureType: "landscape",
|
||||
// elementType: "geometry",
|
||||
// stylers: [{
|
||||
// color: "#F4F4F4"
|
||||
// }]
|
||||
// }
|
||||
// ]
|
||||
};
|
||||
|
||||
const map1 = new google.maps.Map(document.getElementById("map-klienci-indywidualni"), mapOptions);
|
||||
@@ -1766,16 +1725,6 @@ $klienci_instytucjonalni = [
|
||||
clients: klienciInstytucjonalni,
|
||||
mapWrapperId: "klienci-instytucjonalni"
|
||||
});
|
||||
|
||||
// const overlayMask = new google.maps.Polygon({
|
||||
// paths: [fullScreenPolygon, polandHolePolygon],
|
||||
// strokeOpacity: 0,
|
||||
// strokeWeight: 0,
|
||||
// fillColor: "#000",
|
||||
// fillOpacity: 0.6,
|
||||
// map: map2,
|
||||
// clickable: false,
|
||||
// });
|
||||
}
|
||||
|
||||
function setupMapSection({
|
||||
@@ -1791,6 +1740,8 @@ $klienci_instytucjonalni = [
|
||||
const bounds = new google.maps.LatLngBounds();
|
||||
const markers = [];
|
||||
|
||||
let selectedLocation = null;
|
||||
|
||||
locations.forEach(loc => {
|
||||
if (loc.position && loc.position.lat && loc.position.lng) {
|
||||
const marker = new google.maps.Marker({
|
||||
@@ -1801,28 +1752,38 @@ $klienci_instytucjonalni = [
|
||||
});
|
||||
|
||||
marker.addListener("click", () => {
|
||||
// if(loc.id == selectedLocation) {
|
||||
// return;
|
||||
// } else {
|
||||
// selectedLocation = null;
|
||||
// }
|
||||
|
||||
const voivKey = Object.keys(voivodeships).find(k => voivodeships[k].id === loc.voivodeship.id);
|
||||
if (voivKey) {
|
||||
|
||||
select.value = voivodeships[voivKey].name;
|
||||
renderList(voivodeships[voivKey].name);
|
||||
|
||||
setTimeout(() => {
|
||||
const itemEl = listContainer.querySelector(`.location-item[data-id="${loc.id}"]`);
|
||||
if (itemEl) {
|
||||
const itemRect = itemEl.getBoundingClientRect();
|
||||
const containerRect = listContainer.getBoundingClientRect();
|
||||
const offsetTop = itemRect.top - containerRect.top;
|
||||
console.log('itemRect.top: ', itemRect.top);
|
||||
console.log('containerRect.top: ', containerRect.top);
|
||||
console.log('offsetTop: ', offsetTop);
|
||||
const containerTop = listContainer.getBoundingClientRect().top;
|
||||
const itemTop = itemEl.getBoundingClientRect().top;
|
||||
const scrollOffset = listContainer.scrollTop + (itemTop - containerTop);
|
||||
|
||||
if (offsetTop != 0) {
|
||||
listContainer.scrollTo({
|
||||
top: offsetTop,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
if(loc.id == selectedLocation) {
|
||||
itemEl.classList.add('highlight');
|
||||
setTimeout(() => itemEl.classList.remove('highlight'), 1000);
|
||||
return;
|
||||
} else {
|
||||
selectedLocation = loc.id;
|
||||
}
|
||||
|
||||
listContainer.scrollTo({
|
||||
top: scrollOffset,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
|
||||
itemEl.classList.add('highlight');
|
||||
setTimeout(() => itemEl.classList.remove('highlight'), 1000);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user