{% 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> 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 nobody can capture it.</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 %}