mirror of
https://github.com/cwinfo/powerdns-admin.git
synced 2024-12-27 21:45:39 +00:00
94a923a965
If the 'otp_force' and 'otp_field_enabled' basic settings are both enabled, automatically enable 2FA for the user after login or signup, if needed, by setting a new OTP secret. Redirect the user to a welcome page for scanning the QR code. Also show the secret key in ASCII form on the user profile page for easier copying into other applications.
165 lines
9.6 KiB
HTML
165 lines
9.6 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}<title>My Profile - {{ SITE_NAME }}</title>{% endblock %}
|
|
{% block dashboard_stat %}
|
|
<!-- Content Header (Page header) -->
|
|
<section class="content-header">
|
|
<h1>
|
|
Profile
|
|
<small>Edit my profile</small>
|
|
</h1>
|
|
<ol class="breadcrumb">
|
|
<li><a href="{{ url_for('dashboard.dashboard') }}"><i class="fa fa-dashboard"></i>Home</a></li>
|
|
<li class="active">My Profile</li>
|
|
</ol>
|
|
</section>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<section class="content">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="box box-primary">
|
|
<div class="box-header with-border">
|
|
<h3 class="box-title">Edit my profile{% if session['authentication_type'] != 'LOCAL' %} [Disabled -
|
|
Authenticated externally]{% endif %}</h3>
|
|
</div>
|
|
<div class="box-body">
|
|
<!-- Custom Tabs -->
|
|
<div class="nav-tabs-custom" id="tabs">
|
|
<ul class="nav nav-tabs">
|
|
<li class="active"><a href="#tabs-personal" data-toggle="tab">Personal
|
|
Info</a></li>
|
|
{% if session['authentication_type'] == 'LOCAL' %}
|
|
<li><a href="#tabs-password" data-toggle="tab">Change Password</a></li>
|
|
{% endif %}
|
|
{% if session['authentication_type'] in ['LOCAL', 'LDAP'] %}
|
|
<li><a href="#tabs-authentication" data-toggle="tab">Authentication</a></li>
|
|
{% endif %}
|
|
</ul>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="tabs-personal">
|
|
<form role="form" method="post" action="{{ user_profile }}">
|
|
<input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
|
|
<div class="form-group">
|
|
<label for="firstname">First Name</label> <input type="text"
|
|
class="form-control" name="firstname" id="firstname"
|
|
placeholder="{{ current_user.firstname }}"
|
|
{% if session['authentication_type'] != 'LOCAL' %}disabled{% endif %}>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="lastname">Last Name</label> <input type="text" class="form-control"
|
|
name="lastname" id="lastname" placeholder="{{ current_user.lastname }}"
|
|
{% if session['authentication_type'] != 'LOCAL' %}disabled{% endif %}>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="email">E-mail</label> <input type="email" class="form-control"
|
|
name="email" id="email" placeholder="{{ current_user.email }}"
|
|
{% if session['authentication_type'] != 'LOCAL' %}disabled{% endif %}>
|
|
</div>{% if session['authentication_type'] == 'LOCAL' %}
|
|
<div class="form-group">
|
|
<button type="submit" class="btn btn-flat btn-primary">Submit</button>
|
|
</div>{% endif %}
|
|
</form>
|
|
</div>
|
|
{% if session['authentication_type'] == 'LOCAL' %}
|
|
<div class="tab-pane" id="tabs-password">
|
|
{% if not current_user.password %}
|
|
Your account password is managed via LDAP which isn't supported to change here.
|
|
{% else %}
|
|
<form action="{{ user_profile }}" method="post">
|
|
<input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
|
|
<div class="form-group">
|
|
<label for="password">New Password</label> <input type="password"
|
|
class="form-control" name="password" id="newpassword" />
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="rpassword">Re-type New Password</label> <input type="password"
|
|
class="form-control" name="rpassword" id="rpassword" />
|
|
</div>
|
|
<div class="form-group">
|
|
<button type="submit" class="btn btn-flat btn-primary">Change Password</button>
|
|
</div>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
<!-- {% if session['authentication_type'] in ['LOCAL', 'LDAP'] %} -->
|
|
<div class="tab-pane" id="tabs-authentication">
|
|
<form action="{{ user_profile }}" method="post">
|
|
<input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
|
|
<div class="form-group">
|
|
<input type="checkbox" id="otp_toggle" class="otp_toggle"
|
|
{% if current_user.otp_secret %}checked{% endif %}>
|
|
<label for="otp_toggle">Enable Two Factor Authentication</label>
|
|
{% if current_user.otp_secret %}
|
|
<div id="token_information">
|
|
<p><img id="qrcode" src="{{ url_for('user.qrcode') }}"></p>
|
|
<div style="position: relative; left: 15px">
|
|
Your secret key is: <br />
|
|
<form>
|
|
<input type=text id="otp_secret" value={{current_user.otp_secret}} readonly>
|
|
<button type=button style="position:relative; right:28px" onclick="copy_otp_secret_to_clipboard()"> <i class="fa fa-clipboard"></i> </button>
|
|
<br /><font color="red" id="copy_tooltip" style="visibility:collapse">Copied.</font>
|
|
</form>
|
|
</div>
|
|
You can use Google Authenticator (<a target="_blank"
|
|
href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2">Android</a>
|
|
- <a target="_blank"
|
|
href="https://apps.apple.com/us/app/google-authenticator/id388497605">iOS</a>)
|
|
or FreeOTP (<a target="_blank"
|
|
href="https://play.google.com/store/apps/details?id=org.fedorahosted.freeotp&hl=en">Android</a>
|
|
- <a target="_blank"
|
|
href="https://itunes.apple.com/en/app/freeotp-authenticator/id872559395?mt=8">iOS</a>)
|
|
on your smartphone to scan the QR code.
|
|
<br />
|
|
<font color="red"><strong><i>Make sure only you can see this QR Code and secret key and
|
|
nobody can capture them.</i></strong></font>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<!-- {% endif %} -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{% endblock %}
|
|
{% block extrascripts %}
|
|
<!-- TODO: add password and password confirmation comparison check -->
|
|
<script>
|
|
$(function () {
|
|
$('#tabs').tabs({
|
|
// add url anchor tags
|
|
activate: function (event, ui) {
|
|
window.location.hash = ui.newPanel.attr('id');
|
|
}
|
|
});
|
|
// re-set active tab (ui)
|
|
var activeTabIdx = $('#tabs').tabs('option', 'active');
|
|
$('#tabs li:eq(' + activeTabIdx + ')').tab('show')
|
|
});
|
|
|
|
// initialize pretty checkboxes
|
|
$('.otp_toggle').iCheck({
|
|
checkboxClass: 'icheckbox_square-blue',
|
|
increaseArea: '20%'
|
|
});
|
|
|
|
// handle checkbox toggling
|
|
$('.otp_toggle').on('ifToggled', function (event) {
|
|
var enable_otp = $(this).prop('checked');
|
|
var postdata = {
|
|
'action': 'enable_otp',
|
|
'data': {
|
|
'enable_otp': enable_otp
|
|
},
|
|
'_csrf_token': '{{ csrf_token() }}'
|
|
};
|
|
applyChanges(postdata, $SCRIPT_ROOT + '/user/profile', false, true);
|
|
});
|
|
</script>
|
|
{% endblock %}
|