SIES COLLEGE OF SCIENCE ARTS AND COMMERCE

(AUTONOMOUS)
PROJECT ON

ONLINE DEBATING SYSTEM

By
VARDHARAJ KONAR
CS1920637
SURIYA KUPPUSWAMY
CS1920670
SHAIKH MOHAMMED AFRID
CS1920682
 PROJECT REPORT SUBMITTED TO

DEPARTMENT OF COMPUTER SCIENCE

S.I.E.S COLLEGE OF ARTS, SCIENCE AND COMMERCE (AUTONOMUS)

SION (W), MUMBAI – 400 022.

“ONLINE DEBATING SYSTEM”

For the Project Fulfilment for The Degree Of

Bachelor of Science (Computer Science)
2019-2020

HEAD OF DEPARTMENT PROJECT GUIDE

PROF. MANOJ SINGH PROF.MANOJ SINGH

SUBMITTED BY:
VARDHARAJ KONAR CS1920637
SURIYA KUPPUSWAMY CS1920670
SHAIKH MOHAMMED AFRID CS1920682
S.NO TOPIC
1 Acknowledgement
2 About the project
3 Introduction
4 Project plan
5 Modules
6 stakeholders
7 Stakeholders role
8 Feasibility study
9 Limitation of previous model
10 Questionnaire
11 Gantt chart
12 Use case Diagram
13 Activity Diagram
14 ER Diagram
15 Sequence Diagram
16 Class Diagram
17 Deployment Diagram
18 Code and implementation
19 Test case
 Acknowledgement

It is a great pleasure to get this opportunity and sincerely thank

all those people who have helped me during the successful
development of this Project on
“Online debating system” for
Department of Computer Science, S.I.E.S College of Arts,
Science & Commerce (Autonomus), Sion (W), Mumbai-22.

Our sincere regards and gratitude to the Head of the Department

Prof.Manoj Singh, having given me the support throughout the
course.

We would like to thank our project guide Prof.Manoj Singh

and our professors Prof. Maya Nair, Prof.Abuzar.Ansari, and
Prof. Gauraang Kelkar, for their constant help and support
during the development of this project.

We also express my gratitude towards the non-teaching staff of

the Computer Science Department, for providing and
maintaining the quality of laboratory required for the
development of this project.

Also, we would like to thank our family members and friends

for their co-operation and efforts for making this project a
success.
 ABOUT THE PROJECT
• TITLE OF THE OF THE PROJECT : ONLINE DEBATING SYSTEM
• STATEMENT ABOUT THE PROBLEM :- Often people unable to
have structural and organized debate on online and doesn’t end
up with logical conclusion
• OBJECTIVE AND SCOPE OF PROJECT : To have an organized and
logical argument while having an online debate . Which can give
a constructive solution and conclusion
• HARDWARE & SOFTWARE : WEBSITE BASED APPLICATION
 Introduction
• The aim of this project is to be able to create a portal on which
only registered users can login and debate to any topic in real-
time
• Debate on selected topics with people across the world and
have a successful debate and reach a conclusion. End users of
your project:
• All the general public as well as the rest of the people who all
access to internet and know how to use the portal.
• The scope of this project is as follows-
• 1) Awareness among the users about the new upcoming topics.
• 2) Users get to share their opinion over an online portal.
• 3) In future can be used to conduct inter-Country meetings
regarding important topics using a secret portal inside the
website.
• 4) Unanswered questions can be answered taking into
consideration of everybody’s opinion.
• This has many real time applications such as allowing a news
channel to conduct nation wide debates. The main beneficiaries
of this
• system are those who like debating and sharing their opinion as
they now have a platform where they can debate and find
questions to
• unanswered questions at home. As a result of the deployment of
this project, awareness about important topics will be spread
around the country.
 PROJECT PLAN
• The original plan for this project was to implement debates
online in text conversion in real time which is very efficient as it
saves time and cost.
• The initial activities involved basic modules such as logging in,
opening links to access a live debate and thus either
participating for or against the topic done via either typing in
chat box via text conversion which is posted in the chat box.
• The chatbox also contains the participants name the the stance
that he is taking.
• The next part of the plan was to post the upcoming debates for
the day so that all users which have or haven’t logged in can see
thatand accordingly come online and access the debate only if
they are registered users.
• The process model used is the waterfall model. This model is
being used as there are predefined GUI screens and since it is a
web based project, different modules have to be determine
before hand prior to linking the various screens that are
available to the user.
 MODULES
A. Login/Register Module
• This module is used by any free user to login or register on the
website so that he is eligible to debate on the website and only
after
• any of the above two steps the link to debate is enabled.
B. Home Module
• It is used to describe the website, provide navigation, and
describe the developers.
C. Live Debates Module
• This module is used to inform the users of the current debate
and only those users can participate in the debate who have
already
• logged in or registered.
D. Upcoming Debates Module
• This module is used to display the debates that will happen
throughout the day along with the date, time and topic.
• E. Debating Module
• This portal is used by the users that have entered in the live
debate and want to debate about the topic before which they
have to
• choose one of the two sides for or against which is stored in the
database and showed to other users on the same side as him.
• This module also includes a chatbox in which the whole debate
is displayed that what user text at which time, so that it is
 • visible to everyone else. In short, it keeps the log of all the
points. Input to the chat box is done either through direct text .
F. Log out module
• It is used by users to log out.
STAKEHOLDERS
• MEDIA HOUSE
• ADMIN
• REGISTERED USER
• UNREGISTERED USER
• DIGITAL MARKETING
 Stakeholders Roles
MEDIA HOUSE :
•

ADMIN :
-
-
-
-
-
-
-
-
REGISTERED USER :
UNREGISTERED USER :
THE DATE UNREGISTERED USER CAN ONLY VIEW

STAKEHOLDER ROLE OF DIGITAL MARKETING :

Digital marketing team can run advertisement
Digital marketing team can optimize page
Digital marketing team can track advertisement impression
 FEASIBILITY STUDY
Technical Feasibility
1.Front End : HTML/CSS/PHP.
2.Back End : MySql/PHP.
Economic Feasibility
The Organization needs to provide a domain or sub
domain for this system.
The front end used is HTML-5,Css,JavaScript and Boo
Tstrap.
The Backend used is MySql and Php
LIMITATION OF PREVIOUS/EXISTING MODEL:

