PHP Chatting

[vizz]

CREATE TABLE IF NOT EXISTS `users` (
  `ID` mediumint(9) NOT NULL AUTO_INCREMENT,
  `username` varchar(60) DEFAULT NULL,
  `password` varchar(60) DEFAULT NULL,
  PRIMARY KEY (`ID`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;

CREATE TABLE IF NOT EXISTS `chatmessage` (
  `id` bigint(20) NOT NULL AUTO_INCREMENT,
  `from` varchar(250) NOT NULL,
  `to` varchar(250) NOT NULL,
  `message` text NOT NULL,
  `timestamp` datetime NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;


   $query =("SELECT * FROM  users ");
   $result = mysql_query($query);

   while ($row = mysql_fetch_assoc($result))
 {
    $users=$row['username'];
    echo"<a href='chat.php'>$users</a><br>";    
 }

Above while loop gives users from database.
How to chat with one or multiple users listed inside anchor tag?

[phorce]

Hello,

Are you trying to create these tables everytime you run the SQL query?

[vizz]

no it's only database I'm using to collect information

[phorce]

Okay, it's really unclear what you want to do...

I'm guessing you want some kind of message board, is this correct?

If so, you'd need a page that has something like "chat.php?id={id}" and then select/post messages to the table depending on it's ID..

<?php
   // chat.php
   $id = $_GET['id'];

   // include mysql connection data

   // query the database:
      $query = "SELECT * FROM chat WHERE id='$id'";
      $result = mysql_query($query);
      if(mysql_affected_rows() >= 1)
      {
          // display the chat
      }else{
        echo 'There are currently no messages';
      }
   ?>

Something along those lines?

[vizz]

this helped little.
I'm creating something like gmail chat.

BTW, thanks.

[phorce]

Okay..

But how would you do it via realtime? How will you alert the user that they have another message?

I would start with something easier, something like a private messaging system (This will give you a rough idea of how to create something simular).

So I'm guessing your using cookies/sessions?

<?php

    // connection information
    // connection information

        $query = "SELECT * FROM chat WHERE to='{$_SESSION['user_id']}'";
        $result = mysql_query($query);
        if(mysql_affected_rows() >= 1)
        {
           while($row = mysql_fetch_array($result))
           {
              // Here you can display the actual message "gmail"
              // or create a link (like the previous post) that contains the message.

           }
         }else{
           echo 'No new messages';
         }
        }
   ?>

Hope this helps. Look into "polling"/"Sockets" if you want something realtime.

[vizz]

ok
This is for receiving message but how to send message?

[Robert1995]

Just get this one {URL SNIPPED} and problem solved, you seem like a bad coder so you should probably take a look how others done it before. Maybe i'll get rep- but who cares..

[phorce]

Robert, was there any need to post that? No. Grow up.

[vizz]

How to send message? is meant for How to create chat window on click, for each user selected, to send message like gmail chat?

[phorce]

Hey,

This type of application is going to require jQuery/Ajax and PHP.

[vizz]

yes, can you help me for coding to send message to selected user?

[Robert1995]

Wow, honestly I had not ideea what I posted THE HOVER IS BAD, THIS IS A BUG CLICK THE LINK FOR GODS SAKE, i put this : https://blueimp.net/ajax/ it's a free open source ajax chat.

[Dani]

There's some type of bug ... you're posting a legit site, but for some reason the hover is showing an asian porn site of some kind!

Ha ha ha. Dani - are you pandering to some of your more concupiscent members? Now that's funny. Why didn't you make the hovers link to a speciality tea or a cleaning fluid site?

But seriously, it seems like a thumbshot.com error

DO NOT FOLLOW THE LINK BELOW!!!

<img src="http://images.thumbshots.com/image.aspx?cid=1162&amp;v=1&amp;w=300&amp;url=https://blueimp.net/ajax/">

From Inspect Element / Chrome, this is one of the last elements in the page.

[Dani]

thumbshot.org error or not ... It's not very appropriate.

I agree. When I investigated further (not trying to look at Asian porn sites, I assure you!), the link to the offending thumb only seemed to happen if the entire url without the urlencoded & was entered. Using just the id or just the url parameteres in the querystring did not show the image. Similarly taking out the v or w parameters stopped the image from appearing. WHen I searched for the blueimp url in thumbshots.com, it said coming soon, so it doesn't appear to have been previously referenced. However, I may be wrong - I frequently am.

//EDIT

I don't think the search function is working as search for referenced sites. So disregard my last bit of nonsense. :(

[Dani]

I've reported the bug to Thumbshots.com.

OK, back to the thread. Sorry for going off-piste.

The blueimp chat is very good and I've used it myself in a few projects. However, if you are determined to roll your own - a great way to develop your skills as it's not very difficult to get going, but takes time to get it to look and work like you need. One of the bigegst problems IMO is resources. Ajax is all well and good, but you still need to check the server for posts periodically (pull). There is a similar method out there called comet, which pushes data from the server. It's sometimes called "long polling". The APE project has some nice examples, although it's not that straightforward.

By now there are a number of different 'push' technologies, but I'm no expert on these I'm afraid.

//EDIT

forgot to mention - Comet - it uses javascript on both server and client - not php

[peter_budo]

I've reported the bug to Thumbshots.com.

At the time when post was reported, I actually opened that link and it was going to porn site. Hence reason for infraction

Seems sorted now - the hover image is of the chat site. Thankfully. :)

[vizz]

Thanks ardav. http://www.ape-project.org/ is nice site. It is helpful. Can you help little more to create pop-up div on click for selected user to send chat message?

I'm trying my own but your help may solve problem easily.

[vibhaJ]

Apart from readymade script, if you still want to make your own code:
1) Design database tables.
e.g
autoId
chatSession
fromUserId
toUserId
message
dateTime
2) There will be one div and one text area for design view.
3) When user type something in textarea and press enter trigger javascript and call ajax to insert textarea's value in database.
make sure you use proper fromUserId and toUserId to insert in database.
4) In div after every 2 sec, call ajax and if there is any new entry in database based on chatSession then show it in div.

