{% include 'header.twig' %}

 <main><div class="main_container" id="main_container">
	<div class="content_area">
	  <div class="content">
	    <!-- page and other top info -->
	    <div class="page_top_info" id="page_top_info"></div>
    <div class="row">
      <div class="col-md-12">
       <div class="card card_v2">
		<div class="card-body">
			<div id="main-page" class="">
				<div class="">
				  <div class="alert alert-warning alert-dismissable"><button aria-hidden="true" data-dismiss="alert" class="close" type="button"></button><strong>You never changed your password, for your best security you are required to update your passwords.</strong></div>

               
               {% if error %}
        <div class="alert alert-dismissible alert-danger">
          <button type="button" class="close" data-dismiss="alert">×</button>
          {{ errorText }}
        </div>
      {% endif %}
      {% if success %}
        <div class="alert alert-dismissible alert-success">
          <button type="button" class="close" data-dismiss="alert">×</button>
          {{ successText }}
        </div>
      {% endif %}
      
        <div class="card card_v2 mb-3">
          <div class="card-body">
            <div id="def_side_title">
              <div class="icon">
                <i class="fal fa-user-circle"></i>
              </div>
              <div class="name">
                User Infos
              </div>
            </div>
            <div class="mb-3">
              <label for="username">Username</label>
              <input type="text" class="form-control" id="username" value="{{ user['username'] }}" readonly>
            </div>
            <div class="mb-3">
              <label for="email">Email Address</label>
              <input type="text" class="form-control" id="email" value="{{ user['email'] }}" readonly>
            </div>
          </div>
        </div>

        <!-- Two-factor Authentication Section -->
        <div class="card card_v2 mb-3">
          <div class="card-body">
            <div id="2fa-approve-error-block" class="alert alert-danger alert-dismissible fade show" style="display: {% if error2fa %} block {% else %} none {% endif %};">
              <button type="button" class="close" data-dismiss="alert">&times;</button>
              <span id="2fa-error-text">{{ error2faText }}</span>
            </div>

            <div class="component_form_group">
              <label>Two-factor Authentication</label>
              {% if user['two_factor_enabled'] == 1 %}
                <p>2FA is currently enabled.</p>
                <form id="2fa-disable-form" method="post" action="/account/disable_2fa">
                  <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
                  <button type="submit" class="btn btn-primary w-100">Disable 2FA</button>
                </form>
              {% elseif user['two_factor_enabled'] == 3 %}
                <p>2FA is currently being enabled. Please check your email and enter the code below.</p>
                <form id="2fa-approve-form" method="post" action="/account/verify_2fa">
                  <div class="mb-4" style="color: white;">Please enter the code sent to your email.</div>
                  <div class="form-group">
                    <label for="code">Code</label>
                    <input type="text" id="code" name="two_factor_code" class="form-control" required>
                  </div>
                  <input type="hidden" name="enabled" value="1">
                  <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
                  <button id="2fa-approve" type="submit" class="btn btn-primary w-100">Verify 2FA Code</button>
                </form>
                <form id="2fa-resend-code-form" method="post" action="/account/enable_2fa" class="mt-3">
                  <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
                  <input type="hidden" name="resend" value="1">
                  <button type="submit" class="btn btn-secondary w-100">Resend Code</button>
                </form>
              {% else %}
                <p>2FA is currently disabled.</p>
                <form id="2fa-generate-form" method="post" action="/account/enable_2fa">
                  <div class="mb-4" style="color: white;">
                    Email-based 2FA adds an extra layer of security. When signing in, you will need to enter a code sent to your email.
                  </div>
                  <input type="hidden" name="enabled" value="1">
                  <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
                  <button id="2fa-generate" type="submit" class="btn btn-primary w-100">Enable 2FA</button>
                </form>
              {% endif %}
            </div>
          </div>
        </div>

        <div class="card card_v2 mb-3">
          <div class="card-body">
            <div id="def_side_title">
              <div class="icon">
                <i class="far fa-lock"></i>
              </div>
              <div class="name">
                Account Password Manager
              </div>
            </div>
            <form action="" method="post">
              <div class="mb-3">
                <label for="current">Current Password</label>
                <input type="password" class="form-control" id="current" name="current_password">
              </div>
              <div class="mb-3">
                <label for="new">New Password</label>
                <input type="password" class="form-control" id="new" name="password">
              </div>
              <div class="mb-3">
                <label for="confirm">Confirm Password</label>
                <input type="password" class="form-control" id="confirm" name="confirm_password">
              </div>
              <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
              <button type="submit" class="btn btn-primary d-block w-100">Update Password</button>
            </form>
          </div>
        </div>

   


            <form action="/account/newapikey" method="post">
<div class="form-group panel-border-top">
					 <label class="control-label" for="api_key"
					   >API key</label
					 >
					 					 <input
					   class="form-control"
					   id="api_key"
					   value="Press regenerate button to generate api key."
					   readonly="readonly"
					   type="text"
					 />
              <input type="hidden" name="csrf_token" value="{{ csrfToken }}">
              <button type="submit" class="btn btn-primary d-block w-100">Generate new</button>
            </form>

          </div>
        </div>

        
                <div class="card card_v2 mb-3">
                    <div class="card-body">
                            <div id="def_side_title">
                                <div class="icon">
                                    <i class="far fa-clock"></i>
                                </div>
                                <div class="name">
                                    Timezone
                                </div>
                            </div>
                             <form method="post" action="/account/timezone">
                                <div class="form-group">
                                  <label for="timezone" class="control-label">Timezone</label>
                                   <select class="form-control" name="timezone">
                                  {% for timezone in timezones %}
                                      <option value="{{ timezone }}" {% if timezone == user["timezone"] %}selected{% endif %}>{{ timezone }}</option>
                                  {% endfor %}
                              </select>
                                </div>
                      
                                <button type="submit" class="btn btn-primary d-block w-100">Save</button>
                              </form>
                    </div>
                  </div>

            </div>
        </div>
    </div>
</div>

      </div>
    </div>
  </main>
  
  
 {% include 'footer.twig' %}
		