We cannot have an organized way for debating in the existing

online debating portal because user cannot properly
represent their sides (for or against).
Number of people as spectator agreeing or disagreeing with a
point in a debate cannot be determined.
User cannot participate in multiple debate at same time.
No specific time period for debate can be assigned where the
admin has to manually stop the debate.
No option for reporting the user who is spamming the debate.
Admin can insert advertisement for revenue
QUESTIONNAIRE
1. how many stakeholders should be in the debating system?
-yes -no
2. Should there be an option for reporting users?
-yes -no
3. What operating system/interface would you like to be
implemented in the software?
-Linux -Windows
4. Do you want any external person to handle the
advertisement ?
-yes -no
5.Should there be any time duration for debates?
6.Should the user is allowed to join multiple debate at same
time ?
-yes -no
7.What are the credentials should be asked to the user while
registering?
8.Do you use any other software currently?
-yes -no
9. What features do you need beyond traditional debating
system?
 EVENT TABLE
SR Events Trigger Source Activity Response Destination
no.
1 Registration Request of User Register the Successfully User and
Registration user Registered Register
table
2 Login Request of User Login of User Logged in User and
Login Successfully Register
table
3 Update User Update User Update user Successfully User and
Detail Detail Updated Register
table
4 User Feedback User Adding Thankyou for User and
feedback feedback your feedback feedback
table
5 Logout Request of User Logout of Logged Out User
Logout User Successfully
6 Search Request of User Search for Display Debate User and
Debate Debate Debate Debate table
7 Join Debate Request to User Joining in Successfully User and
Join Debate Debate joined Debate Debate table

8 Exit Debate Request to User Exit the Successfully User

exit Debate Debate Exited Debate

9 Create Request to User Create the Successfully User and

Debate Create Debate Created your debate table
Debate Debate
10 Report Report The User Reporting the Action will be User and
Debate Debate Debate taken on your Report table
Report
11 Debate Detail Request for User Displaying Display Debate User and
Debate Debate Detail Detail debate table
Detail
12 View Profile Request for Admin/user Displaying Display User User and
user Detail User Detail Detail Admin

13 Sort Debate Request for User Sort the Display Sorted User and
Sorting Debate Debate Debate table
Debate
14 Upload Post Uploading User Upload The Your Post will User and
Post Post be uploaded post table
after
Verification

15 Upload Post Uploading Admin Upload The You have Admin and
Post Post Successfully post table
uploaded
16 View Request For Debate Fetch Leader Display Leader User and
Leaderboard Leader Joined User board board leader board
Board table
17 Remove Post Delete Post Admin Delete the You have Admin and
Post successfully post table
Removed
18 View Report Request for Admin Fetch Report Display Admin and
report Reports report table

19 Remove User Remove Admin Delete user User Admin and

User Record Successfully register table
Removed
20 View your Request for User Fetch Report Display Report User and
report report report table
21 Up VOTE Request for USER Up Vote the UPVOTED User and
up vote argument debate table
22 DOWN VOTE Request for USER Down vote DOWN VOTED User and
down vote the argument debate table
23 SHARE Request for USER Link Successfully user
generate link generated shared
24 CHOOSE Request for USER Selecting topic SELECTED User and
TOPIC OF selecting TOPIC post table
INTREST topic
25 REMOVE Request for USER Removing the Deselected User and
TOPIC OF removing selected topic post table
INTEREST selected
topic
26 ENTER TEXT Entering text USER Allowing text Text entered User
(For to be entered
Argument) in text box
27 UPLOAD TEXT Request for USER Allowing Text/Argument User and
(For Upload text/argument uploaded Argument
Argument) entered text to be table
uploaded
28 DELETE Request to USER Deleting Text/Argument User and
UPLOADED delete uploaded deleted argument
ARGUMENT Uploaded text/argument table
entered text
29 ENTER Entering link USER Allowing link Link entered User
REFERENCE of article to be entered
(LINK OF in text box
ARTICLE)
30 UPLOAD Request for USER Allowing link Reference User and
REFERENCE uploading to be uploaded Argument
link of the uploaded table
article
31 DELETE Request for USER Deleting Reference User and
REFERCENCE uploading uploaded link deleted argument
link of the table
article
32 UPLOAD Request for USER Allowing Image User and
REFERNCE uploading image to be uploaded Argument
(image file) image uploaded table
33 DELETE Request to USER Deleting Image deleted User and
REFERENCE delete uploaded Argument
(image file) uploaded image table
image
34 UPLOAD Request for USER Allowing video Video User and
REFERNCE uploading to be uploaded Argument
(video file) video uploaded table
35 DELETE Request to USER Deleting Video deleted User and
REFERENCE delete uploaded Argument
(video file) uploaded video Table
video
36 VIEW VIEWER Request for ADMIN Displaying Viewer count admin
COUNT viewer count viewer count displayed

37 View Request for ADMIN Displaying Display admin

Participant id Participant participant id participant id
Id
38 REMOVE REQUEST TO ADMIN ARGUMRNT ARGUMENT ADMIN
ARGUMENT REMOVE REMOVE REMOVED
ARGUMENT
39 REMOVE REQUEST TO ADMIN USER USER ADMIN
USER REMOVE REMOED REMOVED
USER FROM DEBATE
40 Request to ADMIN REPORTS WILL REPORTS ADMIN
View Report view report BE SHOWN DISPLAYED

41 Request for ADMIN POST WILL BE POST VERIFIED USER

Verify post post verify VERIFIED

42 Request to ADMIN POST WILL BE POST USER

Remove post remove post REMOVED REMOVED

44 ADMIN Request to ADMIN Will be logged LOGGED IN ADMIN

LOGIN login in
45 ADMIN Request to ADMIN Will be logged LOGGED OUT ADMIN
LOGOUT logout out

46 ADD TOPIC Request to Media Topic will be Topic added MEDIA

add topic house added HOUSE

47 REMOVE Request to Media Topic will be Topic removed MEDIA

TOPIC remove house removed HOUSE
topic
48 ADD DEBATE Request to Media debate will be debate added MEDIA
add debate house added HOUSE

