addEventListener("load", function() {
movementMenu("authorizationDiv");

/* создание кнопки авторизации */
authorizationButtonId = document.getElementById("authorizationButton");
handleJsonRpcRequest('authorizationInformation', {}, 1).then(data => {
	authorizationDivId = document.getElementById("authorizationDiv");
	if (data.login == "true") {
		authorizationButtonId.style.background = "url(../../img/pict/mc_iconslyb.svg) -1038px 1px";
        document.documentElement.style.setProperty('--autButBackX', '-1038');
        document.documentElement.style.setProperty('--autButBackY', '1');
		authorizationButtonId.onclick = function() {
			createAjaxRequest({ handleRequestAction: 'API', logoff: 'Выйти' }, function(response) {
                location.reload();
			});
		};
	} else if (data.login == "false") {
		authorizationButtonId.style.background = "url(../../img/pict/mc_iconslyb.svg) -756px 1px";
        document.documentElement.style.setProperty('--autButBackX', '-756');
        document.documentElement.style.setProperty('--autButBackY', '1');
        authorizationButtonId.onclick = function() {
            const el = authorizationDivId;
            if (el.style.visibility === "visible") {
                el.style.visibility = "hidden";
            } else {
                el.style.visibility = "visible";
                el.style.top = "20%";
                el.style.left = "50%";
                el.style.transform = "translate(-50%, -20%)";
            }
        };         
	}
});

});

function authorizationDivCloseFun() {
    document.getElementById("authorizationDiv").style.visibility = "hidden";
}

function loginButtonFunCreate() {
    document.querySelector(".authorizationDivMainDiv").innerHTML = `
        <div id="BackArrow" onClick="mainButtonFunCreate()"></div>
        <div class="formRow">
            <label>{{login_label}}:</label>
            <input type="text" id="loginInput" name="login">
        </div>
        <div class="formRow">
            <label>{{password_label}}:</label>
            <input type="password" id="passInput" name="pass" autocomplete="">
        </div>
        <div class="formRow">
            <button type="button" id="loginButton" onClick="loginButtonFun()">{{login}}</button>
        </div>
    `;
}
function loginButtonFun() {
	var login = document.getElementById("loginInput").value;
	var pass = document.getElementById("passInput").value;
	createAjaxRequest({ handleRequestAction: 'API', login: login, pass: pass, log: "Войти" }, function(response) {
		if (response.status == "true") {
			handleJsonRpcRequest('authorizationInformation', {}, 1).then(data => {
				location.reload();
			});
		} else {
			messageFunction("{{incorrect_login_password}}");
		}
	});
}

function registrationButtonFunCreate() {
    document.querySelector(".authorizationDivMainDiv").innerHTML = `
        <div id="BackArrow" onClick="mainButtonFunCreate()"></div>
        <div class="formRow">
            <label>{{login_label}}:</label>
            <input type="text" id="loginInput" name="login">
        </div>
        <div class="formRow">
            <label>{{password_label}}:</label>
            <input type="text" id="passInput" name="pass">
        </div>
        <div class="formRow">
            <label>{{repeat_password_label}}:</label>
            <input type="text" id="passСheckInput" name="pass">
        </div>
        <div class="formRow">
            <label>{{email_label}}:</label>
            <input id="emailInput">
        </div>
        <div class="formRow">
            <button type="button" id="loginButton" onClick="registrationButtonFun()">{{register}}</button>
        </div>
    `;
}
function registrationButtonFun() {
	var login = document.getElementById("loginInput").value;
	var pass = document.getElementById("passInput").value;
	var passСheck = document.getElementById("passСheckInput").value;
	var email = document.getElementById("emailInput").value;
    if (login.trim() == "" || pass.trim() == ""  || passСheck.trim() == ""  || email.trim() == "" ) {
        messageFunction("{{fill_all_fields}}");
        return;
    }
    if (pass != passСheck) {
        messageFunction("{{passwords_do_not_match}}");
        return;
    }
	handleJsonRpcRequest('registrationRequest', { login, pass, email }, 1).then(response => {
		if (response.status == true) {
			messageFunction("{{account_creation_request_sent}}");
		} else if (response.status == "name coincidence") {
			messageFunction("{{user_exists}}");
		} else if (response.status == "error while creating") {
			messageFunction("{{account_creation_error}}");
		} else if (response.status == "incorrect mail") {
			messageFunction("{{incorrect_email}}");
		} else {
			messageFunction("{{account_creation_request_error}}");
        }
	});
}

function mainButtonFunCreate() {
    document.querySelector(".authorizationDivMainDiv").innerHTML = `
        <div class="formRow">{{account_authorization}}</div>
        <div class="formRow">
            <button type="button" id="loginButton" onClick="loginButtonFunCreate()">{{login}}</button>
            <button type="button" id="loginButton" onClick="registrationButtonFunCreate()">{{register}}</button>
        </div>
    `;
}