Skip to content

Commit

Permalink
Update boostrap view
Browse files Browse the repository at this point in the history
  • Loading branch information
@afermon
afermon committed Nov 9, 2015
1 parent 554e564 commit 2778bb5
Show file tree
Hide file tree
Showing 14 changed files with 297 additions and 272 deletions.
44 changes: 21 additions & 23 deletions application/view/login/changeUserRole.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,29 +7,27 @@
<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<div class="box">
<h2>Change account type</h2>
<p>
This page is a basic implementation of the upgrade-process.
User can click on that button to upgrade their accounts from
"basic account" to "premium account". This script simple offers
a click-able button that will upgrade/downgrade the account instantly.
In a real world application you would implement something like a
pay-process.
</p>
<p>
Please note: This whole process has been renamed from AccountType (v3.0) to UserRole (v3.1).
</p>
<h2>Change account type</h2>
<p>
This page is a basic implementation of the upgrade-process.
User can click on that button to upgrade their accounts from
"basic account" to "premium account". This script simple offers
a click-able button that will upgrade/downgrade the account instantly.
In a real world application you would implement something like a
pay-process.
</p>
<p>
Please note: This whole process has been renamed from AccountType (v3.0) to UserRole (v3.1).
</p>

<h2>Currently your account type is: <?php echo Session::get('user_account_type'); ?></h2>
<!-- basic implementation for two account types: type 1 and type 2 -->
<form action="<?php echo Config::get('URL'); ?>login/changeUserRole_action" method="post">
<?php if (Session::get('user_account_type') == 1) { ?>
<input type="submit" name="user_account_upgrade" value="Upgrade my account (to Premium User)" />
<?php } else if (Session::get('user_account_type') == 2) { ?>
<input type="submit" name="user_account_downgrade" value="Downgrade my account (to Basic User)" />
<?php } ?>
</form>
</div>
<h2>Currently your account type is: <?php echo Session::get('user_account_type'); ?></h2>
<!-- basic implementation for two account types: type 1 and type 2 -->
<form action="<?php echo Config::get('URL'); ?>login/changeUserRole_action" method="post">
<?php if (Session::get('user_account_type') == 1) { ?>
<input class="btn btn-success" type="submit" name="user_account_upgrade" value="Upgrade my account (to Premium User)" />
<?php } else if (Session::get('user_account_type') == 2) { ?>
<input class="btn btn-warning" type="submit" name="user_account_downgrade" value="Downgrade my account (to Basic User)" />
<?php } ?>
</form>
</div>
</div>
33 changes: 16 additions & 17 deletions application/view/login/editAvatar.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,26 +7,25 @@
<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<div class="box">
<h3>Upload an Avatar</h3>
<h3>Upload an Avatar</h3>

<div class="feedback info">
If you still see the old picture after uploading a new one: Hard-Reload the page with F5! Your browser doesn't
realize there's a new image as new and old one have the same filename.
</div>
<p>
If you still see the old picture after uploading a new one: Hard-Reload the page with F5! Your browser doesn't
realize there's a new image as new and old one have the same filename.
</p>

<form action="<?php echo Config::get('URL'); ?>login/uploadAvatar_action" method="post" enctype="multipart/form-data">
<form action="<?php echo Config::get('URL'); ?>login/uploadAvatar_action" method="post" enctype="multipart/form-data">
<div class="form-group"
<label for="avatar_file">Select an avatar image from your hard-disk (will be scaled to 44x44 px, only .jpg currently):</label>
<input type="file" name="avatar_file" required />
<input type="file" id="avatar_file" name="avatar_file" required />
<!-- max size 5 MB (as many people directly upload high res pictures from their digital cameras) -->
<input type="hidden" name="MAX_FILE_SIZE" value="5000000" />
<input type="submit" value="Upload image" />
</form>
</div>

