/* 
 <div class="modify" data-youtube='95Lo9kiikOA'></div>
 <div class="modify" data-isbn13='9784005009916'></div>
 <div class="modify" data-metabase='abac037e-f970-4481-b69d-5b28ddeb2a2c'></div>

iframe.youtube-16-9 {
  width: 100%;
  height: auto;
  aspect-ratio: 1.78;
  max-width: 768px;
}
iframe.metabase-16-9 {
  width: 100%;
  height: auto;
  aspect-ratio: 1.78;
  max-width: 768px;
}
 */
window.addEventListener('load', () => {

	// !Change it!
	const amazonLogo = '/attachment/677116aa307fe184858fd549';

	const isbn10to13 = (code) => {
		var newCode="978" + code.substring(0,9);
		return newCode + checksum13(newCode);
	};

	const isbn13to10 = (code) => {
		const oldCode = code.substring(3,12);
		return oldCode + checksum10(oldCode);
	};

	const checksum10 = (code) => {
		let sum=0;
		for( cnt=0 ; cnt<9 ; cnt++ ){
			sum=sum + (code.charAt(cnt)-'0') * (10-cnt);
		}
		checksum = ( 11 - (sum % 11) );
		return (checksum == 11 ? "0" : (checksum == 10 ? "X" : checksum)) ;
	};

	const checksum13 = (code) => {
		var sum=0;
		for( cnt=0 ; cnt<12 ; cnt++ ){
			sum=sum + (code.charAt(cnt)-'0') * (cnt%2==0 ? 1 : 3);
		}
		checksum = ( 10 - (sum % 10) );
		return checksum;
	};

	const handleUrlChange = () => {
		document.querySelectorAll('div.modify').forEach((dtag) => {
			try {
        if (0 < dtag.children.length) {
          // if there are already contents in dtag.
          return;
        } else if (dtag.dataset.youtube) {
          const movie_id = dtag.dataset.youtube;
          dtag.innerHTML = `<iframe class=\"youtube-16-9\" src=\"https://www.youtube.com/embed/${movie_id}\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>`;
        } else if (dtag.dataset.isbn13) {
          const isbn = dtag.dataset.isbn13.trim();
          const asin = isbn13to10(isbn);
          dtag.innerHTML = `<a href=\"https://www.amazon.co.jp/o/ASIN/${asin}\"><img src=\"https://img.hanmoto.com/bd/img/${isbn}.jpg\" alt=\"${isbn}\"/></a>`;
        } else if (dtag.dataset.isbn10) {
          const asin = dtag.dataset.isbn10.trim();
          const isbn = isbn10to13(asin);
          dtag.innerHTML = `<a href=\"https://www.amazon.co.jp/o/ASIN/${asin}\"><img src=\"https://img.hanmoto.com/bd/img/${isbn}.jpg\" alt=\"${isbn}\"/></a>`;
        } else if (dtag.dataset.asin) {
          const asin = dtag.dataset.asin;
          dtag.innerHTML = `<a href=\"https\://www.amazon.co.jp/o/ASIN/${asin}\"><img src=\"${amazonLogo}\" alt=\"${asin}\"/></a>`;
        } else if (dtag.dataset.metabase) {
          const dashboard_id = dtag.dataset.metabase;
          dtag.innerHTML = `<iframe class=\"metabase-16-9\" src=\"https://ir-db.tsukuba-tech.ac.jp/public/question/${dashboard_id}\" title=\"Metabase Dashboard\" frameborder=\"0\" allowfullscreen></iframe>`;
        }
			} catch (e) {
				console.log(e);
			}
		});
	};

	// ---- onload event ----
	requestAnimationFrame((timestamp)=>{
		handleUrlChange();
	});
	
	// ---- url change event (observe body changed) ----
	let href = location.href;
	const observer = new MutationObserver((mutations) => {
		if (href == location.href) {
			return;
		}
		
		href = location.href;
		requestAnimationFrame((timestamp) => {
			handleUrlChange();
		});
	});

	const config = {
		characterData: true,
		subtree: true
	};

	observer.observe(document.body, config);
});