WorkingWithUserInput

//Log form
<form action="index.php" method="post" class="form">
    <p>User Name</p>
    <input type="text" name="userName"></br>
    <p>&nbsp;Password</p>
    <input type="password" name="password" class="pass"></br>
    <input type="submit" value="Submit"  class="button">
    <button type="button" value="Register" class="buttonTwo" onclick="location.href='regist.php'">Register</button>
</form></br>

<?php
echo '<link href="styleSheetLogForm.css" rel="stylesheet">';


if(isset($_SESSION['logged']) === true)
{
    echo 'Is Logged...';
}
else {
     if(isset($_POST['userName'],$_POST['password']))
    {
        $userName = trim($_POST['userName']);
        $password = trim($_POST['password']);


            if(strlen($userName)>3 && strlen($password)>3)
            {
            $info = file('regist.txt');
                foreach ($info as $v){
                    $print = explode(';', $v);

                        foreach ($print as $value){
                            $printTwo = explode(':',$value);

                                if($printTwo[0]=='Name')
                                {
                                    $user = $printTwo[1];
                                }
                                elseif($printTwo[0]=='Password')
                                {
                                    $pass = $printTwo[1];
                                }
                                if($userName == $user && $password == $pass)
                                {
                                      $_SESSION['logged']=true;
                                      header('Location: index.php');
                                }
                                else
                                {
                                    echo '<div style="color:red">'.'FAILURE!'.'</div>';
                                }

                        }

                }


            }
        }
}
?>
//Regist form


