View source for MediaWiki:Template:MainPageInfopush.js

$(
	(function () {
		mw.loader.using(["oojs-ui-core", "oojs-ui-windows"]).done(() => {
			for (const infopush of document.querySelectorAll(".tpl-infopush")) {
				try {
					const content = infopush.querySelector(".tpl-infopush-content");

					const items = content.querySelectorAll(".tpl-infopush-item");
					const total = items.length;

					for (const item of items) {
						const { articleId } = item.dataset;
						if (!articleId) return;

						item.addEventListener("click", () => console.log("showArticle(item)"));
					}

					const navigation = infopush.querySelector(".tpl-infopush-navigation");

					let currentOffset = 0;
					function showSlide(index) {
						currentOffset = (index + total) % total;
						content.style.transform = `translateX(-${currentOffset * 100}%)`;
					}

					const autoAdvanceEvery = 5000;

					let autoAdvanceInterval;
					function resetAutoAdvance() {
						if (autoAdvanceInterval) clearInterval(autoAdvanceInterval);
						autoAdvanceInterval = setInterval(function () {
							showSlide(currentOffset + 1);
						}, autoAdvanceEvery);
					}

					navigation
						.querySelector(".tpl-infopush-navigation-previous")
						.addEventListener("click", () => {
							showSlide(currentOffset - 1);
							resetAutoAdvance();
						});

					navigation
						.querySelector(".tpl-infopush-navigation-next")
						.addEventListener("click", () => {
							showSlide(currentOffset + 1);
							resetAutoAdvance();
						});

					resetAutoAdvance();
					showSlide(0);
				} catch (reason) {
					console.warn(
						"Template:MainPageInfopush",
						"Couldn't initialize infopush.",
						reason
					);
				}
			}
		});
	})()
);
Description	What you type	What you get
Italic	''Italic text''	Italic text
Bold	'''Bold text'''	Bold text
Bold & italic	'''''Bold & italic text'''''	*Bold & italic text*