kathleendeboer9.files.wordpress.com · web view2020. 2. 27. · technical documentation....

TECHNICAL DOCUMENTATION

4/25/2019Group 1:Jean-Marc JulienJeremiah RiceJet HerKathleen DeboerKristen Kangas

Table of ContentsCODE OVERVIEW....................................................................................................................... 3

about-us.html........................................................................................................................ 3

contact.html...........................................................................................................................3

delete.php..............................................................................................................................3

index.html..............................................................................................................................3

index.php...............................................................................................................................3

insert.php...............................................................................................................................3

insert_marriage.php..............................................................................................................3

insert_name_change.php......................................................................................................3

login.html...............................................................................................................................3

logout.php............................................................................................................................. 3

processregister.php...............................................................................................................3

register.html.......................................................................................................................... 3

style.css..................................................................................................................................3

styles.css................................................................................................................................3

update.php............................................................................................................................ 3

ERD DIAGRAM............................................................................................................................4

Entity Relationship Diagram:..................................................................................................4

TABLE SCHEMAS........................................................................................................................ 5

Users Table............................................................................................................................ 5

Person Table.......................................................................................................................... 5

Photo Table............................................................................................................................5

Evidence Table.......................................................................................................................5

Name_Change Table..............................................................................................................5

Marriage Table.......................................................................................................................6

SYSTEM ARCHITECTURE.............................................................................................................6

CODE DETAILS............................................................................................................................6

about-us.html........................................................................................................................ 6

contact.html...........................................................................................................................8

delete.php............................................................................................................................11

1

index.html............................................................................................................................13

index.php.............................................................................................................................15

insert.php.............................................................................................................................31

insert_marriage.php............................................................................................................34

insert_name_change.php....................................................................................................37

login.html.............................................................................................................................40

logout.php........................................................................................................................... 42

processregister.php.............................................................................................................44

register.html........................................................................................................................ 46

style.css................................................................................................................................47

styles.css.............................................................................................................................. 57

update.php.......................................................................................................................... 57

2

CODE OVERVIEW (Full code is listed at the end of this document)

about-us.htmlGives users a sense of what our company is about.

contact.htmlAllows user to contact our company.

delete.phpDeletes a person added to your family tree.

index.htmlThe main landing page for the website.

index.phpThe main page for the family tree application.Part of this code contains a family tree section which creates a vertical family tree and was borrowed from https://codepen.io/simplyhue/pen/pjEYGo

insert.phpAdds a person to your family tree.

insert_marriage.phpAdds marriage documentation (evidence).

insert_name_change.phpAdds a name change or birth documentation (evidence).

login.htmlAllows a user to log in to the application.

logout.phpAllows a user to log out of the application.

processregister.phpProcess the register information sent by the user to the back end for processing.

register.htmlPresents a form for the user to create a new account for registration.

style.cssThe css for the website.

styles.cssThe css for the family tree.This is an external library so the code is not included hereThe library can be found at https://codepen.io/simplyhue/pen/pjEYGo

update.phpUpdate a person’s information that is in your family tree.

3

ERD DIAGRAMBelow is the Entity Relationship Diagram (ERD), set up in a Crow’s Foot format. Underneath the ERD is a display of each table. These diagrams and table represent the database design of the RootsTech Family Tree display.

As can be seen in the diagrams and tables, the person_id acts as the primary key for the person table, then continues, acting as the foreign key for the rest of the tables. Aside from the Users (login) page, most tables have a one-to-many relationship with the Persons Table. This design allows for the retention of multiple cardinalities, which are linked to the person_id. Set in 3rd normal form, the outer tables (connected through the person_ id) can hold multiple existent-dependent entities. This causes each primary key value to remain connected to the person table. Entity Relationship Diagram:

Figure 1.1 is the ERD for the RootsTech Family Tree Application

4

TABLE SCHEMAS

Users Table

Person Table

Photo Table

Evidence Table

Name_Change Table

5

Marriage Table

Figure 1.2 presents the Tables for the RootsTech Family Tree

SYSTEM ARCHITECTUREProgramming language : PHPDatabase : SQLlite

Figure 1.3 is the Architecture for RootsTech Information System

CODE DETAILS

about-us.html

<!DOCTYPE html><html><head><meta charset="utf-8"><title>RootsTech - Plant Your Family Tree</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45">

6

</header> <br /><br /><br />  <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav>  <section class = "about"> <br/> <h3>About Us</h3> <br /> <div class = "transbox"> <p>Bringing together science and self-discovery, RootsTech helps everyone, everywhere discover the story of what led to them. Our sophisticated engineering and technology harnesses family history, combining billions of rich historical records, millions of family trees to provide people with deeply meaningful insights about who they are and where they come from.</p> </div> </section> <br /> <hr> <br /> <h4>Who We Are</h4> <br /> <div id = "sec-service"> <section class = "customer-service"> <br /> <img src = "customer-service.jpg" id = "service" alt = "Customer Service Team" height = "300"> <p> <br /><br /> We strive for complete customer satisfaction! <br /> <br /> For assistance with everything from setting up your account to adding photos; paying for your membership to linking members of your tree, our team is always here to help! With 24/7 assistance, you can get the help you need, when you need it.<br /> <br />

7

Call or email now to talk to one of our customer support associates! <br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /> </p> </section> <section class = "sec-lab"> <img src = "lab-worker.png" id = "lab" alt = "Lab Worker" height = "300"> <p id = "lab-work"> <br /><br /> Our lab technicians are experts in geneaology. <br /> <br /> With our state-of-the-art system, our lab technicans are able to match your DNA with a 99% accuracy rate. <br /> <br /> The goal of our lab technicians is to efficiently and accurately match you with your family members. <br /> <br /> This information will allow you to grow your family tree and discover your roots. <br /> </p> </section> </div> <footer> <hr>  <p id = "copy">© 2019 | RootsTech Inc.</p>  <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height = "30"></a> <a href = "#"><img src = "instagram.jpg" alt = "Instagram icon" height = "30"></a> <a href = "#"><img src = "twitter.jpg" alt = "Twitter icon" height = "30"></a>  </p> <p id = "links"><a href = "Privacy%20Policy.pdf">Privacy Policy</a> | <a href = "Terms%20and%20Conditions.pdf" target = "_blank">Terms & Conditions</a></p> </footer></body></html>

