mirror of
https://github.com/jupyterhub/jupyterhub.git
synced 2025-10-18 15:33:02 +00:00
consistent block structure for login form overrides
- `{name}_input` for overriding full input - `{name}_input_attrs` for overriding input element attributes (not including id). Use `super()` to extend. - For all `name` in username, password, otp
This commit is contained in:
@@ -35,82 +35,86 @@
|
|||||||
{% if login_error %}<p class="login_error">{{ login_error }}</p>{% endif %}
|
{% if login_error %}<p class="login_error">{{ login_error }}</p>{% endif %}
|
||||||
<input type="hidden" name="_xsrf" value="{{ xsrf }}" />
|
<input type="hidden" name="_xsrf" value="{{ xsrf }}" />
|
||||||
{# Allow full override of the "label" and "input" elements of the username and password fields. #}
|
{# Allow full override of the "label" and "input" elements of the username and password fields. #}
|
||||||
{% block username_password_input_override %}
|
{% block username_input %}
|
||||||
<label for="username_input">Username:</label>
|
<label for="username_input">Username:</label>
|
||||||
<input id="username_input"
|
<input id="username_input"
|
||||||
type="text"
|
{% block username_input_attrs %}
|
||||||
autocapitalize="off"
|
type="text"
|
||||||
autocorrect="off"
|
autocapitalize="off"
|
||||||
autocomplete="username"
|
autocorrect="off"
|
||||||
class="form-control"
|
autocomplete="username"
|
||||||
name="username"
|
class="form-control"
|
||||||
val="{{ username }}"
|
name="username"
|
||||||
autofocus="autofocus"
|
val="{{ username }}"
|
||||||
{# allow adding extra HTML Input Attributes (pattern, placeholder, title, minlenght, maxlenght, ...) #}
|
autofocus="autofocus"
|
||||||
{% block username_input_attribs %}{% endblock username_input_attribs %}
|
{% endblock username_input_attrs %} />
|
||||||
/>
|
{% endblock username_input %}
|
||||||
<label for='password_input'>Password:</label>
|
{% block password_input %}
|
||||||
<input type="password"
|
<label for='password_input'>Password:</label>
|
||||||
class="form-control"
|
<input id="password_input"
|
||||||
autocomplete="current-password"
|
{% block password_input_attrs %}
|
||||||
name="password"
|
type="password"
|
||||||
id="password_input"
|
class="form-control"
|
||||||
{# allow adding extra HTML Input Attributes (pattern, placeholder, title, minlenght, maxlenght, ...) #}
|
autocomplete="current-password"
|
||||||
{% block password_input_attribs %}{% endblock password_input_attribs %}
|
name="password"
|
||||||
/>
|
{% endblock password_input_attrs %} />
|
||||||
{% endblock username_password_input_override %}
|
{% endblock password_input %}
|
||||||
{% if authenticator.request_otp %}
|
{% if authenticator.request_otp %}
|
||||||
<label for='otp_input'>{{ authenticator.otp_prompt }}</label>
|
{% block otp_input %}
|
||||||
<input class="form-control"
|
<label for="otp_input">{{ authenticator.otp_prompt }}</label>
|
||||||
autocomplete="one-time-password"
|
<input id="otp_input"
|
||||||
name="otp"
|
{% block otp_input_attrs %}
|
||||||
id="otp_input" />
|
class="form-control"
|
||||||
{% endif %}
|
autocomplete="one-time-password"
|
||||||
<div class="feedback-container">
|
name="otp"
|
||||||
<input id="login_submit"
|
{% endblock otp_input_attrs %} />
|
||||||
type="submit"
|
{% endblock otp_input %}
|
||||||
class='btn btn-jupyter form-control'
|
{% endif %}
|
||||||
value='Sign in'
|
<div class="feedback-container">
|
||||||
tabindex="3" />
|
<input id="login_submit"
|
||||||
<div class="feedback-widget hidden">
|
type="submit"
|
||||||
<i class="fa fa-spinner"></i>
|
class='btn btn-jupyter form-control'
|
||||||
</div>
|
value='Sign in'
|
||||||
</div>
|
tabindex="3" />
|
||||||
{% block login_terms %}
|
<div class="feedback-widget hidden">
|
||||||
{% if login_term_url %}
|
<i class="fa fa-spinner"></i>
|
||||||
<div id="login_terms" class="login_terms">
|
|
||||||
<input type="checkbox"
|
|
||||||
id="login_terms_checkbox"
|
|
||||||
name="login_terms_checkbox"
|
|
||||||
required />
|
|
||||||
{% block login_terms_text %}
|
|
||||||
{# allow overriding the text #}
|
|
||||||
By logging into the platform you accept the <a href="{{ login_term_url }}">terms and conditions</a>.
|
|
||||||
{% endblock login_terms_text %}
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
{% endblock login_terms %}
|
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</div>
|
||||||
{% endif %}
|
{% block login_terms %}
|
||||||
{% endblock login_container %}
|
{% if login_term_url %}
|
||||||
</div>
|
<div id="login_terms" class="login_terms">
|
||||||
{% endblock login %}
|
<input type="checkbox"
|
||||||
{% endblock main %}
|
id="login_terms_checkbox"
|
||||||
{% block script %}
|
name="login_terms_checkbox"
|
||||||
{{ super() }}
|
required />
|
||||||
<script>
|
{% block login_terms_text %}
|
||||||
if (!window.isSecureContext) {
|
{# allow overriding the text #}
|
||||||
// unhide http warning
|
By logging into the platform you accept the <a href="{{ login_term_url }}">terms and conditions</a>.
|
||||||
var warning = document.getElementById('insecure-login-warning');
|
{% endblock login_terms_text %}
|
||||||
warning.className = warning.className.replace(/\bhidden\b/, '');
|
</div>
|
||||||
}
|
{% endif %}
|
||||||
// setup onSubmit feedback
|
{% endblock login_terms %}
|
||||||
$('form').submit((e) => {
|
</div>
|
||||||
var form = $(e.target);
|
</form>
|
||||||
form.find('.feedback-container>input').attr('disabled', true);
|
{% endif %}
|
||||||
form.find('.feedback-container>*').toggleClass('hidden');
|
{% endblock login_container %}
|
||||||
form.find('.feedback-widget>*').toggleClass('fa-pulse');
|
</div>
|
||||||
});
|
{% endblock login %}
|
||||||
</script>
|
{% endblock main %}
|
||||||
{% endblock script %}
|
{% block script %}
|
||||||
|
{{ super() }}
|
||||||
|
<script>
|
||||||
|
if (!window.isSecureContext) {
|
||||||
|
// unhide http warning
|
||||||
|
var warning = document.getElementById('insecure-login-warning');
|
||||||
|
warning.className = warning.className.replace(/\bhidden\b/, '');
|
||||||
|
}
|
||||||
|
// setup onSubmit feedback
|
||||||
|
$('form').submit((e) => {
|
||||||
|
var form = $(e.target);
|
||||||
|
form.find('.feedback-container>input').attr('disabled', true);
|
||||||
|
form.find('.feedback-container>*').toggleClass('hidden');
|
||||||
|
form.find('.feedback-widget>*').toggleClass('fa-pulse');
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
{% endblock script %}
|
||||||
|
Reference in New Issue
Block a user