<div class="box">
<h3>Delete your avatar</h3>
<p>Click this link to delete your (local) avatar: <a href="<?php echo Config::get('URL'); ?>login/deleteAvatar_action">Delete your avatar</a>
</div>
</div>
<input type="hidden" name="MAX_FILE_SIZE" value="5000000" />
<input class="btn btn-primary" type="submit" value="Upload image" />
</form>

<h3>Delete your avatar</h3>
<p>Click this link to delete your (local) avatar: <a class="btn btn-danger" href="<?php echo Config::get('URL'); ?>login/deleteAvatar_action">Delete your avatar</a>

</div>
</div>
17 changes: 8 additions & 9 deletions application/view/login/editUserEmail.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,16 +7,15 @@
<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<div class="box">
<h2>Change your email address</h2>
<h2>Change your email address</h2>

<form action="<?php echo Config::get('URL'); ?>login/editUserEmail_action" method="post">
<label>
New email address: <input type="text" name="user_email" required />
</label>
<input type="submit" value="Submit" />
</form>
</div>
<form class="form-inline" action="<?php echo Config::get('URL'); ?>login/editUserEmail_action" method="post">
<div class="form-group">
<label for="user_email">New email address:</label>
<input type="text" id="user_email" name="user_email" required />
</div>
<input class="btn btn-primary" type="submit" value="Submit" />
</form>
</div>
</div>

23 changes: 11 additions & 12 deletions application/view/login/editUsername.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,18 +7,17 @@
<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<div class="box">
<h2>Change your username</h2>
<h2>Change your username</h2>

<form action="<?php echo Config::get('URL'); ?>login/editUserName_action" method="post">
<!-- btw http://stackoverflow.com/questions/774054/should-i-put-input-tag-inside-label-tag -->
<label>
New username: <input type="text" name="user_name" required />
</label>
<!-- set CSRF token at the end of the form -->
<input type="hidden" name="csrf_token" value="<?= Csrf::makeToken(); ?>" />
<input type="submit" value="Submit" />
</form>
</div>
<form class="form-inline" action="<?php echo Config::get('URL'); ?>login/editUserName_action" method="post">
<!-- btw http://stackoverflow.com/questions/774054/should-i-put-input-tag-inside-label-tag -->
<div class="form-group">
<label for="user_name">New username:</label>
<input type="text" name="user_name" id="user_name" required />
</div>
<!-- set CSRF token at the end of the form -->
<input type="hidden" name="csrf_token" value="<?= Csrf::makeToken(); ?>" />
<input class="btn btn-primary" type="submit" value="Submit" />
</form>
</div>
</div>
82 changes: 46 additions & 36 deletions application/view/login/index.php
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,29 @@
<div class="container">

<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<div class="login-page-box">
<div class="table-wrapper">

<!-- login box on left side -->
<div class="login-box">
<h2>Login here</h2>
<div class="row">
<div class="col-md-12">
<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>
</div>
<div class="row">
<div class="col-xs-6">
<div class="well">
<form action="<?php echo Config::get('URL'); ?>login/login" method="post">
<input type="text" name="user_name" placeholder="Username or email" required />
<input type="password" name="user_password" placeholder="Password" required />
<label for="set_remember_me_cookie" class="remember-me-label">
<input type="checkbox" name="set_remember_me_cookie" class="remember-me-checkbox" />
Remember me for 2 weeks
</label>



