added chat messaging app (pranjay-poddar#3074)

* added chat messaging app * images problem solved
Morin3 · Jul 5, 2023 · d157dbf · d157dbf
1 parent 8ecf238
commit d157dbf
Show file tree

Hide file tree

Showing 19 changed files with 15,577 additions and 0 deletions.
diff --git a/PHP Projects/wechat/.htaccess b/PHP Projects/wechat/.htaccess
@@ -0,0 +1 @@
+ErrorDocument 404 /chat/php/404.php
diff --git a/PHP Projects/wechat/README.md b/PHP Projects/wechat/README.md
@@ -0,0 +1,49 @@
+# We chat - web messenger app
+<p align="center">
+  <img src="https://cdn-icons-png.flaticon.com/512/724/724715.png" width="160" />
+</p>
+
+one of the best backend project in this git repository of mine with backend development as well.
+This project helps you to communicate with your loved ones across the worl in a millisecond and express your emotions
+
+# ⚜ DEMO
+![image](https://user-images.githubusercontent.com/97821844/232280382-69b24c6f-0fb0-40eb-bd4d-3ee4646cbb6f.png)
+![image](https://user-images.githubusercontent.com/97821844/232280386-cffc042e-1694-4441-9dbb-3efda91866c9.png)
+![image](https://user-images.githubusercontent.com/97821844/232280479-7f9273a8-3e6d-4f83-8807-19fa8a8edb60.png)
+![image](https://user-images.githubusercontent.com/97821844/232280527-e258cf4a-aeba-4854-805a-4ae56243bd19.png)
+![image](https://user-images.githubusercontent.com/97821844/232280556-ba107399-5b9b-4071-a77c-fe687d3d9dcf.png)
+
+
+
+### 📌 Requirements 
+
+- HTML 
+- CSS
+- Javascript
+- PHP
+- MySql
+
+
+### 🔰 Installation 
+
+- Download or clone this repository.
+```
+git clone https://github.com/rohanmittal163/wechat.git
+```
+- Download the zip folder in xampp/htdocs in your C drive to avoid any error
+
+
+- Don't forget to import chat.sql into your phpmyadmin database (if not having install xampp)
+
+## ❤ Contribute
+This project is open source and we are happy to receive contributions. If you would like to contribute, please follow these steps:
+
+1. Make a fork of the repository.
+2. Create a branch for your feature or bugfix (`git checkout -b my-new-feature`)
+3. Commit your changes (`git commit -am 'Added my new feature'`)
+4. Push your branch (`git push origin my-new-feature`)
+5. Create a pull request.
+
+<p align="center">
+  <img src="https://user-images.githubusercontent.com/104341274/210186277-0d434bb0-80c0-43a9-b6b0-2e42e18c31a9.png" width="400" />
+</p>
diff --git a/PHP Projects/wechat/chat.php b/PHP Projects/wechat/chat.php
@@ -0,0 +1,111 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>We chat</title>
+		<link rel="shortcut icon" type="images/x-icon" href="https://drive.google.com/file/d/1nVMGh6ZOE5SvNnyPr6WRI7whEYn7KdwL/view?usp=drive_link" />
+		<link rel="stylesheet" type="text/css" href="css/all.css" />
+		<link rel="stylesheet" type="text/css" href="css/style.css" />
+	</head>
+	<body>
+		<?php
+		define('chat',true);
+		session_start();
+		include_once 'php/config.php';
+		if(!isset($_SESSION['unique_id'])){
+			header('location:login.php');
+		}
+		$uniqueId = $_GET['user_id'];
+		$sql = mysqli_query($conn,"SELECT * from users where unique_id = {$uniqueId}");
+		$row = mysqli_fetch_assoc($sql);
+		?>
+		<section class="cht_sec">
+			<header class="cht_header">
+				<a href="user.php">
+					<div class="cht_h_icon">
+						<i class="fas fa-arrow-left"></i>
+					</div>
+				</a>
+				<img src="<?php echo "images/{$row['img']}"; ?>" alt="error loading
+				image" title="<?php echo $row['fname']. " " .$row['lname']; ?>"
+				draggable="false" />
+				<div class="cht_user">
+					<p><?php echo $row['fname']. " " .$row['lname']; ?></p>
+					<p><?php echo $row['status']; ?></p>
+				</div>
+			</header>
+			<div class="cht_box"></div>
+			<footer class="cht_foot">
+				<div class="cht_msg">
+					<form class="typing_area" method="POST">
+						<input
+							type="text"
+							name="outgoing_id"
+							value="<?php echo $_SESSION['unique_id']?>"
+							hidden
+						/>
+						<input
+							type="text"
+							name="incoming_id"
+							value="<?php echo $uniqueId?>"
+							hidden
+						/>
+						<input
+							type="text"
+							name="message"
+							placeholder="type a message here"
+							autofocus
+						/>
+
+						<button class="cht_send">
+							<i class="fab fa-telegram-plane"></i>
+						</button>
+					</form>
+				</div>
+			</footer>
+		</section>
+
+		<script type="text/javascript" src="js/all.js"></script>
+		<script type="text/javascript">
+			const form = document.querySelector('.typing_area');
+			const sendBtn = document.querySelector('.cht_send');
+			const chtArea = document.querySelector('.cht_box');
+
+			form.onsubmit = (e) => {
+				e.preventDefault();
+			};
+			sendBtn.onclick = () => {
+				let xhr = new XMLHttpRequest();
+				xhr.onload = () => {};
+				xhr.open('POST', 'php/insert-chat.php', true);
+				let formData = new FormData(form);
+				xhr.send(formData);
+				form.reset();
+			};
+
+			chtArea.onmouseenter = () => {
+				chtArea.classList.add('activa');
+			};
+			chtArea.onmouseleave = () => {
+				chtArea.classList.remove('activa');
+			};
+			setInterval(() => {
+				let xhr = new XMLHttpRequest();
+				xhr.onload = () => {
+					if (xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
+						let data = xhr.responseText;
+						chtArea.innerHTML = data;
+						if (!chtArea.classList.contains('activa')) {
+							chtArea.scrollTo(0, chtArea.scrollHeight);
+						}
+					}
+				};
+				xhr.open('POST', 'php/getdata.php');
+				let formData = new FormData(form);
+				xhr.send(formData);
+			}, 200);
+		</script>
+	</body>
+</html>
diff --git a/PHP Projects/wechat/chat.sql b/PHP Projects/wechat/chat.sql
@@ -0,0 +1,89 @@
+-- phpMyAdmin SQL Dump
+-- version 5.2.0
+-- https://www.phpmyadmin.net/
+--
+-- Host: 127.0.0.1
+-- Generation Time: Apr 09, 2023 at 08:02 AM
+-- Server version: 10.4.24-MariaDB
+-- PHP Version: 8.1.6
+
+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: `chat`
+--
+
+-- --------------------------------------------------------
+
+--
+-- Table structure for table `message`
+--
+
+CREATE TABLE `message` (
+  `msg_id` bigint(255) NOT NULL,
+  `outgoing_msg_id` bigint(255) NOT NULL,
+  `incoming_msg_id` bigint(255) NOT NULL,
+  `msg` varchar(255) NOT NULL
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
+
+-- --------------------------------------------------------
+
+--
+-- Table structure for table `users`
+--
+
+CREATE TABLE `users` (
+  `user_id` int(11) NOT NULL,
+  `unique_id` varchar(200) NOT NULL,
+  `fname` varchar(200) NOT NULL,
+  `lname` varchar(200) NOT NULL,
+  `email` varchar(200) NOT NULL,
+  `password` varchar(200) NOT NULL,
+  `img` varchar(200) NOT NULL,
+  `status` varchar(200) NOT NULL
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
+
+--
+-- Indexes for dumped tables
+--
+
+--
+-- Indexes for table `message`
+--
+ALTER TABLE `message`
+  ADD PRIMARY KEY (`msg_id`);
+
+--
+-- Indexes for table `users`
+--
+ALTER TABLE `users`
+  ADD PRIMARY KEY (`user_id`);
+
+--
+-- AUTO_INCREMENT for dumped tables
+--
+
+--
+-- AUTO_INCREMENT for table `message`
+--
+ALTER TABLE `message`
+  MODIFY `msg_id` bigint(255) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=3;
+
+--
+-- AUTO_INCREMENT for table `users`
+--
+ALTER TABLE `users`
+  MODIFY `user_id` int(11) NOT NULL AUTO_INCREMENT;
+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 */;