Aplikasi chatting tidak asing lagi
bagi telinga kita, sebab sudah sering kita lihat iklan pada televisi atau pada
media lainnya seperti wechat, line, dan lain-lain. Apakah terlintas difikiran
kita bagaimana cara membuat chat sendiri tidak perlu menggunakan milik orang
lain.
Pada pembuatan aplikasi chatting maka anda buatlah sebuah folder dengan nama apa saja namun disini penulis menggunakan nama chatroom kemudian buatlah database pada mysql server dengan nama database dan tabel terserah anda namun yang wajib diketahui anda harus edit file koneksi.php sesuai dengan user server anda, untuk script sql dapat anda copy seperti dibawah ini.
Pada pembuatan aplikasi chatting maka anda buatlah sebuah folder dengan nama apa saja namun disini penulis menggunakan nama chatroom kemudian buatlah database pada mysql server dengan nama database dan tabel terserah anda namun yang wajib diketahui anda harus edit file koneksi.php sesuai dengan user server anda, untuk script sql dapat anda copy seperti dibawah ini.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
CREATE DATABASE IF NOT
EXISTS
`chat` DEFAULT CHARACTER SET latin1 COLLATE
latin1_swedish_ci;
USE
`chat`;
CREATE TABLE IF NOT
EXISTS `message`
(
`id`
int(11) NOT NULL AUTO_INCREMENT,
`message`
text NOT NULL,
`sender`
varchar(30) NOT NULL,
PRIMARY KEY (`id`)
)
ENGINE=MyISAM DEFAULT
CHARSET=latin1
AUTO_INCREMENT=13 ;
INSERT INTO `message` (`id`, `message`, `sender`) VALUES
(1, 'helo',
'argie'),
(2,
'hi', 'wewew'),
(3,
'helo', 'argie'),
(4,
'helo', 'argie'),
(5,
'(=^_^=)', 'wewew'),
(6,
'helo', 'argie'),
(7,
'hi', 'Ghazali'),
(8,
'saya suka', 'Ghazali'),
(9,
'saya datang', 'admin'),
(10,
'saya juga', 'user'),
(11,
'emang kamu dimana', 'admin'),
(12,
'saya di sebelah feri', 'user');
CREATE TABLE IF NOT
EXISTS
`user` (
`id_user`
int(11) NOT NULL AUTO_INCREMENT,
`username`
varchar(45) NOT NULL,
`password`
varchar(45) NOT NULL,
PRIMARY KEY (`id_user`)
)
ENGINE=InnoDB DEFAULT
CHARSET=latin1
AUTO_INCREMENT=3 ;
INSERT INTO `user` (`id_user`, `username`, `password`) VALUES
(1,
'admin', 'admin'),
(2,
'user', 'user');
|
Selanjutnya pada folder tadi buat file koneksi.php dan letakkan script dibawah ini dan selanjutnya buat file lagi yang berbentuk bold.
1
2
3
4
|
<?php
mysql_connect("localhost","root","")or die("Gagal Koneksi");
mysql_select_db("chat")or die("Tidak ada
database");
?>
|
header.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
<!DOCTYPE
html>
<html>
<head>
<meta
http-equiv="Content-Type"
content="text/html;
charset=utf-8"
/>
<title>Simple
Chat</title>
<script
language="javascript"
src="jquery-1.2.6.min.js"></script>
<script
language="javascript"
src="jquery.timers-1.0.0.js"></script>
<script
type="text/javascript">
$(document).ready(function(){
var j = jQuery.noConflict();
j(document).ready(function(){
j(".refresh").everyTime(1000,function(i){
j.ajax({
url:
"refresh.php",
cache:
false,
success:
function(html){
j(".refresh").html(html);
}
})
})
});
j(document).ready(function()
{
j('#post_button').click(function()
{
$text = $('#post_text').val();
j.ajax({
type:
"POST",
cache:
false,
url:
"save.php",
data:
"text="+$text,
success:
function(data) {
alert('data
has been stored to database');
}
});
});
});
j('.refresh').css({color:"green"});
});
</script>
<style
type="text/css">
.refresh
{
border:
1px solid #333333;
border-left:
4px solid #333333;
color:
green;
font-family:
tahoma;
font-size:
12px;
height:
225px;
overflow:
auto;
width:
400px;
padding:10px;
background-color:#FFFFFF;
}
#post_button{
border:
1px solid #333333;
background-color:#333333;
width:
100px;
color:#FFFFFF;
font-weight:
bold;
margin-left:
-105px; padding-top: 4px; padding-bottom: 4px;
cursor:pointer;
}
#buttontwo{
border:
1px solid #333333;
background-color:#333333;
width:
100px;
color:#FFFFFF;
font-weight:
bold;
margin-left:
-105px; padding-top: 4px; padding-bottom: 4px;
cursor:pointer;
}
#textlog{
border:
1px solid #333333;
border-left:
4px solid #333333;
width:
410px;
margin-bottom:
10px;
padding:5px;
}
#textb{
border:
1px solid #333333;/*#3366FF;*/
border-left:
4px solid #333333;
width:
320px;
margin-top:
10px; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; width: 415px;
}
#texta{
border:
1px solid #333333;
border-left:
4px solid #333333;
width:
410px;
margin-bottom:
10px;
padding:5px;
}
.p{
border-top:
1px solid #EEEEEE;
margin-top:
0px; margin-bottom: 5px; padding-top: 5px;
}
span{
font-weight:
bold;
color:
#3B5998;
}
</style>
</head>
<body>
|
footer.php
1
2
3
4
5
|
<footer>
<p>©
Ghazali</p>
</footer>
</body>
</html>
|
index.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
<?php
include "koneksi.php";
include "header.php";
if(isset($_POST['submit'])){
$user=$_POST['user'];
$pass=$_POST['pass'];
$has=mysql_query("select
* from user where username='$user' and password='$pass'");
$data=mysql_fetch_array($has);
$u=$data['username'];
$p=$data['password'];
if($user=$u && $pass=$p){
session_start();
$_SESSION['username']=$u;
header('location:
chat.php');
}
else{
echo mysql_error();
}
}
?>
<form
method="post"
name="" action="">
<p><label>Username
</label>
<input
name="user"
type="text" id="textlog"/></p>
<p><label>Password
</label>
<input
name="pass"
type="password" id="textlog"/>
<input
name="submit"
type="submit" value="Login" id="buttontwo" /></p>
</form>
<?php
include "footer.php"; ?>
|
chat.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<?php
include "koneksi.php";
include "header.php";
session_start();
if(!isset($_SESSION['username'])){
header('location:
index.php');
}
if(isset($_GET['out'])=='yes'){
echo '<script
type="text/javascript">window.location.assign("index.php");</script>';
session_destroy();
}
if(isset($_POST['submit'])){
$message=$_POST['message'];
$sender=$_POST['sender'];
mysql_query("INSERT
INTO message(message, sender)VALUES('$message', '$sender')");
}
?>
<p>Selamat
datang wahai <b><?php echo
$_SESSION['username']
?></b> | <a href="?out=yes" style="text-decoration:none;color:
green;">Logout</a></p>
<form
method="POST"
name="" action="">
<input
name="sender"
type="hidden" id="texta" value="<?php echo
$_SESSION['username'] ?>"/>
<div
class="refresh">
<?php
include "refresh.php"; ?>
</div>
<input
name="message"
type="text" id="textb"/>
<input
name="submit"
type="submit" value="Chat" id="post_button" />
</form>
<?php
include "footer.php"; ?>
|
refresh.php
1
2
3
4
5
6
7
|
<?php
include "koneksi.php";
$result = mysql_query("SELECT * FROM
message ORDER BY id DESC");
while($row = mysql_fetch_array($result)){
echo '<p
class="p">'.'<span>'.$row['sender'].'</span>'.
' ' .
$row['message'].'</p>';
}
?>
|
save.php
1
2
3
4
5
6
7
|
<?php
if (isset($_POST['text'])) {
include "koneksi.php";
$ddd=$_POST['text'];
$query = "INSERT INTO message
(message) VALUES ('$ddd')";
}
?>
|