MediaWiki:Common.js: Difference between revisions

← Older edit Newer edit →

@@ Line 256: / Line 256: @@
 			event.preventDefault();
 			toggleClassCategoryAccordion(this);
+		}
+	});
+}() );
+/* Mobile/tablet race culture cards */
+( function () {
+	var cultureCardQuery = window.matchMedia('(max-width: 899px)');
+	function isMobileCitizenCultureLayout() {
+		return cultureCardQuery.matches && $('body').hasClass('skin-citizen');
+	}
+	function initialiseCultureCards() {
+		var isActive = isMobileCitizenCultureLayout();
+		$('.wizlords-culture-card').each(function () {
+			var $card = $(this);
+			var isOpen = $card.hasClass('is-open');
+			if (isActive) {
+				$card
+					.attr('data-wizlords-mobile-culture-card', '1')
+					.attr('role', 'button')
+					.attr('tabindex', '0')
+					.attr('aria-expanded', isOpen ? 'true' : 'false');
+			} else {
+				$card
+					.removeClass('is-open')
+					.removeAttr('data-wizlords-mobile-culture-card')
+					.removeAttr('role')
+					.removeAttr('tabindex')
+					.removeAttr('aria-expanded');
+			}
+		});
+	}
+	function toggleCultureCard(card) {
+		if (!isMobileCitizenCultureLayout()) {
+			return;
+		}
+		var $card = $(card);
+		var isOpen = $card.hasClass('is-open');
+		$card
+			.toggleClass('is-open', !isOpen)
+			.attr('aria-expanded', isOpen ? 'false' : 'true');
+	}
+	$(initialiseCultureCards);
+	if (cultureCardQuery.addEventListener) {
+		cultureCardQuery.addEventListener('change', initialiseCultureCards);
+	} else if (cultureCardQuery.addListener) {
+		cultureCardQuery.addListener(initialiseCultureCards);
+	}
+	$(document).on('click', '.wizlords-culture-card', function (event) {
+		if ($(event.target).closest('a').length) {
+			return;
+		}
+		toggleCultureCard(this);
+	});
+	$(document).on('keydown', '.wizlords-culture-card', function (event) {
+		if (event.key === 'Enter' || event.key === ' ') {
+			event.preventDefault();
+			toggleCultureCard(this);
 		}
 	});