Membuat Chat Online Sederhana dengan PHP-Sql

Mari belajar tentang cara membuat aplikasi Obrolan sederhana dengan menggunakan sistem login yang sudah ada. Ini akan solusi yang berguna dan yang paling sederhana. Kami akan dapat chatting dengan anggota login kami. Kami akan menggunakan database untuk menyimpan pesan.

Tahap-1 : Membuat Template dengan HTML, PHP
Ini untuk jendela obrolan utama. copy script dibawah ini dengan nama: index.php

    
<frameset rows="65%,35%" framespacing="1" frameborder="yes" border="1" bordercolor="#FF0000">
    <frame src="messages.php" name="main_frame">
    <frame src="main.php" name="login_frame" scrolling="no" noresize target="middle">
</frameset>

Selanjutnya buat form login, kopi kode dibwah ini dan beri nama: login_form.html

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

<form class="login_form" method="post" action="main.php">
 <div>Username: <input type="text" name="username" /></div>
 <div>Password: <input type="password" name="password" /></div>
 <div><input type="submit" value="Login" name="Login" /></div>
</form>
<div>You can use username "User1" or "User2" or "User3" and password "qwerty" to login in system</div>

Berikut adalah file 3 template untuk chatting (2 kotak pesan dan 1 untuk mengirim formulir pesan):

chat_begin.html

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

<div class="chat_main">
<h3>Chat</h3>

chat_end.html

</div>

chat_input.html

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

<form class="submit_form" method="post" action="main.php">
 <div><input type="text" name="s_message" /><input type="submit" value="Say" name="s_say" /></div>
</form>
<div>You can type anything in chat</div>

Tahap-2 : CSS

Kopi kode dibawah ini, simpan dengan nama: styles.css

.login_form {
 border: 1px solid #AAA;
 padding:10px;
}

h3 {margin-top:3px;}

.chat_main {
 border:1px solid #AAA;
 -moz-box-shadow:0 0 10px #ccc;
 -webkit-box-shadow: 0 0 10px #ccc;
 width:350px;
 padding:10px;
 background:#f3f3f3;
}

.message {
 border:1px solid #AAA;
 margin:4px;
 padding:5px;
 -moz-border-radius:7px;
 -webkit-border-radius:7px;
 background:#ffffff;
}

.textf {
-moz-box-shadow:0 0 10px #CCCCCC;
-webkit-box-shadow:0 0 10px #CCCCCC;
border:1px solid #CCCCCC;
height:40px;
}

.submit {
-moz-border-radius:7px;
-webkit-border-radius:7px;
background:#F3F3F3;
border:1px solid #CCCCCC;
font-size:16px;
font-weight:bold;
height:35px;
margin-left:10px;
padding:5px;
}
.message span {
 font-size:10px;
 color:#888;
 margin-left:10px;
}

.submit_form {
 margin:10px 0px;
}

Tahap-3 : Membuat Database