49 REMOVE Request to Media debate will be debate MEDIA

DEBATE remove house removed removed HOUSE
debate
GANTT CHART
Uml diagrams
Use case diagram
Deployment Diagram
CODE AND IMPLEMENTATION
REGISTRATION PAGE

CODE
registration.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
 <link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<header>
<div>
<?php include("header1.php"); ?>
</div>
</header>
<h2 align="center">Create User Account</h2>
<span id="suc" style="font-size:20px;"></span>
<div id="register" align="center">
<form id="registerform" method="post"
enctype="multipart/form-data">
<image src="https://bgp-
palembang.com/assets/img/avatar/avatar-2.png" alt="Profile" width="80" height="80"
id="imgpreview" style="border-radius:50%;"/><br>
Profile:<input type="file" id="image"
onchange="imagePreview(this);" name="image" style="background-color:grey;"/><br>
Username:<input type="text" name="un" id="un"
autocomplete="on"/><br>
<br>
Email:<input type="text" name="em" id="em"
autocomplete="on"/><br>
Password:<input type="password" name="pw" id="pw"
autocomplete="on"/><br>
 Confirm Password:<input type="password" name="cpw"
id="cpwd" autocomplete="on"/><br>
<input type="submit" value="signup" name="rgster"/>
</form>
</div>
</div>
</body>
</html>
<script>
function imagePreview(input){
if(input.files && input.files[0]){
var filerd = new FileReader();
filerd.onload=function(e){
$("#imgpreview").attr("src",e.target.result)
};
filerd.readAsDataURL(input.files[0]);
}
};
$(document).ready(function(){
$('#registerform').on('submit',function(e){
e.preventDefault();
var formData = new FormData($("#registerform")[0]);
$.ajax({
url:"register.php",
method:"POST",
data:formData,
contentType:false,
 processData:false,
success:function(data)
{
$('#suc').html(data);
}
})
$('#imgpreview').attr("src","https://bgp-
palembang.com/assets/img/avatar/avatar-2.png");
this.reset();
});
});
</script>

registration.php
<html>
<head></head>
<body>
<?php
try{
$un=$_POST['un'];
$em=$_POST['em'];
$pw=$_POST['pw'];
$cpwd=$_POST['cpw'];
$file=$_FILES["image"]["tmp_name"];
if($file!=""){
$file=addslashes(file_get_contents($_FILES["image"]["tmp_name"]));
}
$sp=true;
 if(!filter_var($em,FILTER_VALIDATE_EMAIL)){
echo "<p style='color:red;text-align:center;'>**Invalid Email Format</p>";
}
if(preg_match('/[\s]/',$un) || preg_match('/[\s]/',$pw)){
$sp=false;
echo "<p style='color:red;text-align:center;'>**Space are not allowed in
username or password</p>";
}
if(preg_match('/[$#!%?]/',$un)){
$sp=false;
echo "<p style='color:red;text-align:center;'>**Special character are not
allowed in username or password</p>";
}
if($un=="" && $pw=="" && $cpwd=="" && $file==""){
echo "<p style='color:red;text-align:center;'>**All fields are required</p>";
}
if($un!="" && $pw==""){
echo "<p style='color:red;text-align:center;'>**Please Enter Password</p>";
}
if($un=="" && $pw!=""){
echo "<p style='color:red;text-align:center;'>**Please Enter Username</p>";
}
if($pw!=$cpwd){
echo "<p style='color:red;text-align:center;'>**Password confirmation is not
matching</p>";
}
if($un!="" && $pw!="" && $cpwd!="" && $file!="" && $pw==$cpwd && $sp==true){
$conn=mysqli_connect("localhost","root","","opinio");
 $sql="INSERT INTO `registration`(`username`,`profile`,`email`,`password`)
VALUES('$un','$file','$em','$pw');";
if(!mysqli_query($conn,$sql)){
echo "<p style='color:red;text-align:center'>record not inserted</p>";
}
else{
echo "<p style='color:green;text-align:center'>Registered
Successfully</p>";
}
mysqli_close($conn);
}
}
catch(Exception $e){
echo $e;
}
?>
</body>
</html>
LOGIN AS PAGE

CODE
loginas.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
 <link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div>
<?php include("header1.php"); ?>
</div>
<div class="login-as">
<button id="admin-login"><a href="adminlogin.html">MEDIA HOUSE
LOGIN</a></button>
<button id="user-login"><a href="login.html">USER LOGIN</a></button>
</div>
</body>
</html>

USER LOGIN PAGE

login.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
 <script>
function ajax_post(){
var ajax=new XMLHttpRequest();
var method="POST";
var url="login.php";
var asycchronous=true;
ajax.open(method,url,asycchronous);
var un=document.getElementById("un").value;
var pwd=document.getElementById("pw").value;
var form="login";
var vars="un="+un+"&pwd="+pwd+"&form="+form;
ajax.setRequestHeader("Content-type","application/x-www-
form-urlencoded");
ajax.onreadystatechange=function(){
if(ajax.readyState==4 && ajax.status==200){
var result=ajax.responseText;
if(result=="Y"){
window.location.href="homelog.html";
result="";
}
if(result=="N"){
window.location.href="login.html";
}
else{

document.getElementById("dp").innerHTML=result;
}
}
 }
ajax.send(vars);
document.getElementById("un").value="";
document.getElementById("pw").value="";
}
</script>
</head>
<body>
<div>
<header>
<div>
<?php include("header1.php"); ?>
</div>
</header>
<h2 align="center" style="font-size:30px">Login</h2>
<span id="dp" style="color:red;margin-left:250px;"></span>
<div id="register" align="center">
Username:<input type="text" name="nm" id="un"/><br>
Password:<input type="password" name="pw"
id="pw"/><br>
<input type="submit" value="Login" id="login"
onclick="javascript:ajax_post();">
</div>
</div>
</body>
</html>
login.php
<?php
if($_SERVER['REQUEST_METHOD']=='POST'){
session_start();
$un=$_REQUEST['un'];
$pwd=$_REQUEST['pwd'];
if($un=="" && $pwd==""){
echo "<p style='color:red;text-align:center;'>**All fields are required</p>";
}
if($un!="" && $pwd==""){
echo "<p style='color:red;text-align:center;'>**Please Enter Password</p>";
}
if($un=="" && $pwd!=""){
echo "<p style='color:red;text-align:center;'>**Please Enter Username</p>";
}
if($un!="" && $pwd!=""){
$conn=mysqli_connect("localhost","root","","opinio");
$q='select * from `registration` where `username`="'.$un.'" and
`password`="'.$pwd.'"';
$r=mysqli_query($conn,$q);
$row=mysqli_fetch_assoc($r);
if(mysqli_num_rows($r)==1){
$_SESSION['una']=$un;
$_SESSION['pwd']=$pwd;
$_SESSION['uid']=$row['id'];
echo "Y";
}
 else{
echo "<p style='color:red;text-align:center;'>**your password and user
name doesn't match</p>";
}
mysqli_close($conn);
}
}
else{
header("location:login.html");
}
?>

MEDIA HOUSE LOGIN PAGE

adminlogin.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
function ajax_post(){
var ajax=new XMLHttpRequest();
var method="POST";
var url="adlogin.php";
var asycchronous=true;
ajax.open(method,url,asycchronous);
var un=document.getElementById("un").value;
var pwd=document.getElementById("pw").value;
var form="login";
var vars="un="+un+"&pw="+pwd+"&form="+form;
ajax.setRequestHeader("Content-type","application/x-www-
form-urlencoded");
ajax.onreadystatechange=function(){
if(ajax.readyState==4 && ajax.status==200){
var result=ajax.responseText;
if(result=="Y"){
 window.location.href="adminhome.html";
result="";
}
if(result=="N"){
window.location.href="login.html";
}
else{

document.getElementById("dp").innerHTML=result;
}
}

}
ajax.send(vars);
document.getElementById("un").value="";
document.getElementById("pw").value="";
}
</script>
<style>
body {font-family: Arial, Helvetica, sans-serif;}
form {border: 3px solid #f1f1f1;}

input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
 border: 1px solid #ccc;
box-sizing: border-box;
}
button:hover {
opacity: 0.8;
}

.cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}

.container {
padding: 16px;
}

span.psw {
float: right;
padding-top: 16px;
}

/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
 float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
</head>
<body>
<div>
<?php include("header1.php"); ?>
</div>
<span id="dp" style="color:red;margin-left:250px;"></span>
<i><b><h2 align="center" style="border-radius:5px;font-size:50px;">MEDIA HOUSE
LOGIN</h2></b></i>
<div class="container">
<label for="uname" style="color:white;"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="un" id="un"
required>
<label for="psw" style="color:white;"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="pw" id="pw"
required>
<button type="submit" id="adlogin" style="background-color:green;"
onclick="javascript:ajax_post();">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember"> Remember
me
</label>
</div>
 <div class="container" style="background-color:#f1f1f1">
<button type="button" class="cancelbtn">Cancel</button>
<span class="psw">Forgot <a href="#">password?</a></span>
</div>
</body>
</html>

adminlogin.php
<?php
if($_SERVER['REQUEST_METHOD']=='POST'){
session_start();
$un=$_REQUEST['un'];
$pwd=$_REQUEST['pw'];
$_SESSION['adm']="suriya";
$_SESSION['adpw']="suriyacs";
if($un=="" && $pwd==""){
echo "<p style='color:red;text-align:center;'>**All fields are required</p>";
}
if($un!="" && $pwd==""){
echo "<p style='color:red;text-align:center;'>**Please Enter Password</p>";
}
if($un=="" && $pwd!=""){
echo "<p style='color:red;text-align:center;'>**Please Enter Username</p>";
}
if($un!="" && $pwd!=""){
$conn=mysqli_connect("localhost","root","","opinio");
$q='select * from `admin` where `adname`="'.$un.'" and
`password`="'.$pwd.'"';
 $r=mysqli_query($conn,$q);
$row=mysqli_fetch_assoc($r);
if(mysqli_num_rows($r)==1){
$_SESSION['una']=$un;
$_SESSION['pwd']=$pwd;
$_SESSION['uid']=$row['adid'];
echo "Y";
}
else{
echo "<p style='color:red;text-align:center;'>**your password and user
name doesn't match</p>";
}
mysqli_close($conn);
}
}
else{
header("location:login.html");
}
?>
 MEDIA HOUSE REGISTRATION PAGE

adminregister.html
<html>

<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
background-color: white;
}
{
box-sizing: border-box;
}

/* Add padding to containers */

.container {
padding: 16px;
background-color: white;
}

/* Full-width input fields */

input[type=text], input[type=password] {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
display: inline-block;
border: none;
background-color:lightgrey ;
}
input[type=text]:focus, input[type=password]:focus {
background-color: #ddd;
outline: none;
}

/* Overwrite default styles of hr */

hr {
border: 1px solid #f1f1f1;
margin-bottom: 25px;
}

/* Set a style for the submit button */

.registerbtn {
background-color:green;
color: white;
padding: 16px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 30%;
opacity: 1.0;

.registerbtn:hover {
 opacity: 1;

/* Add a blue text color to links */

a{
color: dodgerblue;
}

/* Set a grey background color and center the text of the "sign in"
section */
.signin {
background-color: tomato;
text-align: center;
}
</style>
</head>
<body>
<div>
<?php include("header1.php"); ?>
</div>
<form id="registerform">
<div class="container">
<span id="suc" style="font-size:20px;"></span>
<i> <h1 align=center style="border-style:solid;
border-width:medium;
border-radius:5px;
 font-size: 50px;
background-color:CadetBlue;"><B> ADMIN REGISTRATION</B></h1>
<hr></i>
<label for="username"><b>ADMIN USERNAME</b></label>
<input type="text" placeholder="USERNAME" required name="un">

<label for="email"><b>Email ID</b></label>

<input type="text" placeholder="Enter Email" name="em" required>

<label for="psw"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="pw" required>

<label for="psw-repeat"><b>Repeat Password</b></label>

<input type="password" placeholder="Repeat Password" name="cpw" required>
<hr>
<p>By creating an account you agree to our <a href="#">Terms & Privacy</a>.</p>

<button type="submit" class="registerbtn">Register</button>

</div>

<div class="container signin">

<p>Already have an account? <a href="adminlogin.html">Sign in</a>.</p>
</div>
</form>
</body>
</html>
<script>
 $(document).ready(function(){
$('#registerform').on('submit',function(e){
e.preventDefault();
var formData = new FormData($("#registerform")[0]);
$.ajax({
url:"adregister.php",
method:"POST",
data:formData,
contentType:false,
processData:false,
success:function(data)
{
$('#suc').html(data);
}
})
});
});
</script>

adminregsiter.php
<html>
<head></head>
<body>
<?php
try{
$un=$_POST['un'];
$em=$_POST['em'];
$pw=$_POST['pw'];
 $cpwd=$_POST['cpw'];
if(preg_match('/[\s]/',$un) || preg_match('/[\s]/',$pw)){
$sp=false;
echo "<p style='color:red;text-align:center;'>**Space are not allowed in
username or password</p>";
}
if($un=="" && $pw=="" && $cpwd=="" && $file==""){
echo "<p style='color:red;text-align:center;'>**All fields are required</p>";
}
if(!filter_var($em,FILTER_VALIDATE_EMAIL)){
echo "<p style='color:red;text-align:center;'>**Invalid Email Format</p>";
}
if(preg_match('/[$#!%?]/',$un)){
$sp=false;
echo "<p style='color:red;text-align:center;'>**Special character are not
allowed in username or password</p>";
}
if($un!="" && $pw==""){
echo "<p style='color:red;text-align:center;'>**Please Enter Password</p>";
}
if($un=="" && $pw!=""){
echo "<p style='color:red;text-align:center;'>**Please Enter Username</p>";
}
if($pw!=$cpwd){
echo "<p style='color:red;text-align:center;'>**Password confirmation is not
matching</p>";
}
if($un!="" && $pw!="" && $cpwd!="" && $pw==$cpwd){
 $conn=mysqli_connect("localhost","root","","opinio");
$sql="INSERT INTO `admin`(`adname`,`ademail`,`password`)
VALUES('$un','$em','$pw');";
if(!mysqli_query($conn,$sql)){
echo "<p style='color:red;text-align:center'>record not inserted</p>";
}
else{
echo "<p style='color:green;text-align:center'>Registered
Successfully</p>";
}
mysqli_close($conn);
}
}
catch(Exception $e){
echo $e;
}
?>
</body>
</html>
 MEDIA HOUSE HOME PAGE

adminhome.html
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" type="text/css" href="admin_home1.css">

<link rel="stylesheet" type="text/css" href="admin_home2.css">

<link rel="stylesheet" type="text/css" href="style.css">
 <div>
<?php include("header.php"); ?>
</div>
</head>
<body>
<table border=0px style="border-spacing:4px;">
<tr>
<td>
<div class="w3-container">
<a href="deb_detail.html" class="button" style="vertical-
align:middle"><span>CREATE DEBATE</span></a>
</div>
</td>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>ADVERTISEMENT </span></a>
</div>
</td>
</tr>
<tr>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>UPDATE DEBATE</span></a>
</div>
</td>
 <td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>PAYMENT</span></a>
</div>
</td>
</tr>
<tr>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>REMOVE DEBATE</span></a>
</div>
</td>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>MODERATOR</span></a>
</div>
</td>
</tr>
<tr>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>VIEW REPORT</span></a>
 </div>
</td>
<td>
<div class="w3-container">
<a
href="https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_buttons_all"
class="button" style="vertical-align:middle"><span>REMOVE USER</span></a>
</div>
</td>
</tr>
</TABLE>
</body>
</html>

DEBATE JOINING PAGE

deb_join.html
<html>
 <head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<?php include("header.php"); ?>
</div>
<div class="search-box">
<input type="text" name="" placeholder="Type to Search">
<a class="search-btn" href="#">
<i class="fa fa-search" style="font-size:30px"></i>
</a>
</div>
<div class="join-table">
<form method="POST">
<span id="display_joins"></span>
</form>
</div>
</body>
</html>
<script>
load_joins();
function load_joins()
 {
$.ajax({
url:"display_join.php",
method:"POST",
success:function(data)
{
if(data=="0"){
$('#display_joins').html(data);
}
}
})
}
</script>

display_join.php
<html>
<head><script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script></head>
<body>
<?php
try{
session_start();
$conn=mysqli_connect("localhost","root","","opinio");
$una=$_SESSION['una'];
$pwd=$_SESSION['pwd'];
$sql='SELECT * FROM deb_detail ORDER BY dbcreated DESC';
$result=mysqli_query($conn,$sql);
 $sql1='select * from `registration` where `username`="'.$una.'" and
`password`="'.$pwd.'"';
$result2=mysqli_query($conn,$sql1);
$row1=mysqli_fetch_assoc($result2);
$uid=$row1['id'];
$sql2='SELECT * FROM `deb_join` where `uid`="'.$uid.'"';
$result3=mysqli_query($conn,$sql2);
echo "<form>";
echo "<table border='2'>";
echo "<tr>";
echo "<th width='100' height='50' colspan='4'>JOIN YOUR DEBATE</th>";
echo "</tr>";
while($row=mysqli_fetch_assoc($result)){
echo "<tr>";
echo "<td width='100' height='50'><img
src='data:image/jpeg;base64,".base64_encode($row['image'])."' width='100'
height='100'/></td>";
echo "<td width='300' height='50'>".$row['dbtopic']."</td>";
echo "<td width='100' height='50'><button value=".$row['debateid']."
name='dbidp' id=".$row['debateid']." style='width:140px;height:30px;background-
color:green;'>JOIN As Pro</button></td>";
echo "<td width='100' height='50'><button value=".$row['debateid']."
name='dbida' id=".$row['debateid']." style='width:140px;height:30px;background-
color:red;'>JOIN As Againsts</button></td>";
echo "</tr>";
}
echo "<span id='message'></span>";
echo "</table>";
echo "</form>";
 mysqli_close($conn);
}
catch(Exception $e){
echo $e;
}
?>
</body>
</html>
<script>
$(document).ready(function(){
$("button").on("click",function(){
var x=this.id;
var x2=this.name;
var data={};
data[x2]=$("#"+this.id).val();
if(x=="si"){
window.location.href="login.html";
}
else{
$.ajax({
url:"deb_join.php",
method:"POST",
data:data,
dataType:"text",
success:function(data)
{
if(data=="JOINED"){
 $("button[id='"+x+"'][name='"+x2+"']").html("JOINED");
}
else{

$("button[id='"+x+"'][name='"+x2+"']").html("AJOINED");
}
}
});
return false;
}
});
});
</script>

deb_join.php
<?php
try{
session_start();
$conn=mysqli_connect("localhost","root","","opinio");
if(isset($_POST['dbidp'])){
$dbid=$_POST['dbidp'];
$jas='1';
}
else{
$dbid=$_POST['dbida'];
$jas='0';
}
 $una=$_SESSION['una'];
$pwd=$_SESSION['pwd'];
$sql1='select * from `registration` where `username`="'.$una.'" and
`password`="'.$pwd.'"';
$result=mysqli_query($conn,$sql1);
$row=mysqli_fetch_assoc($result);
$uid=$row['id'];
$sql="INSERT INTO `deb_join`(`uid`,`debid`,`joinedas`) VALUES('$uid','$dbid','$jas');";
/*$sql2='SELECT * FROM `deb_join` where `uid`="'.$uid.'" and `debid`="'.$dbid.'"';*/
if(mysqli_query($conn,$sql)){
echo "JOINED";
}
else{
echo "AJOINED";
}
mysqli_close($conn);

}
catch(Exception $e){
echo $e;
}
?>
 DEBATE JOINED PAGE
deb_joined.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
 <?php include("header.php"); ?>
</div>
<div class="search-box">
<input type="text" name="" placeholder="Type to Search">
<a class="search-btn" href="#">
<i class="fa fa-search" style="font-size:30px"></i>
</a>
</div>
<div class="join-table">
<form method="POST">
<span id="display_joins"></span>
</form>
</div>
</body>
</html>
<script>
load_joins();
function load_joins()
{
$.ajax({
url:"display_joined.php",
method:"POST",
success:function(data)
{
$('#display_joins').html(data);
}
})
 }
</script>

deb_joined.php
<html>
<head><script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script></head>
<body>
<?php
try{
$conn=mysqli_connect("localhost","root","","opinio");
$sql='SELECT * FROM deb_detail ORDER BY dbcreated DESC';
$result=mysqli_query($conn,$sql);
$row=mysqli_fetch_assoc($result);
echo "<form id='form_join' method='POST' id='join_form'>";
echo "<table border='2'>";
echo "<tr>";
echo "<th width='100' height='50' colspan='3'>JOIN YOUR DEBATE</th>";
echo "</tr>";
while($row=mysqli_fetch_assoc($result)){
echo "<tr>";
echo "<td width='100' height='50'><img
src='data:image/jpeg;base64,".base64_encode($row['image'])."' width='100'
height='100'/></td>";
echo "<td width='300' height='50'>".$row['dbtopic']."</td>";
echo "<td width='100' height='50'><button value=".$row['debateid']."
name='dbid' id=".$row['debateid']." style='width:60px;height:20px;'>START
DEBATE</button></td>";
echo "</tr>";
 }
echo "<span id='message'></span>";
echo "</table>";
echo "</form>";
mysqli_close($conn);
}
catch(Exception $e){
echo $e;
}
?>
</body>
</html>
<script>
$(document).ready(function(){
$('#form_join').on('submit',function(e){
e.preventDefault();
$("button").one("click",function(){
var x=this.id;
$.ajax({
url:"deb_join.php",
method:"POST",
async:false,
data:{dbid:($("#"+this.id).val())},
dataType:"text",
success:function(data)
{
if(data=="JOINED"){
 $("#"+x).html("JOINED");
}
else{
$("#"+x).html("JOINED");
}
}
});
});
});
});
</script>

DEBATING PAGE
Debate.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
 <link rel="stylesheet" type="text/css" href="style.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<?php include("header.php"); ?>
</div>
<table border="1" align="center">
<tr colspan="3">
<td><textarea rows="20" cols="40" name="Point"
placeholder="TOPIC"></textarea></td>
<td align="center">
<form id="comment_form" method="POST">
Add Your Point:<textarea rows="20" cols="40" name="Point"
id="Point" style="resize:none;"></textarea><br>
<br>
<input type="submit" value="Post!" id="submit"/><br>
</form>
</td>
<td width="500" height="100"><span id="comment_message"><textarea
rows="25" cols="50" name="Point" placeholder="CHAT"></textarea></span></td>
</tr>
</table>
</body>
</html>
<script>
$(document).ready(function(){
 $('#comment_form').on('submit',function(e){
e.preventDefault();
var form_data = $(this).serialize();
$.ajax({
url:"comment.php",
method:"POST",
data:form_data,
dataType:"JSON",
success:function(data)
{
if(data.error!='')
{
$('#comment_form')[0].reset();

$('#comment_message').html(data.error);
}
}
})
});
setInterval(function(){
load_comment();},1000);
function load_comment()
{
$.ajax({
url:"display_comment.php",
method:"POST",
success:function(data)
 {
$('#comment_message').html(data);
}
})
}
});
</script>

Debate.php
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<?php include("header.php");
$_SESSION['did']=$_POST['dbid'];
$dbid=$_POST['dbid'];
$conn=mysqli_connect("localhost","root","","opinio");
$sql="SELECT * FROM deb_detail where debateid=".$dbid;
$result=mysqli_query($conn,$sql);
$row=mysqli_fetch_assoc($result);
?>
</div>
<table border="1" align="center">
 <tr colspan="3" rowspan="2">
<td width="300">
<figure>
<figcaption>
<center><span style="font-size:18px;color:white;">Valid
till:&nbsp;<?php echo date('Y:m:d',strtotime($row['dbcreated']));
?>&nbsp;&nbsp;TO</span>&nbsp;&nbsp;<span id="predate" style="font-
size:18px;color:white;"><?php echo $row['valid_till']; ?></span></center>
</figcaption>
<img src="data:image/jpeg;base64,<?php echo
base64_encode($row['image']); ?>" width="300" height="450">
<figcaption>
<center><span id="txtpre" style="font-
size:30px;color:white;"><?php echo $row['dbtopic']; ?></span></center>
</figcaption>
</figure>
</td>
<td align="center" rowspan="2">
<form id="comment_form" method="POST">
<span id="did" style="display:none;"><?php echo
$_POST['dbid']; ?></span>
<input type="text" value=<?php echo $_POST['dbid']; ?>
name="dbid" style="display:none;">
<span style="color:white;">Add Your Point:</span><textarea
rows="30" cols="50" name="Point" id="Point"></textarea><br>
<br>
<input type="submit" value="Post!" id="submit"/><br>
</form>
</td>
<td>
 <table border="1">
<tr style="background-color:#BC8F8F;">
<td align="center" style="color:#90EE90;"
width="200px">PROS</td>
<td align="center" style="color:#FFA07A;"
width="200px">AGAINST</td>
</tr>
<tr>
<th width="600" height="550" colspan="2"
style="background-color:#FAFAD2;">
<div class="chatbox">
<div class="chatlogs">
<div class ="chat friend">
<span
id="comment_message"></span>
</div>
</div>
</div>
</th>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
<script>
$(document).ready(function(){
 $('#comment_form').on('submit',function(e){
e.preventDefault();
var form_data = $(this).serialize();
$.ajax({
url:"comment.php",
method:"POST",
data:form_data,
dataType:"JSON",
success:function(data)
{
if(data.error!='')
{
$('#comment_form')[0].reset();
$('#comment_message').html(data.error);
}
}
})
this.reset();
});
});
$(document).ready(function(e){
$.ajaxSetup({cache:false});

setInterval(function(){$('#comment_message').load('display_comment.php');},1000);
});
</script>
 DEBATE CREATING PAGE
deb_detail.html
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.7.0/css/font-awesome.min.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<?php include("header.php"); ?>
</div>
<form id="deb_detail" method="post" enctype="multipart/form-data">
<div class="debdetail">
<table border="1">
<tr colspan="2">
<th colspan="2"><p style="font-size:40px;">Create Your
Debate</p></th>
</tr>
 <tr>
<td>
<p style="font-size:40px;text-align:center;">
Debate Detail
</p>
<p style="font-size:20px;text-align:center;">
Enter Debate Topic:
</p>
<input type="text" name="dt" placeholder="Enter
Debate Topic" id="dt"/><br>
<br>
<p style="font-size:20px;text-align:center;">
Select Image For Debate Topic:
</p>
<input type="file" id="image"
onchange="imagePreview(this);" name="image" style="width:300px;text-
align:center;height:40px;background-color:grey;"/><br>
<br>
<p style="font-size:20px;text-align:center;">
Select Debate Duration:
</p>
<input type="date" id="dur" name="dur"/>
</td>
<td>
<p style="font-size:40px;text-
align:center;">Debate Preview</p>
<figure>
<figcaption>
 <center>Valid till:<span
id="predate" style="font-size:20px"></span></center>
</figcaption>
<img src="" alt="Image Preview"
height="200" id="imgpreview"><br>
<figcaption>
<center><span id="txtpre"
name="txtpre" style="font-size:30px"></span></center>
</figcaption>
</figure>
</td>
</tr>
<tr>
<td align="center" colspan="2"><input type="submit"
value="create Debate" name="create" id="create"/></td>
</tr>
</table>
</div>
</form>
</body>
</html>
<script>
$(function(){
$('#dur').on("keyup change",function(){
$('#predate').text($(this).val());
});
});
$(function(){
 $('#dt').keyup(function(){
$('#txtpre').text($(this).val());
});
});
function imagePreview(input){
if(input.files && input.files[0]){
var filerd = new FileReader();
filerd.onload=function(e){
$("#imgpreview").attr("src",e.target.result)
};
filerd.readAsDataURL(input.files[0]);
}
};
$(document).ready(function(){
$('#deb_detail').on('submit',function(e){
e.preventDefault();
var formData = new FormData($("#deb_detail")[0]);
$.ajax({
url:"deb_detail.php",
method:"POST",
data:formData,
contentType:false,
processData:false,
success:function(data)
{
if(data=="1"){
alert("Debate Created Successfully");
 }
else{
alert("Debate Creation Failed");
}
}
})
$('#imgpreview').attr("src","");
$('#txtpre').text("");
$('#predate').text("");
this.reset();
});
});
</script>

deb_detail.php
<?php
try{
$conn=mysqli_connect("localhost","root","","opinio");
$dbtopic=$_POST['dt'];
$vdate=date('Y-m-d',strtotime($_POST['dur']));
$file = addslashes(file_get_contents($_FILES["image"]["tmp_name"]));
$sql="INSERT INTO `deb_detail`(`dbtopic`,`image`,`valid_till`)
VALUES('$dbtopic','$file','$vdate');";
if(mysqli_query($conn,$sql)){
echo "1";
}
else{
echo "0";
 }
}
catch(Exception $e){
echo $e;
}
?>

HEADER IN PAGES
Header1
Header1.php
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="header">
 <h1>Opino.com</h1>
<button id="si"><a href="loginas.html">Signin</a></button>
<button id="su"><a href="register.html">Signup</a></button>
<div>
</body>

</html>

Header2

Header.php
<?php session_start(); ?>
<html>
<head>
<meta name="viewport" content="width=device-
width,initial-scale=1.0">

<link rel="stylesheet" type="text/css"

href="style.css">
 </head>
<body>
<?php

$conn=mysqli_connect("localhost","root","","opinio");
$una=$_SESSION['una'];
$pwd=$_SESSION['pwd'];
$sql1='select * from `registration` where
`username`="'.$una.'" and `password`="'.$pwd.'"';
$result1=mysqli_query($conn,$sql1);
$row1=mysqli_fetch_assoc($result1);
?>
<div class="header">
<h1>Opino.com</h1>
<button id="si"><a
href="login.html">Logout</a></button>
<div id="profile">
<figure>
<img
src="data:image/jpeg;base64,<?php echo
base64_encode($row1['profile']); ?>" alt="Image Preview"
height="80" width="120"><br>
 <figcaption>
<center><span style="font-
size:20px;"><?php echo $_SESSION['una'];
?></span></center>
</figcaption>
</figure>
</div>
<div>
</body>
</html>
CSS CODE
Style.css
.header{
background-image:url("log1.png");
width:100%;
height:20%;
background-color:#fff0b3;
background-size:35% 75%;
background-repeat:no-repeat;
background-position:center;
margin-bottom:50px;
}
body{
background: linear-gradient(to right, #cc0000 0%, #ffff66 100%);
}
.search-box{
position:absolute;
top:30%;
left:40%;
background:gray;
height:45px;
}
.search-box input[type="text"]{
width:300px;
height:45px;
}
.search-btn{
color:#4da6ff;
}
#vjdebate{
position:absolute;
left:28%;
height:40px;
width:330px;
}
#jdebate{
position:absolute;
left:50%;
height:40px;
width:330px;
}
.debdetail{
position:absolute;
top:25%;
width:600px;
left:50%;
margin-left:-300px;
}
#register input[type="text"],#register input[type="password"],#register input[type="file"]{
width:300px;display:block;text-align:center;height:40px;
}
.debdetail input[type="text"],.debdetail input[type="submit"],.debdetail input[type="date"]{
width:300px;text-align:center;height:40px;
}
.join-table{
position:absolute;
top:40%;
left:28%;
}
.chatbox{
width:600px;
min-width:400px;
height:500px;
background-color:#FAFAD2;
padding:25px;
margin:20px auto;
}
.chatlogs{
padding: 10px;
width: 100%;
height:500px;
overflow-x: hidden;
overflow-y: scroll;
}
.chatlogs::-webkit-scrollbar{
width:10px;
}
/* Track */
.chatlogs::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 10px;
}

