https://carlsbergsverige.se/assets/scripts/modules/language-selector.js

1$(document).ready(function() {
2
3	var carlsbergGroupLanguageSelector = (function() {
4 
5		// 'Private' variables
6		var oldIE = $('html').hasClass('lt-ie9') ? true : false; // Check whether we're dealing with < IE9
7
8		// 'Private' functions
9		function init(){
10			toggleLanguageSelector();
11			splitList();
12			links();
13			scroll();
14			bindTabs();
15		}
16		
17		function toggleLanguageSelector(){
18			$('.js-language-selector').click(function(e){
19				e.preventDefault();
20				$('.overlay-background').fadeToggle(200);
21				$('.language-selector').toggleClass('language-selector--show');
22				$('body').toggleClass('language-selector-open');
23				$('.language-selector').focus();
24			});
25		}
26				
27		function calcNumCols(maxCols, itemsCount, splitThreshold){
28			var numCols = maxCols;
29			for (i = 1; i < itemsCount; i++) {
30				if(itemsCount <= splitThreshold * i){
31					return i;
32				}
33			}
34		}
35
36		function splitList(){
37
38			var container = $('.js-split-list'),
39				listItem = 'li',
40				listClass = 'split-list__columns';
41
42			container.each(function() {
43				var _this = $(this),
44					splitThreshold = _this.data('split-threshold'),
45					maxCols = _this.data('max-cols'),
46					itemsPerCol = new Array(),
47					items = $(this).find(listItem),
48					itemsCount = items.length,
49					numCols = calcNumCols(maxCols, itemsCount, splitThreshold),
50					minItemsPerCol = Math.floor(items.length / numCols),
51        			difference = items.length - (minItemsPerCol * numCols);
52
53				for (var i = 0; i < numCols; i++) {
54					if (i < difference) {
55						itemsPerCol[i] = minItemsPerCol + 1;
56					} else {
57						itemsPerCol[i] = minItemsPerCol;
58					}
59				}
60				for (var i = 0; i < numCols; i++) {
61					$(this).append($('<ul></ul>').addClass(listClass));
62					for (var j = 0; j < itemsPerCol[i]; j++) {
63						var pointer = 0;
64						for (var k = 0; k < i; k++) {
65							pointer += itemsPerCol[k];
66						}
67						$(this).find('.' + listClass).last().append(items[j + pointer]);
68					}
69				}
70			});
71			$('.' + listClass).each(function(){
72				$(this).wrap('<li class="split-list__column"></li>');
73			});
74
75		}
76
77		function links(){
78			$('.js-country-name').click(function(e){
79				e.preventDefault;
80				pop($(this));
81			});
82			$('.js-country-name').keydown(function(e){
83				if (e.which == 13) {
84					pop($(this));
85				}
86			})
87		}
88		
89		function pop(_this){
90			var thisContainer = _this.closest('.language-selector__country');
91			var languages = $('a', thisContainer);
92			var openLangClass = 'language-selector__country-name--show-languages';
93
94			function closeLanguageOptions(){
95				$('.language-selector__country-name', '.language-selector__country-name--show-languages' ).focus();
96				$('.' + openLangClass).removeClass(openLangClass);
97			}
98
99			// Close any open language options
100			closeLanguageOptions();
101
102			// If no languages for a country then we have issues!
103			if(!languages){
104				return;
105			}
106
107			// If only 1 language, act as a link, otherwise open language selector
108			if(languages.length == 1){
109				//console.log(languages.first().attr('href'));
110				var firstLanguage = languages.first();
111				window.open(firstLanguage.attr('href'), firstLanguage.attr('target') || '_self');
112			}else{
113				thisContainer.addClass(openLangClass);
114			}
115
116			$('.js-language-options').click(function(){
117				closeLanguageOptions();
118			});
119		
120		}
121	
122		function bindTabs() {
123			var inputs = $('.language-selector__country-name','.language-selector');
124			var firstTabEl = $('.close-overlay');
125			var lastTabEl = inputs.last();
126				
127			lastTabEl.on('keydown', function (e) {
128			   if ((e.which === 9 && !e.shiftKey)) {
129				   e.preventDefault();
130				   firstTabEl.focus();
131			   }
132			});
133		
134			firstTabEl.on('keydown', function (e) {
135				if ((e.which === 9 && e.shiftKey)) {
136					e.preventDefault();
137					lastTabEl.focus();
138				}
139			});
140		}
141		
142		function scroll(){
143			if(!oldIE){
144				$('.language-selector__scroll').perfectScrollbar();
145			}
146		}
147
148		// 'Public'
149		return {
150			init: init
151		};
152
153	})();
154 
155	carlsbergGroupLanguageSelector.init();
156});