{% extends 'base.html' %}

{% block title %}Профиль{% endblock %}
{% block header %}Профиль{% endblock %}


{% block content %}

{% with messages = get_flashed_messages() %}
{% if messages %}
{% for message in messages %}
<p style="color: green; font-weight: bold; font-size: 20px">{{ message }}</p>
{% endfor %}
{% endif %}
{% endwith %}


<form method="POST">
  {% for field in g.auth.meta_fields(visible=True) %}
  {% set value = g.auth[field.name] or '' %}
  <label>
    {% if field.input_type != "hidden" %}
    {{ field.caption }}: <br>
    {% endif %}
    <input style="width: 100%;" placeholder="{{k}}" type="{{field.input_type}}" name="{{field.name}}" value="{{value}}"
      {% if field.readonly %}disabled{% endif %}>

  </label>
  {% endfor %}
  <button>Сохранить</button>
</form>

<hr>

<h2>Смена пароля</h2>

<form method="POST" action="set_password" id="set-password">
  <input type="hidden" id="login" name="login" value="{{g.auth.login}}">
  <input type="password" autocomplete="new-password" name="password" id="password" placeholder="Пароль" required>
  <input type="password" autocomplete="new-password" name="password" id="password" placeholder="Повторите пароль"
    required>

  <button>Сохранить</button>
</form>
<pre>
</pre>

<a href="signout">Выйти из аккаунта</a>
{% endblock %}

{% block scripts %}

<script>
  // TODO: объединить код с регистрацией 
  const form = document.getElementById("set-password")
  form.addEventListener("submit", async function (event) {
    event.preventDefault()
    const loginElement = document.getElementById("login")
    const passwordElement = document.getElementById("password")
    const phoneElement = document.getElementById("phone")

    const login = loginElement.value
    const password = passwordElement.value

    const salt = window.crypto.getRandomValues(new Uint8Array(16))
    const saltHex = await arrayBufferToHexDec(salt)

    const key = await getKey(password, salt)
    const keyHex = await keyToHex(key)

    const res = await post(
      window.location.pathname + "?action=set_password",
      {
        login,
        hash: keyHex,
        salt: saltHex,
      }
    )

    if (!res.ok) {
      alert("fail")
      console.error(await res.text())
      return
    } else {
      alert(await res.text())
    }

    redirectNextUrl(window.location.href)

    return false
  })
</script>

{% endblock %}