[PHP & JavaScript][Help Needed] Live Chat

[AustinB]

Hello LinusTechTips community!

 

I am in need of some help and maybe some resources for a Live chat system I plan on developing for my panel.

The chat would need the following:

• Auto refreshing
• Fast
• Non-Resource intensive

It would only have to between 3 people the Myself(just to observe), the Employee & the Client

Functions

• Main Chat page w/ 5 second refreshing
• Send Button
• Any thing else that might be needed

I already have the login & registar system in place.

 

Thanks for any help you may able to provide!

 

EDIT:

• We use Unique ID's for each project
• 1 Chat per project
• All logged.

 

 

P.S. Im not the greastest at PHP.

[Createinator]

Why do you use this?

[RaidenLeeChin]

Have you looked at jQuery? If you haven't then it is basically a large javaScript library that incorporates AJAX.

 

So for:

• Auto refreshing:
  

  $(function() {startRefresh();});function startRefresh() {  setTimeout(startRefresh,1000);  $.get('pagelink.php', function(data) {  $('#content_div_id').html(data); });}//took this from here: http://stackoverflow.com/questions/13324432/jquery-auto-refresh-without-blinking

• Fast - jQuery is
• Non-Resource intensive - jQuery is

You can achieve those with jQuery using simple function calls. Check out the API

[Paralectic]

Have you looked at jQuery? If you haven't then it is basically a large javaScript library that incorporates AJAX.

 

So for:

• Auto refreshing:

  $(function() {startRefresh();});function startRefresh() {  setTimeout(startRefresh,1000);  $.get('pagelink.php', function(data) {  $('#content_div_id').html(data); });}//took this from here: http://stackoverflow.com/questions/13324432/jquery-auto-refresh-without-blinking

• Fast - jQuery is
• Non-Resource intensive - jQuery is

You can achieve those with jQuery using simple function calls. Check out the API

Also useful for other UI elements and animations. Really recommended.

[AustinB]

Why do you use this?

I want something custom.

 

Have you looked at jQuery? If you haven't then it is basically a large javaScript library that incorporates AJAX.

 

So for:

• Auto refreshing:

  $(function() {startRefresh();});function startRefresh() {  setTimeout(startRefresh,1000);  $.get('pagelink.php', function(data) {  $('#content_div_id').html(data); });}//took this from here: http://stackoverflow.com/questions/13324432/jquery-auto-refresh-without-blinking

• Fast - jQuery is
• Non-Resource intensive - jQuery is

You can achieve those with jQuery using simple function calls. Check out the API

Thanks!

[RaidenLeeChin]

Thanks!

 

No problemo! extra

[Createinator]

I want something custom.

That's great ~ but give it a try ~ the single operator license is free and has all the features. If you still do not like it, it will give you ideas on what you want in your custom live chat.

[LukeTim]

For an AJAX (I'd recomend AJAX for this, just as @Rock_Lee2 suggested) based JS and PHP chat app, I'd probably associate the two sessions with some ID and then create a joint JSON file with that ID on the server to store the messages (since they're logged). Put each message in the file associated with a timestamp... When you make an AJAX request (probably every second) you send along with it the timestamp of the last received message, the PHP script then opens the JSON file and finds all messages since that last timestamp and sends them back...

Simple. Probably quick and not too difficult to implement.

I was actually thinking of developing my own - comlpetely private and secure - chat application using Node.js and Socket.io...

[Nallown]

Have you looked at jQuery? If you haven't then it is basically a large javaScript library that incorporates AJAX.

 

So for:

• Auto refreshing:

  $(function() {startRefresh();});function startRefresh() {  setTimeout(startRefresh,1000);  $.get('pagelink.php', function(data) {  $('#content_div_id').html(data); });}//took this from here: http://stackoverflow.com/questions/13324432/jquery-auto-refresh-without-blinking

• Fast - jQuery is
• Non-Resource intensive - jQuery is

You can achieve those with jQuery using simple function calls. Check out the API

 

Instead of using settimeout you could use setInterval which would set the refresh interval of a certain command execution.

so it would look like something like this.

window.setInterval(function() {//   retrieve and update messages}, 1200);// 1200 is the refresh rate in milliseconds, so this would make the panel refresh every 1.2 seconds

I wouldn't recommend refreshing the content though or calling on a certain event every x seconds since this would refresh without an unnecessary reason so even when something hasn't updated it would refresh the pane to update the content. Even if you were to have keep-alive enabled this would still be an inefficient solution.

Instead I'd recommend using something such as HTML5 socket which would allow you to setup a server and have a open connection which data gets send from such as messages. So you would directly receive a messages when there is one instead of refresh to check for new messages and then show if it is new.

[csmith1991]

I'd recommend using something such as HTML5 socket which would allow you to setup a server and have a open connection which data gets send from such as messages. So you would directly receive a messages when there is one instead of refresh to check for new messages and then show if it is new.

 

This. The limitation to HTML5 is that it requires a more modern browser (in this case IE10+). Not only this, but there's example code out there how to do this. Just search for websockets php chat tutorial, and I'm sure you'll find plenty of resources. A quick search found this. I can't speak for its quality, but probably worth looking into.