/*#########################################################

	画面解析後のイベント

	#########################################################*/
document.addEventListener("DOMContentLoaded", function (event) {
	// モーダルのセット
	setModal();
	setModal("-sample");
});

const MODALNAME = "js-modal";	// モーダル名
const MODALSHOW = "js-modal-show"; // モーダルの表示。モーダルの種類に関係なく固定
const MODALOUTER = "js-modal-outer"; // モーダルの外枠。モーダルの種類に関係なく固定
/* ========================================================
	モーダルの表示関数
	=========================================================*/
function setModal(NAME) {
	NAME = NAME ? "." + NAME : "";
	console.log("NAME:"+NAME);

	// モーダルウインドウ
	let modal = document.querySelector("." + MODALNAME + NAME);
	// モーダル呼び出しボタン
	let openModal = document.querySelectorAll("." + MODALNAME + "-open" + NAME);

	// モーダルウインドウと呼び出しボタンがある場合
	if (openModal && modal) {
		for (let i = 0; i < openModal.length; i++) {
			// モーダルを開くボタンをクリック
			openModal[i].addEventListener("click", function (e) {
				e.preventDefault();
				// クラス追加（モーダルを開くCSS設定）
				modal.classList.add(MODALSHOW);
				// スクロール禁止
				document.querySelector("html, body").style.overflow = "hidden";
			});
		}

		// モーダル自体をクリックしても閉じないための処理
		let modalOuter = document.querySelectorAll("." + MODALOUTER);
		if (modalOuter) {
			for (let i = 0; i < modalOuter.length; i++) {
				modalOuter[i].addEventListener("click", function (e) {
					e.stopPropagation();
				});
			}
		}

		// 閉じるボタン
		let closeModal = document.querySelectorAll("." + MODALNAME + "-close" + NAME);
		// 閉じるボタンがある場合
		if (closeModal) {
			for (let i = 0; i < closeModal.length; i++) {
				// モーダルを閉じるボタンをクリック
				closeModal[i].addEventListener("click", function () {
					// モーダルを非表示にする
					hideModal(modal);
				});
			}
		}
	}
}

/* ========================================================
	モーダルの非表示関数
	=========================================================*/
function hideModal(MODAL) {
	if (MODAL) {
		// モーダルを非表示にする
		MODAL.classList.remove(MODALSHOW);
		// スクロール解除
		document.querySelector("html, body").style.overflow = "auto";
	}
}