Add registration feature
This commit is contained in:
Andrew Trieu
96
chatline.sql
Normal file
96
chatline.sql
Normal file
@@ -0,0 +1,96 @@
|
||||
-- phpMyAdmin SQL Dump
|
||||
-- version 5.2.1
|
||||
-- https://www.phpmyadmin.net/
|
||||
--
|
||||
-- Host: localhost
|
||||
-- Generation Time: Feb 22, 2024 at 06:45 PM
|
||||
-- Server version: 10.4.32-MariaDB
|
||||
-- PHP Version: 8.2.12
|
||||
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
|
||||
START TRANSACTION;
|
||||
SET time_zone = "+00:00";
|
||||
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */
|
||||
;
|
||||
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */
|
||||
;
|
||||
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */
|
||||
;
|
||||
/*!40101 SET NAMES utf8mb4 */
|
||||
;
|
||||
--
|
||||
-- Database: `chatline`
|
||||
--
|
||||
|
||||
-- --------------------------------------------------------
|
||||
--
|
||||
-- Table structure for table `messages`
|
||||
--
|
||||
|
||||
CREATE TABLE `messages` (
|
||||
`msg_id` int(11) NOT NULL,
|
||||
`get_msg_id` int(255) NOT NULL,
|
||||
`post_msg_id` int(255) NOT NULL,
|
||||
`msg` varchar(1000) NOT NULL,
|
||||
`unique_id` int(255) NOT NULL
|
||||
) ENGINE = InnoDB DEFAULT CHARSET = utf8mb4 COLLATE = utf8mb4_general_ci;
|
||||
-- --------------------------------------------------------
|
||||
--
|
||||
-- Table structure for table `users`
|
||||
--
|
||||
|
||||
CREATE TABLE `users` (
|
||||
`user_id` int(11) NOT NULL,
|
||||
`unique_id` int(255) NOT NULL,
|
||||
`first_name` varchar(255) NOT NULL,
|
||||
`last_name` varchar(255) NOT NULL,
|
||||
`email` varchar(255) NOT NULL,
|
||||
`password` varchar(255) NOT NULL,
|
||||
`img` varchar(255) DEFAULT NULL,
|
||||
`status` varchar(255) NOT NULL
|
||||
) ENGINE = InnoDB DEFAULT CHARSET = utf8mb4 COLLATE = utf8mb4_general_ci;
|
||||
--
|
||||
-- Indexes for dumped tables
|
||||
--
|
||||
|
||||
--
|
||||
-- Indexes for table `messages`
|
||||
--
|
||||
ALTER TABLE `messages`
|
||||
ADD PRIMARY KEY (`msg_id`),
|
||||
ADD KEY `FOREIGN` (`unique_id`) USING BTREE;
|
||||
--
|
||||
-- Indexes for table `users`
|
||||
--
|
||||
ALTER TABLE `users`
|
||||
ADD PRIMARY KEY (`user_id`),
|
||||
ADD KEY `UNIQUE_ID` (`unique_id`) USING BTREE;
|
||||
--
|
||||
-- AUTO_INCREMENT for dumped tables
|
||||
--
|
||||
|
||||
--
|
||||
-- AUTO_INCREMENT for table `messages`
|
||||
--
|
||||
ALTER TABLE `messages`
|
||||
MODIFY `msg_id` int(11) NOT NULL AUTO_INCREMENT;
|
||||
--
|
||||
-- AUTO_INCREMENT for table `users`
|
||||
--
|
||||
ALTER TABLE `users`
|
||||
MODIFY `user_id` int(11) NOT NULL AUTO_INCREMENT;
|
||||
--
|
||||
-- Constraints for dumped tables
|
||||
--
|
||||
|
||||
--
|
||||
-- Constraints for table `messages`
|
||||
--
|
||||
ALTER TABLE `messages`
|
||||
ADD CONSTRAINT `FOREIGN_MESSAGES_USERS` FOREIGN KEY (`unique_id`) REFERENCES `users` (`unique_id`) ON DELETE CASCADE ON UPDATE CASCADE;
|
||||
COMMIT;
|
||||
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */
|
||||
;
|
||||
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */
|
||||
;
|
||||
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */
|
||||
;
|
||||
@@ -49,6 +49,7 @@ body {
|
||||
background: #f8d7da;
|
||||
border: 1px solid #f5c6cb;
|
||||
margin-bottom: 10px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.form form .names {
|
||||
|
||||
@@ -12,31 +12,31 @@
|
||||
<div class="wrapper">
|
||||
<section class="register form">
|
||||
<header>Join us at ChatLine!</header>
|
||||
<form action="#" >
|
||||
<div class="error">Error</div>
|
||||
<form action="#" method="POST" enctype="multipart/form-data" autocomplete="off">
|
||||
<div class="error"></div>
|
||||
<div class="names">
|
||||
<div class="field">
|
||||
<label>First name</label>
|
||||
<input type="text" placeholder="First name" required>
|
||||
<input type="text" name="first_name" placeholder="First name" required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Last name</label>
|
||||
<input type="text" placeholder="Last name" required>
|
||||
<input type="text" name="last_name" placeholder="Last name" required>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<label>Email</label>
|
||||
<input type="text" placeholder="Enter your email" required>
|
||||
<input type="text" name="email" placeholder="Enter your email" required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Password</label>
|
||||
<input type="password" placeholder="Enter new password" required>
|
||||
<input type="password" name="password" placeholder="Enter new password" required>
|
||||
<i class="fas fa-eye"></i>
|
||||
</div>
|
||||
<div class="image">
|
||||
<label>Profile photo</label>
|
||||
<input type="file">
|
||||
<input type="file" name="image" accept="image/x-png,image/jpeg,image/jpg">
|
||||
</div>
|
||||
<div class="button">
|
||||
<input type="submit" value="Register">
|
||||
@@ -47,5 +47,6 @@
|
||||
</section>
|
||||
</div>
|
||||
<script src="js/password-visibility.js"></script>
|
||||
<script src="js/register.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
27
js/register.js
Normal file
27
js/register.js
Normal file
@@ -0,0 +1,27 @@
|
||||
const form = document.querySelector(".register form"),
|
||||
continueBtn = form.querySelector(".button input"),
|
||||
errorText = form.querySelector(".error");
|
||||
|
||||
form.onsubmit = (e) => {
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
continueBtn.onclick = () => {
|
||||
let xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", "php/register.php", true);
|
||||
xhr.onload = () => {
|
||||
if (xhr.readyState === XMLHttpRequest.DONE) {
|
||||
if (xhr.status === 200) {
|
||||
let data = xhr.response;
|
||||
if (data === "success") {
|
||||
location.href = "home.php";
|
||||
} else {
|
||||
errorText.style.display = "block";
|
||||
errorText.textContent = data;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
let formData = new FormData(form);
|
||||
xhr.send(formData);
|
||||
};
|
||||
@@ -13,7 +13,7 @@
|
||||
<section class="register form">
|
||||
<header>Login to ChatLine</header>
|
||||
<form action="#" >
|
||||
<div class="error">Error</div>
|
||||
<div class="error"></div>
|
||||
<div>
|
||||
<div class="field">
|
||||
<label>Email</label>
|
||||
11
php/config.php
Normal file
11
php/config.php
Normal file
@@ -0,0 +1,11 @@
|
||||
<?php
|
||||
$hostname = "localhost:3200";
|
||||
$username = "root";
|
||||
$password = "";
|
||||
$dbname = "chatline";
|
||||
|
||||
$conn = mysqli_connect($hostname, $username, $password, $dbname);
|
||||
if(!$conn){
|
||||
echo "Database connection error".mysqli_connect_error();
|
||||
}
|
||||
?>
|
||||
84
php/register.php
Normal file
84
php/register.php
Normal file
@@ -0,0 +1,84 @@
|
||||
<?php
|
||||
session_start();
|
||||
include_once "config.php";
|
||||
function escape($conn, $value) {
|
||||
return mysqli_real_escape_string($conn, $value);
|
||||
}
|
||||
function isValidEmail($email) {
|
||||
return filter_var($email, FILTER_VALIDATE_EMAIL);
|
||||
}
|
||||
function moveUploadedFile($tempFileName, $newFileName) {
|
||||
return move_uploaded_file($tempFileName, "images/" . $newFileName);
|
||||
}
|
||||
function generateUniqueUserId() {
|
||||
return rand(time(), 100000000);
|
||||
}
|
||||
function encryptPassword($password) {
|
||||
return md5($password);
|
||||
}
|
||||
function fetchUserByEmail($conn, $email) {
|
||||
$email = escape($conn, $email);
|
||||
$sql = mysqli_query($conn, "SELECT * FROM users WHERE email = '{$email}'");
|
||||
return mysqli_fetch_assoc($sql);
|
||||
}
|
||||
function insertUser($conn, $unique_id, $first_name, $last_name, $email, $encrypt_pass, $new_img_name, $status) {
|
||||
return mysqli_query($conn, "INSERT INTO users (unique_id, first_name, last_name, email, password, img, status) VALUES ({$unique_id}, '{$first_name}','{$last_name}', '{$email}', '{$encrypt_pass}', '{$new_img_name}', '{$status}')");
|
||||
}
|
||||
function loginUser($user) {
|
||||
$_SESSION["unique_id"] = $user["unique_id"];
|
||||
echo "success";
|
||||
}
|
||||
if (!empty($_POST["first_name"]) || !empty($_POST["last_name"]) || !empty($_POST["email"]) || !empty($_POST["password"])) {
|
||||
$first_name = escape($conn, $_POST["first_name"]);
|
||||
$last_name = escape($conn, $_POST["last_name"]);
|
||||
$email = escape($conn, $_POST["email"]);
|
||||
$password = escape($conn, $_POST["password"]);
|
||||
if (isValidEmail($email)) {
|
||||
$existingUser = fetchUserByEmail($conn, $email);
|
||||
if ($existingUser) {
|
||||
echo "The email address $email already exists!";
|
||||
} else {
|
||||
if (isset($_FILES["image"])) {
|
||||
$img_name = $_FILES["image"]["name"];
|
||||
$img_type = $_FILES["image"]["type"];
|
||||
$temp_file_name = $_FILES["image"]["tmp_name"];
|
||||
$img_ext = pathinfo($img_name, PATHINFO_EXTENSION);
|
||||
$allowedExtensions = ["jpeg", "png", "jpg"];
|
||||
if (in_array($img_ext, $allowedExtensions) && in_array($img_type, ["image/jpeg", "image/jpg", "image/png", ])) {
|
||||
$time = time();
|
||||
$new_img_name = $time . $img_name;
|
||||
if (moveUploadedFile($temp_file_name, $new_img_name)) {
|
||||
$unique_id = generateUniqueUserId();
|
||||
$status = "Active now";
|
||||
$encrypt_pass = encryptPassword($password);
|
||||
} else {
|
||||
echo "An error occurred while uploading the image.";
|
||||
exit();
|
||||
}
|
||||
} else {
|
||||
echo "Image must be of the following formats: JPEG, JPG, PNG.";
|
||||
exit();
|
||||
}
|
||||
} else {
|
||||
$unique_id = generateUniqueUserId();
|
||||
$status = "Active now";
|
||||
$encrypt_pass = encryptPassword($password);
|
||||
}
|
||||
if (insertUser($conn, $unique_id, $first_name, $last_name, $email, $encrypt_pass, $new_img_name, $status)) {
|
||||
$loggedInUser = fetchUserByEmail($conn, $email);
|
||||
if ($loggedInUser) {
|
||||
loginUser($loggedInUser);
|
||||
} else {
|
||||
echo "An error occurred. Please try again.";
|
||||
}
|
||||
} else {
|
||||
echo "An error occurred. Please try again.";
|
||||
}
|
||||
}
|
||||
} else {
|
||||
echo "The email address $email is not valid!";
|
||||
}
|
||||
} else {
|
||||
echo "All input fields are required!";
|
||||
}
|
||||
?>
|
||||
Reference in New Issue
Block a user