$(function () {
	const observer = new IntersectionObserver(setAnimate, {
		threshold: [0.5, 1],
		rootMargin: '-125px 0px 0px 0px',
	});

	document.querySelectorAll('.observe').forEach((x) => {
		observer.observe(x);
	});
});

function addNumber(start, end, speed, timer, id) {
	let o = document.querySelector(id);
	let i = start;
	let Interval;
	if (i < end) {
		Interval = setInterval(function () {
			i += speed; // 璁剧疆姣忔澧炲姞鐨勫姩鎬佹暟瀛楋紝鍙皟鏁
			if (i > end) {
				clearInterval(Interval); // 娓呴櫎setInterval鐨則ime锛岃繖涓柟娉晈3c鍙叿浣撴煡鐪嬫枃妗
				o.innerHTML = end.toLocaleString(); // 姝よ祴鍊兼槸涓轰簡閬垮厤鏈€鍚庝竴娆″鍔犺繃鍚庣殑鏁版嵁鍜岀湡瀹炴暟鎹笉鍚
				i = 0;
			} else {
				o.innerHTML = i.toLocaleString();
			}
		}, timer); // 鏁版嵁璺宠浆鐨勯€熷害鎺у埗
	}
}

function setAnimate(entry) {
	entry.forEach((x) => {
		const { target, isIntersecting } = x;
		const obj = $(target);

		if (obj.find('.animate__fadeInUp').length > 0 || !isIntersecting) return;

		if (obj.find('.mapNumc').length > 0) {
			obj.find('.mapNumc').addClass('animate__fadeInUp');

			addNumber(0, 40, 1, 50, '.mapNumc');
			addNumber(0, 100, 1, 25, '.mapNumy');
			addNumber(0, 90000, 1000, 30, '.mapNumj');
		} else {
			obj.find('.animate__animated').each((i, e) => {
				setTimeout(() => {
					$(e).addClass('animate__fadeInUp');
				}, 100 * i);
			});
		}
	});
}