package react.user;

import react.ReactComponent;
import react.ReactMacro.jsx;
import Common;

typedef CookieConsentBoxProps = {
	redirectUrl:String,
	message:String,
	?phoneRequired:Bool
}

typedef CookieConsentBoxState = {
	email:String,
	password:String,
	error:String
}

/**
 * CookieConsent Box
 * @author fbarbut
 */
class CookieConsentBox extends react.ReactComponentOfPropsAndState<CookieConsentBoxProps, CookieConsentBoxState> {
	public function new(props:CookieConsentBoxProps) {
		if (props.redirectUrl == null || props.redirectUrl == "null")
			props.redirectUrl = "/";
		if (props.message == "")
			props.message = null;
		super(props);

		this.state = {email: "", password: "", error: null};
	}

	function setError(err:String) {
		this.setState(cast {error: err});
	}

	override public function render() {
		return jsx('<div onKeyPress=$onKeyPress>
			<$Error error="${state.error}" />
			<$Message message="${props.message}" />
			<form action="" method="post" className="form-horizontal">
				<h4>Personnaliser les préférences en matière de consentement</h4>
				<p>
				Nous n\'utilisons que des cookies nécessaires pour vous aider à naviguer efficacement et à exécuter certaines fonctionnalités. Les cookies nécessaires sont cruciaux pour les fonctions de base du site Web et celui-ci ne fonctionnera pas comme prévu sans eux. Ces cookies ne stockent aucune donnée personnellement identifiable.
				</p>

				<p className="text-center">
					<a onClick={deny} className="btn btn-secondary btn-lg" >Tout Refuser</a>
					&nbsp;
					<a onClick={submit} className="btn btn-primary btn-lg" ><span className="glyphicon glyphicon-user"></span> Tout Accepter</a>
				</p>
			</form>
		</div>');

	}

	/**
	 * @doc https://facebook.github.io/react/docs/forms.html
	 */
	function onChange(e:js.html.Event) {
		e.preventDefault();

		var name:String = untyped e.target.name;
		var value:String = untyped /*(e.target.value == "") ? null :*/ e.target.value;
		Reflect.setField(state, name, value);
		this.setState(this.state);
	}

	public function submit(?e:js.html.Event) {
		// lock button
		var el:js.html.Element = null;
		if (e != null) {
			el = cast e.target;
			el.classList.add("disabled");
		}
		// var cookie = js.Browser.document.cookie;
		var newCookie = "rgpd=true; SameSite=Lax";
		js.Browser.document.cookie = newCookie;
		// js.Browser.window.location.href = props.redirectUrl;
		js.Browser.window.location.href = '/';
	}

	public function deny(?e:js.html.Event) {
		// lock button
		var el:js.html.Element = null;
		if (e != null) {
			el = cast e.target;
			el.classList.add("disabled");
		}
		var newCookie = "rgpd=false; SameSite=Lax";
		js.Browser.document.cookie = newCookie;
		// js.Browser.window.location.href = props.redirectUrl;
		js.Browser.window.location.href = '/';
	}

	function onKeyPress(e:js.html.KeyboardEvent) {
		if (e.key == "Enter")
			submit();
	}
}