/**
 * 親子さん大夏祭り専用フォームフォーム
 */
class SummerFestivalJsForm {
	/**
	 * コンストラクタ
	 */
	constructor() {
		/** 募集情報ID */
		this.rcrt_id = "";
		/** 緊急連絡先 */
		this.emergency_contact = "";
		/** 年齢 */
		this.member_age = "";
		/** 保護者の同意 */
		this.parental_consent = "";
		/** 学校名 */
		this.school_name = "";
		/** 親子三代夏祭りでのボランティア経験の有無 */
		this.volunteer_experience = "";
		/** ポロシャツのサイズ */
		this.polo_shirt_sizes = "";
		/** 希望活動日時 */
		this.act_date_time = "";
		/** 説明会参加可否 */
		this.info_session = "";
		/** やぐらアナウンス */
		this.announcement = "";

		// コントロールクリア
		this.setControlStyle("rcrt_id", "border: 1px solid #ccc;");
		this.setControlStyle("emergency_contact", "border: 1px solid #ccc;");
		this.setControlStyle("member_age", "border: 1px solid #ccc;");
		this.setControlStyle("parental_consent", "border: 1px solid #ccc;");
		this.setControlStyle("school_name", "border: 1px solid #ccc;");
		this.setControlStyle("volunteer_experience", "border: 1px solid #ccc;");
		this.setControlStyle("polo_shirt_sizes", "border: 1px solid #ccc;");
		this.setControlStyle("act_date_time", "border: 1px solid #ccc;");
		this.setControlStyle("info_session", "border: 1px solid #ccc;");
		this.setControlStyle("announcement", "border: 1px solid #ccc;");
	}

	/**
	 * フォームデータを設定
	 */
	setFormData() {
		var elm_rcrt_id = document.getElementById('vol_form').rcrt_id;
		if (elm_rcrt_id != null) {
			this.rcrt_id = elm_rcrt_id.value;
		}
		var elm_emergency_contact = document.getElementById('vol_form').emergency_contact;
		if (elm_emergency_contact != null) {
			this.emergency_contact = elm_emergency_contact.value;
		}
		var elm_member_age = document.getElementById('vol_form').member_age;
		if (elm_member_age != null) {
			this.member_age = elm_member_age.value;
		}
		const chkParentalConsent = document.querySelectorAll('input[name="parental_consent[]"]:checked');
		const selectedValueParentalConsent = Array.from(chkParentalConsent).map(checkbox => checkbox.value);
		this.parental_consent = selectedValueParentalConsent;
		var elm_school_name = document.getElementById('vol_form').school_name;
		if (elm_school_name != null) {
			this.school_name = elm_school_name.value;
		}
		var elm_volunteer_experience = document.getElementById('vol_form').volunteer_experience;
		if (elm_volunteer_experience != null) {
			this.volunteer_experience = elm_volunteer_experience.value;
		}
		var elm_polo_shirt_sizes = document.getElementById('vol_form').polo_shirt_sizes;
		if (elm_polo_shirt_sizes != null) {
			this.polo_shirt_sizes = elm_polo_shirt_sizes.value;
		}
		var elm_act_date_time = document.getElementById('vol_form').act_date_time;
		if (elm_act_date_time != null) {
			this.act_date_time = elm_act_date_time.value;
		}
		var elm_info_session = document.getElementById('vol_form').info_session;
		if (elm_info_session != null) {
			this.info_session = elm_info_session.value;
		}
		const chkAnnouncement = document.querySelectorAll('input[name="announcement[]"]:checked');
		const selectedValueAnnouncement = Array.from(chkAnnouncement).map(checkbox => checkbox.value);
		this.announcement = selectedValueAnnouncement;
	}

	/**
	 * バリデーション
	 */
	validate() {
		let errInfo = [];
		// 必須チェック
		if (this.emergency_contact == "") {
			errInfo.push(["emergency_contact", "緊急連絡先を入力してください。"]);
		}
		if (this.member_age == "") {
			errInfo.push(["member_age", "年齢を入力してください。"]);
		}
		if (this.volunteer_experience == "") {
			errInfo.push(["volunteer_experience", "親子三代夏祭りでのボランティア経験の有無を入力してください。"]);
		}
		if (this.polo_shirt_sizes == "") {
			errInfo.push(["polo_shirt_sizes", "ポロシャツのサイズを入力してください。"]);
		}
		if (this.act_date_time == "") {
			errInfo.push(["act_date_time", "希望活動日時を入力してください。"]);
		}
		if (this.info_session == "") {
			errInfo.push(["info_session", "説明会参加可否を入力してください。"]);
		}
		// 桁数チェック
		if (errInfo.length == 0) {
			if (this.emergency_contact.length > 20) {
				errInfo.push(["emergency_contact", "緊急連絡先の文字数が大きすぎます。"]);
			}
			if (this.parental_consent.length > 12) {
				errInfo.push(["parental_consent", "保護者の同意の文字数が大きすぎます。"]);
			}
			if (this.school_name.length > 64) {
				errInfo.push(["school_name", "学校名の文字数が大きすぎます。"]);
			}
			if (this.volunteer_experience.length > 12) {
				errInfo.push(["volunteer_experience", "親子三代夏祭りでのボランティア経験の有無の文字数が大きすぎます。"]);
			}
			if (this.polo_shirt_sizes.length > 32) {
				errInfo.push(["polo_shirt_sizes", "ポロシャツのサイズの文字数が大きすぎます。"]);
			}
			if (this.act_date_time.length > 64) {
				errInfo.push(["act_date_time", "希望活動日時の文字数が大きすぎます。"]);
			}
			if (this.info_session.length > 12) {
				errInfo.push(["info_session", "説明会参加可否の文字数が大きすぎます。"]);
			}
			if (this.announcement.length > 12) {
				errInfo.push(["announcement", "やぐらアナウンスの文字数が大きすぎます。"]);
			}
		}
		// 入力形式チェック
		if (errInfo.length == 0) {
			if (validTel(this.emergency_contact) != true) {
				errInfo.push(["emergency_contact", "緊急連絡先の入力形式が正しくありません。"]);
			}
		}
		// 範囲チェック
		if (errInfo.length == 0) {
		}
		// 相関チェック
		if (errInfo.length == 0) {
		}

		// エラー情報設定
		errInfo.forEach(function(err) {
			this.setControlStyle(err[0], "border: 1px solid red;");
		}, this);

		return errInfo;
	}

	/**
	 * コントロールにスタイルを適用する
	 */
	setControlStyle(ctrlName, style) {
		let ctrls = document.getElementsByName(ctrlName);
		ctrls.forEach(function(ctrl) {
			ctrl.style = style;
		});
	}
}