lib_plankton.zoo_page.register(
	"register",
	async (parameters, target_element) => {
		function set_state(
			state : ("load" | "fill" | "wait" | "done"),
			messages : Array<string> = []
		) : void
		{
			target_element.querySelector(".register").setAttribute("rel", state);
			target_element.querySelector(".register-message").textContent = "";
			let dom_list = document.createElement("ul");
			messages.forEach(
				message => {
					let dom_message = document.createElement("li");
					dom_message.textContent = message;
					dom_list.appendChild(dom_message);
				}
			);
			target_element.querySelector(".register-message").appendChild(dom_list);
		}
		
		const id : int = parseInt(parameters["id"]);
		const verification : string = parameters["verification"];
		// const verification : string = (new URLSearchParams(location.search)).get("verification");
		
		update_nav({"mode": null});
		target_element.appendChild(template_request("register"));
		set_state(
			"load",
			[
			]
		);
		
		let member_data : (
			null
			|
			{
				name_real_value : string;
				name_real_index : int;
				name_login : string;
				email_address_veiled : string;
				email_address_nominal : string;
			}
		);
		try {
			member_data = await _espe.backend.member_info(id, verification);
		}
		catch (error) {
			member_data = null;
		}
		
		if (member_data === null) {
			set_state(
				"fill",
				[
					lib_plankton.translate.get("page.register.flaw.already_registered"),
				]
			);
		}
		else {
			
			// title
			{
				target_element.querySelector(".register-title").textContent = lib_plankton.translate.get("page.register.title");
			}
			// info
			{
			}
			// form
			{
				let input : lib_plankton.zoo_input.interface_input<
					{
						email_address : ("none" | "only_veiled" | "both");
						email_redirect : boolean;
						password_value : string;
						password_confirmation : string;
					}
				>;
				// input
				{
					input = new lib_plankton.zoo_input.class_input_group(
						[
							{
								"name": "email_address",
								"input": new lib_plankton.zoo_input.class_input_enumeration(
									[
										{
											"value": "none",
											"label": lib_plankton.translate.get("page.register.form.field.email_address.option.none"),
										},
										{
											"value": "only_veiled",
											"label": lib_plankton.translate.get("page.register.form.field.email_address.option.only_veiled"),
										},
										{
											"value": "both",
											"label": lib_plankton.translate.get("page.register.form.field.email_address.option.both"),
										},
									]
								),
								"label": lib_plankton.translate.get("page.register.form.field.email_address.label"),
								"help": lib_plankton.translate.get(
									"page.register.form.field.email_address.help",
									{
										"email_address_veiled": member_data.email_address_veiled,
										"email_address_nominal": member_data.email_address_nominal,
									}
								),
							},
							{
								"name": "email_redirect",
								"input": new lib_plankton.zoo_input.class_input_checkbox(
								),
								"label": lib_plankton.translate.get("page.register.form.field.email_redirect.label"),
							},
							{
								"name": "password_value",
								"input": new lib_plankton.zoo_input.class_input_password(
								),
								"label": lib_plankton.translate.get("page.register.form.field.password_value.label"),
								"help": lib_plankton.translate.get("page.register.form.field.password_value.help"),
							},
							{
								"name": "password_confirmation",
								"input": new lib_plankton.zoo_input.class_input_password(
								),
								"label": lib_plankton.translate.get("page.register.form.field.password_confirmation.label"),
							},
						]
					);
					await input.setup(target_element.querySelector(".register-form-input") as HTMLElement);
					await input.write(
						{
							"email_address": "both",
							"email_redirect": true,
							"password_value": "",
							"password_confirmation": "",
						}
					);
				}
				// actions
				{
					target_element.querySelector(".register-form-action-send").textContent = lib_plankton.translate.get("page.register.form.submit");
					target_element.querySelector(".register-form-action-send").addEventListener(
						"click",
						async (event) => {
							const value : {
								email_address : ("none" | "only_veiled" | "both");
								email_redirect : boolean;
								password_value : string;
								password_confirmation : string;
							} = await input.read();
							let flaws : Array<{incident : string; details : Record<string, any>;}>;
							if (value.password_value !== value.password_confirmation) {
								flaws = [
									{"incident": "password_mismatch", "details": {}},
								];
							}
							else {
								set_state(
									"wait",
									[
									]
								);
								try {
									flaws = await _espe.backend.member_register(
										id,
										verification,
										{
											"email_use_veiled_address": (value.email_address !== "none"),
											"email_use_nominal_address": (value.email_address === "both"),
											"email_redirect_to_private_address": value.email_redirect,
											"password": value.password_value,
										}
									);
								}
								catch (error) {
									flaws = [
										{"incident": "unhandled_error", "details": {}},
									];
								}
							}
							if (flaws.length > 0) {
								set_state(
									"fill",
									flaws.map(
										flaw => lib_plankton.string.coin(
											lib_plankton.translate.get("page.register.flaw." + flaw.incident),
											flaw.details
										)
									)
								);
							}
							else {
								set_state(
									"done",
									[
										lib_plankton.translate.get("page.register.success")
									]
								);
							}
						}
					);
				}
			}
		}
	},
);