<script type="text/javascript">

	$(document).ready(function () {
		var registrationValidator = (function () {

			var validateFields = function () {

				$("#reg_login").change(function () {

					if ($('#reg_login').val() == '') {
						$("#reg_login").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("div#reg_login").html("<span>{{ lang.auth_login_descr }}</span>");
						return;
					}

					$.post('/engine/rpc.php', {
						json: 1,
						methodName: 'core.registration.checkParams',
						rndval: new Date().getTime(),
						params: json_encode({'login': $('#reg_login').val()}),
						dataType: 'json'
					}, function (data) {
						if (typeof data == 'string') {
							resTX = $.parseJSON(data);
						} else {
							resTX = data;
						}
						if (!resTX['status']) {
							alert('Error [' + resTX['errorCode'] + ']: ' + resTX['errorText']);
						} else {
							if ((resTX['data']['login'] > 0) && (resTX['data']['login'] < 100)) {
								$("#reg_login").css("border-color", "#b54d4b");
								$("div#reg_login").html("<span style='color:#b54d4b;'>{{ lang.theme['registration.msg.login_warning'] }}</span>");
							} else {
								$("#reg_login").css("border-color", "#94c37a");
								$("div#reg_login").html("<span style='color:#94c37a;'>{{ lang.theme['registration.msg.login_success'] }}</span>");
							}
						}
					}, "text").error(function () {
						alert('HTTP error during request', 'ERROR');
					});

				});

				$("#reg_email").change(function () {

					if ($('#reg_email').val() == '') {
						$("#reg_email").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("div#reg_email").html("<span>{{ lang.auth_email_descr }}</span>");
						return;
					}

					$.post('/engine/rpc.php', {
						json: 1,
						methodName: 'core.registration.checkParams',
						rndval: new Date().getTime(),
						params: json_encode({'email': $('#reg_email').val()}),
						dataType: 'json'
					}, function (data) {
						if (typeof data == 'string') {
							resTX = $.parseJSON(data);
						} else {
							resTX = data;
						}
						if (!resTX['status']) {
							alert('Error [' + resTX['errorCode'] + ']: ' + resTX['errorText']);
						} else {
							if ((resTX['data']['email'] > 0) && (resTX['data']['email'] < 100)) {
								$("#reg_email").css("border-color", "#b54d4b");
								$("div#reg_email").html("<span style='color:#b54d4b;'>{{ lang.theme['registration.msg.email_warning'] }}</span>");
							} else {
								$("#reg_email").css("border-color", "#94c37a");
								$("div#reg_email").html("<span style='color:#94c37a;'>{{ lang.theme['registration.msg.email_success'] }}</span>");
							}
						}
					}).error(function () {
						alert('HTTP error during request', 'ERROR');
					});

				});


				$("#reg_password2").change(function () {

					if ($('#reg_password2').val() == '' && $('#reg_password').val() == '') {
						$("#reg_password").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("#reg_password2").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("div#reg_password2").html("<span>{{ lang.auth_pass2_descr }}</span>");
						return;
					}

					if ($('#reg_password2').val() != $('#reg_password').val()) {
						$("#reg_password").css("border-color", "#b54d4b");
						$("#reg_password2").css("border-color", "#b54d4b");
						$("div#reg_password2").html("<span style='color:#b54d4b;'>{{ lang.theme['registration.msg.password_warning'] }}</span>");
					} else {
						$("#reg_password").css("border-color", "#94c37a");
						$("#reg_password2").css("border-color", "#94c37a");
						$("div#reg_password2").html("<span style='color:#94c37a;'>{{ lang.theme['registration.msg.password_success'] }}</span>");
					}


				});


				$("#reg_password").change(function () {

					if ($('#reg_password2').val() == '' && $('#reg_password').val() == '') {
						$("#reg_password").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("#reg_password2").css({
							"display": "table-cell",
							"background": "#f9f9f9",
							"border": "1px solid #e2e2e2",
							"box-shadow": "inset 2px 3px 3px -2px #e2e2e2"
						});
						$("div#reg_password2").html("<span>{{ lang.auth_pass2_descr }}</span>");
						return;
					}
					if ($('#reg_password2').val() != $('#reg_password').val()) {
						$("#reg_password").css("border-color", "#b54d4b");
						$("#reg_password2").css("border-color", "#b54d4b");
						$("div#reg_password2").html("<span style='color:#b54d4b;'>{{ lang.theme['registration.msg.password_warning'] }}</span>");
					} else {
						$("#reg_password").css("border-color", "#94c37a");
						$("#reg_password2").css("border-color", "#94c37a");
						$("div#reg_password2").html("<span style='color:#94c37a;'>{{ lang.theme['registration.msg.password_success'] }}</span>");
					}


				});

			};

			return {
				validateFields: validateFields
			};

		})();

		registrationValidator.validateFields();
	});