/* Handle */
.chatlogs::-webkit-scrollbar-thumb {
background: red;
border-radius: 10px;
}

/* Handle on hover */
.chatlogs::-webkit-scrollbar-thumb:hover {
background: #b30000;
}
.chat{
display:flex;
 flex-flow: row wrap;
align-items: flex-start;
margin-bottom:10px;
}
.chat .user-photo{
width:60px;
height:60px;
background-color:white;
border-radius:50%;
overflow:hidden;
}
.chat .user-photo img{
width:100%;
}
.chat .chat-message {
width:80%;
padding:20px;
margin:-55px 65px 0;
background-color:green;
border-radius: 10px;
color:black;
font-size:20px;
}
h1{
font-size:80px;
}
h1::first-letter{
 font-size:90px;
}
#si{
margin-left:1300px;
position:absolute;top:15px;right:16px;
margin-top:30px;
width:80px;
line-height:15px;
height:20px;
}
#su{
position:absolute;top:15px;right:120px;
margin-top:30px;
width:80px;
line-height:15px;
height:20px;
}
/*loginas.html*/
#admin-login{
position:absolute;
left:18%;
height:50px;
width:430px;
}
#user-login{
position:absolute;
left:52%;
 height:50px;
width:430px;
}
/*adminlogin.html*/
#adlogin{
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 30%;
}
#logout{
margin-left:1300px;
position:absolute;top:15px;right:16px;
margin-top:30px;
width:80px;
line-height:15px;
height:20px;
}
#profile{
margin-left:1300px;
position:absolute;top:0px;right:200px;
margin-top:5px;
line-height:15px;
}
/*button of upvote and downvote*/
.btnmsg{
background-color:LawnGreen;
border: none;
color: white;
margin:10px;
padding: 8px 12px;
font-size: 18px;
cursor: pointer;
border-radius: 30px;
}
.btnmsg:hover {
background-color:black ;
}
/*Displaying msg time*/
#tt{
font-size:18px;
font-family:Raleway;
text-align:right;
margin-left:80px;