<div class="form-group">
<label for="user_name">Username</label>
<input class="form-control" type="text" name="user_name" id="user_name" placeholder="Username or email" required />
</div>
<div class="form-group">
<label for="user_password" >Password</label>
<input class="form-control" type="password" id="user_password" name="user_password" placeholder="Password" required />
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="set_remember_me_cookie" class="remember-me-checkbox" />
Remember me for 2 weeks
</label>
</div>
<!-- when a user navigates to a page that's only accessible for logged a logged-in user, then
the user is sent to this page here, also having the page he/she came from in the URL parameter
(have a look). This "where did you came from" value is put into this form to sent the user back
Expand All @@ -24,27 +32,29 @@
<?php if (!empty($this->redirect)) { ?>
<input type="hidden" name="redirect" value="<?php echo $this->redirect ?>" />
<?php } ?>
<!--
set CSRF token in login form, although sending fake login requests mightn't be interesting gap here.
If you want to get deeper, check these answers:
1. natevw's http://stackoverflow.com/questions/6412813/do-login-forms-need-tokens-against-csrf-attacks?rq=1
2. http://stackoverflow.com/questions/15602473/is-csrf-protection-necessary-on-a-sign-up-form?lq=1
3. http://stackoverflow.com/questions/13667437/how-to-add-csrf-token-to-login-form?lq=1
-->
<input type="hidden" name="csrf_token" value="<?= Csrf::makeToken(); ?>" />
<input type="submit" class="login-submit-button" value="Log in"/>
<!--
set CSRF token in login form, although sending fake login requests mightn't be interesting gap here.
If you want to get deeper, check these answers:
1. natevw's http://stackoverflow.com/questions/6412813/do-login-forms-need-tokens-against-csrf-attacks?rq=1
2. http://stackoverflow.com/questions/15602473/is-csrf-protection-necessary-on-a-sign-up-form?lq=1
3. http://stackoverflow.com/questions/13667437/how-to-add-csrf-token-to-login-form?lq=1
-->
<input type="hidden" name="csrf_token" value="<?= Csrf::makeToken(); ?>" />
<input type="submit" class="btn btn-success btn-block" value="Log in"/>
</form>
<div class="link-forgot-my-password">
<a href="<?php echo Config::get('URL'); ?>login/requestPasswordReset">I forgot my password</a>
</div>
</div>

<!-- register box on right side -->
<div class="register-box">
<h2>No account yet ?</h2>
<a href="<?php echo Config::get('URL'); ?>login/register">Register</a>
<a class="btn btn-default btn-block" href="<?php echo Config::get('URL'); ?>login/requestPasswordReset">I forgot my password</a>
</div>

</div>
<div class="col-xs-6">
<p class="lead">Register now for <span class="text-success">FREE</span></p>
<ul class="list-unstyled" style="line-height: 2">
<li><span class="glyphicon glyphicon-ok text-success"></span> See all your orders</li>
<li><span class="glyphicon glyphicon-ok text-success"></span> Fast re-order</li>
<li><span class="glyphicon glyphicon-ok text-success"></span> Save your favorites</li>
<li><span class="glyphicon glyphicon-ok text-success"></span> Fast checkout</li>
<li><span class="glyphicon glyphicon-ok text-success"></span> Get a gift <small>(only new customers)</small></li>
</ul>
<p><a class="btn btn-info btn-block" href="<?php echo Config::get('URL'); ?>login/register">Register</a></p>
</div>
</div>
</div>
62 changes: 37 additions & 25 deletions application/view/login/register.php
View file
Original file line number Diff line number Diff line change
@@ -1,37 +1,49 @@
<div class="container">

<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>
<div class="row">
<div class="col-md-12"

<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

</div>
<!-- login box on left side -->
<div class="login-box" style="width: 50%; display: block;">
<div class="col-md-6 col-md-offset-3 well text-center">
<h2>Register a new account</h2>

<!-- register form -->
<form method="post" action="<?php echo Config::get('URL'); ?>login/register_action">
<!-- the user name input field uses a HTML5 pattern check -->
<input type="text" pattern="[a-zA-Z0-9]{2,64}" name="user_name" placeholder="Username (letters/numbers, 2-64 chars)" required />
<input type="text" name="user_email" placeholder="email address (a real address)" required />
<input type="password" name="user_password_new" pattern=".{6,}" placeholder="Password (6+ characters)" required autocomplete="off" />
<input type="password" name="user_password_repeat" pattern=".{6,}" required placeholder="Repeat your password" autocomplete="off" />

