let dots = document.querySelectorAll(".page-dots > div");
let randomSwipePage = ["left", "right", "up", "down"];
let isSwipe = false;

for (let d of dots) {
	d.onclick = function (event) {
		if (isSwipe) return;
		if (this.dataset && this.dataset.page) {
			let switchPage = document.querySelector(this.dataset.page);
			if (switchPage) {
				if (!this.classList.contains("active") && !switchPage.classList.contains("active")) {
					isSwipe = true;
					let active = document.querySelector(".page-dots > .active");
					let activePage = document.querySelector(".page.active");
					if (active && activePage) {
						active.classList.remove("active");

						let arrow = randomSwipePage[Math.round(Math.random() * 3)];

						activePage.classList.add(arrow);
						setTimeout(function () {
							activePage.classList.remove("active", arrow);
							isSwipe = false;
						}, 400);
					}
				}
				this.classList.add("active");
				switchPage.classList.add("active");
			}
		}
	};
}