842343a1a9
* update choose_password to have the confirmation * update commander * reverted the base * remove some spaces * nits * more nits
216 lines
7.4 KiB
Plaintext
216 lines
7.4 KiB
Plaintext
<!DOCTYPE html>
|
|
<html>
|
|
<!-- This page is displayed when someone clicks a valid 'reset password' link.
|
|
Users should feel free to add to this page (i.e. branding or security widgets)
|
|
but should be sure not to delete any of the form inputs or the javascript from the
|
|
template file. This javascript is what adds the necessary values to authenticate
|
|
this session with Parse.
|
|
The query params 'username' and 'app' hold the friendly names for your current user and
|
|
your app. You should feel free to incorporate their values to make the page more personal.
|
|
If you are missing form parameters in your POST, Parse will navigate back to this page and
|
|
add an 'error' query parameter.
|
|
-->
|
|
<head>
|
|
<title>Password Reset</title>
|
|
<style type='text/css'>
|
|
h1 {
|
|
display: block;
|
|
font: inherit;
|
|
font-size: 30px;
|
|
font-weight: 600;
|
|
height: 30px;
|
|
line-height: 30px;
|
|
margin: 45px 0px 45px 0px;
|
|
padding: 0px 8px 0px 8px;
|
|
}
|
|
|
|
.error {
|
|
color: red;
|
|
padding: 0px 8px 0px 8px;
|
|
margin: -25px 0px -20px 0px;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Open Sans', 'Helvetica Neue', Helvetica;
|
|
color: #0067AB;
|
|
margin: 15px 99px 0px 98px;
|
|
}
|
|
|
|
label {
|
|
color: #666666;
|
|
}
|
|
form {
|
|
margin: 0px 0px 45px 0px;
|
|
padding: 0px 8px 0px 8px;
|
|
}
|
|
form > * {
|
|
display: block;
|
|
margin-top: 25px;
|
|
margin-bottom: 7px;
|
|
}
|
|
|
|
button {
|
|
font-size: 22px;
|
|
color: white;
|
|
background: #0067AB;
|
|
-moz-border-radius: 5px;
|
|
-webkit-border-radius: 5px;
|
|
-o-border-radius: 5px;
|
|
-ms-border-radius: 5px;
|
|
-khtml-border-radius: 5px;
|
|
border-radius: 5px;
|
|
background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#0070BA),color-stop(100%,#00558C));
|
|
background-image: -webkit-linear-gradient(#0070BA,#00558C);
|
|
background-image: -moz-linear-gradient(#0070BA,#00558C);
|
|
background-image: -o-linear-gradient(#0070BA,#00558C);
|
|
background-image: -ms-linear-gradient(#0070BA,#00558C);
|
|
background-image: linear-gradient(#0070BA,#00558C);
|
|
-moz-box-shadow: inset 0 1px 0 0 #0076c4;
|
|
-webkit-box-shadow: inset 0 1px 0 0 #0076c4;
|
|
-o-box-shadow: inset 0 1px 0 0 #0076c4;
|
|
box-shadow: inset 0 1px 0 0 #0076c4;
|
|
border: 1px solid #005E9C;
|
|
padding: 10px 14px;
|
|
cursor: pointer;
|
|
outline: none;
|
|
display: block;
|
|
font-family: "Helvetica Neue",Helvetica;
|
|
|
|
-webkit-box-align: center;
|
|
text-align: center;
|
|
box-sizing: border-box;
|
|
letter-spacing: normal;
|
|
word-spacing: normal;
|
|
line-height: normal;
|
|
text-transform: none;
|
|
text-indent: 0px;
|
|
text-shadow: none;
|
|
}
|
|
|
|
button:hover {
|
|
background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#0079CA),color-stop(100%,#005E9C));
|
|
background-image: -webkit-linear-gradient(#0079CA,#005E9C);
|
|
background-image: -moz-linear-gradient(#0079CA,#005E9C);
|
|
background-image: -o-linear-gradient(#0079CA,#005E9C);
|
|
background-image: -ms-linear-gradient(#0079CA,#005E9C);
|
|
background-image: linear-gradient(#0079CA,#005E9C);
|
|
-moz-box-shadow: inset 0 0 0 0 #0076c4;
|
|
-webkit-box-shadow: inset 0 0 0 0 #0076c4;
|
|
-o-box-shadow: inset 0 0 0 0 #0076c4;
|
|
box-shadow: inset 0 0 0 0 #0076c4;
|
|
}
|
|
|
|
button:active {
|
|
background-image: -webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#00395E),color-stop(100%,#005891));
|
|
background-image: -webkit-linear-gradient(#00395E,#005891);
|
|
background-image: -moz-linear-gradient(#00395E,#005891);
|
|
background-image: -o-linear-gradient(#00395E,#005891);
|
|
background-image: -ms-linear-gradient(#00395E,#005891);
|
|
background-image: linear-gradient(#00395E,#005891);
|
|
}
|
|
|
|
button:disabled,
|
|
button[disabled] {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
input {
|
|
color: black;
|
|
cursor: auto;
|
|
display: inline-block;
|
|
font-family: 'Helvetica Neue', Helvetica;
|
|
font-size: 25px;
|
|
height: 30px;
|
|
letter-spacing: normal;
|
|
line-height: normal;
|
|
margin: 2px 0px 2px 0px;
|
|
padding: 5px;
|
|
text-transform: none;
|
|
vertical-align: baseline;
|
|
width: 500px;
|
|
word-spacing: 0px;
|
|
}
|
|
|
|
#password_match_info {
|
|
margin-top: 0px;
|
|
font-size: 13px;
|
|
color: red;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Reset Your Password<span id='app'></span></h1>
|
|
<noscript>We apologize, but resetting your password requires javascript</noscript>
|
|
<div class='error' id='error'></div>
|
|
<form id='form' action='#' method='POST'>
|
|
<label>New Password for <span id='username_label'></span></label>
|
|
|
|
<span>New Password</span>
|
|
<input name="new_password" type="password" id="password"/> <br>
|
|
|
|
<span>Confirm New Password</span>
|
|
<input name="confirm_new_password" type="password" id="password_confirm"/>
|
|
<span id="password_match_info"></span>
|
|
|
|
<input name='utf-8' type='hidden' value='✓' />
|
|
<input name="username" id="username" type="hidden" />
|
|
<input name="token" id="token" type="hidden" />
|
|
|
|
|
|
<button id="change_password">Change Password</button>
|
|
</form>
|
|
|
|
<script language='javascript' type='text/javascript'>
|
|
<!--
|
|
window.onload = function() {
|
|
var urlParams = {};
|
|
(function () {
|
|
var pair, // Really a match. Index 0 is the full match; 1 & 2 are the key & val.
|
|
tokenize = /([^&=]+)=?([^&]*)/g,
|
|
// decodeURIComponents escapes everything but will leave +s that should be ' '
|
|
re_space = function (s) { return decodeURIComponent(s.replace(/\+/g, " ")); },
|
|
// Substring to cut off the leading '?'
|
|
querystring = window.location.search.substring(1);
|
|
|
|
while (pair = tokenize.exec(querystring))
|
|
urlParams[re_space(pair[1])] = re_space(pair[2]);
|
|
})();
|
|
|
|
var id = urlParams['id'];
|
|
var base = PARSE_SERVER_URL;
|
|
document.getElementById('form').setAttribute('action', base + '/apps/' + id + '/request_password_reset');
|
|
document.getElementById('username').value = urlParams['username'];
|
|
document.getElementById('username_label').appendChild(document.createTextNode(urlParams['username']));
|
|
document.getElementById("password").oninput = validatePassword;
|
|
document.getElementById("password_confirm").oninput = validatePassword;
|
|
document.getElementById("change_password").disabled = true;
|
|
|
|
document.getElementById('token').value = urlParams['token'];
|
|
if (urlParams['error']) {
|
|
document.getElementById('error').appendChild(document.createTextNode(urlParams['error']));
|
|
}
|
|
if (urlParams['app']) {
|
|
document.getElementById('app').appendChild(document.createTextNode(' for ' + urlParams['app']));
|
|
}
|
|
|
|
function validatePassword() {
|
|
var pass2 = document.getElementById("password").value;
|
|
var pass1 = document.getElementById("password_confirm").value;
|
|
if(pass1 !== pass2) {
|
|
if(document.getElementById("password_confirm").value) {
|
|
document.getElementById("change_password").disabled = true;
|
|
document.getElementById("password_match_info").innerHTML = "Must match the previous entry";
|
|
}
|
|
} else {
|
|
document.getElementById("change_password").disabled = false;
|
|
document.getElementById("password_match_info").innerHTML = "";
|
|
}
|
|
//empty string means no validation error
|
|
}
|
|
|
|
}
|
|
//-->
|
|
</script>
|
|
</body>
|