contact.html

<!DOCTYPE html><html>

8

<head> <meta charset="utf-8"> <title>Contact Us - RootsTech</title> <link href="style.css" rel="stylesheet" /> <script> function Submit() { alert("Your message has been received. You should receive a response from our team within 24 hours."); } </script></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav> <h3> Contact Us </h3> <form id = "contact"> <p> <label for="first">First Name: </label><input type="text" size="15" id="first" style="background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAfBJREFUWAntVk1OwkAUZkoDKza4Utm61iP0AqyIDXahN2BjwiHYGU+gizap4QDuegWN7lyCbMSlCQjU7yO0TOlAi6GwgJc0fT/fzPfmzet0crmD7HsFBAvQbrcrw+Gw5fu+AfOYvgylJ4TwCoVCs1ardYTruqfj8fgV5OUMSVVT93VdP9dAzpVvm5wJHZFbg2LQ2pEYOlZ/oiDvwNcsFoseY4PBwMCrhaeCJyKWZU37KOJcYdi27QdhcuuBIb073BvTNL8ln4NeeR6NRi/wxZKQcGurQs5oNhqLshzVTMBewW/LMU3TTNlO0ieTiStjYhUIyi6DAp0xbEdgTt+LE0aCKQw24U4llsCs4ZRJrYopB6RwqnpA1YQ5NGFZ1YQ41Z5S8IQQdP5laEBRJcD4Vj5DEsW2gE6s6g3d/YP/g+BDnT7GNi2qCjTwGd6riBzHaaCEd3Js01vwCPIbmWBRx1nwAN/1ov+/drgFWIlfKpVukyYihtgkXNp4mABK+1GtVr+SBhJDbBIubVw+Cd/TDgKO2DPiN3YUo6y/nDCNEIsqTKH1en2tcwA9FKEItyDi3aIh8Gl1sRrVnSDzNFDJT1bAy5xpOYGn5fP5JuL95ZjMIn1ya7j5dPGfv0A5eAnpZUY3n5jXcoec5J67D9q+VuAPM47D3XaSeL4AAAAASUVORK5CYII=

9

"); background-attachment: scroll; background-size: contain; background-position: 98% 50%; background-repeat: no-repeat no-repeat;"> </p> <p> <label for="last">Last Name: <input type="text" id="last"></label> <p> <label for="email">Email Address: </label><input type="text" size = "30"> </p> <textarea cols="50" rows="6" onclick="this.value=''">Message</textarea> <p> <input type="submit" value="Enter" class="button" onclick = "Submit()"> <input type="reset"> </p> </form> <br /> <hr> <br /> <section class = "contact-info"> <br /> <div class = "transbox"> <h3>Get in Touch With Us</h3> <p> <strong>Address: </strong><br /> 3080 N. 1<sup>st</sup> Street<br /> San Jose, CA<br /> 95134<br /> </p> <p> <strong>Phone Number: </strong><br /> (408) 891-6453<br /> </p> <p> We're here to help you!<br /><br /> Contact our customer satisfaction team, 24 hours a day, 7 days a week.<br /><br /> We strive for complete customer satisfaction and will do whatever we can<br /> to provide a solution for your issue. </p> </div> </section> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p>

10

<p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height = "30"></a> <a href = "#"><img src = "instagram.jpg" alt = "Instagram icon" height = "30"></a> <a href = "#"><img src = "twitter.jpg" alt = "Twitter icon" height = "30"></a> </p> <p id = "links"><a href = "Privacy%20Policy.pdf">Privacy Policy</a> | <a href = "Terms%20and%20Conditions.pdf" target = "_blank">Terms & Conditions</a></p> </footer></body></html>

delete.php

<?php// Start the sessionsession_start(); ?>

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <?php if($_SESSION['logged_in'] == true){ ?> <li><a href = "logout.php">Log Out</a></li> <li><a href = "index.php">Family Tree</a></li>

<?php }else{

11

?> <li><a href = "register.html">Register</a></li> <li><a href = "login.php">Log In</a></li> <?php } ?>

</ul> </nav> <br><br><br> <?

//select the databse $db = new SQLite3('490.db'); //person table $person_id = $_GET['person'];

//delete all $db->query("delete from person where person_id= $person_id"); $db->query("delete from photos where person_id= $person_id"); $db->query("delete from name_change where person_id= $person_id"); $db->query("delete from evidence"); $db->query("delete from marriage"); echo("The person data has been deleted, click on family tree to go back and view your

family tree"); ?> <br><br><br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =

"30"></a> <a href = "#"><img src = "instagram.jpg" alt = "Instagram icon" height = "30"></a> <a href = "#"><img src = "twitter.jpg" alt = "Twitter icon" height = "30"></a>

</p> <p id = "links"><a href = "Privacy Policy.pdf">Privacy Policy</a> | <a href =

"terms.pdf">Terms & Conditions</a></p> </footer>

12

</body></html>

index.html

<!DOCTYPE html><html><head><meta charset="utf-8"><title>RootsTech - Plant Your Family Tree</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br />  <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav>  <section class = "plant"> <br /> <h3>Plant Your Family Tree</h3> <div class = "transbox"> <br /> <h4>Dig up your roots now!</h4> <p> Use our FamilyTreePlanter™ tool to plant or water your family tree: <ul> <li>Start with your information - plant the seeds</li> <li>Add relationships - water your tree</li> <li>Add family members - dig up your roots</li> </ul> </p> <p align = "center">

13

<button type = "button" class = "btnplant" ><a href = "register.html">Plant My Family Tree</a></button> <button type = "button" class = "btnwater" ><a href = "login.html">Water My Family Tree</a></button>