<div class="form-group">
<input class="form-control" type="text" pattern="[a-zA-Z0-9]{2,64}" name="user_name" placeholder="Username (letters/numbers, 2-64 chars)" required />
</div>
<div class="form-group">
<input class="form-control" type="text" name="user_email" placeholder="email address (a real address)" required />
</div>
<div class="form-group">
<input class="form-control" type="password" name="user_password_new" pattern=".{6,}" placeholder="Password (6+ characters)" required autocomplete="off" />
</div>
<div class="form-group">
<input class="form-control" type="password" name="user_password_repeat" pattern=".{6,}" required placeholder="Repeat your password" autocomplete="off" />
</div>
<!-- show the captcha by calling the login/showCaptcha-method in the src attribute of the img tag -->
<img id="captcha" src="<?php echo Config::get('URL'); ?>login/showCaptcha" />
<input type="text" name="captcha" placeholder="Please enter above characters" required />

<!-- quick & dirty captcha reloader -->
<a href="#" style="display: block; font-size: 11px; margin: 5px 0 15px 0; text-align: center"
onclick="document.getElementById('captcha').src = '<?php echo Config::get('URL'); ?>login/showCaptcha?' + Math.random(); return false">Reload Captcha</a>
<div class="col-md-6 col-md-offset-3">
<img class="img-responsive" id="captcha" src="<?php echo Config::get('URL'); ?>login/showCaptcha" />
<!-- quick & dirty captcha reloader -->
<a href="#" onclick="document.getElementById('captcha').src = '<?php echo Config::get('URL'); ?>login/showCaptcha?' + Math.random(); return false">Reload Captcha</a>
</div>
<div class="form-group">
<input class="form-control" type="text" name="captcha" placeholder="Please enter above characters" required />
</div>

<input type="submit" value="Register" />
<input class="btn btn-success" type="submit" value="Register" />
</form>
</div>
<div class="col-md-12">
<p>
Please note: This captcha will be generated when the img tag requests the captcha-generation
(= a real image) from YOURURL/login/showcaptcha. As this is a client-side triggered request, a
$_SESSION["captcha"] dump will not show the captcha characters. The captcha generation
happens AFTER the request that generates THIS page has been finished.
</p>
</div>
</div>
<div class="container">
<p style="display: block; font-size: 11px; color: #999;">
Please note: This captcha will be generated when the img tag requests the captcha-generation
(= a real image) from YOURURL/login/showcaptcha. As this is a client-side triggered request, a
$_SESSION["captcha"] dump will not show the captcha characters. The captcha generation
happens AFTER the request that generates THIS page has been finished.
</p>
</div>

25 changes: 11 additions & 14 deletions application/view/login/requestPasswordReset.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,17 @@
<div class="page-header">
<h1>Request a password reset</h1>
</div>
<div class="box">

<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<!-- echo out the system feedback (error and success messages) -->
<?php $this->renderFeedbackMessages(); ?>

<!-- request password reset form box -->
<form method="post" action="<?php echo Config::get('URL'); ?>login/requestPasswordReset_action">
<label>
Enter your username or email and you'll get a mail with instructions:
<input type="text" name="user_name_or_email" required />
</label>
<input type="submit" value="Send me a password-reset mail" />
</form>

</div>
<!-- request password reset form box -->
<form class="form-inline" method="post" action="<?php echo Config::get('URL'); ?>login/requestPasswordReset_action">
<div class="form-group">
<label for="user_name_or_email">Enter your username or email and you'll get a mail with instructions:</label>
<input class="form-control" type="text" id="user_name_or_email" name="user_name_or_email" required />
</div>
<input class="btn btn-success" type="submit" value="Send me a password-reset mail" />
</form>
</div>
</div>
Loading

0 comments on commit 2778bb5

Please sign in to comment.