https://dosduendes-lp.netlify.app/assets/js/function.js

1var winmed = window.matchMedia("(max-width: 768px)");
2if (winmed.matches) {
3  $(".toForm").click(function () {
4    $('html, body').animate({
5      /*scrollTop: $("#formulario").offset().top*/
6      scrollTop: $(".formBox").offset().top
7    }, 3000);
8  });
9
10  $(".buttonHome").click(function () {
11    $('html, body').animate({
12      scrollTop: $("#home").offset().top
13    }, 3000);
14  });
15
16  mapSelectMobile();
17  setNameTipologias();
18} else {
19  $(".toForm").click(function () {
20    $('html, body').animate({
21      scrollTop: $(".section-eight").offset().top
22    }, 3000);
23  });
24
25  $(".buttonHome").click(function () {
26    $('html, body').animate({
27      scrollTop: $("#home").offset().top
28    }, 3000);
29  });
30  mapSelectDesktop();
31}
32//mapSelect();
33hoverProyect();
34
35function mapSelectDesktop() {
36  var dosduendes = document.getElementById('dosduendes');
37  var agave = document.getElementById('agave');
38  var mapIframe = document.getElementById('map');
39  var mapIframeDosduendes = '<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d899.1056446569991!2d-100.3716903!3d25.657283000000003!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8662bde89b1c38bd%3A0x70bed107d6b86dfc!2sDosduendes%20Calzada!5e0!3m2!1ses!2smx!4v1694058297774!5m2!1ses!2smx" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>';
40  var mapIframeAgave = '<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3596.5264311692376!2d-100.3485395!3d25.6538384!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8662bf88da24180b%3A0xb6433cc117a329e5!2sAGAVE%20Desarrollos!5e0!3m2!1ses!2smx!4v1693292994170!5m2!1ses!2smx" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>'
41  var pDosduendes = document.querySelector('#dosduendes h3');
42  var h3Dosduendes = document.querySelector('#dosduendes p');
43  var pAgave = document.querySelector('#agave p');
44  var h3Agave = document.querySelector('#agave h3');
45
46  mapIframe.innerHTML = mapIframeDosduendes;
47  pDosduendes.classList.add('mapActiveP');
48  h3Dosduendes.classList.add('mapActiveP');
49
50  dosduendes.addEventListener('click', function (e) {
51    e.preventDefault();
52    mapIframe.innerHTML = mapIframeDosduendes;
53    pDosduendes.classList.add('mapActiveP');
54    h3Dosduendes.classList.add('mapActiveP');
55    pAgave.classList.remove('mapActiveP');
56    h3Agave.classList.remove('mapActiveP');
57  });
58  agave.addEventListener('click', function (e) {
59    e.preventDefault();
60    mapIframe.innerHTML = mapIframeAgave;
61    pAgave.classList.add('mapActiveP');
62    h3Agave.classList.add('mapActiveP');
63    pDosduendes.classList.remove('mapActiveP');
64    h3Dosduendes.classList.remove('mapActiveP');
65  });
66}
67
68function mapSelectMobile() {
69  var dosduendes = document.getElementById('dosduendes');
70  var agave = document.getElementById('agave');
71  var mapIframe = document.getElementById('mapMovile');
72  var mapIframeDosduendes = '<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d899.1056446569991!2d-100.3716903!3d25.657283000000003!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8662bde89b1c38bd%3A0x70bed107d6b86dfc!2sDosduendes%20Calzada!5e0!3m2!1ses!2smx!4v1694058297774!5m2!1ses!2smx" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>';
73  var mapIframeAgave = '<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3596.5264311692376!2d-100.3485395!3d25.6538384!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8662bf88da24180b%3A0xb6433cc117a329e5!2sAGAVE%20Desarrollos!5e0!3m2!1ses!2smx!4v1693292994170!5m2!1ses!2smx" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>'
74  mapIframe.innerHTML = mapIframeDosduendes;
75
76  var pDosduendes = document.querySelector('.content-mobile #dosduendes h3');
77  var h3Dosduendes = document.querySelector('.content-mobile #dosduendes p');
78  var pAgave = document.querySelector('.content-mobile #agave p');
79  var h3Agave = document.querySelector('.content-mobile #agave h3');
80
81  pDosduendes.classList.add('mapActiveP');
82  h3Dosduendes.classList.add('mapActiveP');
83
84  dosduendes.addEventListener('click', function (e) {
85    e.preventDefault();
86    mapIframe.innerHTML = mapIframeDosduendes;
87    pDosduendes.classList.add('mapActiveP');
88    h3Dosduendes.classList.add('mapActiveP');
89    pAgave.classList.remove('mapActiveP');
90    h3Agave.classList.remove('mapActiveP');
91  });
92  agave.addEventListener('click', function (e) {
93    e.preventDefault();
94    mapIframe.innerHTML = mapIframeAgave;
95    pAgave.classList.add('mapActiveP');
96    h3Agave.classList.add('mapActiveP');
97    pDosduendes.classList.remove('mapActiveP');
98    h3Dosduendes.classList.remove('mapActiveP');
99  });
100}
101
102function hoverProyect() {
103  var imgHoverLeft = document.querySelector('.img-hover-left');
104  var imgHoverRight = document.querySelector('.img-hover-right');
105  var leftInformation = document.querySelector('#leftInformation');
106  var rigthInformation = document.querySelector('#rigthInformation');
107
108  imgHoverLeft.addEventListener('mouseenter', (e) => {
109    leftInformation.classList.add('visible');
110    leftInformation.classList.remove('notVisible');
111  });
112
113  leftInformation.addEventListener('mouseleave', (e) => {
114    leftInformation.classList.add('notVisible');
115    leftInformation.classList.remove('visible');
116  });
117
118  imgHoverRight.addEventListener('mouseenter', (e) => {
119    rigthInformation.classList.add('visible');
120    rigthInformation.classList.remove('notVisible');
121  });
122
123  rigthInformation.addEventListener('mouseleave', (e) => {
124    rigthInformation.classList.add('notVisible');
125    rigthInformation.classList.remove('visible');
126  });
127}
128
129function setNameTipologias() {
130  var tipologiaA = document.getElementById("tipologiaA-tab");
131  var tipologiaB = document.getElementById("tipologiaB-tab");
132  var tipologiaC = document.getElementById("tipologiaC-tab");
133  var tipologiaD = document.getElementById("tipologiaD-tab");
134  var tipologiaE = document.getElementById("tipologiaE-tab");
135
136  tipologiaA.innerHTML = "A" + '<br>' + "140 m2";
137  tipologiaB.innerHTML = "B" + '<br>' + " 135 m2";
138  tipologiaC.innerHTML = "C" + '<br>' + " 135 m2";
139  tipologiaD.innerHTML = "D" + '<br>' + " 144 m2";
140  tipologiaE.innerHTML = "E" + '<br>' + " 135 m2";
141}