Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-11-06 22:15:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

register and login -> BS3

Browse Source
This commit is contained in:
psychobunny
2013-08-24 00:38:40 +08:00
parent 316077fffb
commit a008cf971d
4 changed files with 161 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
public/src/forum/register.js
View File

@@ -21,13 +21,13 @@
if(username.value.length < 3) {
username_notify.innerHTML = 'Username too short';
username_notify.className = 'label label-important';
username_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else if(username.value.length > 13) {
username_notify.innerHTML = 'Username too long';
username_notify.className = 'label label-important';
username_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else if(!usernamevalid) {
username_notify.innerHTML = 'Invalid username';
username_notify.className = 'label label-important';
username_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else {
socket.emit('user.exists', {username: username.value});
}
@@ -38,7 +38,7 @@
if(!emailvalid) {
email_notify.innerHTML = 'Invalid email address';
email_notify.className = 'label label-important';
email_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
}
else
socket.emit('user.email.exists', { email: emailEl.value });
@@ -48,31 +48,35 @@
passwordvalid = utils.isPasswordValid(password.value);
if (password.value.length < 6) {
password_notify.innerHTML = 'Password too short';
password_notify.className = 'label label-important';
password_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else if(!passwordvalid) {
password_notify.innerHTML = 'Invalid password';
password_notify.className = 'label label-important';
password_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else {
password_notify.innerHTML = 'OK!';
password_notify.className = 'label label-success';
password_notify.innerHTML = '<i class="icon icon-ok"></i>';
password_notify.parentNode.className = 'input-group-addon btn-success label-success';
}
if(password.value !== password_confirm.value) {
if(password.value !== password_confirm.value && password_confirm.value.length > 0) {
password_confirm_notify.innerHTML = 'Passwords must match!';
password_confirm_notify.className = 'label label-important';
password_confirm_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
passwordsmatch = false;
} else if (password.value === password_confirm.value && password_confirm.value.length > 0) {
password_confirm_notify.innerHTML = '<i class="icon icon-ok"></i>';
password_confirm_notify.parentNode.className = 'input-group-addon btn-success label-success';
passwordsmatch = true;
}
});
$(password_confirm).on('keyup', function() {
if(password.value !== password_confirm.value) {
password_confirm_notify.innerHTML = 'Passwords must match!';
password_confirm_notify.className = 'label label-important';
password_confirm_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
passwordsmatch = false;
}
else {
password_confirm_notify.innerHTML = 'OK!';
password_confirm_notify.className = 'label label-success';
password_confirm_notify.innerHTML = '<i class="icon icon-ok"></i>';
password_confirm_notify.parentNode.className = 'input-group-addon btn-success label-success';
passwordsmatch = true;
}
});
@@ -83,10 +87,10 @@
userexists = data.exists;
if (data.exists === true) {
username_notify.innerHTML = 'Username exists';
username_notify.className = 'label label-important';
username_notify.parentNode.className = 'input-group-addon btn-warning label-warning';
} else {
username_notify.innerHTML = 'OK!';
username_notify.className = 'label label-success';
username_notify.innerHTML = '<i class="icon icon-ok"></i>';
username_notify.parentNode.className = 'input-group-addon btn-success label-success';
}
});
@@ -95,11 +99,11 @@
if (data.exists === true) {
email_notify.innerHTML = 'Email Address exists';
email_notify.className = 'label label-important';
email_notify.className = 'label label-warning';
}
else {
email_notify.innerHTML = 'OK!';
email_notify.className = 'label label-success';
email_notify.innerHTML = '<i class="icon icon-ok"></i>';
email_notify.parentNode.className = 'input-group-addon btn-success label-success';
}
});
@@ -121,7 +125,7 @@
if (username.value.length < 2 || !usernamevalid) {
username_notify.innerHTML = 'Invalid username';
username_notify.className = 'label label-important';
username_notify.className = 'label label-warning';
validated = false;
}

53
public/templates/login.tpl
View File

@@ -1,23 +1,57 @@
<h1>Login</h1>
<div class="row-fluid">
<div class="well {login_window:spansize}">
<h4>Login via Username &amp; Password</h4>
<ol class="breadcrumb">
<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="/" itemprop="url"><span itemprop="title">Home</span></a>
</li>
<li class="active" itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Login</span>
</li>
</ol>
<div class="row">
<div class="{login_window:spansize}">
<div class="well well-lg">
<div class="alert alert-error" id="error" style="display:none">
<button type="button" class="close" data-dismiss="alert">&times;</button>
<strong>Failed Login Attempt</strong> <p></p>
</div>
<form>
<label>Username</label><input type="text" placeholder="Enter Username" name="username" id="username" /><br />
<label>Password</label><input type="password" placeholder="Enter Password" name="password" id="password" /><br />
<input type="hidden" name="_csrf" value="{token}" id="csrf-token" />
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="username" class="col-lg-2 control-label">Username</label>
<div class="col-lg-10">
<input class="form-control" type="text" placeholder="Enter Username" name="username" id="username" />
</div>
</div>
<div class="form-group">
<label for="password" class="col-lg-2 control-label">Password</label>
<div class="col-lg-10">
<input class="form-control" type="password" placeholder="Enter Password" name="password" id="password" />
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button class="btn btn-primary" id="login" type="submit">Login</button> &nbsp; <a href="/reset">Forgot Password?</a>
</div>
</div>
<input type="hidden" name="_csrf" value="{token}" id="csrf-token" />
</form>
<div id="login-error-notify" class="alert alert-danger hide">Invalid username/password</div>
</div>
</div>
<div class="well span6 {alternate_logins:display}">
<div class="col-md-6 {alternate_logins:display}">
<div class="well well-lg">
<h4>Alternative Logins</h4>
<ul class="alt-logins">
<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li>
@@ -25,6 +59,7 @@
<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
</ul>
</div>
</div>
</div>
<script type="text/javascript" src="{relative_path}/src/forum/login.js"></script>

