weseek__growi/lib/views/invited.html

{% extends 'layout-growi/base/layout.html' %}

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

{% block content_main %}

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

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

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

  <div class="login-dialog-inner front">
    <h2>ユーザー情報入力</h2>

    <p>
    ようこそ!<br>
    はじめに、あなたのことを教えて下さい。
    </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>メールアドレス</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">
      このメールアドレスで招待を受け取っています。
      </p>

      <label>ユーザー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="記入例: taroyama" name="invitedForm[username]" value="{{ req.body.invitedForm.username }}" required>
      </div>
      <p class="help-block">
      <span id="help-block-username" class="text-danger"></span>
      ユーザーIDは、ユーザーページのURLなどに利用されます。半角英数字と一部の記号のみ利用できます。
      </p>

      <label>名前</label>
      <div class="input-group">
        <span class="input-group-addon"><i class="fa fa-user"></i></span>
        <input type="text" class="form-control" placeholder="記入例: 山田 太郎" name="invitedForm[name]" value="{{ req.body.invitedForm.name }}" required>
      </div>

      <label>パスワード</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">
      現在、仮パスワードでログインしています。新しいパスワードを決定してください。<br>
      パスワードは6文字以上の半角英数字または記号
      </p>

      <input type="hidden" name="_csrf" value="{{ csrf() }}">
      <input type="submit" class="btn btn-primary btn-lg btn-block" value="登録を完了">
    </form>

    <hr>

  </div>
</div>

<script>
$(function() {
  $('#invited-form input[name="invitedForm[username]"]').change(function(e) {
    var username = $(this).val();
    $('#input-group-username').removeClass('has-error');
    $('#help-block-username').html("");

    $.getJSON('/_api/check_username', {username: username}, function(json) {
      if (!json.valid) {
        $('#help-block-username').html('<i class="fa fa-warning"></i>このユーザーIDは利用できません。<br>');
        $('#input-group-username').addClass('has-error');
      }
    });
  });
});
</script>
</div>

{% endblock %}