{% extends 'layout/single-nologin.html' %}

{% block html_title %}Registration · {% endblock %}

{% block content_main %}

<h1 class="login-page">
  {% if config.crowi['app:title'] == 'Crowi' %}
    <img src="/logo/135x32.png" alt="Crowi">
  {% else %}
    {{ config.crowi['app:title'] }}<br>
    <img src="/logo/100x11_w.png" alt="powered by Crowi">
  {% endif %}
</h1>

<div class="login-dialog-container flip-container col-md-5">

<div class="login-dialog" id="login-dialog">

  <div class="login-dialog-inner front">
    <h2>{{ t('Sign up') }}</h2>

    <p>
    Welcome to {{ config.crowi['app:title'] }}!<br>
    {{ t('page_register.note.invited') }}
    </p>

    <div id="login-form-errors">
      {% set message = req.flash('warningMessage') %}
      {% if message.length %}
      <div class="alert alert-danger">
        {{ message }}
      </div>
      {% endif %}

      {% if req.form.errors.length > 0 %}
      <div class="alert alert-danger">
        <ul>
        {% for error in req.form.errors %}
          <li>{{ error }}</li>
        {% endfor %}
        </ul>
      </div>
      {% endif %}
    </div>
    <form role="form" id="invited-form" action="/login/activateInvited" method="post">

      <label>{{ t('Email') }}</label>
      <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
        <input type="text" class="form-control" disabled value="{{ user.email }}">
      </div>
      <p class="help-block">
      {{ t('page_register.form_help.invited_email') }}
      </p>

      <label>{{ t('User ID') }}</label>
      <div class="input-group" id="input-group-username">
        <span class="input-group-addon"><strong>@</strong></span>
        <input type="text" class="form-control" placeholder="{{ t('Example') }}: taroyama" name="invitedForm[username]" value="{{ req.body.invitedForm.username }}" required>
      </div>
      <p class="help-block">
      <span id="help-block-username" class="text-danger"></span>
      {{ t('page_register.form_help.user_id') }}
      </p>

      <label>{{ t('Name') }}</label>
      <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-user"></i></span>
        <input type="text" class="form-control" placeholder="{{ t('Example') }}: {{ t('Taro Yamada') }}" name="invitedForm[name]" value="{{ req.body.invitedForm.name }}" required>
      </div>

      <label>{{ t('Password') }}</label>
      <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-key"></i></span>
        <input type="password" class="form-control" placeholder="Password" name="invitedForm[password]" required>
      </div>
      <p class="help-block">
      {{ t('page_register.form_help.invited_password') }}<br>
      {{ t('page_register.form_help.password') }}
      </p>

      <input type="hidden" name="_csrf" value="{{ csrf() }}">
      <input type="submit" class="btn btn-primary btn-lg btn-block" value="{{ t('Sign up') }}">
    </form>

    <hr>

  </div>
</div>

</div>

{% endblock %}