</script>
<div class="post">
	<form name="register" action="{{ form_action }}" method="post" class="newtopic" onsubmit="return validate();">
		<input type="hidden" name="type" value="doregister"/>
		<div class="postinfotop">
			<h2>{{ lang.registration }}</h2>
		</div>
		<div class="accsection">
			<div class="topwrap">
				<div class="card">
					{% for entry in entries %}
						{% if entry.type == 'input' %}
							<div style="margin: 10px 0;">
								<label>{{ entry.title }}</label>
								<input id="{{ entry.id }}" type="{{ entry.type }}" name="{{ entry.name }}" value="{{ entry.value }}" class="form-control" />
								<div id="{{entry.id}}">{{ entry.descr }}</div>
							</div>
						{% endif %}
						{% if entry.type == 'password' %}
							<div style="margin: 10px 0;">
								<label>{{ entry.title }}</label>
								<input id="{{ entry.id }}" type="{{ entry.type }}" name="{{ entry.name }}" value="{{ entry.value }}" class="form-control" />
								<div id="{{entry.id}}">{{ entry.descr }}</div>
							</div>
						{% endif %}
						{% if entry.type == 'text' %}
							<div style="margin: 10px 0;">
								<label>{{ entry.title }}</label>
								<textarea name="{{ entry.name }}" rows="10"></textarea>
							</div>
						{% endif %}
						{% if entry.type == 'select' %}
							<div style="margin: 10px 0;">
								<label>{{ entry.title }}</label>
								<select type="{{ entry.type }}" name="{{ entry.name }}">{% for key,value in entry.values %}<option value="{{ key }}">{{ value }}</option>{% endfor %}</select>
							</div>
						{% endif %}
					{% endfor %}
					{% if flags.hasCaptcha %}
						<div style="margin: 10px 0;">
							<label>{{ lang['captcha'] }}</label>
							<div><span><img src="{{ admin_url }}/captcha.php?id=registration&force=1&rand={{ random() }}" onclick="reload_captcha();" id="img_captcha" style="background: #fff; cursor: pointer;" alt="Security code" width="120" height="40" /></span></div>
							<div><input type="text" name="vcode" style="width:120px" /></div>
							<div class="label-desc">{{ lang.captcha_desc }}</div>
						</div>
					{% endif %}
					<div class="postinfobot">
						<div class="notechbox pull-left">
							<input type="checkbox" name="agree" class="form-control" />
						</div>
						<div class="pull-left lblfch">
							<label>{{ lang.theme.registration_rules }}</label>
						</div>
						<div class="pull-right postreply">
							<div class="pull-left"><button class="btn btn-primary" type="submit">{{ lang.register }}</button></div>
							<div class="clearfix"></div>
						</div>
						<div class="clearfix"></div>
					</div>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
	</form>
</div>
<script type="text/javascript">
	function validate() {
		if (document.register.agree.checked == false) {
			window.alert('{{ lang.theme.registration_check_rules }}');
			return false;
		}
		return true;
	}
	var ADMIN_URL = "{{ admin_url }}";
	function reload_captcha() {
		let img = document.getElementById('img_captcha');
		if (img) {
			img.src = ADMIN_URL + '/captcha.php?id=registration&force=1&rand=' + Math.random();
		}
	}
</script>