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

53
public/templates/login.tpl
View File

@@ -1,23 +1,57 @@
<h1>Login</h1> <ol class="breadcrumb">
<div class="row-fluid"> <li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<div class="well {login_window:spansize}"> <a href="/" itemprop="url"><span itemprop="title">Home</span></a>
<h4>Login via Username &amp; Password</h4> </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"> <div class="alert alert-error" id="error" style="display:none">
<button type="button" class="close" data-dismiss="alert">&times;</button> <button type="button" class="close" data-dismiss="alert">&times;</button>
<strong>Failed Login Attempt</strong> <p></p> <strong>Failed Login Attempt</strong> <p></p>
</div> </div>
<form> <form class="form-horizontal" role="form">
<label>Username</label><input type="text" placeholder="Enter Username" name="username" id="username" /><br /> <div class="form-group">
<label>Password</label><input type="password" placeholder="Enter Password" name="password" id="password" /><br /> <label for="username" class="col-lg-2 control-label">Username</label>
<input type="hidden" name="_csrf" value="{token}" id="csrf-token" /> <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> <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> </form>
<div id="login-error-notify" class="alert alert-danger hide">Invalid username/password</div> <div id="login-error-notify" class="alert alert-danger hide">Invalid username/password</div>
</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> <h4>Alternative Logins</h4>
<ul class="alt-logins"> <ul class="alt-logins">
<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li> <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> <li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
</ul> </ul>
</div> </div>
</div>
</div> </div>
<script type="text/javascript" src="{relative_path}/src/forum/login.js"></script> <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> <ol class="breadcrumb">
<div class="row-fluid"> <li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<div class="well {register_window:spansize}"> <a href="/" itemprop="url"><span itemprop="title">Home</span></a>
<form method="post" action="{relative_path}/register"> </li>
<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 /> <li class="active" itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
<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 /> <span itemprop="title">Register</span>
<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 /> </li>
<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 /> </ol>
<input type="hidden" name="_csrf" value="{token}" />
<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> <button class="btn btn-primary" id="register" type="submit">Register Now</button>
</div>
</div>
<input type="hidden" name="_csrf" value="{token}" />
</form> </form>
</div> </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> <h4>Alternative Registration</h4>
<ul class="alt-logins"> <ul class="alt-logins">
<li data-url="/auth/twitter" class="twitter {twitter:display}"><i class="icon-twitter-sign icon-3x"></i></li> <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> <li data-url="/auth/facebook" class="facebook {facebook:display}"><i class="icon-facebook-sign icon-3x"></i></li>
</ul> </ul>
</div> </div>
</div>
</div> </div>
<script type="text/javascript" src="{relative_path}/src/forum/register.js"></script> <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) { if (num_strategies == 0) {
data = { data = {
'login_window:spansize': 'span12', 'login_window:spansize': 'col-md-12',
'alternate_logins:display': 'none' 'alternate_logins:display': 'none'
}; };
} else { } else {
data = { data = {
'login_window:spansize': 'span6', 'login_window:spansize': 'col-md-6',
'alternate_logins:display': 'block' 'alternate_logins:display': 'block'
} }
for (var i=0, ii=num_strategies; i<ii; i++) { for (var i=0, ii=num_strategies; i<ii; i++) {
@@ -88,12 +88,12 @@ var user = require('./../user.js'),
if (num_strategies == 0) { if (num_strategies == 0) {
data = { data = {
'register_window:spansize': 'span12', 'register_window:spansize': 'col-md-12',
'alternate_logins:display': 'none' 'alternate_logins:display': 'none'
}; };
} else { } else {
data = { data = {
'register_window:spansize': 'span6', 'register_window:spansize': 'col-md-6',
'alternate_logins:display': 'block' 'alternate_logins:display': 'block'
} }
for (var i=0, ii=num_strategies; i<ii; i++) { for (var i=0, ii=num_strategies; i<ii; i++) {