<style>
    .main_sec{
        margin: auto;
        /* display: flex; */
        text-align: center;
    }
</style>
<h1><%= lang("user registration") %></h1>
<div class="main_sec">
    <div>
        <input type="text" id="login" name="login" value="" placeholder="<%= lang("login") %>">
        <input type="password" id="pass" name="pass" value="" placeholder="<%= lang("password") %>">
        <button onclick='reg();'><%= lang("register") %></button>
    </div>
    <div>
        <label for="admin_check"><%= lang("admin") %></label>
        <input type="checkbox" name="admin" value='false' id="admin_check">
    </div>
    <div id="reg_response"></div>
</div>

<script>
        function reg(){
            console.log("reg");
            let login = document.getElementById("login").value;
            let pass = document.getElementById("pass").value;
            let admin = document.getElementById("admin_check").checked;
            // console.log(login,pass,admin);
            // console.log("cl reg");
            $.post( "/admin/users/reg", { login:login,pass:pass,admin:admin })
            .done(function( res ) {
                // console.log("serv reg");
                if(res["out"] == "good"){
                    // console.log(res["body"]);
                    document.getElementById("reg_response").innerHTML = `user ${login} successfully registered `;
                    load_users_data(users_from);

                }
                else if (res["out"] == "bad"){
                    document.getElementById("reg_response").innerHTML = "cannot register user "+login+" already in use";
                }
            });
        }
</script>