login.html 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  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="hidden" name="_csrf" value="{{ _csrf() }}">
  43. <input type="submit" class="btn btn-primary btn-lg btn-block" value="Login">
  44. </form>
  45. <hr>
  46. <div class="row">
  47. {% if googleLoginEnabled() %}
  48. <div class="col-md-6">
  49. <p>Google でログイン</p>
  50. <form role="form" action="/login/google" method="get">
  51. <button type="submit" class="btn btn-block btn-google"><i class="fa fa-google-plus-square"></i> Login</button>
  52. <input type="hidden" name="_csrf" value="{{ _csrf() }}">
  53. </form>
  54. </div>
  55. {% endif %}
  56. {% if facebookLoginEnabled() %}
  57. <div class="col-md-6">
  58. <p>Facebook でログイン</p>
  59. <form role="form">
  60. <input type="hidden" name="_csrf" value="{{ _csrf() }}">
  61. <button type="button" id="btn-login-facebook" class="btn btn-block btn-facebook"><i class="fa fa-facebook-square"></i> Login</button>
  62. </form>
  63. </div>
  64. {% endif %}
  65. </div>
  66. {% if config.crowi['security:registrationMode'] != 'Closed' %}
  67. <p class="bottom-text"><a href="#register" id="register"><i class="fa fa-pencil"></i> 新規登録はこちら</a></p>
  68. {% endif %}
  69. </div>
  70. {% if config.crowi['security:registrationMode'] != 'Closed' %}
  71. <div class="register-dialog-inner back">
  72. <h2>新規登録</h2>
  73. {% if config.crowi['security:registrationMode'] == 'Restricted' %}
  74. <p class="alert alert-warning">
  75. この Wiki への新規登録は制限されています。<br>
  76. 利用を開始するには、新規登録後、管理者による承認が必要です。
  77. </p>
  78. {% endif %}
  79. {% if googleId %}
  80. <div class="google-info alert alert-info">
  81. <code>{{ googleEmail }}</code> この Google アカウントで登録します<br>
  82. ユーザーID、名前、パスワードを決めて登録を継続してください。
  83. </div>
  84. {% endif %}
  85. <div id="register-form-errors">
  86. {% set message = req.flash('registerWarningMessage') %}
  87. {% if message.length %}
  88. <div class="alert alert-danger">
  89. {% for msg in message %}
  90. {{ msg }}<br>
  91. {% endfor %}
  92. </div>
  93. {% endif %}
  94. {% if req.form.errors.length > 0 %}
  95. <div class="alert alert-danger">
  96. <ul>
  97. {% for error in req.form.errors %}
  98. <li>{{ error }}</li>
  99. {% endfor %}
  100. </ul>
  101. </div>
  102. {% endif %}
  103. </div>
  104. <form role="form" method="post" action="/register" id="register-form">
  105. <input type="hidden" class="form-control" name="registerForm[fbId]" value="{{ req.body.registerForm.fbId }}">
  106. <input type="hidden" class="form-control" name="registerForm[googleId]" value="{{ googleId|default(req.body.registerForm.googleId) }}">
  107. <label>ユーザーID</label>
  108. <div class="input-group" id="input-group-username">
  109. <span class="input-group-addon"><strong>@</strong></span>
  110. <input type="text" class="form-control" placeholder="記入例: taroyama" name="registerForm[username]" value="{{ req.body.registerForm.username }}" required>
  111. </div>
  112. <p class="help-block">
  113. <span id="help-block-username" class="text-danger"></span>
  114. ユーザーIDは、ユーザーページのURLなどに利用されます。半角英数字と一部の記号のみ利用できます。
  115. </p>
  116. <label>名前</label>
  117. <div class="input-group">
  118. <span class="input-group-addon"><i class="fa fa-user"></i></span>
  119. <input type="text" class="form-control" placeholder="記入例: 山田 太郎" name="registerForm[name]" value="{{ req.body.registerForm.name }}" required>
  120. </div>
  121. <label >メールアドレス</label>
  122. <div class="input-group">
  123. <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
  124. <input type="email" class="form-control" placeholder="E-mail" name="registerForm[email]" value="{{ googleEmail|default(req.body.registerForm.email) }}" required>
  125. </div>
  126. {% if config.crowi['security:registrationWhiteList'] && config.crowi['security:registrationWhiteList'].length %}
  127. <p class="help-block">
  128. この Wiki では以下のメールアドレスのみ登録可能です。
  129. </p>
  130. <ul>
  131. {% for em in config.crowi['security:registrationWhiteList'] %}
  132. <li><code>{{ em }}</code></li>
  133. {% endfor %}
  134. </ul>
  135. {% endif %}
  136. <label>パスワード</label>
  137. <div class="input-group">
  138. <span class="input-group-addon"><i class="fa fa-key"></i></span>
  139. <input type="password" class="form-control" placeholder="Password" name="registerForm[password]" required>
  140. </div>
  141. <p class="help-block">
  142. パスワードは6文字以上の半角英数字または記号
  143. </p>
  144. <input type="hidden" name="_csrf" value="{{ _csrf() }}">
  145. <input type="submit" class="btn btn-primary btn-lg btn-block" value="新規登録">
  146. </form>
  147. <hr>
  148. <div class="row">
  149. {% if googleLoginEnabled() %}
  150. <div class="col-md-6">
  151. <p>Google で登録</p>
  152. <form role="form" method="post" action="/register/google">
  153. <input type="hidden" name="_csrf" value="{{ _csrf() }}">
  154. <button type="submit" class="btn btn-block btn-google"><i class="fa fa-google-plus-square"></i> Login</button>
  155. </form>
  156. </div>
  157. {% endif %}
  158. {% if facebookLoginEnabled() %}
  159. <div class="col-md-6">
  160. <p>Facebook で登録</p>
  161. <form role="form">
  162. <button type="button" id="btn-register-facebook" class="btn btn-block btn-facebook"><i class="fa fa-facebook-square"></i> Login</button>
  163. </form>
  164. </div>
  165. {% endif %}
  166. </div>
  167. <p class="bottom-text"><a href="#login" id="login"><i class="fa fa-sign-out"></i> ログインはこちら</a></p>
  168. </div>
  169. {% endif %} {# if registrationMode == Closed #}
  170. </div>
  171. </div>
  172. {#
  173. <div class="login-footer">
  174. <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>
  175. </div>
  176. #}
  177. {% endblock %}