Bagaimana cara membuat Wallpost seperti facebook dengan PHP - Ajax - MySQL

Antefer.web.id
0 Comments
Kita tentu familiar dengan Jejaring Pertemanan Facebook, dalam situs kita dapat mengupdate semua tentang kita di sana, baik video, gambar, dan lain-lain. Dalam mengupdate tentunya kita menuliskan sesuatu di sebuah input textbox setelah kita tekan tombol "share" maka apa yang kita masukkan akan dilihat oleh teman-teman kita.

Berikut sedikit contoh dasar dalam membuat share post seperti yang ada dalam Facebook. Contoh sederhana ini dapat dikembangkan sesuai kebutuhan, dapat juga dipasang di web sebagai commnet system tentunya setelah dilakukan modifikasi.

Dalam projek ini berikut struktur direktorinya :
- session.php --> pencatatan user (jika ada fasilitas login), karena demo $uid = 1;
- message_ajax.php --> untuk menambahkan Update/Pesan Utama
- load_messages.php --> untuk menampilkan data update/pesan utama pada halaman utama
- load_comments.php --> untuk menampilkan data komentar dari setiap update/pesan utama (jika ada)
- index.php --> halaman utama
- delete_message_ajax.php --> menghapus pesan update/pesan utama
- delete_comment_ajax.php --> menghapus komentar
- comment_ajax.php -> untuk menambah komentar dari update/pesan utama yang ada.
- js/wall.js --> fungsi ajax untuk menangani wallpost system
- js/jquery.oembed.js --> fungsi ajax untuk mengambil url yang diisi dan menampilkan hasil (yotube.com, vimeo.com, dll)
- includes/tolink.php
- includes/time_stamp.php --> fungsi untuk menampilkan berapa lama update/komentar telah di post
- includes/functions.php --> class yang dibuat untuk komunikasi dengan database.
- includes/db.php --> konfigurasi koneksi database
- css/wall.css --> style sheet dari wall post..


Langkah 1

Pertama kita tentukan struktur database seperti berikut :
Tabel Users :
CREATE TABLE `users` (
`uid` int(11) AUTO_INCREMENT PRIMARY KEY,
`username` varchar(255) UNIQUE KEY,
`password` varchar(100),
`email` varchar(255) UNIQUE KEY
)

Tabel Messages :

 CREATE TABLE `messages` (
`msg_id` int(11) AUTO_INCREMENT PRIMARY KEY,
`message` varchar(255),
`uid_fk` int(11),
`ip` varchar(30),
`created` int(11),
FOREIGN KEY(uid_fk) REFERENCES users(uid)
)

Tabel Comments :

 CREATE TABLE `comments` (
`com_id` int(11) AUTO_INCREMENT PRIMARY KEY,
`comment` varchar(255),
`msg_id_fk` int(11),
`uid_fk` int(11),
`ip` varchar(30),
`created` int(11),
FOREIGN KEY(uid_fk) REFERENCES users(uid),
FOREIGN KEY(msg_id_fk) REFERENCES messages(msg_id)
)

Langkah 2

Edit konfigurasi database koneksi yang ada pada file includes/db.php :

<?php
define('DB_SERVER', 'Host');
define('DB_USERNAME', 'User Name');
define('DB_PASSWORD', 'Password');
define('DB_DATABASE', 'Database');
$connection = mysql_connect(DB_SERVER, DB_USERNAME, DB_PASSWORD) ordie(mysql_error());
$database = mysql_select_db(DB_DATABASE) or die(mysql_error());
?>

Langkah 3

index.php akan terlihat seperti berikut :
<?php
include_once 'includes/db.php';
include_once 'includes/functions.php';
include_once 'session.php';
$Wall = new Wall_Updates();
$updatesarray=$Wall->Updates($uid);
?>
<link href="css/wall.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.oembed.js"></script>
<script type="text/javascript" src="js/wall.js"></script>
What's up?
<form method="post" action="">
<textarea cols="30" rows="4" name="update" id="update" maxlength="200" ></textarea>
<br />
<input type="submit" value=" Update " id="update_button" class="update_button"/>
</form>
<div id="content">
<?php include('load_messages.php'); ?>
</div>

Langkah 4

Konfigurasi session, jika nantinya anda menggunakan fungsi login maka konfigurasi session ini akan berguna untuk mencatat informasi user yang login:
<?php
session_start();
$uid=$_SESSION['user_id']; // In demo $uid=1
?>

Langkah 5

