login.html 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
  1. {% extends 'layout/single-nologin.html' %}
  2. {% block html_title %}Login · {% endblock %}
  3. {% block content_main %}
  4. <h1 class="login-page">
  5. {% if config.crowi['app:title'] == 'Crowi' %}
  6. <img src="/logo/135x32.png" alt="Crowi">
  7. {% else %}
  8. {{ config.crowi['app:title'] }}<br>
  9. <img src="/logo/100x11_w.png" alt="powered by Crowi">
  10. {% endif %}
  11. </h1>
  12. <div class="login-dialog-container flip-container col-md-5">
  13. <div class="login-dialog flipper {% if req.query.register or req.body.registerForm or googleId %}to-flip{% endif %}" id="login-dialog">
  14. <div class="login-dialog-inner front">
  15. <h2>ログイン</h2>
  16. <div id="login-form-errors">
  17. {% set message = req.flash('warningMessage') %}
  18. {% if message.length %}
  19. <div class="alert alert-danger">
  20. {{ message }}
  21. </div>
  22. {% endif %}
  23. {% if req.form.errors.length > 0 %}
  24. <div class="alert alert-danger">
  25. <ul>
  26. {% for error in req.form.errors %}
  27. <li>{{ error }}</li>
  28. {% endfor %}
  29. </ul>
  30. </div>
  31. {% endif %}
  32. </div>
  33. <form role="form" action="/login" method="post">
  34. <div class="input-group">
  35. <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
  36. <input type="text" class="form-control" placeholder="E-mail" name="loginForm[email]">
  37. </div>
  38. <div class="input-group">
  39. <span class="input-group-addon"><i class="fa fa-key"></i></span>
  40. <input type="password" class="form-control" placeholder="Password" name="loginForm[password]">
  41. </div>
  42. <input type="submit" class="btn btn-primary btn-lg btn-block" value="Login">
  43. </form>
  44. <hr>
  45. <div class="row">
  46. {% if googleLoginEnabled() %}
  47. <div class="col-md-6">
  48. <p>Google でログイン</p>
  49. <form role="form" action="/login/google" method="get">
  50. <button type="submit" class="btn btn-block btn-google"><i class="fa fa-google-plus-square"></i> Login</button>
  51. </form>
  52. </div>
  53. {% endif %}
  54. {% if facebookLoginEnabled() %}
  55. <div class="col-md-6">
  56. <p>Facebook でログイン</p>
  57. <form role="form">
  58. <button type="button" id="btn-login-facebook" class="btn btn-block btn-facebook"><i class="fa fa-facebook-square"></i> Login</button>
  59. </form>
  60. </div>
  61. {% endif %}
  62. </div>
  63. {% if config.crowi['security:registrationMode'] != 'Closed' %}
  64. <p class="bottom-text"><a href="#register" id="register"><i class="fa fa-pencil"></i> 新規登録はこちら</a></p>
  65. {% endif %}
  66. </div>
  67. {% if config.crowi['security:registrationMode'] != 'Closed' %}
  68. <div class="register-dialog-inner back">
  69. <h2>新規登録</h2>
  70. {% if config.crowi['security:registrationMode'] == 'Restricted' %}
  71. <p class="alert alert-warning">
  72. この Wiki への新規登録は制限されています。<br>
  73. 利用を開始するには、新規登録後、管理者による承認が必要です。
  74. </p>
  75. {% endif %}
  76. {% if googleId %}
  77. <div class="google-info alert alert-info">
  78. <code>{{ googleEmail }}</code> この Google アカウントで登録します<br>
  79. ユーザーID、名前、パスワードを決めて登録を継続してください。
  80. </div>
  81. {% endif %}
  82. <div id="register-form-errors">
  83. {% set message = req.flash('registerWarningMessage') %}
  84. {% if message.length %}
  85. <div class="alert alert-danger">
  86. {% for msg in message %}
  87. {{ msg }}<br>
  88. {% endfor %}
  89. </div>
  90. {% endif %}
  91. {% if req.form.errors.length > 0 %}
  92. <div class="alert alert-danger">
  93. <ul>
  94. {% for error in req.form.errors %}
  95. <li>{{ error }}</li>
  96. {% endfor %}
  97. </ul>
  98. </div>
  99. {% endif %}
  100. </div>
  101. <form role="form" method="post" action="/register" id="register-form">
  102. <input type="hidden" class="form-control" name="registerForm[fbId]" value="{{ req.body.registerForm.fbId }}">
  103. <input type="hidden" class="form-control" name="registerForm[googleId]" value="{{ googleId|default(req.body.registerForm.googleId) }}">
  104. <label>ユーザーID</label>
  105. <div class="input-group" id="input-group-username">
  106. <span class="input-group-addon"><strong>@</strong></span>
  107. <input type="text" class="form-control" placeholder="記入例: taroyama" name="registerForm[username]" value="{{ req.body.registerForm.username }}" required>
  108. </div>
  109. <p class="help-block">
  110. <span id="help-block-username" class="text-danger"></span>
  111. ユーザーIDは、ユーザーページのURLなどに利用されます。半角英数字と一部の記号のみ利用できます。
  112. </p>
  113. <label>名前</label>
  114. <div class="input-group">
  115. <span class="input-group-addon"><i class="fa fa-user"></i></span>
  116. <input type="text" class="form-control" placeholder="記入例: 山田 太郎" name="registerForm[name]" value="{{ req.body.registerForm.name }}" required>
  117. </div>
  118. <label >メールアドレス</label>
  119. <div class="input-group">
  120. <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
  121. <input type="email" class="form-control" placeholder="E-mail" name="registerForm[email]" value="{{ googleEmail|default(req.body.registerForm.email) }}" required>
  122. </div>
  123. {% if config.crowi['security:registrationWhiteList'] && config.crowi['security:registrationWhiteList'].length %}
  124. <p class="help-block">
  125. この Wiki では以下のメールアドレスのみ登録可能です。
  126. </p>
  127. <ul>
  128. {% for em in config.crowi['security:registrationWhiteList'] %}
  129. <li><code>{{ em }}</code></li>
  130. {% endfor %}
  131. </ul>
  132. {% endif %}
  133. <label>パスワード</label>
  134. <div class="input-group">
  135. <span class="input-group-addon"><i class="fa fa-key"></i></span>
  136. <input type="password" class="form-control" placeholder="Password" name="registerForm[password]" required>
  137. </div>
  138. <p class="help-block">
  139. パスワードは6文字以上の半角英数字または記号
  140. </p>
  141. <input type="submit" class="btn btn-primary btn-lg btn-block" value="新規登録">
  142. </form>
  143. <hr>
  144. <div class="row">
  145. {% if googleLoginEnabled() %}
  146. <div class="col-md-6">
  147. <p>Google で登録</p>
  148. <form role="form" method="post" action="/register/google">
  149. <button type="submit" class="btn btn-block btn-google"><i class="fa fa-google-plus-square"></i> Login</button>
  150. </form>
  151. </div>
  152. {% endif %}
  153. {% if facebookLoginEnabled() %}
  154. <div class="col-md-6">
  155. <p>Facebook で登録</p>
  156. <form role="form">
  157. <button type="button" id="btn-register-facebook" class="btn btn-block btn-facebook"><i class="fa fa-facebook-square"></i> Login</button>
  158. </form>
  159. </div>
  160. {% endif %}
  161. </div>
  162. <p class="bottom-text"><a href="#login" id="login"><i class="fa fa-sign-out"></i> ログインはこちら</a></p>
  163. </div>
  164. {% endif %} {# if registrationMode == Closed #}
  165. </div>
  166. </div>
  167. {#
  168. <div class="login-footer">
  169. <p>&copy; {{ now|date('Y') }} {{ config.app.title }}. <a href="" data-target="#helpModal" data-toggle="modal"><i class="fa fa-question-circle"></i> ヘルプ</a></p>
  170. </div>
  171. #}
  172. {% endblock %}