<div class="raptor">
    <form action="regist.php" method="post">
    <div id="header">
        <h1>USER REGISTRATION FORM</h1>
        <h2>register here to become a member of our website.</h2>
    </div>
     <input type="hidden" name="submitForm" value="1">
        <p class="textUserName">User Nama<span>*</span></p>
    <input type="text" name="userName" class="userName"></br>
        <p>Password<span>*</span></p>
    <input type="password" name="password" class="input"></br>
        <p>Repeat Password<span>*</span></p>
    <input type="password" name="repeatPassword" class="input"></br>
        <p>Secret Question<span>*</span></p>
    <input type="text" name="secretQuestion" class="input"></br>
        <p>Secret Answer<span>*</span></p>
    <input type="text" name="secretAnswer" class="input"></br>
        <p>Email</p>
    <input type="text" name="email" class="input"></br>
        <p>First Name<span>*</span></p>
    <input type="text" name="firstName" class="input"></br>
        <p>Last Name<span>*</span></p>
    <input type="text" name="lastName" class="input"></br>
        <p>Sex<span>*</span></p>
        <input type="radio" name="sex" value="male" class="male"><p id="male">male's</p>
        <input type="radio" name="sex" value="female" class="female"><p id="female">female's</p></br>
        <p>Birthday<span>*</span></p>
        <select name="birthday_day" id="day">
            <option value="1" selected="1">day's</option>
            <option value="1">1</option><option value="2">2</option>
            <option value="3">3</option><option value="4">4</option>
            <option value="5">5</option><option value="6">6</option>
            <option value="7">7</option><option value="8">8</option>
            <option value="9">9</option><option value="10">10</option>
            <option value="11">11</option><option value="12">12</option>
            <option value="13">13</option><option value="14">14</option>
            <option value="15">15</option><option value="16">16</option>
            <option value="17">17</option><option value="18">18</option>
            <option value="19">19</option><option value="20">20</option>
            <option value="21">21</option><option value="22">22</option>
            <option value="23">23</option><option value="24">24</option>
            <option value="25">25</option><option value="26">26</option>
            <option value="27">27</option><option value="28">28</option>
            <option value="29">29</option><option value="30">30</option>
            <option value="31">31</option>
        </select>
        <select id="month" name="birthday_month">
            <option selected="1" value="0">Month</option>
            <option value="1">Jan</option>
            <option value="2">Feb</option>
            <option value="3">Mar</option>
            <option value="4">Apr</option>
            <option value="5">May</option>
            <option value="6">Jun</option>
            <option value="7">Jul</option>
            <option value="8">Aug</option>
            <option value="9">Sept</option>
            <option value="10">Oct</option>
            <option value="11">Nov</option>
            <option value="12">Dec</option>
        </select>
        <select id="year" name="birthday_year">
            <option selected="1" value="0">Year</option>
            <option value="2014">2014</option>
            <option value="2013">2013</option>
            <option value="2012">2012</option>
            <option value="2011">2011</option>
            <option value="2010">2010</option>
            <option value="2009">2009</option>
            <option value="2008">2008</option>
            <option value="2007">2007</option>
            <option value="2006">2006</option>
            <option value="2005">2005</option>
            <option value="2004">2004</option>
            <option value="2003">2003</option>
            <option value="2002">2002</option>
            <option value="2001">2001</option>
            <option value="2000">2000</option>
            <option value="1999">1999</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1996">1996</option>
            <option value="1995">1995</option>
            <option value="1994">1994</option>
            <option value="1993">1993</option>
            <option value="1992">1992</option>
            <option value="1991">1991</option>
            <option value="1990">1990</option>
            <option value="1989">1989</option>
            <option value="1988">1988</option>
            <option value="1987">1987</option>
            <option value="1986">1986</option>
            <option value="1985">1985</option>
            <option value="1984">1984</option>
            <option value="1983">1983</option>
            <option value="1982">1982</option>
            <option value="1981">1981</option>
            <option value="1980">1980</option>
            <option value="1979">1979</option>
            <option value="1978">1978</option>
            <option value="1977">1977</option>
            <option value="1976">1976</option>
            <option value="1975">1975</option>
            <option value="1974">1974</option>
            <option value="1973">1973</option>
            <option value="1972">1972</option>
            <option value="1971">1971</option>
            <option value="1970">1970</option>
            <option value="1969">1969</option>
            <option value="1968">1968</option>
            <option value="1967">1967</option>
            <option value="1966">1966</option>
            <option value="1965">1965</option>
            <option value="1964">1964</option>
            <option value="1963">1963</option>
            <option value="1962">1962</option>
            <option value="1961">1961</option>
            <option value="1960">1960</option>
            <option value="1959">1959</option>
            <option value="1958">1958</option>
            <option value="1957">1957</option>
            <option value="1956">1956</option>
            <option value="1955">1955</option>
            <option value="1954">1954</option>
            <option value="1953">1953</option>
            <option value="1952">1952</option>
            <option value="1951">1951</option>
            <option value="1950">1950</option>
            <option value="1949">1949</option>
            <option value="1948">1948</option>
            <option value="1947">1947</option>
            <option value="1946">1946</option>
            <option value="1945">1945</option>
            <option value="1944">1944</option>
            <option value="1943">1943</option>
            <option value="1942">1942</option>
            <option value="1941">1941</option>
            <option value="1940">1940</option>
            <option value="1939">1939</option>
            <option value="1938">1938</option>
            <option value="1937">1937</option>
            <option value="1936">1936</option>
            <option value="1935">1935</option>
            <option value="1934">1934</option>
            <option value="1933">1933</option>
            <option value="1932">1932</option>
            <option value="1931">1931</option>
            <option value="1930">1930</option>
            <option value="1929">1929</option>
            <option value="1928">1928</option>
            <option value="1927">1927</option>
            <option value="1926">1926</option>
            <option value="1925">1925</option>
            <option value="1924">1924</option>
            <option value="1923">1923</option>
            <option value="1922">1922</option>
            <option value="1921">1921</option>
            <option value="1920">1920</option>
            <option value="1919">1919</option>
            <option value="1918">1918</option>
            <option value="1917">1917</option>
            <option value="1916">1916</option>
            <option value="1915">1915</option>
            <option value="1914">1914</option>
            <option value="1913">1913</option>
            <option value="1912">1912</option>
            <option value="1911">1911</option>
            <option value="1910">1910</option>
            <option value="1909">1909</option>
            <option value="1908">1908</option>
            <option value="1907">1907</option>
            <option value="1906">1906</option>
            <option value="1905">1905</option>
        </select></br>
        <button type="submit" name="submit" value="Create Profile" class="submit" onclick="location.href='logout.php'">Create Profile</button>
</form>
</div>
<?php
echo '<link href="StyleSheetWebReg.css" rel="stylesheet">';
$userName = trim($_POST['userName']);
$password = trim($_POST['password']);
$repeatPassword = trim($_POST['repeatPassword']);
$secretQuestion = trim($_POST['secretQuestion']);

if(strlen($userName)>3 && strlen($password)>3)
   {
        if($password === $repeatPassword){
            $writeData= 'Name:'.$userName.';Password:'.$password.';RepeatPassword:'.$repeatPassword.';';
            file_put_contents('regist.txt', $writeData."\n",FILE_APPEND);
            header('Location: index.php');
        }
        else{
            echo 'Wrong input!';
        }
    }
    ?>

  //Logout page

   <?php
