[SOLVED] Question - User is typing message indicator

[ipwnzphp]

You have a live chat system and when the admin is typing a message you want it to show the user that the admin is typing a message. like "Admin is typing!"

 

How would you achieve this?

 

Thanks!!

[phpSensei]

this should

http://www.quirksmode.org/js/keys.html

 

Basically on your TEXTAREA, have a onkeydown and onkeyup function. When key is down change the DIV tag or w.e your sign is for the user typing to "Admin is typing...", and if key is UP then erase the text.

[ipwnzphp]

this should

http://www.quirksmode.org/js/keys.html

 

Basically on your TEXTAREA, have a onkeydown and onkeyup function. When key is down change the DIV tag or w.e your sign is for the user typing to "Admin is typing...", and if key is UP then erase the text.

 

Yea, cause when the admin is typing it needs to show the guest on the chat that the admin is typing. Do you have any rough sample code?

[phpSensei]

this should

http://www.quirksmode.org/js/keys.html

 

Basically on your TEXTAREA, have a onkeydown and onkeyup function. When key is down change the DIV tag or w.e your sign is for the user typing to "Admin is typing...", and if key is UP then erase the text.

 

Yea, cause when the admin is typing it needs to show the guest on the chat that the admin is typing. Do you have any rough sample code?

 

argh too tired but what the heck... give me a sec here...

[ipwnzphp]

this should

http://www.quirksmode.org/js/keys.html

 

Basically on your TEXTAREA, have a onkeydown and onkeyup function. When key is down change the DIV tag or w.e your sign is for the user typing to "Admin is typing...", and if key is UP then erase the text.

 

Yea, cause when the admin is typing it needs to show the guest on the chat that the admin is typing. Do you have any rough sample code?

 

argh too tired but what the heck... give me a sec here...

 

Thanks bro!

[phpSensei]

http://www.appleautoglass.us/typing.html - DEMO html

 

<script type="text/javascript" language="javascript">
var timer = 0;
function reduceTimer(){
timer = timer - 1;
isTyping(true);
}
function isTyping(val){
if(val == 'true'){
document.getElementById('typing_on').innerHTML = "Admin is typing...";
}else{

if(timer <= 0){
document.getElementById('typing_on').innerHTML = "No one is typing at the moment.";
}else{
setTimeout("reduceTimer();",500);
}
}
}
</script>
<label>
<textarea onkeypress="isTyping('true'); timer=5;" onkeyup="isTyping('false')" name="textarea" id="textarea" cols="45" rows="5"></textarea>
</label>
<div id="typing_on">No one is typing at the moment.</div>

[ipwnzphp]

Thanks! now i just have one more question. i know i use div tags with the id="" to display them. But how does it know to send it back to the guests browsers instead of the admins to display>

[phpSensei]

Thanks! now i just have one more question. i know i use div tags with the id="" to display them. But how does it know to send it back to the guests browsers instead of the admins to display>

 

lol...

 

forgot abuot that man...

 

 

Well you have to store it in a text file. Basically its like a chat system. You have to use AJAX, and this is where it gets complicated. If you make a text file called "isTyping.txt", then everytime the admin types you have to send a XMLHTTPREQUEST to the textfile to change to "1" (meaning is typing) and by default "0" (meaning not typing). THEN you must create a timer that recalls a function that reads the "isTyping.txt" to see if it has changed to 1. If it has then on the users end the text will change to "admin is typing.."

 

i just showed you how to display it, that part of the job you can either learn ajax or hire someone.

 

 

 

HOW TO ACCOMPLISH THIS IN BRIEF STEPS

 

1. Create a text file called "isTyping.txt"

2. Save the file and type in "0" in there.

3. On your FORM everytime the admin is typing (isTyping() function) the server will send a request object to cahnge the isTyping.txt file to "1"

 

4. The user visiting the page will have a TIMER to run a function every 5 seconds or less to check if the isTyping has changed to "1".

 

5. If "1" then change the DIV text to  is typing, if not do nothing

 

6. If the admin stops typing (again isTyping()) then send a request to the server to change the text file to "0"...

 

7. User functins being called every 5 seconds will see it has changed and make the changes accordingly.

 

8. repeat

[ipwnzphp]

Thanks! now i just have one more question. i know i use div tags with the id="" to display them. But how does it know to send it back to the guests browsers instead of the admins to display>

 

lol...

 

forgot abuot that man...

 

 

Well you have to store it in a text file. Basically its like a chat system. You have to use AJAX, and this is where it gets complicated. If you make a text file called "isTyping.txt", then everytime the admin types you have to send a XMLHTTPREQUEST to the textfile to change to "1" (meaning is typing) and by default "0" (meaning not typing). THEN you must create a timer that recalls a function that reads the "isTyping.txt" to see if it has changed to 1. If it has then on the users end the text will change to "admin is typing.."

 

i just showed you how to display it, that part of the job you can either learn ajax or hire someone.

 

Ok, great! i will post it to a database then fetch the results form there.

[ipwnzphp]

I did this.. but cant fig out how to get it to display.. I stored my 0 and 1's in a mysql database. that all is working fine. when a user keysdown it sets to 1 and on keysup it sets to 0. That is working fine.

 

Now i just cant get it to display on the admin's chat box.

 

Ajax Code

 

// Send Typing Status - Display
function userDisplayTyping() {
sendReq.open("POST", 'getChat.php?chat=1&sid=' + document.getElementById('sid').value, true);
sendReq.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
var param = 'action=distyping';
sendReq.send(param);
}

 

PHP Code

 

if ($_POST['action'] == 'distyping') {
$result = mysql_query("SELECT * FROM simp_live_typing_status WHERE s_id = '$_GET[s_id]'");
$results = mysql_fetch_array($result);
$typing = $results['typing'];
if ($typing == 1) { 
echo "User is typing a message...";
} 
}

 

On the admin screen i have a div tag called 

<div id="user_type"></div>

to display the message for the user is typing.

 

Need some help on fixing this..

 

[phpSensei]

Okay after storing in a DATABASE using AJAX, you need a little function called setTimeout

 

 

You will need a function that starts when the window loads to check the mysql database every 2-3 seconds to see if the admin is typing. It will retrieve the mysql data from a php that will spit out the mysql data.

 

search on Javascript setTimeout