Untuk menambah fungsi-fungsi tambahan jika ingin memodifikasi projek ini silahkan tambah fungsi sendiri di includes/functions.php
<?php
class Wall_Updates 
{
// Updates 
public function Updates($uid)
{
$query = mysql_query("SELECT M.msg_id, M.uid_fk, M.message, M.created, U.username FROM messages M, users U  WHERE M.uid_fk=U.uid and M.uid_fk='$uid' order by M.msg_id desc ") or die(mysql_error());
while($row=mysql_fetch_array($query))
$data[]=$row;
return $data;
}
//Comments
public function Comments($msg_id)
{
$query = mysql_query("SELECT C.com_id, C.uid_fk, C.comment, C.created, U.username FROM comments C, users U WHERE C.uid_fk=U.uid and C.msg_id_fk='$msg_id' order by C.com_id asc ") or die(mysql_error());
while($row=mysql_fetch_array($query))
$data[]=$row;
if(!empty($data))
{
return $data;
}
}
//Avatar Image
public function Gravatar($uid)
{
$query = mysql_query("SELECT email FROM `users` WHERE uid='$uid'") or die(mysql_error());
$row=mysql_fetch_array($query);
if(!empty($row))
{
$email=$row['email'];
$lowercase = strtolower($email);
$imagecode = md5( $lowercase );
$data="http://www.gravatar.com/avatar.php?gravatar_id=$imagecode";
return $data;
}
else
{
$data="default.jpg";
return $data;
}
}
//Insert Update
public function Insert_Update($uid, $update)
{
$update=htmlentities($update);
$time=time();
$ip=$_SERVER['REMOTE_ADDR'];
$query = mysql_query("SELECT msg_id,message FROM `messages` WHERE uid_fk='$uid' order by msg_id desc limit 1") or die(mysql_error());
$result = mysql_fetch_array($query);
if ($update!=$result['message'])
{
$query = mysql_query("INSERT INTO `messages` (message, uid_fk, ip,created) VALUES ('$update', '$uid', '$ip','$time')") or die(mysql_error());
$newquery = mysql_query("SELECT M.msg_id, M.uid_fk, M.message, M.created, U.username FROM messages M, users U where M.uid_fk=U.uid and M.uid_fk='$uid' order by M.msg_id desc limit 1 ");
$result = mysql_fetch_array($newquery);
return $result;
}
else
{
return false;
}
}
//Delete update
public function Delete_Update($uid, $msg_id)
{
$query = mysql_query("DELETE FROM `comments` WHERE msg_id_fk = '$msg_id' ") or die(mysql_error());
$query = mysql_query("DELETE FROM `messages` WHERE msg_id = '$msg_id' and uid_fk='$uid'") or die(mysql_error());
return true;
}
//Insert Comments
public function Insert_Comment($uid,$msg_id,$comment)
{
$comment=htmlentities($comment);
$time=time();
$ip=$_SERVER['REMOTE_ADDR'];
$query = mysql_query("SELECT com_id,comment FROM `comments` WHERE uid_fk='$uid' and msg_id_fk='$msg_id' order by com_id desc limit 1 ") or die(mysql_error());
$result = mysql_fetch_array($query);
if ($comment!=$result['comment'])
{
$query = mysql_query("INSERT INTO `comments` (comment, uid_fk,msg_id_fk,ip,created) VALUES ('$comment', '$uid','$msg_id', '$ip','$time')") or die(mysql_error());
$newquery = mysql_query("SELECT C.com_id, C.uid_fk, C.comment, C.msg_id_fk, C.created, U.username FROM comments C, users U where C.uid_fk=U.uid and C.uid_fk='$uid' and C.msg_id_fk='$msg_id' order by C.com_id desc limit 1 ");
$result = mysql_fetch_array($newquery);
return $result;
}
else
{
return false;
}
}
//Delete Comments
public function Delete_Comment($uid, $com_id)
{
$query = mysql_query("DELETE FROM `comments` WHERE uid_fk='$uid' and com_id='$com_id'") or die(mysql_error());
return true;
}
}
?>

Bagaimana cara menambahkan sebuah fungsi/method

Misalkan kita akan mengambil data tentang gambar, maka tambahkan sebuah fingsi di dalam class Wall_Updates{}. pertama-tama alter tabel users tambahkan field gambar type text;
public function Image_Path($uid)
{
$result = mysql_query("SELECT image_path FROM users WHERE uid = $uid");
$user_data = mysql_fetch_array($result);
echo $user_data['image_path'];
}
Cara menampilkan data gambar sebagai berikut : 
<?php
$Wall = new Wall_Updates();
$image=$Wall->Image_Path($uid);
$user->Image_Path($uid);
echo "<img src='$image'/>"
?>

Agar program dapat berjalan, silahakan menambahkan 1 user di dalam Table USERS , misalkan:
 INSERT INTO `users`(`uid`, `username`, `password`, `email`) VALUES ('1','antefer.web.id','123456','webmaster@antefer.web.id')
Karena diasumsikan sudah ada user yang teregistrasi, didalam system.

Untuk script lengkap download, dan untuk melihat demo dapat dilihat di bawah ini : Demikian sedikit penjelasan tentang cara membuat Wallpost seperti facebook. Semoga dapat bermanfaat..

Posting Komentar

0Komentar

Posting Komentar (0)

#buttons=(Ok, Go it!) #days=(20)

Our website uses cookies to enhance your experience. Check Now
Ok, Go it!