https://ponyexpress.kz/bitrix/js/n7.googletranslate/script.js?1790416490

1class LangModule {
2	constructor(options) {
3
4		this.name = options.name;
5		this.templates = options.templates;
6		this.params = options.params;
7
8		const parsed = tldts.parse(window.location.hostname);
9
10		this.googleTranslateConfig = {
11			lang: options.params.mainLang,
12			langFirstVisit: options.params.mainLang,
13			domain: parsed.domain
14		};
15
16
17		
18
19
20		this.init();
21
22	}
23
24	async init() {
25
26		await this.insertFixedLanguageSelector(this.params.themeOpts[1]);
27		await this.insertHeaderLanguageSelector(this.params.themeOpts[2]);
28		await this.insertMobileLanguageSelector(this.params.themeOpts[3]);
29		if (Cookies.get("showLangModal") != "Y" && this.params.themeOpts[4]['ACTIVE'] === "Y") {
30			await this.insertModalLanguageSelector(this.params.themeOpts[4]).then(
31				(modal = document.getElementById('lang-modal-wrapper'), closeModalBtns = document.getElementById('lang-modal-close'), modalOverlay = document.querySelector('.lang-modal-overlay')) => {
32
33					Cookies.set("showLangModal", "Y");
34
35					const modalTitle = this.params.themeOpts[4]['OPT4'][this.params.mainLang];
36					if (modalTitle) document.querySelector('#lang-modal-wrapper h2').textContent = modalTitle;
37
38					closeModalBtns.addEventListener('click', () => {
39						modal.style.display = 'none';
40					});
41
42					modalOverlay.addEventListener('click', () => {
43						modal.style.display = 'none';
44					});
45
46				}
47			);
48		}
49
50		this.preventMobileMenuCloseOnSwipe();
51
52
53
54	}
55
56
57
58
59	async insertTemplate(templateURL, selector, langs, shortName = false) {
60		try {
61			const response = await fetch(templateURL);
62			let templateHTML = await response.text();
63			const place = document.querySelector(selector);
64			let langList, liItems, langName, currentLang;
65
66
67
68			currentLang = (shortName) ? langs[this.params.mainLang]['SHORT_NAME'] : langs[this.params.mainLang]['NAME'];
69
70			for (let key in langs) {
71				langName = (shortName) ? langs[key]['SHORT_NAME'] : langs[key]['NAME'];
72				liItems = "<li data-google-lang='" + key + "'>" + langName + "</li>";
73				langList = (langList) ? langList + liItems : liItems;
74
75			}
76
77
78			templateHTML = templateHTML.replace(/#CURRENT_LANG#/g, currentLang);
79			templateHTML = templateHTML.replace(/#LANGS_LIST#/g, langList);
80
81			if (place && templateHTML) {
82				place.insertAdjacentHTML('afterbegin', templateHTML);
83			}
84
85			const code = this.translateGetCode(this.googleTranslateConfig);
86			this.translateHtmlHandler(code);
87
88		} catch (error) {
89			console.error(`Ошибка при загрузке и вставке шаблона ${templateURL} в селектор ${selector} : ${error}`);
90		}
91	}
92
93	async insertHeaderLanguageSelector(options) {
94		if (options['ACTIVE'] === "Y" && options['OPT3']) {
95			await this.insertTemplate(this.templates.header, options['OPT3'], this.params.languages, true);
96			this.addCss("#header-language-selector-v1 .current-lang {color:" + options['OPT1'] + " !important;}");
97			this.addCss("#header-language-selector-v1 ul li {color:" + options['OPT1'] + " !important;}");
98			this.addCss("#header-language-selector-v1 ul li:hover {background:" + options['OPT7'] + " !important; color:" + options['OPT2'] + " !important;}");
99			this.addCss("#header-language-selector-v1  {background:" + options['OPT4'] + " !important;}");
100			this.addCss("#header-language-selector-v1 ul  {background:" + options['OPT5'] + " !important;}");
101			this.addCss("#header-language-selector-v1 svg {color:" + options['OPT6'] + " !important;}");
102			this.addCss("#header-language-selector-v1 svg.arrow {color:" + options['OPT1'] + " !important;}");
103		}
104	}
105
106
107	async insertFixedLanguageSelector(options) {
108
109		if (options['ACTIVE'] === "Y") {
110			await this.insertTemplate(this.templates.fixed, "body", this.params.languages);
111
112			if (options['OPT3'] === "left") {
113				document.getElementById("fixed-language-selector").classList.remove("right");
114				document.getElementById("fixed-language-selector").classList.add("left");
115			}
116			else {
117				document.getElementById("fixed-language-selector").classList.remove("left");
118				document.getElementById("fixed-language-selector").classList.add("right");
119			}
120
121
122			this.addCss("#fixed-language-selector .lang-body .hover-drop .wrap:before {border-right-color:" + options['OPT4'] + " !important;}");
123			this.addCss("#fixed-language-selector .lang-body {background-color:" + options['OPT4'] + " !important;}");
124			this.addCss("#fixed-language-selector .lang-body .hover-drop .wrap {background-color:" + options['OPT4'] + " !important;}");
125			this.addCss("#fixed-language-selector .lang-body .hover-drop .wrap ul li {color: " + options['OPT1'] + " 

125!important;}");
126			this.addCss("#fixed-language-selector .lang-body .hover-drop .wrap ul li:hover {color: " + options['OPT7'] + " !important;}");
127			this.addCss("#fixed-language-selector .lang-body:hover {background-color: " + options['OPT2'] + " !important;}");
128			this.addCss("#fixed-language-selector .lang-body svg {color: " + options['OPT5'] + " !important;}");
129			this.addCss("#fixed-language-selector .lang-body:hover svg {color: " + options['OPT6'] + " !important; }");
130
131
132		}
133
134	}
135
136
137
138
139
140	async insertMobileLanguageSelector(options) {
141		if (options['ACTIVE'] === "Y" && options['OPT3']) {
142			await this.insertTemplate(this.templates.mobile, options['OPT3'], this.params.languages, true);
143			this.addCss("#mobile-menu-language-selector ul li {color:" + options['OPT1'] + " !important;}");
144
145			this.addCss("#mobile-menu-language-selector ul li:hover {color:" + options['OPT2'] + " !important;}");
146
147			this.addCss("#mobile-menu-language-selector svg {color:" + options['OPT5'] + " !important;}");
148			this.addCss("#mobile-menu-language-selector {background:" + options['OPT4'] + " !important;}");
149		}
150	}
151
152	async insertModalLanguageSelector(options) {
153
154
155		await this.insertTemplate(this.templates.modal, "body", this.params.languages);
156
157
158		this.addCss("#lang-modal-wrapper ul li {color:" + options['OPT1'] + " !important;}");
159		this.addCss("#lang-modal-wrapper h2 {color:" + options['OPT1'] + " !important;}");
160		this.addCss("#lang-modal-wrapper .close {color:" + options['OPT1'] + " !important;}");
161
162
163		this.addCss("#lang-modal-wrapper ul li:hover  {color:" + options['OPT2'] + " !important;}");
164		this.addCss("#lang-modal-wrapper .close:hover {color:" + options['OPT6'] + " !important;}");
165
166
167		this.addCss("#lang-modal-wrapper .lang-modal-content {background-color:" + options['OPT3'] + " !important;}");
168
169		this.addCss("#lang-modal-wrapper .lang-modal-content ul li {background-color:" + options['OPT5'] + " !important;}");
170		this.addCss("#lang-modal-wrapper .lang-modal-content ul li:hover {background-color:" + options['OPT6'] + " !important;}");
171
172
173		this.addCss("#lang-modal-wrapper ul li.active  {color:" + options['OPT8'] + " !important;}");
174		this.addCss("#lang-modal-wrapper ul li.active  {background-color:" + options['OPT7'] + " !important;}");
175	}
176
177
178	preventMobileMenuCloseOnSwipe() {
179		const mobileMenu = document.querySelector("#mobilemenu");
180		if (mobileMenu) mobileMenu.classList.add("swipeignore");
181	}
182
183
184	addCss(data) {
185		const sheet = document.styleSheets[0];
186		sheet.insertRule(data, sheet.cssRules.length);
187	}
188
189
190	googleTranslateElementInit() {
191		this.translateInit(this.googleTranslateConfig);
192	}
193
194	translateInit(config) {
195		if (config.langFirstVisit && !Cookies.get("googtrans")) {
196			this.translateCookieHandler("/auto/" + config.langFirstVisit);
197		}
198
199		const code = this.translateGetCode(config);
200
201		if (code === config.lang) {
202			this.translateCookieHandler(null, config.domain);
203		}
204
205
206		new google.translate.TranslateElement({
207			pageLanguage: config.lang,
208		});
209
210		this.translateEventHandler("click", "[data-google-lang]", (element) => {
211			this.translateCookieHandler(
212				"/" + config.lang + "/" + element.getAttribute("data-google-lang"),
213				config.domain
214			);
215			window.location.reload();
216		});
217	}
218
219	translateGetCode(config) {
220
221
222		let lang =
223			Cookies.get("googtrans") != undefined && Cookies.get("googtrans") != "null"
224				? Cookies.get("googtrans")
225				: config.lang;
226
227
228		return lang.match(/(?!^\/)[^\/]*$/gm)[0];
229
230
231
232	}
233
234	translateCookieHandler(val, domain) {
235
236
237		
238
239
240		Cookies.set("googtrans", val);
241		Cookies.set("googtrans", val, { domain: "." + document.domain });
242
243		if (domain !== "undefined") {
244			Cookies.set("googtrans", val, { domain: domain });
245			Cookies.set("googtrans", val, { domain: "." + domain });
246		}
247
248
249	}
250
251	translateEventHandler(event, selector, handler) {
252		document.addEventListener(event, (e) => {
253			const el = e.target.closest(selector);
254			if (el) handler(el);
255		});
256	}
257
258	translateHtmlHandler(code) {
259
260
261
262
263
264
265		document.querySelectorAll(`.lang-selector-overlay`).forEach((e) => {
266			const current = e.querySelector(`[data-google-lang="${code}"]`);

267			const currentDisplay = e.querySelector('.current-lang');
268			if (current) {
269
270
271				current.classList.add('active')
272				if (currentDisplay) {
273					const langName = current.textContent;
274					if (langName) currentDisplay.textContent = langName
275				}
276			}
277		});
278
279	}
280}
281
282
283
284
285
286document.addEventListener("DOMContentLoaded", function () {
287
288
289
290	const langModule = new LangModule({
291		name: 'Google Translate',
292		templates: {
293			header: '/lang-module-src/templates/header-template.php',
294			mobile: '/lang-module-src/templates/mobile-template.php',
295			fixed: '/lang-module-src/templates/fixed-template.php',
296			modal: '/lang-module-src/templates/modal-template.php',
297		},
298
299		params: $('#n7GoogleTranslate').data().params
300	});
301
302
303	window.onload = function () {
304		langModule.googleTranslateElementInit();
305	};
306
307
308});