DES471: Dynamic Web 1

Week # 9

Upload your Challenge and Assignment to D2L. This will be located in Content -> Week 9 -> Graded Activities

CRUD

Last week, we finished going over how to create a registration system and how to set and utilize cookies.

Here is the end result result of our register and login pages:

The following is a link that shows how the end result of the register.php page should look like: 

https://goo.gl/Hpca91

The final result of our login.php should look like:

https://goo.gl/BjCepU

CMS

• This week, we're going to learn how to use our previous understanding of SQL to insert, update, and delete data in our database in the form of a Content Management System (CMS).
• What is a CMS? According to Wikipedia, a CMS is "A content management system (CMS)[1][2][3] is a computer application that allows publishing, editing, modifying, organizing, deleting, and maintaining content from a central interface." (https://en.wikipedia.org/wiki/Content_management_system)
• Basically, a CMS is a program that allows you to manage content using an interface. Examples of some common CMS are WordPress, SquareSpace, Joomla!, and Drupal. 
• We'll cover the usage of existing CMS in detail in Dynamic Web 2, but for now we're going to learn how to create some of the concepts behind the technology using PHP.

CMS

• We've actually built out some of the CMS already when we created the registration and login system. After all, users are content and we've created the ability to publish and use them from a central interface (the PHP pages we created). 
• Next, we're going to expand on our login and registration system to demonstrate other aspects of the CMS. More specifically, we're going to create a way to update and delete our existing data. Let's go ahead and get to how we can do that. 

Building CMS

CMS

• Updating our information is actually fairly simple. The steps are as follows:
  • Create a form for updating the user's information
  • Check the data from the form
  • Output a message to users about what information they did/didn't update.
  • Have users log in with new information. 
  • Optional: You can style this information and have the information presented on a "profile" page.

Updating Information

CMS

• We're going to create our update form in our "update.php" page
• Add the form into the div with a class of "container"
• We'll need fields for existing username, existing password, new name, new username, and new password. Again, the structure of this is going to be identical to other forms we've created earlier. 
• Be sure that the action is set to an empty string, the method is set to "Post", and the submit button has a name and value of "update"
• The answer is on the next page, but let's see if you can do this on your own.

Creating the Form

CMS

Creating the Form

<h1>Update Information</h1>
<form method="post" action="">
	<ul>
		<li>
			<label for="old_username">Enter Existing Username</label>
			<input id="old_username" type="text" name="old_username" value="" />
		</li>
		<li>
			<label for="old_password">Enter Existing Password</label>
			<input id="old_password" type="text" name="old_password" value="" />
		</li>
		<li>
			<label for="new_username">Enter New Username</label>
			<input id="new_username" type="text" name="new_username" value="" />
		</li>
		<li>
			<label for="new_password">Enter New Password</label>
			<input id="new_password" type="password" name="new_password" value=""/>
		<li>
		<li>
			<label for="new_name">Enter New Name</label>
			<input id="new_name" type="text" name="new_name" value=""/>
		<li>
			<input type="submit" name="update" value="update">
		</li>
	</ul>
</form>

CMS

Checking username and password

• Next, we're going to check to see if update was clicked and that there is a value in the old_username and old_password field. If so, we're going to save those values into variables.
• Next, we're going to query the database to see if the username exists and if the password from the form matches that from the database. If it does, we move on to the next step. If not, we throw an error. I'm going to go through this step fast, because we've already covered this in the last few weeks. See the next page for the code. 

CMS

Checking username and password

// Check to see if user has posted the information
if (isset($_POST['update']) && trim($_POST['update']) != '') {
	if (isset($_POST['old_username']) && isset($_POST['old_password']) 
		&& trim($_POST['old_username']) != '' && trim($_POST['old_password']) != '') {

		// Save and check old username and password
		$old_username = escape_quotes($_POST['old_username']);
		$old_password = escape_quotes(hash("sha512", $_POST['old_password']));

		$user = get_all_info("SELECT * FROM users WHERE Username='$old_username'");

		// Get the first instance of the user and store it into an array
		$userArray = $user->fetch_assoc();

                if(count($userArray) <= 0) {
			die("That username doesn't exist! Please type in the correct username. 
				<a href='update.php'>Back</a>");
		}
		if ($userArray['Password'] != $old_password) {
			die("Incorrect password! <a href='update.php'>Back</a>");
		}

CMS

Checking name and updating name

if ($userArray['Password'] != $old_password) {
	die("<h2>Incorrect password! <a href='update.php'>Back</a></h2>");
}

$new_name = '';
if ($_POST['new_name']) {
	// Get the existing name if users input the name
	$old_name = $userArray['Name'];

	$new_name = escape_quotes(strip_tags($_POST['new_name']));

	insert_or_update_info("UPDATE users SET Name='$new_name'
 		WHERE Name='$old_name'");

 	echo "<h2>Name has been updated. Please <a href='login.php'>log in</a> 
        with your new credentials. </h2><br>";	
} else {
	echo "<h2>Since no Name was given, Name is still " . $userArray['Name'] . "</h2><br>";
}

• Our next step is going to be checking to see if the name field was filled in. If so, we're going to set the variables for the old name and for the new name.  If not, we print a statement about the name not being updated.
• Then, we're going to update the database using an UPDATE clause and set the Name field to the new name where the old name existed. 
• We then print out a statement that says the user has been updated.

CMS

Checking name and updating name

• The next steps may seem like a lot, but most of it was just copy/pasted from register.php. 
• I'm going to check if someone set a username. 
• Then, we do the same thing in register.php, which is that we run validations on the new username. If the validations fail, we give an error message. If the validations pass, we use the UPDATE clause to update the username where the old username is. 
• Again, we print out a statement if the username was updated. Otherwise, we print a statement that says that the username wasn't updated (in case no input was placed in the new_username field)
• See the next page for the code.

CMS

// Check new username if user put it
if (trim($_POST['new_username']) != '' && isset($_POST['new_username']) ) {
	$new_username = escape_quotes(strip_tags($_POST['new_username']));

	$check = get_all_info("SELECT * FROM users WHERE Username='$new_username'");
	// Get the first instance of the user and store it into an array
	$userArray = $check->fetch_assoc();

	if (count($userArray) > 0) {
		die("<h2>That username already exists! Try creating another username. 
			<a href='register.php'>Back</a></h2>");
	}
	if (!ctype_alnum($new_username)) {
		die("<h2>Username contains special characters! Only numbers and letters 
			are permitted. <a href='update.php'>Back</a></h2>" );
	}
	if (strlen($new_username) > 20) {
		die("<h2>Username must contain less than 20 characters. 
			<a href='update.php'>Back</a></h2>" );
	}

	insert_or_update_info("UPDATE users SET Username='$new_username'
 		WHERE Username='$old_username'");

	echo "<h2>Username has been updated. Please <a href='login.php'>log in</a> 
            with your new credentials. </h2><br>";	
} else {
	echo "<h2>Since no Username was given, Username is still " 
        . $userArray['Username'] . "</h2><br>";
}

CMS

	// Check new password
	if (trim($_POST['new_password']) != '' && isset($_POST['new_password'])) {

		$new_password = escape_quotes(hash("sha512", $_POST['new_password']));

		insert_or_update_info("UPDATE users SET Password='$new_password'
	 		WHERE Password='$old_password'");

		echo "<h2>Password has been updated. Please <a href='login.php'>log in</a>
                 with your new credentials. <h2><br>";	
	} else {
		echo "<h2>Since no Password was given, Password remains the same. </h2><br>";
	}
}
else {
	echo "<h2>Please enter a username and password.</h2>";
}

• We're going to do the same thing for the password as we did for the username and name fields. 
• That is, we're going to set variable for the new password, update the field for password in the database, and then output the result. Be sure to not output the password to the screen, since that information is both sensitive and since it's serialized, won't make sense to the end user anyway.

CMS

Here is the final result of our update.php file: https://goo.gl/ON4iQn

Challenge Time!

Update Form

• Using this week's code:
• Implement the code for this week's update.php field.
• Try updating several different users that you have already created.
• Update only one field at a time and see what the output is. 
• Screenshot each of your results and place them in a folder. 
• Zip the folder and send the results to me.

Assignment 9

Update Form

• Using this week's code:
• Go back to your project and add the ability to update your login information.