https://pressroll.ru/local/templates/pressroll/assets/js/pr_tabs.js?175519089413193

1function pressRollGenTabsFromComponents () {
2
3	/** Создание вкладок из компонентов */
4	var arrTabClick = new Array();
5	var nTab = 0;
6	var nGroup = nGroupBefore = "";
7	var nGroupTabs = "";
8	[...document.querySelectorAll('[data-tab-group]')].forEach((element) => {
9		nTab++;
10		var tabGroup = element.getAttribute("data-tab-group"); nGroup = tabGroup;
11		var tabName = element.getAttribute("data-tab-name");
12		var tabImg = element.getAttribute("data-tab-img");
13		var tabClick = element.getAttribute("data-tab-click");
14		var tabActive = element.getAttribute("data-tab-active");
15			if(tabActive == "Y") { arrTabClick.push('g' + nGroup + '-n' + nTab); } // g555-n2 
16		var tabClickSelector = element.getAttribute("data-tab-click-selector");
17		var tabIncParam1 = element.getAttribute("data-tab-calc-param1");
18		var tabIncParam2 = element.getAttribute("data-tab-calc-param2");
19		var tabIncParam3 = element.getAttribute("data-tab-calc-param3");
20		var tabIncParam4 = element.getAttribute("data-tab-calc-param4");
21		var tabIncParam5 = element.getAttribute("data-tab-calc-param5");
22
23		if(nTab == 1){ nGroupBefore = tabGroup; }
24		element.classList.add("tab-wrp");
25
26		// вставка секции для кнопок переключения и блока вкладок
27		if((nTab == 1) || (nGroupBefore != tabGroup)){
28			var secBtnsTab = document.createElement("section");
29			secBtnsTab.classList.add("box-tabs-group");
30			secBtnsTab.classList.add("group"+nGroup);
31
32			var parentDiv = element.parentNode;
33			parentDiv.insertBefore(secBtnsTab, element);
34		}
35
36		var groupWrp = document.querySelector('.group' + nGroup);
37
38		if((nTab == 1) || (nGroupBefore != tabGroup)){
39			// встака секции для кнопок вкладок
40			var secBtnsWrp = document.createElement("div");
41				secBtnsWrp.classList.add("btns-wrp");
42				groupWrp.appendChild(secBtnsWrp);
43
44			// встака секции для кнопок вкладок для малых экранов
45			var secBtnsMobWrp = document.createElement("div");
46				secBtnsMobWrp.classList.add("btns-wrp-mob");
47				secBtnsMobWrp.classList.add("sidebar");
48				groupWrp.appendChild(secBtnsMobWrp);
49
50				var groupBtnsMobWrp = groupWrp.querySelector('.btns-wrp-mob');
51
52				var secBtnsMobTitle = document.createElement("div");
53					secBtnsMobTitle.classList.add("tabs-nav-title-wrp");
54					groupBtnsMobWrp.appendChild(secBtnsMobTitle);
55
56				var groupBtnsMobTitleWrp = groupWrp.querySelector('.tabs-nav-title-wrp');
57				var secBtnsMobTitleText = document.createElement("span");
58					secBtnsMobTitleText.classList.add("title-btn");
59					groupBtnsMobTitleWrp.appendChild(secBtnsMobTitleText);
60
61				var secBtnsMobTitleBtn = document.createElement("span");
62					secBtnsMobTitleBtn.classList.add("toggle-btn");
63					secBtnsMobTitleBtn.innerHTML = '<span class="arrow-parent-btn"> <span>-</span><span>&gt;</span> </span>';
64					groupBtnsMobTitleWrp.appendChild(secBtnsMobTitleBtn);
65
66				var secBtnsMobTitleUL = document.createElement("ul");
67					secBtnsMobTitleUL.classList.add("sidebar-menu");
68					groupBtnsMobWrp.appendChild(secBtnsMobTitleUL);
69
70				var groupBtnsMobWrpUL = groupBtnsMobWrp.querySelector('.sidebar-menu');
71				var secBtnsMobTitleULinner = document.createElement("ul");
72					secBtnsMobTitleULinner.classList.add("mob-btns-list");
73					groupBtnsMobWrpUL.appendChild(secBtnsMobTitleULinner);
74
75				var groupBtnsMobWrpULinner = groupBtnsMobWrpUL.querySelector('ul');
76
77			// встака секции для вкладок
78			var secTabsWrp = document.createElement("div");
79				secTabsWrp.classList.add("tabs-wrp");
80				groupWrp.appendChild(secTabsWrp);
81		}
82		
83
84		// наполнение кнопками секции
85		var groupBtnsWrp = groupWrp.querySelector('.btns-wrp');
86		var groupBtnsMobWrp = groupWrp.querySelector('.mob-btns-list');
87		// смотрим была ли вкладка с таким названием
88		var btnsAll = groupBtnsWrp.querySelectorAll('.btn-tab');
89		var gnBtn = gnBtnActiv = "";
90		for (var j = 0; j <= btnsAll.length; j++) {
91			var curBtn = btnsAll[j];
92			if(curBtn){
93				//console.log(curBtn.innerHTML);
94				//console.log(tabName);
95				//console.log('<img src="' + tabImg + '"><p>' + tabName + '</p>');
96				//console.log("===========");
97				if((curBtn.innerHTML == tabName) || (curBtn.innerHTML == '<img src="' + tabImg + '"><p>' + tabName + '</p>')){
98					gnBtn = curBtn.getAttribute("data-btn-tab-gn");
99					if(curBtn.classList.contains("active")) {
100						gnBtnActiv = true;
101					}
102				} 
103			}
104		};
105
106		if(gnBtn == ""){
107			// добавляем новую
108				//для больших экранов
109				var sTab = document.createElement("span");
110				sTab.classList.add("btn-tab");
111
112				sTab.classList.add("btn-tab-" + nTab);
113				if((nTab == 1) || (nGroupBefore != tabGroup)){
114					sTab.classList.add("active");
115					sTab.classList.add("border-o");
116				}
117				sTab.setAttribute("data-btn-tab-g", 'g' + nGroup);
118				sTab.setAttribute("data-btn-tab-gn", 'g' + nGroup + '-n' + nTab);
119				if(tabImg != ""){
120					sTab.classList.add("tab-img");
121					sTab.innerHTML = '<img src="' + tabImg + '"><p>' + tabName + '</p>';
122				}else{
123					sTab.innerHTML = tabName;
124				}
125
126				sTab.setAttribute("data-btn-tab-click", tabClick);				
127				sTab.setAttribute("data-btn-tab-click-selector", tabClickSelector);		
128
129				if(tabIncParam1) sTab.setAttribute("data-tab-calc-param1", tabIncParam1);				
130				if(tabIncParam2) sTab.setAttribute("data-tab-calc-param2", tabIncParam2);				
131				if(tabIncParam3) sTab.setAttribute("data-tab-calc-param3", tabIncParam3);				
132				if(tabIncParam4) sTab.setAttribute("data-tab-calc-param4", tabIncParam4);				
133				if(tabIncParam5) sTab.setAttribute("data-tab-calc-param5", tabIncParam5);				
134
135				groupBtnsWrp.appendChild(sTab);
136
137				//для малых экранов
138				var sPan = document.createElement("span");
139				sPan.classList.add("btn-tab");
140				sPan.setAttribute("data-btn-tab-g", 'g' + nGroup);
141				sPan.setAttribute("data-btn-tab-gn", 'g' + nGroup + '-n' + nTab);
142					sPan.setAttribute("data-btn-tab-click", tabClick);				
143					sPan.setAttribute("data-btn-tab-click-selector", tabClickSelector);	
144						if(tabIncParam1) sPan.setAttribute("data-tab-calc-param1", tabIncParam1);				
145						if(tabIncParam2) sPan.setAttribute("data-tab-calc-param2", tabIncParam2);				
146						if(tabIncParam3) sPan.setAttribute("data-tab-calc-param3", tabIncParam3);				
147						if(tabIncParam4) sPan.setAttribute("data-tab-calc-param4", tabIncParam4);				
148						if(tabIncParam5) sPan.setAttribute("data-tab-calc-param5", tabIncParam5);	
149				var dropdownSideBarMenuWrp = groupWrp.querySelector(".title-btn"); 
150				//sPan.innerHTML = tabName;
151
152				if(tabImg != ""){
153					sPan.classList.add("tab-img");
154					sPan.innerHTML = '<img src="' + tabImg + '"><p>' + tabName + '</p>';
155				}else{					
156					sPan.innerHTML = tabName;
157				}
158				var sLiTab = document.createElement("li");
159				if((nTab == 1) || (nGroupBefore != tabGroup)){
160					sLiTab.classList.add("selected");
161					dropdownSideBarMenuWrp.innerHTML = tabName;
162				}				
163				sLiTab.appendChild(sPan);
164				groupBtnsMobWrp.appendChild(sLiTab);
165
166				element.setAttribute("data-tab-gn", 'g' + nGroup + '-n' + nTab);
167				element.setAttribute("data-tab-g", 'g' + nGroup );
168				
169				
170		}else{
171			// связываем с сущестующей
172				element.setAttribute("data-tab-gn", gnBtn);
173				element.setAttribute("data-tab-g", 'g' + nGroup );
174				if(gnBtnActiv != "") {
175					element.classList.add("active");
176				}
177		}
178		
179		if((nTab == 1) || (nGroupBefore != tabGroup)){
180			element.classList.add("active");
181		}
182		var groupTabsWrp = groupWrp.querySelector('.tabs-wrp');
183			groupTabsWrp.appendChild(element);
184
185		nGroupBefore = tabGroup;
186	});
187
188
189	[...document.querySelectorAll('.box-tabs-group .btn-tab')].forEac

189h(
190		(element) => {
191			element.onclick = function(){
192				var tabG = element.getAttribute("data-btn-tab-g");
193				var tabGN = element.getAttribute("data-btn-tab-gn");
194				var tabTx = element.innerText;
195
196				var parentDiv = element.parentNode;
197				if(parentDiv.parentNode.classList.contains("mob-btns-list")){					
198					var parentDivTitle = element.parentNode.parentNode.parentNode.parentNode;
199					var titleTextWrp = parentDivTitle.querySelector(".title-btn"); 
200					titleTextWrp.innerHTML = tabTx;
201
202					var LisAll = parentDivTitle.querySelectorAll('.mob-btns-list li');
203					for (var j = 0; j <= LisAll.length; j++) {
204						var curLi = LisAll[j];
205						if(curLi){ curLi.classList.remove("selected");  }
206					};
207					element.parentNode.classList.add("selected");
208					titleTextWrp.click();
209				}else{
210					var btnsAll = parentDiv.querySelectorAll('.btn-tab');
211					for (var j = 0; j <= btnsAll.length; j++) {
212						var curBtn = btnsAll[j];
213						if(curBtn){ curBtn.classList.remove("active"); curBtn.classList.remove("border-o"); }
214					};
215					element.classList.add("active");
216					for (var j = 0; j <= btnsAll.length; j++) {
217						var curBtn = btnsAll[j];
218						if(curBtn){ curBtn.classList.add("border-o"); }
219						if(curBtn.classList.contains("active")) {j = 1000;}
220					};					
221				}
222
223				var secAll = document.querySelectorAll('[data-tab-g="'+tabG+'"]');
224				for (var j = 0; j <= secAll.length; j++) {
225					var secCur = secAll[j];
226					if(secCur){ secCur.classList.remove("active"); }
227				};
228
229				var secAllActive = document.querySelectorAll('[data-tab-gn="'+tabGN+'"]');
230				for (var j = 0; j <= secAllActive.length; j++) {
231					var secCur = secAllActive[j];
232					if(secCur){ secCur.classList.add("active"); }
233				};
234
235				// Ajax
236				var tabClick = element.getAttribute("data-btn-tab-click");
237				var tabClickSelector = element.getAttribute("data-btn-tab-click-selector");
238					var tabParam1 = element.getAttribute("data-tab-calc-param1"); if(!tabParam1) {tabParam1 = "";}
239					var tabParam2 = element.getAttribute("data-tab-calc-param2"); if(!tabParam2) {tabParam2 = "";}
240					var tabParam3 = element.getAttribute("data-tab-calc-param3"); if(!tabParam3) {tabParam3 = "";}
241					var tabParam4 = element.getAttribute("data-tab-calc-param4"); if(!tabParam4) {tabParam4 = "";}
242					var tabParam5 = element.getAttribute("data-tab-calc-param5"); if(!tabParam5) {tabParam5 = "";}
243				if(tabClick && tabClickSelector)
244				getAjaxFileContent (tabClick, tabClickSelector, tabParam1, tabParam2, tabParam3, tabParam4, tabParam5);
245
246
247			};
248		}
249	);
250
251
252	[...document.querySelectorAll('.box-tabs-group .btn-tab')].forEach(
253		(element) => {	
254			if(element.classList.contains("active")){					
255				element.click();
256				//console.log(element);
257			}			
258		}
259	);
260	
261
262	if(arrTabClick){		
263		//console.log(arrTabClick);
264		for (var a = 0; a <= arrTabClick.length; a++) {
265			var secCur = arrTabClick[a];
266			if(secCur){ 
267				var secActive = document.querySelector('.btns-wrp [data-btn-tab-gn="'+secCur+'"]');
268				if(secActive){	
269					secActive.click();
270				}
271				var secActiveMob = document.querySelector('.btns-wrp-mob [data-btn-tab-gn="'+secCur+'"]');
272				if(secActiveMob){	
273					secActiveMob.click();
274				}
275			}
276		};
277	}
278
279}
280
281document.addEventListener('DOMContentLoaded', function() {
282
283	pressRollGenTabsFromComponents();
284
285	document.querySelectorAll('.tabs-nav-title-wrp').forEach(nav => {		
286		var dropdownSideBarMenuWrp = document.querySelectorAll(".tabs-nav-title-wrp"); 
287		if (nav)
288			var prnt = nav.parentNode; 			
289		if (prnt) {
290			if (innerWidth < 741) {
291				nav.addEventListener("click", function eventClickDDMenu ( event ) {				
292					var menuWrp = prnt.querySelector(".sidebar-menu"); 
293					if(prnt.classList.contains('opened')){	
294						prnt.classList.remove('opened'); 
295						menuWrp.style.maxHeight = `0px`;
296					}else{
297						prnt.classList.add('opened'); 		
298						menuWrp.style.maxHeight = `${menuWrp.scrollHeight}px`;
299					}
300				}, false);
301				var menuWrp = prnt.querySelector(".sidebar-menu"); 
302				menuWrp.style.maxHeight = `0px`;
303			}else{
304				var menuWrp = prnt.querySelector(".sidebar-menu"); 
305				menuWrp.style.maxHeight = `${menuWrp.scrollHeight}px`;
306			}
307		}
308	});
309
310}, false);
311
312
313
314
315/** Ajax Inser Comp */
316function getAjaxFileContent (url, selector, tabParam1, tabParam2, tabParam3, tabParam4, tabParam5) {
317    var innerTo = document.querySelector(selector);
318    if(innerTo) {
319        innerTo.innerHTML = "";
320        var innerToAll = innerTo.parentNode.parentNode.parentNode.querySelectorAll(".ajax-insert-wrp"); 
321        for (let indx = 0; indx < innerToAll.length; indx++) {
322            var wrp = innerToAll[indx];
323            wrp.innerHTML = "<span class='ajaxinsert-area'></span>";
324            //console.log("clear");
325        }
326    }
327    BX.ajax({
328        url: url,
329        data: { type: 'ajax', param1: tabParam1, param2: tabParam2, param3: tabParam3, param4: tabParam4, param5: tabParam5}, 
330        method: 'POST',
331        dataType: 'html',
332        timeout: 30,
333        async: true,
334        processData: true,
335        scriptsRunFirst: false,
336        emulateOnload: true,
337        start: true,
338        cache: false,
339        onsuccess: function(data){
340            //console.log(data);
341            var innerTo = document.querySelector(selector);
342            if(innerTo) {
343                innerTo.innerHTML = data; 
344            }
345        },
346        onfailure: function(){
347            console.log("Err request");
348        }
349    });
350}