{% extends "login/panel.html" %}
{% block panel_width %}col-md-4 col-md-offset-4{% endblock %}
{% block panel_image %}
<div class="pr-4">
 <img src="{{ url_for('static', filename='img/login.svg') }}" alt="{{ _('Login') }}" height="100%" role="presentation">
</div>
{% endblock %}
{% block title %}{{ _('%(appname)s Login', appname=config.APP_NAME) }}{% endblock %}
{% block panel_title %}{{ _('%(appname)s Login', appname=config.APP_NAME) }}{% endblock %}
{% block panel_body %}
<script type="text/javascript" src="{{ url_for('static', filename='js/jstz.min.js') }}"></script>
<script type="text/javascript">
    function SetTimezone() {
      var current_date = new Date();
      var gmt_offset = current_date.getTimezoneOffset() / 60;
      document.getElementById('tzparam').value = gmt_offset;
      var tzvar = jstz.determine();
      document.getElementById('olsontzparam').value = tzvar.name();
    };
 </script>

 <form action="{{ login_url }}" method="POST" name="login_user_form">
  {{ login_user_form.hidden_tag() }}
    {{ render_field_with_errors(login_user_form.username, "text") }}
    {{ render_field_with_errors(login_user_form.password, "password") }}
    <input type="hidden" name="timezone" id="tzparam" value="" autocomplete="off" />
    <input type="hidden" name="olsonTimezone" id="olsontzparam" value="" autocomplete="off" />
    <input class="btn btn-lg btn-primary btn-block mb-2" type="submit" value="{{ _('Login') }}" autocomplete="off" aria-label="{{ _('Login') }}">
</form>
 <script type="text/javascript">
   SetTimezone();
</script>
{% endblock %}