session_start();
session_destroy();
header('Location: index.php');
?>

//index page

<?php
    session_start();
?>
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>SystemOne</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
    </head>
    <body>
        <h1 style="font-size: 1em">Our System...</h1>

        <?php
        if(isset($_SESSION['logged']) === true)
        {
            echo 'Is Logged... <a href="userEdit.php">Edit your data</a>'.'<br>';
            echo '<a href="logout.php">Logout</a>';
          ?>
              <form action="index.php" method="post"
                    accept-charset=""enctype="multipart/form-data">
                <label for="file">Filename:</label>
                <input type="file" name="file" id="file">
                <input type="submit" name="submit" value="Submit">
             </form>
         <?php
                if ($_FILES["file"]["error"] > 0)
                  {
                    echo "Error: " . $_FILES["file"]["error"] . "<br>";
                  }
                  else {
                    echo "Upload: " . $_FILES["file"]["name"] . "<br>";
                    echo "Type: " . $_FILES["file"]["type"] . "<br>";
                    echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
                    echo "Stored in: " . $_FILES["file"]["tmp_name"];
                  }
         }
        else
        {
            include 'logged.php';
        }
        ?>
    </body>
</html>

    //Style log form  CSS

  .form{
    border: 1px solid black;
    display: inline-block;
    border-radius: 10px;
    padding: 10px;
    height: 80px;

}

p{
    display: inline-block;
    margin: 0px;
    padding: 0px;
    font-size: 1em;
    font-family: monospace;
}

.button,.buttonTwo{
    position: relative;
    top: 10px;
    width: 90px;
    height: 25px;
    padding: 2px;
    text-align: center;
    border-right: 2px solid #666666;
    border-bottom: 2px solid #666666;
    background: #66cc00;
}

.buttonTwo{
    left: 10px;
}

input,.pass{
    position: relative;
    width: 120px;
    height: 20px;
}

.pass{
    top: 5px;
}

  //Style reg form CSS




.raptor{
    background: #f2f5f6; /* Old browsers */
    background: -moz-linear-gradient(top,  #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f5f6), color-stop(37%,#e3eaed), color-stop(100%,#c8d7dc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
    height: 100%;
}


form{
    position: relative;
    //padding: 20px;
    left: 30%;
    width: 28%;
}

#header{
    position: relative;
    width: 135%;
    height: 10%;
    top: 0px;background: #1e5799; /* Old browsers */
    background: -moz-linear-gradient(top,  #1e5799 0%, #207cca 33%, #207cca 33%, #2989d8 55%, #7db9e8 91%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(33%,#207cca), color-stop(33%,#207cca), color-stop(55%,#2989d8), color-stop(91%,#7db9e8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #1e5799 0%,#207cca 33%,#207cca 33%,#2989d8 55%,#7db9e8 91%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #1e5799 0%,#207cca 33%,#207cca 33%,#2989d8 55%,#7db9e8 91%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #1e5799 0%,#207cca 33%,#207cca 33%,#2989d8 55%,#7db9e8 91%); /* IE10+ */
    background: linear-gradient(to bottom,  #1e5799 0%,#207cca 33%,#207cca 33%,#2989d8 55%,#7db9e8 91%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */

}

h1{
    position: relative;
    text-align: center;
    font-size: 1.1em;
    padding: 0px;
    padding-top: 20px;
    color: white;
}

h2{
    position: relative;
    text-align: center;
    font-size: 0.7em;
    padding-top: 0px;
    top: -20px;
    left: 2%;
    color: #cccccc;
}

p{
    display: inline-block;
    padding: 10px;
    margin:  0px;
    position: relative;
    top: -5px;
}

.textUserName{
    display: block;
    padding-top: 50px;

}

.userName{
    top: 125px;
    position:absolute;
    left: 60%;
    width: 70%;
}

.input{
    position:absolute;
    left: 60%;
    width: 70%;
}

.male,.female,#male,#female{
    position: relative;
    left: 45%;
}

#male,#female{
    left: 42%;
    top: 1px;
}

select{
    position: relative;
    left: 38%;
}

.submit{
    postion: relative;
    left: 60%;
    border: 0px;
    font-size: 1em;
    background-color: transparent;
    color:white;
    text-shadow: 3px 1px 4px rgba(44, 193, 101, 1);
}

span{
    color: red;
}