summaryrefslogtreecommitdiffstats
path: root/install/ui
diff options
context:
space:
mode:
authorPetr Vobornik <pvoborni@redhat.com>2014-03-28 16:03:26 +0100
committerPetr Vobornik <pvoborni@redhat.com>2014-06-10 10:23:21 +0200
commit78f026bc9013347d4bc2b4c02e72b19495a1b8ac (patch)
treeef3468dea9b39d72c3d4879df746b7f05f4a22f1 /install/ui
parent6a8eeff22d98c8c32c770869427883198278d077 (diff)
downloadfreeipa-78f026bc9013347d4bc2b4c02e72b19495a1b8ac.tar.gz
freeipa-78f026bc9013347d4bc2b4c02e72b19495a1b8ac.tar.xz
freeipa-78f026bc9013347d4bc2b4c02e72b19495a1b8ac.zip
webui: apply PatternFly login theme on reset_password.html
https://fedorahosted.org/freeipa/ticket/4282 Reviewed-By: Endi Sukma Dewata <edewata@redhat.com>
Diffstat (limited to 'install/ui')
-rw-r--r--install/ui/reset_password.html126
-rw-r--r--install/ui/reset_password.js41
2 files changed, 97 insertions, 70 deletions
diff --git a/install/ui/reset_password.html b/install/ui/reset_password.html
index 883575899..2b7589226 100644
--- a/install/ui/reset_password.html
+++ b/install/ui/reset_password.html
@@ -1,12 +1,17 @@
<!DOCTYPE html>
-<html>
+<html class="login-pf">
<head>
<meta charset="utf-8">
<title>IPA: Identity Policy Audit</title>
<script type="text/javascript" src="js/libs/loader.js"></script>
<script type="text/javascript">
(function() {
- ipa_loader.styles(['ipa.css']);
+ var styles = [
+ '../ui/css/patternfly.css',
+ '../ui/css/ipa.css',
+ '../ui/ipa.css'
+ ];
+ ipa_loader.styles(styles);
ipa_loader.scripts([
'js/libs/jquery.js',
'reset_password.js'
@@ -15,55 +20,90 @@
</script>
</head>
-<body class="info-page login-page">
+<body>
- <div class="container_1">
+<div class="login-pf-body">
+<span id="badge">
+ <img src="images/login-screen-logo.png" alt="" />
+</span>
+<div class="container">
- <div class="header-logo">
- <img src="images/ipa-logo.png" /><img src="images/ipa-banner.png" />
- </div>
+<div class="row">
- <div id="formwindow">
- <h2>Reset password</h2>
+ <div class="col-sm-12">
+ <div id="brand">
+ <img src="images/product-name.png" alt="">
+ </div>
+ </div>
- <div id="invalid" class="error-box" style="display:none">
- <p id="error-msg"></p>
+ <div class="col-sm-7 col-md-6 col-lg-5 login">
+ <form class="form-horizontal" role="form" action="/ipa/session/change_password" method="post" id="reset_password">
+ <div class="form-group validation-summary-group">
+ <div class="col-sm-12 controls">
+ <div class="widget validation-summary">
+ <div class="alert alert-success" style="display:none;">
+ <span class="fa fa-check-circle-o"></span><p></p>
+ </div>
+ <div class="alert alert-danger" style="display:none;">
+ <span class="fa fa-exclamation-circle"></span><p></p>
+ </div>
+ <div class="alert alert-warning" style="display:none;">
+ <span class="fa fa-warning"></span><p></p>
+ </div>
+ </div>
+ </div>
</div>
-
- <div id="success" class="success-box" style="display:none">
- <p>Password reset was successful.
+ <div class="form-group">
+ <div class="col-sm-4 control-label">
+ <label for="user">Username</label>
+ </div>
+ <div class="col-sm-8 controls">
+ <div class="widget text-widget">
+ <input type="text" class="form-control" name="user" id="user" title="Username" accesskey="u">
+ </div>
+ </div>
</div>
-
- <form id="login">
- <ul>
- <li>
- <label for="username">Username:</label>
- <input type="text" id="username" name="username" accesskey="u" />
- </li>
- <li>
- <label for="password">Current Password:</label>
- <input type="password" id="password" name="password" accesskey="p" />
- </li>
- <li>
- <label for="new_password">New Password:</label>
- <input type="password" id="new_password" name="new_password" accesskey="n" />
- </li>
- <li>
- <label for="verify_password">Verify Password:</label>
- <input type="password" id="verify_password" name="verify_password" accesskey="v" />
- </li>
- </ul>
-
- <div class="formbutton">
- <input name="submit" value="Reset" type="submit" />
+ <div class="form-group">
+ <div class="col-sm-4 control-label">
+ <label for="old_password">Current Password</label>
+ </div>
+ <div class="col-sm-8 controls">
+ <div class="widget text-widget">
+ <input type="password" class="form-control" name="old_password" id="old_password" accesskey="p">
+ </div>
</div>
- </form>
- <div style="display:none" class="form-box" id="reset_pwd_link">
- <p><a href="#">Reset password again</a></p>
</div>
- </div>
+ <div class="form-group">
+ <div class="col-sm-4 control-label">
+ <label for="new_password">New Password</label>
+ </div>
+ <div class="col-sm-8 controls">
+ <div class="widget text-widget">
+ <input type="password" class="form-control" name="new_password" id="new_password" accesskey="n">
+ </div>
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-sm-4 control-label">
+ <label for="verify_password">Verify Password</label>
+ </div>
+ <div class="col-sm-8 controls">
+ <div class="widget text-widget">
+ <input type="password" class="form-control" id="verify_password" accesskey="v">
+ </div>
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-xs-4 col-sm-offset-4 col-sm-8 submit">
+ <input name="submit" class="btn btn-primary btn-lg" value="Reset" type="submit" />
+ </div>
+ </div>
+ </form>
</div>
-
+ <div class="col-sm-5 col-md-6 col-lg-7 details">
+ </div>
+</div>
+</div>
+</div>
</body>
-
</html>
diff --git a/install/ui/reset_password.js b/install/ui/reset_password.js
index 472a454f5..5555a17bc 100644
--- a/install/ui/reset_password.js
+++ b/install/ui/reset_password.js
@@ -87,8 +87,8 @@ RP.verify_required = function(field, value) {
RP.on_submit = function() {
- var username = $('#username').val();
- var current_password = $('#password').val();
+ var username = $('#user').val();
+ var current_password = $('#old_password').val();
var new_password = $('#new_password').val();
var verify_password = $('#verify_password').val();
@@ -108,49 +108,36 @@ RP.on_submit = function() {
RP.show_error(result.message);
} else {
RP.reset_form();
- $('#success').css('display', 'block');
- RP.hide_reset_form();
+ RP.show_success("Password reset was successful.");
}
};
RP.reset_form = function() {
- $('#invalid').css('display', 'none');
- $('#success').css('display', 'none');
- $('#password').val('');
+ $('.alert-danger').css('display', 'none');
+ $('.alert-success').css('display', 'none');
+ $('#old_password').val('');
$('#new_password').val('');
$('#verify_password').val('');
};
RP.show_error = function(message) {
- $('#error-msg').text(message);
- $('#invalid').css('display', 'block');
- $('#success').css('display', 'none');
+ $('.alert-danger > p').text(message);
+ $('.alert-danger').css('display', '');
+ $('.alert-success').css('display', 'none');
};
-RP.hide_reset_form = function() {
+RP.show_success = function(message) {
- RP.form.hide();
- RP.reset_link.show();
+ $('.alert-success > p').text(message);
+ $('.alert-danger').css('display', 'none');
+ $('.alert-success').css('display', '');
};
-RP.show_reset_form = function() {
-
- RP.reset_form();
- RP.form.show();
- RP.reset_link.hide();
-};
RP.init = function() {
- RP.form = $('#login');
- RP.reset_link = $('#reset_pwd_link');
- RP.reset_link.click(function() {
- RP.show_reset_form();
- return false;
- });
-
- $('input[name=submit]', RP.form).click(function() {
+ $('#reset_password').submit(function() {
RP.on_submit();
return false;
});