https://maavoimat.fi/o/yja-pv-2020-theme/js/script.js?browserId=chrome&languageId=en_US&t=1790608392000

1document.addEventListener('DOMContentLoaded', function(){
2	// hide selected language from language dropdown
3	var langDropdownUl = document.getElementById('languageSelectionMenu')
4	if (langDropdownUl) {
5		var curLanguage = Liferay.ThemeDisplay.getLanguageId().substring(0,2)
6		var curLanglistElements = langDropdownUl.querySelectorAll('.' + curLanguage)
7
8		if (curLanglistElements.length > 0) {
9			curLanglistElements[0].classList.add('d-none')
10		}
11	}
12
13	// Toggle header OmaIntti field visibility
14	const omaInttiWrapper = document.querySelector('.header__oma-intti');
15	const omaInttiToggler = document.getElementById("omaIntti__toggler");
16	const omaInttiDropdown = document.getElementById("omaIntti-dropdown-content") ;
17
18	if (omaInttiToggler && omaInttiDropdown && omaInttiWrapper) {
19
20		omaInttiToggler.addEventListener('click', () => {
21			omaInttiToggler.setAttribute('aria-expanded', omaInttiToggler.getAttribute('aria-expanded') === 'false' ? 'true' : 'false')
22
23			setTimeout(() => {
24				const state = omaInttiToggler.getAttribute('aria-expanded');
25				if (state === 'true') {
26					omaInttiDropdown.classList.remove('d-none');
27					omaInttiWrapper.classList.add('header__oma-intti--active');
28
29					handleCloseOmaIntti(omaInttiToggler,omaInttiDropdown,omaInttiWrapper);
30
31				} else {
32					omaInttiDropdown.classList.add('d-none');
33					omaInttiWrapper.classList.remove('header__oma-intti--active');
34				}
35			}, 0)
36
37		})
38	}
39
40	function handleCloseOmaIntti(toggler, dropdown, wrapper ) {
41
42		document.addEventListener('pointerdown', (evt) => {
43			if (!dropdown.contains(evt.target) &&
44				!toggler.contains(evt.target)
45			) {
46				dropdown.classList.add('d-none');
47				wrapper.classList.remove('header__oma-intti--active');
48				toggler.setAttribute('aria-expanded', 'false');
49				toggler.focus()
50			}
51		});
52
53		addEventListener('keydown', (evt) => {
54			if (evt.key === 'Escape') {
55				dropdown.classList.add('d-none');
56				wrapper.classList.remove('header__oma-intti--active');
57				toggler.setAttribute('aria-expanded', 'false');
58				toggler.focus()
59			}
60		});
61	}
62
63
64	// Toggle header search field visibility
65	var headerSearchField = document.getElementById('headerSearchField');
66	if (headerSearchField !== undefined) {
67		const headerSearchElement = document.querySelector('.header__search');
68		const searchContainer = document.querySelector('.search-field__container');
69		const activateButton = document.querySelector('.search-button--activate');
70		const buttons  = searchContainer.querySelectorAll('button')
71		const closeButton = buttons[1]
72		const headerRow = document.getElementById("header__rightColumn")
73		const columns = headerRow.querySelectorAll('.header__item')
74		const logoElement = document.querySelectorAll('.header__column--logo')[0]
75		const mobile = window.matchMedia("(max-width: 480px)")
76
77
78		if (!activateButton && !searchContainer) return;
79
80		activateButton.addEventListener('click', () => {
81			openSearchField(activateButton,searchContainer,headerSearchField);
82		},false);
83
84
85		activateButton.addEventListener('keydown', (event) => {
86			if (event.key === 'Enter') openSearchField(activateButton,searchContainer,headerSearchField);
87		},false);
88
89		closeButton.addEventListener('click', function() {
90			searchContainer.classList.add('d-none');
91			headerSearchField.value = "";
92			activateButton.setAttribute('aria-expanded','false');
93
94			setTimeout(() => {
95				activateButton.focus();
96			},200);
97
98		},false);
99
100		function closeSearchElement(event) {
101			if (!headerSearchElement.contains(event.target)) {
102				searchContainer.classList.add('d-none')
103				headerSearchField.value = ""
104				activateButton.setAttribute('aria-expanded','false');
105			}
106		}
107
108		document.addEventListener('click', (event) => {
109			closeSearchElement(event)
110		});
111
112		document.addEventListener('focusin', (event) => {
113			closeSearchElement(event)
114		});
115
116	}
117
118
119	function openSearchField(toggler,searchContainer,headerSearchField) {
120		const toggleState =  toggler.getAttribute('aria-expanded') === 'false' ? 'true' : 'false';
121
122		setTimeout(() => {
123			toggler.setAttribute('aria-expanded', toggleState);
124			if (toggleState === 'true') {
125				searchContainer.classList.remove('d-none');
126				headerSearchField.focus();
127			} else {
128				searchContainer.classList.add('d-none');
129				headerSearchField.value = "";
130			}
131		},100);
132	}
133
134
135	// Toggle header language selector
136	var headerLanguageButton = document.getElementById('language__toggler')
137	if (headerLanguageButton !== undefined) {
138		var parent = headerLanguageButton.parentElement
139		var dropdown = parent.querySelectorAll('.language__dropdown')[0]
140
141		headerLanguageButton.addEventListener('click',function () {
142
143			var ariaExpanded = headerLanguageButton.getAttribute('aria-expanded')
144

145			if (ariaExpanded === 'false') {
146				headerLanguageButton.setAttribute('aria-expanded','true')
147				dropdown.classList.remove('d-none')
148				dropdown.setAttribute('aria-hidden', 'false')
149
150				setTimeout(function(){
151					var ul = document.getElementById('languageSelectionMenu')
152					var focusable = ul.querySelectorAll('a')
153					focusable[0].focus()
154					navigateList(focusable,ul)
155				}, 300)
156
157			} else {
158				headerLanguageButton.setAttribute('aria-expanded','false')
159				dropdown.classList.add('d-none')
160				headerLanguageButton.focus()
161				dropdown.setAttribute('aria-hidden', 'false')
162			}
163
164
165		},false)
166
167		document.addEventListener("click", langugeSelectorClickOutside, false);
168		document.addEventListener('keydown', langugeSelectorloseByEsc, false);
169	}
170
171	function langugeSelectorClickOutside(e) {
172		var headerLanguageButton = document.getElementById('language__toggler')
173		if (headerLanguageButton !== undefined) {
174			var parent = headerLanguageButton.parentElement
175			var inside = parent.contains(e.target);
176
177			if (!inside) {
178				headerLanguageButton.setAttribute('aria-expanded','false')
179				dropdown.classList.add('d-none')
180				dropdown.setAttribute('aria-hidden', 'false')
181			}
182		}
183	}
184
185	function langugeSelectorloseByEsc(e) {
186		var key = e.key;
187		if (key === "Escape") {
188			var headerLanguageButton = document.getElementById('language__toggler')
189			if (headerLanguageButton !== undefined) {
190				headerLanguageButton.setAttribute('aria-expanded','false')
191				dropdown.classList.add('d-none')
192				dropdown.setAttribute('aria-hidden', 'false')
193			}
194		}
195	}
196
197	// Toggle visibility of sites menu
198	var sitesDropdownContainer = document.getElementById('sites-menu')
199	if (sitesDropdownContainer != undefined) {
200		var sitesToggleButton = sitesDropdownContainer.querySelectorAll('button')[0]
201		var sitesDropdown = sitesDropdownContainer.querySelectorAll('.sites-menu__dropdown')[0]
202		var focusable = sitesDropdown.querySelectorAll('[role="list"]')[0]
203		sitesToggleButton.addEventListener('click',function (){
204			var ariaExpanded = sitesToggleButton.getAttribute('aria-expanded')
205			if (ariaExpanded === 'false') {
206				sitesToggleButton.setAttribute('aria-expanded', 'true')
207				sitesDropdown.setAttribute('aria-hidden','false')
208				sitesDropdown.removeAttribute('tabIndex')
209				sitesDropdown.classList.remove('d-none')
210				setTimeout(function(){
211					sitesDropdown.classList.add('sites-menu__dropdown--visible')
212				},100)
213				focusable.focus()
214			} else {
215				sitesToggleButton.setAttribute('aria-expanded', 'false')
216				sitesDropdown.setAttribute('aria-hidden','true')
217				sitesDropdown.classList.remove('sites-menu__dropdown--visible')
218				sitesToggleButton.focus()
219				setTimeout(function(){
220					sitesDropdown.classList.add('d-none')
221				},500)
222			}
223		},false)
224
225		document.addEventListener("click", sitesDropdownContainerClickOutside, false);
226		document.addEventListener('keydown', sitesDropdownContainerCloseByEsc, false);
227
228	}
229
230
231	function sitesDropdownContainerClickOutside(e) {
232		var sitesDropdownContainer = document.getElementById('sites-menu')
233		if (sitesDropdownContainer != undefined) {
234			var sitesToggleButton = sitesDropdownContainer.querySelectorAll('button')[0]
235			var sitesDropdown = sitesDropdownContainer.querySelectorAll('.sites-menu__dropdown')[0]
236			var inside = sitesDropdownContainer.contains(e.target);
237
238			if (!inside) {
239				sitesToggleButton.setAttribute('aria-expanded', 'false')
240				sitesDropdown.setAttribute('aria-hidden','true')
241				sitesDropdown.classList.remove('sites-menu__dropdown--visible')
242			}
243		}
244	}
245
246	function sitesDropdownContainerCloseByEsc(e) {
247		var key = e.key;
248		if (key === "Escape") {
249			var headerLanguageButton = document.getElementById('language__toggler')
250			if (sitesDropdownContainer != undefined) {
251				var sitesToggleButton = sitesDropdownContainer.querySelectorAll('button')[0]
252				var sitesDropdown = sitesDropdownContainer.querySelectorAll('.sites-menu__dropdown')[0]
253
254				sitesToggleButton.setAttribute('aria-expanded', 'false')
255				sitesDropdown.setAttribute('aria-hidden','true')
256				sitesDropdown.classList.remove('sites-menu__dropdown--visible')
257			}
258		}
259	}
260
261	// Slide Menu Navigation
262	var navContainer = document.querySelectorAll('.slide-navigation')[0]
263	if (navContainer !== undefined) {
264		var buttons = navContainer.querySelectorAll('.nav_item--toggler')
265		if (buttons.length > 0) {
266			for(var i=0; i < buttons.length; i++) {
267				var button = buttons[i];
268				button.addEventListener('click',function(event) {
269
270					var elem = event.target.parentElement.parentElement;
271
272					if (event.target.closest('.nav_item--toggler')) {
273						elem =  event.target.closest('.nav_item--toggler')
274					}
275
276					var ariaExpanded = elem.getAttribute('aria-expanded')
277					var navgroup = elem.parentElement.querySelectorAll('ul')[0]
278
279
280					if (ariaExpanded === 'false') {
281						elem.setAttribute('aria-expanded', 'true')
282						navgroup.classList.remove('d-none');
283						navgroup.setAttribute('aria-hidden','false')
284						elem.parentElement.classList.add('menu_state--open')
285
286					} else {
287						elem.setAttribute('aria-expanded', 'false')
288						navgroup.classList.add('d-none');
289						elem.parentElement.classList.remove('menu_state--open')
290						navgroup.setAttribute('aria-hidden','true')
291					}
292				},false)
293			}
294		}
295	}
296
297
298
299},false)
300
301function navigateList(focusable, listener) {
302	listener.addEventListener('keydown',function(event){
303		var EVENT_KEY = event.key;
304		var firstFocusable = focusable[0]

305		var lastFocusbale = focusable[focusable.length - 1]
306		var focusIndex = [].indexOf.call(focusable, document.activeElement);
307		var active = document.activeElement
308
309		switch (EVENT_KEY) {
310			case 'ArrowUp':
311				 event.preventDefault();
312				if (active != firstFocusable) {
313					focusable[focusIndex - 1].focus();
314				} else {
315					lastFocusbale.focus()
316				}
317				break;
318			case 'ArrowDown':
319				 event.preventDefault();
320				if (active !== lastFocusbale) {
321					focusable[focusIndex + 1].focus();
322				} else {
323					firstFocusable.focus()
324				}
325				break;
326			case 'ArrowLeft':
327				 event.preventDefault();
328				if (active !== firstFocusable) {
329					focusable[focusIndex - 1].focus();
330				} else {
331					lastFocusbale.focus()
332				}
333				break;
334			case 'ArrowRight':
335				 event.preventDefault();
336				if (active !== lastFocusbale) {
337					focusable[focusIndex + 1].focus();
338				} else {
339					firstFocusable.focus()
340				}
341				break;
342			case 'Up':
343				 event.preventDefault();
344				if (active !== firstFocusable) {
345					focusable[focusIndex - 1].focus();
346				}  else {
347					lastFocusbale.focus()
348				}
349				break;
350			case 'Down':
351				 event.preventDefault();
352				if (active !== lastFocusbale) {
353					focusable[focusIndex + 1].focus();
354				} else {
355					firstFocusable.focus()
356				}
357				break;
358			case 'Left':
359				 event.preventDefault();
360				if (active !== lastFocusbale) {
361					focusable[focusIndex + 1].focus();
362				} else {
363					lastFocusbale.focus()
364				}
365				break;
366			case 'Right':
367				 event.preventDefault();
368				if (active !== lastFocusbale) {
369					focusable[focusIndex + 1].focus();
370				} else {
371					firstFocusable.focus()
372				}
373				break
374			case 'Escape':
375				closeDropdown()
376				break;
377		}
378	},false)
379
380}
381function closeDropdown() {
382	var dropdown = document.getElementById('dropdown-content')
383	var button = document.getElementById('language__toggler')
384
385	dropdown.classList.add('d-none')
386	dropdown.setAttribute('aria-hidden','true')
387	button.setAttribute('aria-expanded','false')
388	button.focus()
389}
390
391// jQery
392jQuery( document ).ready(function() {
393
394
395	jQuery.fn.setAllToMaxHeight = function(){
396	  return this.height(Math.max.apply(this, jQuery.map(this, function(e){ return jQuery(e).outerHeight(false);})));
397	};
398	
399	/* Accordion */
400
401		 jQuery('.yja-accordion').find('.yja-accordion-toggle').on('tap click', function(){
402			 var elem = jQuery(this),
403			 	 parent = elem.closest('.yja-accordion-wrapper');
404				  
405		          elem.find(".icon").toggleClass('icon-chevron-right');
406		          elem.find(".icon").toggleClass('icon-chevron-down');
407		          parent.toggleClass('open');
408		      });
409	
410	/* Add image caption to images with class caption*/
411	jQuery('img.caption, img.caption-right, img.caption-left').each(function() {
412		
413		var item = jQuery(this),
414			marginbottom = item.css('marginBottom'),
415			margintop = item.css('marginTop'),
416			marginleft = item.css('marginLeft'),
417			marginright = item.css('marginRight'),
418			float = item.css('float'),
419			itemClass=' '+item.attr("class"),
420			caption = item.prop('title'),
421			figcaption = "";
422		if (caption!="") {
423			if(float =="left" && marginright=="0px") {
424				marginright="10px";
425			}
426			figcaption = '<figcaption>'+caption+'</figcaption>';
427			item.css({'margin': '0', 'float':'none'});
428			item.wrap('<figure class="image-caption'+itemClass+'" style="float:'+float+'; margin:'+margintop+' '+marginright+' '+marginbottom+' '+marginleft+'; width:'+item.width()+'px;"></figure>'); 
429			item.closest('.image-caption').append(figcaption);
430		}
431	});
432	
433	/* Navigation Sitemap */
434	
435	jQuery("#toggle-sitemap").on("click", function() {
436		var elem = jQuery(this);
437			//icon = elem.find("em");
438			var parent = elem.closest('li');
439			
440			if(parent.length > 0) {
441				if(parent.hasClass('selected')) {
442					parent.removeClass('selected');
443					//icon.removeClass('icon-remove').addClass('icon-caret-down');
444					elem.removeClass('icon-remove');
445					jQuery("#sitemap-nav").hide();
446				} else {
447					parent.addClass('selected');
448					//icon.addClass('icon-remove').removeClass('icon-caret-down');
449					elem.addClass('icon-remove');
450					jQuery("#sitemap-nav").show();
451					jQuery('#sitemap-nav .span2').setAllToMaxHeight();
452				}
453			}
454	});
455	
456	if(jQuery('.owl-carousel').length) { 
457	    var owlAuto = true;
458	    
459		if(jQuery('.owl-carousel').attr('data-autoplay')) {
460			owlAuto = jQuery('.owl-carousel').data('autoplay');
461	    }
462		jQuery(".owl-carousel").owlCarousel({
463	      navigation : true, // Show next and prev buttons
464	      slideSpeed : 300,
465	      paginationSpeed : 400,
466	      lazyLoad : true,
467	      singleItem:true,
468	      stopOnHover:true,
469	      autoPlay:owlAuto
470		  });
471	}
472
473
474	// BACK TO TOP -link functionality
475	var backToTopButton = jQuery("#yjaScrollToTop");
476
477	jQuery(window).scroll(function() {
478		var height = jQuery(window).scrollTop();
479		if (height > 100) {
480			backToTopButton.fadeIn();
481		} else {
482			backToTopButton.fadeOut();
483		}
484	});
485
486	backToTopButton.click(function(event) {
487		event.preventDefault();
488		jQuery("html, body").animate({ scrollTop: 0 }, "slow");
489		return false;

490	});
491
492	// A11Y Enchanments for mobile panels
493	var leftBurger = jQuery("#leftBurger")
494	var rightBurger = jQuery("#rightBurger")
495	var sideBarLeft = jQuery("#sidebarLeft")
496	var sideBarRight = jQuery("#sidebarRight")
497
498	toggleMobilePanels(leftBurger,sideBarLeft)
499	toggleMobilePanels(rightBurger,sideBarRight)
500
501});
502function toggleMobilePanels(button,content) {
503	button.on("click", function() {
504		var ariaExpanded = jQuery(this).attr('aria-expanded')
505		var focusable = content.find("a[href], input[type='text']")
506		if (ariaExpanded == 'false') {
507			jQuery(this).attr('aria-expanded', 'true')
508			content.attr('aria-hidden', 'false')
509			focusable[0].focus()
510		} else {
511			jQuery(this).attr('aria-expanded', 'false')
512			content.attr('aria-hidden', 'true')
513			jQuery(this).focus()
514		}
515	})
516}
517/* Open all mobile navigation elements */
518function toggleMobileNavItems(collapseAllItemsText, hideAllItemsText) {
519	jQuery("#toggle-mobile-nav-items").on("click", function(e) {
520		e.preventDefault();
521		var elem = jQuery(this),
522			slideBar = jQuery('#sidebarRight'),
523			childMenu = slideBar.find('.child-menu');
524		
525		if(elem.hasClass('itemscollapsed')) {
526			elem.find('.toggle-text').text(collapseAllItemsText);
527			elem.removeClass('itemscollapsed');
528			childMenu.closest('.dropdown').removeClass('selected');
529			childMenu.find('.dropdown').removeClass('clicked');
530			elem.find('.toggle-icon i').removeClass('icon-caret-up').addClass("icon-caret-down");
531			slideBar.find('.arrow').removeClass('icon-caret-up').addClass("icon-caret-down");
532			slideBar.find('.arrow-2').removeClass('icon-caret-up').addClass("icon-caret-down");
533			slideBar.find('.child-menu').slideUp();
534		} else {
535			elem.find('.toggle-text').text(hideAllItemsText);
536			elem.addClass('itemscollapsed');
537			childMenu.closest('.dropdown').addClass('selected');
538			childMenu.find('.dropdown').addClass('clicked');
539			elem.find('.toggle-icon i').removeClass('icon-caret-down').addClass("icon-caret-up");
540			slideBar.find('.arrow').removeClass('icon-caret-down').addClass("icon-caret-up");
541			slideBar.find('.arrow-2').removeClass('icon-caret-down').addClass("icon-caret-up");
542			childMenu.slideDown();
543		}
544	
545	});
546}