Can you help little more to create pop-up div on click for selected user to send chat message?

I'm afraid not. That should be a strightforward js (jquery?) function though. SHould be plenty of online scriptys for that.

[vizz]

<style type="text/css" media="all">
    .chatboxlink{width:5%; padding:15px;}
    .chatboxlink a{ padding:15px; }
    .chatbox{ width:250px; height:250px; background:#00CCFF; float:right; bottom:-190px; position:relative; right:0px;}
    .chatbox textarea{  height:60px; width:250px; bottom:20px; position:fixed; }
</style>



<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>

<script type='text/javascript'>
    $(document).ready(function(){        
        $('.chatboxlink a').click(function(){            
            var id =  $(this).attr('id');                
            $('body').append('<div id="id" class="chatbox"><textarea></textarea></div>');           
        });        
    }); 
</script>

    while ($row = mysql_fetch_assoc($result))
     {
      $id=$row['ID'];
      $users=$row['username'];

      echo"<div class='chatboxlink'><a href='#' id='$users'>$users</a></div>";
     }

This creates floating chat box. How to limit one box per user. And how to get id,username to send message to appropriate user?

[vizz]

<script type='text/javascript'>
$(document).ready(function(){

    $('.chatboxlink a').click(function(){

        var chatid = $(this).attr('id');

        $('body').append('<div class="chatbox"><div id="title">' + chatid + '</div><div id="chatmessage"></div> 
        <div class="chatinput"><textarea></textarea></div></div>');

    });

}); 
</script>


<style type="text/css" media="all">
.chatboxlink{width:5%; padding:15px; }
.chatboxlink a{ padding:15px; }
.chatbox{ width:250px; height:250px; background:#CCFFFF; float:right; bottom:-190px; position:relative; right:0px; border:1px solid #993300;}
.chatbox textarea{  height:80px; width:250px;overflow-y:auto scroll; resize:none; }
.chatbox p{ text-align:center; font-size:16px; color:#99FF99;}
.chatinput{ border-top:2px solid #00FF99; height:60px;width:250px; bottom:40px; position:fixed; float:left; margin-left:0; }
#title{ padding:5px; text-align:left; border:1px solid #3366FF; height:25px; }
#chatmessage{ background:#99CC99;height:155px;width:250px; top:0px; position:relative; overflow:auto scroll;}
</style>

This creates chat window for each user. But it generates multiple instances of same user. How to limit one instance for one user?

If 4 chatbox div are open and clicked on another user(5th) , how to hide 1st box of right side or first opened box?

The popup should have an id associated with it - probably the best way would be to 'id' it with the user's id that you're trying to chat with. Tell js/jquery to check if a popup with that id exists before spawing a new one - if it does, just activate that one (bring it to the front or make it flash twice or something).
Using browser tabs or windows may cause concurrency issues though. I haven't thought about that to much though.

[vizz]

I'm having problem with conditional check

if() //conditional check if chatbox exist for selected user
    { //if user id chatbox exist }
els
    { //if user id chatbox does not exist }

I tried :visible, :hidden, .exists( ), .length

But still I'm not able to write code for conditional check for chatbox is visible for selected user or not.

Can you help me for conditional check code?

[vizz]

This one is better

<script type='text/javascript'>
$(document).ready(function(){
    $('.chatboxlink a').click(function(){           
        var $user= $(this).attr('href');        
        var $id =  $(this).attr('id');
        $('body').append('<div class="chatbox" id='+ $id +'><div id="title"> ' + $user + ' </div><div id="chatmessage"></div><div class="chatinput"><textarea></textarea></div></div>');      
    return false;   
    }); 
}); 
</script>

while ($row = mysql_fetch_assoc($result))
{
    $id=$row['ID'];
    $users=$row['username'];

    echo"<a href='$users' id='$id'>$users</a>";   
}

Still, help for conditional check is required.

Please help

this is becoming a javascript solution. Perhaps asking the question in that forum would be better?