76
public/templates/register.tpl
View File

@@ -1,16 +1,71 @@
<h1>Register</h1>
<div class="row-fluid">
<div class="well {register_window:spansize}">
<form method="post" action="{relative_path}/register">
<label for="email">Email Address</label><input type="email" name="email" placeholder="Enter Email Address" id="email" /> <span id="email-notify" class="label label-important"></span><br />
<label for="username">Username</label><input type="text" name="username" placeholder="Enter Username" id="username" /> <span id="username-notify" class="label label-success"></span> <br />
<label for="password">Password</label><input type="password" name="password" placeholder="Enter Password" id="password" /> <span id="password-notify" class="label label-important"></span> <br />
<label for="password-confirm">Confirm Password</label><input type="password" name="password-confirm" placeholder="Confirm Password" id="password-confirm" /> <span id="password-confirm-notify" class="label label-important"></span> <br />
<input type="hidden" name="_csrf" value="{token}" />
<ol class="breadcrumb">
<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="/" itemprop="url"><span itemprop="title">Home</span></a>
</li>
<li class="active" itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Register</span>
</li>
</ol>
<div class="row">
<div class="{register_window:spansize}">
<div class="well well-lg">
<form class="form-horizontal" role="form" action="{relative_path}/register" method="post">
<div class="form-group">
<label for="email" class="col-lg-4 control-label">Email Address</label>
<div class="col-lg-8">
<div class="input-group">
<input class="form-control" type="text" placeholder="Enter Email Address" name="email" id="email" />
<span class="input-group-addon">
<span id="email-notify"><i class="icon icon-circle-blank"></i></span>
</span>
</div>
</div>
</div>
<div class="form-group">
<label for="username" class="col-lg-4 control-label">Username</label>
<div class="col-lg-8">
<div class="input-group">
<input class="form-control" type="text" placeholder="Enter Username" name="username" id="username" />
<span class="input-group-addon">
<span id="username-notify"><i class="icon icon-circle-blank"></i></span>
</span>
</div>
</div>
</div>
<div class="form-group">
<label for="password" class="col-lg-4 control-label">Password</label>
<div class="col-lg-8">
<div class="input-group">
<input class="form-control" type="password" placeholder="Enter Password" name="password" id="password" />
<span class="input-group-addon">
<span id="password-notify"><i class="icon icon-circle-blank"></i></span>
</span>
</div>
</div>
</div>
<div class="form-group">
<label for="password-confirm" class="col-lg-4 control-label">Confirm Password</label>
<div class="col-lg-8">
<div class="input-group">
<input class="form-control" type="password" placeholder="Confirm Password" name="password-confirm" id="password-confirm" />
<span class="input-group-addon">
<span id="password-confirm-notify"><i class="icon icon-circle-blank"></i></span>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-offset-4 col-lg-8">
<button class="btn btn-primary" id="register" type="submit">Register Now</button>
</div>
</div>
<input type="hidden" name="_csrf" value="{token}" />
</form>
</div>
<div class="well span6 {alternate_logins:display}">
</div>
<div class="col-md-6 {alternate_logins:display}">
<div class="well well-lg">
<h4>Alternative Registration</h4>
<ul class="alt-logins">
<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li>
@@ -18,6 +73,7 @@
<li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
</ul>
</div>
</div>
</div>
<script type="text/javascript" src="{relative_path}/src/forum/register.js"></script>

8
src/routes/api.js
View File

@@ -63,12 +63,12 @@ var user = require('./../user.js'),
if (num_strategies == 0) {
data = {
'login_window:spansize': 'span12',
'login_window:spansize': 'col-md-12',
'alternate_logins:display': 'none'
};
} else {
data = {
'login_window:spansize': 'span6',
'login_window:spansize': 'col-md-6',
'alternate_logins:display': 'block'
}
for (var i=0, ii=num_strategies; i<ii; i++) {
@@ -88,12 +88,12 @@ var user = require('./../user.js'),
if (num_strategies == 0) {
data = {
'register_window:spansize': 'span12',
'register_window:spansize': 'col-md-12',
'alternate_logins:display': 'none'
};
} else {
data = {
'register_window:spansize': 'span6',
'register_window:spansize': 'col-md-6',
'alternate_logins:display': 'block'
}
for (var i=0, ii=num_strategies; i<ii; i++) {