</p> <br /> </div> </section> <br /><br /> <div id = "kit"> <section class="info"> <img src = "dnakit.png" id = "DNAkit" alt = "DNA Kit" height = "350"> <br> Discover your ancestors and learn more about your family history by planting a

family tree with RootsTech! With our new FamilyTreePlanter™ tool, you can plant your family tree, upload photos and important documents, discover your family history, and much more. Come plant your tree and <em>dig up your roots</em>!

<br /><br /> <button type = "button" class = "purchase" ><a href = "#">Purchase a DNA

Kit</a></button> </section> <section class = "tree"> <img src="tree.jpg" id = "tree" alt="Family tree graphic" height="350"> <br /> For only $20 per month, you can plant and water your own family tree. Create

family members, establish relationships, and water your family tree with new information. <em>Watch your tree grow</em>!

<br /><br /> <button type = "button" class = "membership" ><a href = "#">Purchase a Monthly

Membership</a></button> </section> </div> <footer> <hr>  <p id = "copy">© 2019 | RootsTech Inc.</p>  <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =


 </p>

14

<p id = "links"><a href = "Privacy%20Policy.pdf">Privacy Policy</a> | <a href = "Terms%20and%20Conditions.pdf" target = "_blank">Terms & Conditions</a></p>

</footer></body></html>

index.php


<!DOCTYPE html><html><head><meta charset="utf-8"><title>RootsTech</title><link rel="stylesheet" href="styles.css"><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "#">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <?php if($_SESSION['logged_in'] == true){ ?> <li><a href = "logout.php">Log Out</a></li> <?php }else{ ?> <li><a href = "register.html">Register</a></li> <li><a href = "login.php">Log In</a></li> <?php }

15

?>

</ul> </nav> <br> <?

if($_POST['user_id'] != null and $_POST['password'] != null){

$user_id = str_replace("@", "", $_POST['user_id']);

// Set session variables $_SESSION["user_id"] = $user_id; $_SESSION["password"] = $_POST['password']; } if($_SESSION['user_id'] != null and $_SESSION['password'] != null){ $_SESSION["user_id"] = str_replace("@", "", $_SESSION["user_id"]); $user_id=$_SESSION["user_id"]; $password=$_SESSION["password"];

//select the database $db = new SQLite3('490.db'); $results = $db->query("SELECT * from users where user_id='$user_id' and

password='$password'"); //$results = $db->query("SELECT * from users"); while ($row = $results->fetchArray()) {

$_SESSION['logged_in']=true;

//echo $_SESSION['user_id']; } } if($_SESSION['logged_in'] != true){ echo("Your user name and password did not work, please click log in to try again");

16

exit; } $person_id=$_GET['person']; $main_person_id=$_GET['person'];

if($person_id==null){ $person_id="78"; } $mother_id = ""; $father_id = ""; $grandmother1_id = ""; $grandfather1_id = ""; $grandmother2_id = ""; $grandfather2_id = ""; $birth_date=""; $death_date=""; $gender="";

//get data from person $results = $db->query("SELECT * from person where person_id=".$person_id); while ($row = $results->fetchArray()) {

//get data for mother $mother_id = $row['mother_id']; $main_mother_id = $row['mother_id']; $birth_date = $row['birth_date']; $death_date = $row['death_date']; $main_birth_date = $row['birth_date']; $main_death_date = $row['death_date']; $gender = $row['gender']; $results1 = $db->query("SELECT * from person where person_id=".$mother_id); while ($row1 = $results1->fetchArray()) {

$grandmother1_id = $row1['mother_id']; $grandfather1_id = $row1['father_id']; } $father_id = $row['father_id']; $main_father_id = $row['father_id']; $results2 = $db->query("SELECT * from person where person_id=".$father_id);

17

while ($row2 = $results2->fetchArray()) {

$grandmother2_id = $row2['mother_id']; $grandfather2_id = $row2['father_id']; } } //get data from photos $results2 = $db->query("SELECT * from photos where person_id=".$person_id); while ($row2 = $results2->fetchArray()) { $file_name_main = $row2['file_name']; } if($mother_id !=""){ //get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".$mother_id); while ($row2 = $results2->fetchArray()) { $mother_file_name = $row2['file_name']; } } if($father_id !=""){ //get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".$father_id); while ($row2 = $results2->fetchArray()) { $father_file_name = $row2['file_name']; } } if($grandmother1_id !=""){ //get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".

$grandmother1_id); while ($row2 = $results2->fetchArray()) { $grandmother1_file_name = $row2['file_name']; } } if($grandmother2_id !=""){

18

//get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".

$grandmother2_id); while ($row2 = $results2->fetchArray()) { $grandmother2_file_name = $row2['file_name']; } } if($grandfather1_id !=""){ //get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".

$grandfather1_id); while ($row2 = $results2->fetchArray()) { $grandfather1_file_name = $row2['file_name']; } } if($grandfather2_id !=""){ //get data from photos for mother $results2 = $db->query("SELECT * from photos where person_id=".

$grandfather2_id); while ($row2 = $results2->fetchArray()) { $grandfather2_file_name = $row2['file_name']; } } //get data from name_chane $results3 = $db->query("SELECT * from name_change where person_id=".

$person_id); while ($row3 = $results3->fetchArray()) {

$first_name = $row3['first_name']; $middle_name = $row3['middle_name']; $last_name = $row3['last_name']; $maiden_name = $row3['maiden_name']; $first_name_main = $row3['first_name']; $middle_name_main = $row3['middle_name']; $last_name_main = $row3['last_name']; $maiden_name_main = $row3['maiden_name']; }?>

19

<table align="center" cellspacing="35" ><tr> <td> STEP 1. Add a person to your family tree <br/><br/><form action="insert.php" method="post" enctype="multipart/form-data">First Name: <input type="text" name="first_name"><br>Middle Name: <input type="text" name="middle_name"><br>Maiden Name: <input type="text" name="maiden_name"><br>Last Name: <input type="text" name="last_name"><br>Mother: <select name = "mother_id"><option value="78">default</option><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on