@media screen and (max-width:450px){

h1{
font-size:15px;
}
h1::first-letter{
 font-size:40px;
}
#si{
margin-left:1300px;
position:absolute;top:15px;right:10px;
margin-top:30px;
width:49px;
line-height:15px;
height:20px;
}
#su{
position:absolute;top:15px;right:63px;
margin-top:30px;
width:51px;
line-height:15px;
height:20px;
}
}
@media screen and (max-width:800px and min-width:700px){
h1{
font-size:40px;
}
h1::first-letter{
font-size:40px;
}
}

adminhome1.css
*{
padding: 0px;
margin: 0px ;
font-family:tahoma,sans-serif;

}
table {
font-family: arial, sans-serif;
width: 100%;
margin-top:50px;
margin-left:80px;
}

.button {
display: inline-block;
border-radius: 4px;
background-color: #f4511e;
border: none;
color: #FFFFFF;
text-align: center;
font-size: 28px;
padding: 30px;
width: 500px;
transition: all 0.5s;
cursor: pointer;
margin:0px 10px;
background-color:#800000;
}

.button span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.5s;
}

.button span:after {
content: '\00bb';
position: absolute;
opacity: 0;
top: 0;
right: -20px;
transition: 0.5s;
}

.button:hover span {
padding-right: 25px;
}

.button:hover span:after {
opacity: 1;
right: 0;
}

adminhome2.css
.chip {
display: inline-block;
padding: 0 25px;
height: 80px;
font-size: 20px;
line-height: 80px;
border-radius: 40px;
background-color: orange;
}

.chip img {
float: left;
margin: 0 10px 0 -25px;
height: 80px;
width: 80px;
border-radius: 50%;
}
DATABASE-opinio
 TABLES comment

deb_detail
debatejoin

registration
admin
Sr Form Test step Expected Actual Pass/fail
no name condition output output
1 Login Login with Input Invalid Invalid pass
with input invalid wrong credential credential
password credential

2 Login Login with valid Input Login Login pass

with input password correct successful successful
credential
3 Search Search invalid Input invalid No such No such pass
debate debate name name debate debate
name
4 Search Search valid Input valid Shows the Shows the pass
debate debate name name debate debate
name
5 Join as Participate as Click on pro Participated in Participated pass
pro pro debate as pro in debate as
pro

6 Join as Participate as Click on Participated in Participated pass

against against against debate as in debate as
against against

7 Like the Like the Click on like Liked the Liked the pass
argument argument argument argument

8 Dislike Dislike the Click on like Disliked the Disliked the pass
the argument argument argument
argument