CREATE TABLE `s_chat_messages` (
`id` INT(11) NOT NULL AUTO_INCREMENT ,
`user` VARCHAR(255) NOT NULL ,
`message` VARCHAR(255) NOT NULL ,
`when` INT(11) NOT NULL ,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

Buatlah Database seperti dibawah ini:

Tahap-4 : Membuat Kode PHP

Anda ingat - untuk memiliki siap sistem otentikasi mudah. Saya pindah ke file library eksternal (inc / login.inc.php). Ini akan berguna bagi kita - sekarang kode lebih terstruktur dan nyaman untuk digunakan di tempat yang berbeda dari kode.

Setelah membuat perpustakaan baru untuk bekerja dengan chatting (inc / chat.inc.php). Kelas ini memiliki fungsi berikutnya:

menerima Pesan - fungsi menerima pesan yang dikirim dan menyimpannya dalam tabel DB

getMessages - daftar kembali dari 15 pesan terakhir

Setelah membuat 2 file terakhir: messages.php dan main.php. file pertama digunakan untuk menggambar daftar pesan. Ini memiliki pembaruan otomatis setiap 5 detik (saya hal ini cukup untuk chatting kami). bentuk imbang login kedua dan bidang masukan dari chatting. Di mana kita karena login dapat memasukkan teks dalam chat.

Ok, di sini adalah semua file PHP yang digunakan, dengan nama: 

main.php

<?php

// set error reporting level
if (version_compare(phpversion(), "5.3.0", ">=") == 1)
 error_reporting(E_ALL & ~E_NOTICE & ~E_DEPRECATED);
else
 error_reporting(E_ALL & ~E_NOTICE);

require_once('inc/login.inc.php');
require_once('inc/chat.inc.php');

// initialization of login system and generation code
$oSimpleLoginSystem = new SimpleLoginSystem();

$oSimpleChat = new SimpleChat();

// draw login box
echo $oSimpleLoginSystem->getLoginBox();

// draw chat application
$sChatResult = 'Need login before using';
if ($_COOKIE['member_name'] && $_COOKIE['member_pass']) {
 if ($oSimpleLoginSystem->check_login($_COOKIE['member_name'], $_COOKIE['member_pass'])) {
 $sChatResult = $oSimpleChat->acceptMessages();
 }
}
echo $sChatResult;

?>

messages.php

<meta http-equiv="refresh" content="5">
<?php

require_once('inc/chat.inc.php');
$oSimpleChat = new SimpleChat();
echo $oSimpleChat->getMessages();

?>

Buatlah direktori inc, isi file : chat.inc.php, login.inc.php
inc/chat.inc.php

<?php

// simple chat class
class SimpleChat {

    // DB variables
    var $sDbName;
    var $sDbUser;
    var $sDbPass;

    // constructor
    function SimpleChat() {
        //mysql_connect("localhost","username","password");
        $this->sDbName = 'database_name';
        $this->sDbUser = 'username';
        $this->sDbPass = 'password';
    }

    // adding to DB table posted message
    function acceptMessages() {
        if ($_COOKIE['member_name']) {
            if(isset($_POST['s_say']) && $_POST['s_message']) {
                $sUsername = $_COOKIE['member_name'];

                //the host, name, and password for your mysql
                $vLink = mysql_connect("localhost", $this->sDbUser, $this->sDbPass);

                //select the database
                mysql_select_db($this->sDbName);

                $sMessage = mysql_real_escape_string($_POST['s_message']);
                if ($sMessage != '') {
                    mysql_query("INSERT INTO `s_chat_messages` SET `user`='{$sUsername}', `message`='{$sMessage}', `when`=UNIX_TIMESTAMP()");
                }

                mysql_close($vLink);
            }
        }

        ob_start();
        require_once('chat_input.html');
        $sShoutboxForm = ob_get_clean();

        return $sShoutboxForm;
    }

    function getMessages() {
        $vLink = mysql_connect("localhost", $this->sDbUser, $this->sDbPass);

        //select the database
        mysql_select_db($this->sDbName);

        //returning the last 15 messages
        $vRes = mysql_query("SELECT * FROM `s_chat_messages` ORDER BY `id` ASC LIMIT 15");

        $sMessages = '';

        // collecting list of messages
        if ($vRes) {
            while($aMessages = mysql_fetch_array($vRes)) {
                $sWhen = date("H:i:s", $aMessages['when']);
                $sMessages .= '<div class="message">' . $aMessages['user'] . ': ' . $aMessages['message'] . '<span>(' . $sWhen . ')</span></div>';
            }
        } else {
            $sMessages = 'DB error, create SQL table before';
        }

        mysql_close($vLink);

        ob_start();
        require_once('chat_begin.html');
        echo $sMessages;
        require_once('chat_end.html');
        return ob_get_clean();
    }
}

?>

inc/login.inc.php

<?

// class SimpleLoginSystem
class SimpleLoginSystem {

    // variables
    var $aExistedMembers; // Existed members array

    // constructor
    function SimpleLoginSystem() {
        $this->aExistedMembers = array(
            'User1' => 'd8578edf8458ce06fbc5bb76a58c5ca4',
            'User2' => 'd8578edf8458ce06fbc5bb76a58c5ca4',
            'User3' => 'd8578edf8458ce06fbc5bb76a58c5ca4'
        );
    }

    function getLoginBox() {
        ob_start();
        require_once('login_form.html');
        $sLoginForm = ob_get_clean();

        $sLogoutForm = '<a href="'.$_SERVER['PHP_SELF'].'?logout=1">logout</a>';

        if ((int)$_REQUEST['logout'] == 1) {
            if (isset($_COOKIE['member_name']) && isset($_COOKIE['member_pass']))
                $this->simple_logout();
        }

        if ($_REQUEST['username'] && $_REQUEST['password']) {
            if ($this->check_login($_REQUEST['username'], MD5($_REQUEST['password']))) {
                $this->simple_login($_REQUEST['username'], $_REQUEST['password']);
                return 'Hello ' . $_REQUEST['username'] . '! ' . $sLogoutForm;
            } else {
                return 'Username or Password is incorrect' . $sLoginForm;
            }
        } else {
            if ($_COOKIE['member_name'] && $_COOKIE['member_pass']) {
                if ($this->check_login($_COOKIE['member_name'], $_COOKIE['member_pass'])) {
                    return 'Hello ' . $_COOKIE['member_name'] . '! ' . $sLogoutForm;
                }
            }
            return $sLoginForm;
        }
    }

    function simple_login($sName, $sPass) {
        $this->simple_logout();

        $sMd5Password = MD5($sPass);

        $iCookieTime = time() + 24*60*60*30;
        setcookie("member_name", $sName, $iCookieTime, '/');
        $_COOKIE['member_name'] = $sName;
        setcookie("member_pass", $sMd5Password, $iCookieTime, '/');
        $_COOKIE['member_pass'] = $sMd5Password;
    }

    function simple_logout() {
        setcookie('member_name', '', time() - 96 * 3600, '/');
        setcookie('member_pass', '', time() - 96 * 3600, '/');

        unset($_COOKIE['member_name']);
        unset($_COOKIE['member_pass']);
    }

    function check_login($sName, $sPass) {
        return ($this->aExistedMembers[$sName] == $sPass);
    }
}

?>

Demikian Membuat Chat Online Sederhana dengan PHP-SQl, semoga bermanfaat.

Read More

Membuat Bola Kristal Pada CorelDraw

Langkah-langkah untuk membuat bola Kristal pada coreldraw

1.    Buka applikasi coreldraw anda, kemudian klik New.

Buat kotak sebagai alas untuk bola Kristal yang akan anda buat dengan mengklik menu Rectangle Tool pada menu disebelah kiri halaman, atau tekan F6 pada keyboard netbook/computer anda.

2.     Hilangkan garis pinggir kotak tersebut dengan mengklik Menu Outline Width yang terletak disebelah kanan atas halaman, kemudian pilihNone pada menu tersebut.

3.     Beri warna pada kotak dengan mengklik pilihan warna pada menu warna yang terletak disebelah kanan halaman.

4.     Selanjutnya klik menu Ellipse Tool yang terdapat disebelah kiri halaman.

Kemudian buatlah lingkaran diatas kotak yang telah anda buat sebelumnya, dengan klik+tahan+geser mouse.

(Dengan menekan tombol Ctrl pada keyboard secara bersamaan, maka hasil lingkaran yang diperoleh akan lebih sempurna).

5.     Selanjutnya klik menu Interactive+Transparency Tool yang terletak disebelah kiri halaman. (Lihat gambar dibawah)

6.     Selanjutnya klik menu Transparency Tool yang terletak disebelah kiri atas halaman, kemudian pilih Linear pada menu tersebut. Maka akan muncul tanda pada lingkaran seperti pada gambar 2 dibawah.

Aturlah posisi ujung tanda tersebut dengan arah putih atas-hitam bawah.

7.     Langkah berikutnya, klik menu Interactive+Drop Shadow Tool yang terletak disebelah kiri halaman, seperti pada gambar dibawah.

8.     Selanjutnya  klik menu Drop Shadow Tool yang terletak disebelah kiri atas halaman, kemudian pilih Pers Bottom Right pada menu tersebut. Maka akan muncul tanda pada lingkaran seperti pada gambar dibawah.

Aturlah efek bayangan tersebut. 

9.     Selanjutnya, klik menu Ellipse Tool. 

Buatlah sebuah lingkaran lagi diatas bola yang sudah anda buat (lihat gambar dibawah).

Selanjutnya hilangkan garis tepi pada lingkaran tersebut, dan berilah warna. (Caranya sama seperti langkah nomor 2 diatas)  

Maka hasilnya akan menjadi seperti gambar1 dibawah.

10.   Langkah berikutnya adalah klik menu Interactive+Transparency Toolyang terletak disebelah kiri halaman, selanjutnya klik menuTransparency Type yang terletak disebelah kiri atas halaman, kemudian pilih Linear pada menu tersebut. 

      Aturlah ujung kedua garis tersebut seperti pada gambar 2 diatas.

.

Read More