https://gk-integral.ru/local/templates/redcode_procorporate/compon…/contacts/script.js?16660026714535

1addEventListener('DOMContentLoaded', function() {
2	
3	'use strict';
4
5	let scrollBar = [],
6		contactMap = document.getElementById('contactMap'),
7		sectionNameActive = contactMap.querySelector('.sectionNameActive'),
8		
9		/* city */
10		sectionBlock = contactMap.querySelector('.sectionBlock'),
11			sectionBlockWrapper = sectionBlock.querySelector('.sectionBlockWrapper'),
12			sectionName = sectionBlock.querySelectorAll('.sectionName'),
13		
14		/* address */
15		elementBlock = contactMap.querySelector('.elementBlock'),
16			elementsSectionWrapper = elementBlock.querySelectorAll('.elementsSectionWrapper'),
17		
18		/* modal */
19		modalContact = contactMap.querySelector('#modalContact'),
20			modalClose = modalContact.querySelector('.modalContactClose'),
21			modalName = modalContact.querySelector('div:nth-child(2) > span'),
22			modalPhone = modalContact.querySelector('div:nth-child(3) > span'),
23			modalEmail = modalContact.querySelector('div:nth-child(4)'),
24			modalTime = modalContact.querySelector('div:nth-child(5)');
25
26
27	/* Setup height and event for address */
28	elementsSectionWrapper.forEach(function(elem, index) {
29		let elemSectionList = elem.querySelector('.elementsSectionList'),
30			ratio = elemSectionList.scrollHeight / elemSectionList.offsetHeight,
31			height = elemSectionList.offsetHeight / ratio;
32
33		if(height < elemSectionList.offsetHeight)
34		{
35			scrollBar[index] = [elem.querySelector('.scrollBar_'+ index), ratio];
36			scrollBar[index][0].style.height = (height - 15) + 'px';
37			
38			elemSectionList.addEventListener('scroll', function(){
39				let key = this.getAttribute('data-key');
40
41				scrollBar[key][0].style.transform = 'translateY('+ this.scrollTop / scrollBar[key][1] +'px)';
42			});
43		}
44		
45		if(index)
46			elem.style.display = 'none';
47	});
48	
49	
50	/* Setup height and event for city */
51	let ratio = sectionBlockWrapper.scrollHeight / sectionBlockWrapper.offsetHeight,
52		height = sectionBlockWrapper.offsetHeight / ratio;
53	
54	if(height < sectionBlockWrapper.offsetHeight)
55	{
56		contactSectionScrollBar.style.height = (height - 15) + 'px';
57		
58		sectionBlockWrapper.addEventListener('scroll', function(){
59			contactSectionScrollBar.style.transform = 'translateY('+ this.scrollTop / ratio +'px)';
60		});
61	}
62	
63	
64	sectionNameActive.addEventListener('click', function(event){
65		if(sectionBlock.classList.contains('sectionUp'))
66		{
67			sectionBlock.classList.remove('sectionUp');
68			elementBlock.classList.add('elementUp');
69			this.classList.remove('active');
70		}
71		else
72		{
73			elementBlock.classList.remove('elementUp');
74			this.classList.add('active');
75			sectionBlock.classList.add('sectionUp');
76		}
77	});
78	
79	sectionBlock.addEventListener('click', function(event){
80		if(event.target.classList.contains('sectionName'))
81		{
82			if(!event.target.classList.contains('active'))
83			{
84				for(let i = 0, sectionNameLength = sectionName.length; i < sectionNameLength; i++)
85					sectionName[i].classList.remove('active');
86				
87				event.target.classList.add('active');
88				sectionNameActive.querySelector('span').innerHTML = event.target.innerHTML;
89				
90				for(let i = 0, elementsLength = elementsSectionWrapper.length; i < elementsLength; i++)
91				{
92					if(elementsSectionWrapper[i].getAttribute('data-section') == event.target.getAttribute('data-section'))
93						elementsSectionWrapper[i].style.display = 'block';
94					else
95						elementsSectionWrapper[i].style.display = 'none';
96				}
97			}
98			
99			this.classList.remove('sectionUp');
100			sectionNameActive.classList.remove('active');
101			elementBlock.classList.add('elementUp');
102		}
103	});
104	
105	elementBlock.addEventListener('click', function(event){
106		if(event.target.classList.contains('elementName'))
107		{
108			modalName.innerHTML = event.target.dataset.name;
109			modalPhone.innerHTML = event.target.dataset.phone;
110			
111			if(event.target.dataset.email !== '')
112			{
113				modalEmail.style.display = 'flex';
114				modalEmail.lastElementChild.innerHTML = event.target.dataset.email;
115			}
116			else
117				modalEmail.style.display = 'none';
118			
119			if(event.target.dataset.time !== '')
120			{
121				modalTime.style.display = 'flex';
122				modalTime.lastElementChild.innerHTML = event.target.dataset.time;
123			}
124			else
125				modalTime.style.display = 'none';
126			
127			this.style.display = 'none';
128			modalContact.style.display = 'block';
129		}
130	});
131	
132	modalClose.addEventListener('click', function(event){
133		modalContact.style.display = 'none';
134		elementBlock.style.display = 'block';
135	});
136	
137});