{% extends "layout.html" %}
{% block body %}
<div class="well">
  <h2 style="margin-top: 0">{{_('Remote Login')}}</h2>
  <p>
    {{_('Using your another device, visit')}} <a href="{{verify_url}}">{{verify_url}}</a> {{_('and log in')}}.
  </p>
  <p>
    {{_('Once you do so, you will automatically get logged in on this device.')}}
  </p>
  <p>
    {{_('The link will expire after %s minutes.' % 10)}}
  </p>
</div>
{% endblock %}

{% block js %}
<script type="text/javascript">
  (function () {
    // Poll the server to check if the user has authenticated
    var t = setInterval(function () {
      $.post('{{url_for("token_verified")}}', { token: '{{token}}' })
        .done(function(response) {
          if (response.status === 'success') {
            // Wait a tick so cookies are updated
            setTimeout(function () {
              window.location.href = '{{url_for("index")}}';
            }, 0);
          }
        })
        .fail(function (xhr) {
          clearInterval(t);

          var response = JSON.parse(xhr.responseText);
          alert(response.message);
        });
    }, 5000);
  })()
</script>
{% endblock %}