person.person_id = name_change.person_id where person.user_id='$user_id'"); while ($row = $results10->fetchArray()) {

$person_id = $row['person_id']; $first_name = $row['first_name']; $middle_name = $row['middle_name']; $maiden_name = $row['maiden_name']; $last_name = $row['last_name']; echo("<option value='$person_id'>$first_name $middle_name $maiden_name

$last_name</option>"); }?></select><br/>Father: <select name = "father_id"><option value="78">default</option><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on


$person_id = $row['person_id']; $first_name = $row['first_name']; $middle_name = $row['middle_name'];

20

$maiden_name = $row['maiden_name']; $last_name = $row['last_name']; echo("<option value='$person_id'>$first_name $middle_name $maiden_name

$last_name</option>"); }?></select>

<br> photo<input type="file" name="image" id="image"><br/>Birth Location: <input type="text" name="birth_location"><br>Gender: <select name = "gender"> <option value="male">male</option> <option value="female">female</option></select></br><input type="submit"></form> </td></tr> <tr> <td valign="top" >STEP 2. document a name change or birth<br><br><form action="insert_name_change.php" method="post" enctype="multipart/form-

data">Person: <select name = "person_id"><option value="78">default</option><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on



$last_name</option>"); }

21

?></select><br>Date: <input type="text" name="change_date"><br>First Name: <input type="text" name="first_name"><br>Middle Name: <input type="text" name="middle_name"><br>Maiden Name: <input type="text" name="maiden_name"><br>Last Name: <input type="text" name="last_name"><br>Reason: <select name = "reason"> <option value='birth'>birth</option> <option value='name change'>name change</option></select><br/>

documentation<input type="file" name="image" id="image"><br/>

<input type="submit"></form>

</td></tr><tr> <td valign="top"> STEP 3. Document a marriage <br><br><form action="insert_marriage.php" method="post" enctype="multipart/form-data">Person: <select name = "person_id"><option value="78">default</option><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on


$person_id = $row['person_id']; $first_name = $row['first_name']; $middle_name = $row['middle_name']; $maiden_name = $row['maiden_name']; $last_name = $row['last_name'];

22

echo("<option value='$person_id'>$first_name $middle_name $maiden_name $last_name</option>");

}?></select><br>Gender: <select name = "gender"> <option value="male">male</option> <option value="female">female</option></select><br>Start Date: <input type="text" name="start_date"><br>End Date: <input type="text" name="end_date"><br>Spouse: <select name = "spouse_id"><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on

person.person_id = name_change.person_id where person.user_id='".$user_id."'"); while ($row = $results10->fetchArray()) {

$person_id1 = $row['person_id']; $first_name = $row['first_name']; $middle_name = $row['middle_name']; $maiden_name = $row['maiden_name']; $last_name = $row['last_name']; echo("<option value='$person_id1'>$first_name $middle_name $maiden_name

$last_name</option>"); }?></select><br/>

documentation<input type="file" name="image" id="image"><br/>Marriage Location: <input type="text" name="marriage_location"><br></br><input type="submit"></form>

</td></tr></table> <b>FAMILY GROUP SHEET:</b></b><br> click on a person's image below to see their tree<br>

23

Update a person's information (if needed)<br><br> <table cellspacing="0" border="3"> <tr><td>image</td><td>First Name</td><td>Middle Name</td><td>Maiden

Name</td><td>Last Name</td><td>birth location</td><td>birth date</td><td>death date</td><td>gender</td><td>mother</td><td>father</td><td>delete</td><td>UPDATE</td></tr>

<?php //select the databse //$db = new SQLite3('490.db'); //get data from a table //$results = $db->query("SELECT * from person join name_change on

person.person_id = name_change.person_id join photos on person.person_id = photos.person_id where name_change.reason is null and person.user_id ='$user_id'");

$results = $db->query("SELECT * from person join name_change on person.person_id = name_change.person_id join photos on person.person_id = photos.person_id where name_change.reason is null and person.user_id ='$user_id'");

while ($row = $results->fetchArray()) {

$row_person_id = $row['person_id']; $first_name = $row['first_name']; $middle_name = $row['middle_name']; $last_name = $row['last_name']; $file_name1 = $row['file_name']; $maiden_name = $row['maiden_name']; $birth_location = $row['birth_location']; $birth_date = $row['birth_date']; $death_date = $row['death_date']; $gender = $row['gender']; $mother_id = $row['mother_id']; $father_id = $row['father_id']; echo("<form action='update.php' method='post' enctype='multipart/form-data'>"); echo("<input type='hidden' name='person_id' value='$row_person_id'>"); echo("<tr>");

echo("<td><a href='index.php?person=$row_person_id'><img height='50px' src='images/$file_name1'/></a></td><td><input type='text' value='$first_name' name='first_name' /></td><td><input type='text' value='$middle_name' name='middle_name' /></td><td><input type='text' value

='$maiden_name' name='maiden_name' /></td><td><input type='text' value='$last_name' name='last_name' /></td><td><input type='text' value='$birth_location'

24

name='birth_location' /></td><td><input type='text' value='$birth_date' name='birth_date' /></td><td><input type='text' value='$death_date' name='death_date' /></td>");

echo("<td><select name='gender'><option

value='$gender'>$gender</option><option value='male'>male</option><option value='female'>female</option></select></td>");

?> <td><select name = "mother_id"><?php $results10 = $db->query("SELECT * from name_change where

person_id='$mother_id'"); while ($row = $results10->fetchArray()) {


echo("<option selected value='$mother_id'>$first_name $middle_name $maiden_name $last_name</option>");

}?><?php $results10 = $db->query("SELECT * from person join name_change on

person.person_id = name_change.person_id and person.user_id='$user_id'"); while ($row = $results10->fetchArray()) {


$last_name</option>"); }?></select></td>

<td><select name = "father_id"><?php $results10 = $db->query("SELECT * from name_change where

person_id='$father_id'");

25

while ($row = $results10->fetchArray()) {


echo("<option selected value='$father_id'>$first_name $middle_name $maiden_name $last_name</option>");

}?><?php //select the databse // $db = new SQLite3('490.db'); //get data from a table $results10 = $db->query("SELECT * from person join name_change on

person.person_id = name_change.person_id and person.user_id='$user_id'"); while ($row = $results10->fetchArray()) {


$last_name</option>"); }?></select></td>

<?php echo("<td><a href='delete.php?person=$row_person_id'>delete</a></td>"); echo("<td><input type='submit' value='UPDATE'></td>"); echo("</tr></form>");

}?></table> <br><br>

26

<div class="tree"><ul>

<li><br><br> <b><?php echo("$first_name_main $middle_name_main

$maiden_name_main $last_name_main's FAMILY TREE") ?><b></b><br><br><a href="#"><img width="200px"src="<?php echo("images/".

$file_name_main) ?>"/></a><br/><?php echo("$first_name_main $middle_name_main $maiden_name_main $last_name_main") ?><br><?php echo("$main_birth_date "."-"." $main_death_date") ?>

<br/><br/>Marriages :<?php//get data from marriage$query="SELECT * from marriage where person_id_male='".

$main_person_id."' or person_id_female='".$main_person_id."'";//echo($query);

$results3 = $db->query($query); //echo("1"); while ($row3 = $results3->fetchArray()) { //echo("2"); $person_id_male = $row3['person_id_male']; $person_id_female = $row3['person_id_female']; $start = $row3['start_date']; $end = $row3['end_date']; $marriage_id = $row3['marriage_id'];

echo("<br/>".$start." - ".$end." "); $results4 = $db->query("SELECT * from name_change where person_id=".

$person_id_female); while ($row4 = $results4->fetchArray()) { $name = $row4['first_name']." ".$row4['middle_name']." ".

$row4['maiden_name']." ".$row4['last_name']; echo($name." & "); break; } $results4 = $db->query("SELECT * from name_change where person_id=".

$person_id_male); while ($row4 = $results4->fetchArray()) { $name = $row4['first_name']." ".$row4['middle_name']." ".

$row4['maiden_name']." ".$row4['last_name'];

27

echo($name); break; } $results5 = $db->query("SELECT * from evidence where marriage_id=".

$marriage_id); while ($row5 = $results5->fetchArray()) { $file_name = $row5['file_name']; echo("<a href='images/$file_name' target='_blank' >View Document</a>");

} } ?> <br/><br/>Name Change or Birth:

<?php//get data from marriage$query="SELECT * from name_change where (reason='birth' or

reason='name change') and person_id='".$main_person_id."'";//echo($query);

$results3 = $db->query($query); //echo("1"); while ($row3 = $results3->fetchArray()) { //echo("2"); $change_date = $row3['change_date']; $file_name = $row3['image']; $first_name = $row3['first_name']; $last_name = $row3['last_name']; $middle_name = $row3['middle_name']; $maiden_name = $row3['maiden_name']; $reason = $row3['reason']; $change_id = $row3['change_id'];

echo("<br/> $change_date $reason : "); $name = $row3['first_name']." ".$row3['middle_name']." ".

$row3['maiden_name']." ".$row3['last_name'];

echo($name.", ");

28

$results5 = $db->query("SELECT * from evidence where name_change_id=".$change_id);

while ($row5 = $results5->fetchArray()) { $file_name = $row5['file_name']; echo("<a href='images/$file_name' target='_blank' >View Document</a>");

} } ?>

<ul><li>

Mother<br><?php echo(" <a href='index.php?

person=$main_mother_id'> <img width='200px'

src='images/$mother_file_name'/> </a>");?><ul>

<li>Grandmother<br>

<?php echo(" <a href='index.php?

person=$grandmother1_id'> <img width='200px'

src='images/$grandmother1_file_name'/> </a>");?>

</li> <li>

Grandfather<br><?php echo(" <a href='index.php?

person=$grandfather1_id'> <img width='200px'

src='images/$grandfather1_file_name'/> </a>");

29

?></li>

</ul></li><li>

Father<br><?php echo(" <a href='index.php?person=$main_father_id'> <img width='200px'

src='images/$father_file_name'/> </a>");?><ul>

<li>Grandmother<br>

<?php echo(" <a href='index.php?

person=$grandmother2_id'> <img width='200px'

src='images/$grandmother2_file_name'/> </a>");?>

</li> <li>

Grandfather<br><?php echo(" <a href='index.php?

person=$grandfather2_id'> <img width='200px'

src='images/$grandfather2_file_name'/> </a>");?>

</li></ul>

</li>

</ul></li>

</ul></li>

</ul>

30

</div>

<footer style="display:inline-block; bottom:0; width:100%; margin-top:100; padding:100;"> <br><br> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =


</p> <p id = "links"><a href = "#">Privacy Policy</a> | <a href = "#">Terms &

Conditions</a></p> </footer></body></html>

insert.php


<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li>

31

<li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <?php if($_SESSION['logged_in'] == true){ ?> <li><a href = "logout.php">Log Out</a></li> <li><a href = "index.php">Family Tree</a></li>

<?php }else{ ?> <li><a href = "register.html">Register</a></li> <li><a href = "login.php">Log In</a></li> <?php } ?>

</ul> </nav> <br><br><br> <? $user_id=$_SESSION['user_id']; //select the databse $db = new SQLite3('490.db'); //person table $mother_id = $_POST['mother_id']; $father_id = $_POST['father_id']; //$birth-date = $_POST['birth-date']; //$death_date = $_POST['death_date']; $birth_location = $_POST['birth_location']; $gender = $_POST['gender']; $query="insert into

person(user_id,mother_id,father_id,death_date,birth_location,gender) values('$user_id','$mother_id','$father_id','$death_date','$birth_location','$gender')";

$db->query($query); $last_row="";

$results10 = $db->query("SELECT last_insert_rowid() as 'last_row'");

32

while ($row = $results10->fetchArray()) { $last_row = $row['last_row']; //echo($last_row); } //name_change $first_name = $_POST['first_name']; $middle_name = $_POST['middle_name']; $last_name = $_POST['last_name']; $maiden_name = $_POST['maiden_name']; $query="insert into

name_change(first_name,middle_name,last_name,maiden_name,person_id) values('$first_name','$middle_name','$last_name','$maiden_name','$last_row')";

$db->query($query); if(isset($_FILES['image'])){ $errors= array(); $file_name = $_FILES['image']['name']; $file_size =$_FILES['image']['size']; $file_tmp =$_FILES['image']['tmp_name']; $file_type=$_FILES['image']['type']; //$file_ext=strtolower(end(explode('.',$_FILES['image']['name']))); $extensions= array("jpeg","jpg","png","JPEG","JPG","PNG"); //if(in_array($file_ext,$extensions)=== false){ // $errors[]="extension not allowed, please choose a JPEG or PNG file."; //} if($file_size > 2097152){ $errors[]='File size must be excately 2 MB'; } if(empty($errors)==true){ move_uploaded_file($file_tmp,"images/".$file_name); }else{ print_r($errors); } //photos if($file_name !=null and $file_name != ""){ $query="insert into photos(file_name,person_id) values('$file_name','$last_row')"; }else{

33

$query="insert into photos(file_name,person_id) values('default_user_female.png','$last_row')";

} $db->query($query); } echo("The person has been added, click the family tree button to go back to your

family tree."); ?> <br><br><br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =



"terms.pdf">Terms & Conditions</a></p> </footer></body></html>

insert_marriage.php


<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header>

34

<img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <?php if($_SESSION['logged_in'] == true){ ?> <li><a href = "logout.php">Log Out</a></li> <li><a href = "index.php">Family Tree</a></li>


</ul> </nav> <br><br><br> <?

//select the databse $db = new SQLite3('490.db'); //marriage table $person_id = $_POST['person_id']; $start_date = $_POST['start_date']; $end_date = $_POST['end_date']; $spouse_id = $_POST['spouse_id']; $marriage_location = $_POST['marriage_location']; $gender = $_POST['gender']; $file_name = $_POST['image']; $person_id_male=""; $person_id_female=""; if($gender=="male"){

35

$person_id_male=$person_id; $person_id_female=$spouse_id; }else{ $person_id_male=$spouse_id; $person_id_female=$person_id; } $query="insert into

marriage(person_id_male,person_id_female,start_date,end_date,location) values('$person_id_male','$person_id_female','$start_date','$end_date','$marriage_location')";

//echo($query); $db->query($query); $last_row="";

$results10 = $db->query("SELECT last_insert_rowid() as 'last_row'"); while ($row = $results10->fetchArray()) { $last_row = $row['last_row']; //echo($last_row); } //evidence //$first_name = $_POST['first_name']; // $last_name = $_POST['last_name']; //$maiden_name = $_POST['maiden_name']; if(isset($_FILES['image'])){ $errors= array(); $file_name = $_FILES['image']['name']; $file_size =$_FILES['image']['size']; $file_tmp =$_FILES['image']['tmp_name']; $file_type=$_FILES['image']['type']; //$file_ext=strtolower(end(explode('.',$_FILES['image']['name']))); $extensions= array("jpeg","jpg","png","JPEG","JPG","PNG","PDF","pdf"); //if(in_array($file_ext,$extensions)=== false){ // $errors[]="extension not allowed, please choose a JPEG or PNG file."; //} if($file_size > 2097152){ $errors[]='File size must be excately 2 MB'; }

36

if(empty($errors)==true){ move_uploaded_file($file_tmp,"images/".$file_name); // echo "Success"; }else{ print_r($errors); } //photos $query="insert into evidence(file_name,person_id,marriage_id)

values('$file_name','$person_id','$last_row')"; $db->query($query);} echo("The marriage evidence has been added."); ?> <br><br><br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =




insert_name_change.php


<!DOCTYPE html><html><head>

37

$first_name = $_POST['first_name']; $last_name = $_POST['last_name']; $middle_name = $_POST['middle_name']; $maiden_name = $_POST['maiden_name']; $reason = $_POST['reason'];

$query="insert into name_change(person_id,reason,change_date,first_name,

last_name, maiden_name, middle_name) values('$person_id','$reason','$change_date','$first_name','$last_name', '$maiden_name','$middle_name')";

//echo($query); $db->query($query); $last_row="";

$results10 = $db->query("SELECT last_insert_rowid() as 'last_row'"); while ($row = $results10->fetchArray()) { $last_row = $row['last_row']; //echo($last_row); } //evidence //$first_name = $_POST['first_name']; // $last_name = $_POST['last_name']; //$maiden_name = $_POST['maiden_name']; if(isset($_FILES['image'])){ $errors= array(); $file_name = $_FILES['image']['name']; $file_size =$_FILES['image']['size']; $file_tmp =$_FILES['image']['tmp_name']; $file_type=$_FILES['image']['type']; //$file_ext=strtolower(end(explode('.',$_FILES['image']['name']))); $extensions= array("jpeg","jpg","png","JPEG","JPG","PNG","PDF","pdf"); //if(in_array($file_ext,$extensions)=== false){ // $errors[]="extension not allowed, please choose a JPEG or PNG file."; //} if($file_size > 2097152){ $errors[]='File size must be excately 2 MB';

39

} if(empty($errors)==true){ move_uploaded_file($file_tmp,"images/".$file_name); //echo "Success"; }else{ print_r($errors); } //photos $query="insert into evidence(file_name,person_id,name_change_id)

values('$file_name','$person_id','$last_row')"; $db->query($query);} echo("The name change evidence has been added."); ?> <br><br><br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =




login.html

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" />

40

</head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav> <h3> Log In to Water Your Tree </h3> <form method="post" action="index.php"> <br/> <br/> <br/> <br/> Email: <input value="" type="text" placeholder="[email protected]" name="user_id"> <br/> <br/> Password: <input value="" type="password" name="password"> <br/> <br/> <input type="submit" value="submit"> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> </form> <footer>

41

<hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =




logout.php


<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link rel="stylesheet" href="styles.css"><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "#">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav>

42

<br> <br> <br> <br> <br>

<?php

$_SESSION['user_id']=null;$_SESSION['password']=null;$_SESSION['logged_in']=true; echo("You have been logged out!");

?> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =


</p> <p id = "links"><a href = "#">Privacy Policy</a> | <a href = "#">Terms &

Conditions</a></p> </footer></body></html>

processregister.php

<?php

43

// Start the sessionsession_start(); ?>

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link rel="stylesheet" href="styles.css"><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav> <br> <br> <br> <br> <br>

<?php

//select the databse $db = new SQLite3('490.db'); $password1=$_POST['password1']; $password2=$_POST['password2']; $email=$_POST['email'];

44

$email = str_replace("@", "", $email); //check if all fields are filled if($password1==null or $password1=="" or $password2==null or $password2=="" or

$email==null or $email=="" or $password1 != $password2){ echo("Please click on register again and make sure to fill out all of the fields and

also make sure that your passwords match"); }else{ //check if user id already exists $result = $db->query("SELECT * from users where user_id = '$email'"); if($result->fetchArray()==null){

//try to insert into the database $query="insert into users(user_id,password) values('$email','$password1')"; $db->query($query); echo("Your your account has been created. Please click on log in to log in"); }else{ echo("That username was already registered, please click on register to try

another username"); } } ?> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =


</p>

45

<p id = "links"><a href = "Privacy Policy.pdf">Privacy Policy</a> | <a href = "terms.pdf">Terms & Conditions</a></p>

</footer></body></html>

register.html

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <li><a href = "login.html">Log In</a></li> <li><a href = "register.html">Register</a></li> </ul> </nav> <h3> Register Now to Plant Your Tree </h3> <form method="post" action="processregister.php"> <br/> <br/> <br/> <br/> Email: <input value="" type="text" placeholder="[email protected]" name="email"> <br/> <br/> Password: <input value="" type="password" name="password1"> <br/>

46

<br/> Confirm Password: <input value="" type="password" name="password2"> <br/> <br/> <b>By clicking submit, you agree to our Privacy Policy and Terms & Conditions

located <a href="terms.pdf">here</a></b><br> <input type="submit" value="submit"> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> </form> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =




style.css

nav{position: absolute;top: 0px;

left: 0px;padding: 50px 0 0 0;width: 100%;

margin-left: auto; margin-right: auto; display: flex;

47

flex-flow: row;}nav::after { content:''; display: block; clear: both;}nav ul { list-style: none; margin: 0; padding: 0px;}nav ul li:hover{ border-radius: 10px; font-weight: bold; color: #fff;}nav ul li:hover ul { display: block; font-weight: bold; color: #fff;}nav ul li a{

display: inline-block; background-color: #36648B;

color: #fff; border-radius: 10px;

padding: 10px 20px; margin-left: 3px; margin-right: 1px;

text-decoration: none;width: 125px;position: relative

}nav ul li a:visted { color: #fff;}nav ul li a:hover { border-radius: 10px; font-weight: bold; color: #fff; text-decoration: underline;}

48

/* top navigation level */nav > ul { padding-left: 200px;}nav > ul > li { float: left;}nav > ul > li > a { width: auto; padding: 10px 20px 15px 20px;}/* entire site - font family */* { font-family: Arial, Helvetica, sans-serif;}

/* footer - font color */footer { color: #000000;}

/* horizontal line - color */hr { height: 1.5px; color: #36648B; background-color: #36648B;}/* index page main section - background */.plant { background-image: url(family.jpg); background-position: center; background-repeat: no-repeat; border-radius: 10px; padding-top: 20px; padding-left: 10px; margin-top: 10px; margin-left: auto; margin-right: auto; width: 90%; height: 600px;}

/* index page main section - h3 */.plant h3 {

49

color: #fff;}

/* index page main section - translucent section for text */.plant .transbox { font-family: Arial, Helvetica, sans-serif; border-radius: 10px; padding: 5px 5px 5px 5px; font-weight: 500; margin-left: auto; margin-right: auto; background-color: #ffffff; border: 1px solid black; opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ max-width: 1000px;}

/* index page main section - paragraph formatting */.plant .transbox p { margin: 5%; max-width: 900px; font-weight: bold; color: #000000;}

/* index page list in transbox - remove bullets */ul{ list-style: none;}

/* index page buttons in transbox */.btnplant, .btnwater, .purchase, .membership { border-radius: 10px; background-color: #36648B; display: inline-block; border: none; color: #fff; padding: 10px 10px; text-align: center; text-decoration: none; font-size: 12px;}

50

/* index page button in transbox - register link formatting */.btnplant a:link { text-decoration: none; color: #fff;}

/* index page button in transbox - log-in link formatting */.btnwater a:link { text-decoration: none; color: #fff;}.purchase a:link { text-decoration: none; color: #fff;}.membership a:link { text-decoration: none; color: #fff;}

/* index page button in transbox - register link formatting */.btnplant a:visited { text-decoration: none; color: #fff;}

/* index page button in transbox - log-in formatting */.btnwater a:visited { text-decoration: none; color: #fff;}.purchase a:visited { text-decoration: none; color: #fff;}.membership a:visited { text-decoration: none; color: #fff;}/* index page button in transbox - register link formatting */.btnplant a:hover { font-weight: bold; color: #fff; font-size: 13px;

51

}

/* index page button in transbox - log-in link formatting */.btnwater a:hover { font-weight: bold; color: #fff; font-size: 13px;}.purchase a:hover { font-weight: bold; color: #fff; font-size: 13px;}.membership a:hover { font-weight: bold; color: #fff; font-size: 13px;}.info {

-webkit-flex: 1;-ms-flex:1;flex:1;padding: 10px;

order: -2; flex-shrink: 1; height: 600px;}

#kit {display: -webkit-flex;

display: -ms-flexbox;display: flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;width:90%;

margin-right: auto; margin-left: auto; -webkit-justify-content: space-evenly; -ms-justify-content: space-evenly; justify-content: space-evenly;}.tree {

-webkit-flex: 1;

52

-ms-flex:1;flex:1;padding: 20px;

order: 1; height: 600px; -webkit-flex: 1;

-ms-flex:1;flex:1;padding:5px;

order: 1; flex-shrink: 1;}

/* about us page */.about { background-image: url(vintageFamily.jpg); background-repeat: no-repeat; opacity: 0.7; height: 550px; font-size: 1.2em; font-weight: bold; background-size: cover; border-radius: 10px; padding: .5em; display: flex; flex: 1; margin-top: 20px; margin-left: auto; margin-right: auto; margin-bottom: 50px; width: 75%; color: #FFFFFF;}

.about h3 { color: #fff; text-align: center; margin-bottom: 10px;}

/* about us page main section - translucent section for text */.about .transbox { font-family: Arial, Helvetica, sans-serif; border-radius: 10px;

53

padding: 5px 5px 5px 5px; font-weight: 500; margin: 30px; background-color: #ffffff; border: 1px solid black; opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ max-width: 1000px;}

/* about us page main section - paragraph formatting */.about .transbox p { display: inline-block; margin: 5%; max-width: 900px; color: #000000; text-align: center; vertical-align: -275px;}

/* footer - copyright, social media icons, links */#copy, #icons, #links { text-align: center;}

#login-page, #register-page { height: 500px; vertical-align: top;}

h3 { text-align: center;}/* form styling - border & color */form{ text-align: center; border: 2px solid; border-color: #36648B; border-radius: 10px; width: 55%; margin-top: 35px; margin-left: auto; margin-right: auto; display: block;

54

}

/* form styling - input */input{ margin: 4px 2px 4px 2px;}

/* form styling - text boxes */input[type="text"]{ border-top: none; border-right: none; border-bottom: 1px solid black; border-left: none;}

/* form styling - text boxes (active) */input:focus{ border: 2px solid #36648B; background: lightblue;}

/* form styling - button (submit, reset) */.button{ font-size: 24px;}

/* form styling - radio button */input[type="radio"]{ margin-top: none; margin-left: 4px; margin-right: 4px; margin-bottom: none;}

.contact-info { display: block; background-image: url(building.jpg); background-position: center; background-repeat: no-repeat; background-size: contain; border-radius: 10px; width: 100%; height: 600px; margin-left: auto;

55

margin-right: auto;}

.contact-info .transbox { font-family: Arial, Helvetica, sans-serif; border-radius: 10px; padding: 10px 10px 10px 10px; margin-top: 60px; margin-left: auto; margin-right: auto; background-color: #ffffff; border: 1px solid black; opacity: 0.6; filter: alpha(opacity=60); /* For IE8 and earlier */ max-width: 500px;}

/* index page main section - paragraph formatting */.contact-info .transbox p { margin: 5%; max-width: 900px; color: #000000;}

/* about us - lab worker image */#lab { float: right; border-radius: 10px; padding-right: 20px;}

/* about us - lab worker image and text */#lab-work { text-align: center; height: 350px;}

/* about us - customer service image */#service { float: left; border-radius: 10px; padding-left: 20px;}

56

/* about us - positions section (i.e. customer service & lab) */#sec-service { height: 800px;}

/* about us - customer service image and text */.customer-service { text-align: center; background-color: #E5E5E5; height: 350px;}

styles.cssThis is an external library so it is not included hereThe library can be found at https://codepen.io/simplyhue/pen/pjEYGo

update.php


<!DOCTYPE html><html><head><meta charset="utf-8"><title>Register - RootsTech</title><link href="style.css" rel="stylesheet" /></head><body class = "body"> <header> <img src = "rootstech.jpg" alt = "RootsTech Logo" height = "45"> </header> <br /><br /><br /> <nav> <ul> <li><a href = "index.html">Home</a></li> <li><a href = "about-us.html">About Us</a></li> <li><a href = "contact.html">Contact Us</a></li> <?php if($_SESSION['logged_in'] == true){

57

?> <li><a href = "logout.php">Log Out</a></li> <li><a href = "index.php">Family Tree</a></li>


</ul> </nav> <br><br><br> <?

//select the databse $db = new SQLite3('490.db'); //person table $person_id = $_POST['person_id']; $mother_id = $_POST['mother_id']; $father_id = $_POST['father_id']; $birth_date = $_POST['birth_date']; $death_date = $_POST['death_date']; $birth_location = $_POST['birth_location']; $gender = $_POST['gender']; $first_name = $_POST['first_name']; $middle_name = $_POST['middle_name']; $last_name = $_POST['last_name']; $maiden_name = $_POST['maiden_name']; $query="update person set mother_id='$mother_id',

father_id='$father_id',death_date='$death_date',birth_location='$birth_location',birth_date='$birth_date', gender='$gender' where person_id='$person_id'";

$db->query($query); $query="update name_change set first_name='$first_name',

middle_name='$middle_name', last_name='$last_name',maiden_name='$maiden_name' where person_id='$person_id'";

58

$db->query($query); echo("The person has been updated."); ?> <br><br><br> <footer> <hr> <p id = "copy">© 2019 | RootsTech Inc.</p> <p id = "icons"><a href = "#"><img src = "fb.png" alt = "Facebook icon" height =




59

kathleendeboer9.files.wordpress.com · web view2020. 2. 27. · technical documentation....

Documents