Wordpress cache - How to display chat info by Javascript

[veda]

My issue is the following:

My website is based on wordpress and pages are cached.

Actually I display on the home page : the number of user online on chat.

It works but only if the wordpress cache is disabled. This is normal because I use server side code to display this information (so if the number of user change, i don't see the change).

I need to do the same but by client side in Javascript.

Here my server code

Code: Select all

Code:

require_once dirname(__FILE__)."/../../../../src/pfcinfo.class.php";
$serverId = "website";
$chatinfo= new pfcInfo($serverId );
$users = $chatinfo->getOnlineNick(NULL,10);
return count($users);

How could i do this? Can I call something in pfcclient.js which could do this?

thank you for your help. I don't really know how to do!

[Frumph]

Yeah I use wp-supercache as well, pretty important to use cache'ing, I have not yet even thought of looking into a jquery/javascript read of the database for it .. if you do find out, would love to include it

[veda]

I use wp-supercache too but the problem is the same for every (file) cache. But I have not enough knowledge to do the stuff in jquery/javascript. if this feature doesn't exist, I hope a nice soul could propose a solution for this

thank you.

[veda]

I found a solution

Here what I put in the html header of my wordpress site:

Code: Select all

<script type="text/javascript">
var intervalID = window.setInterval(chat_loader, 60000);

function chat_loader () {
var head = document.getElementsByTagName('head').item(0);
var script = document.createElement('script');
script.setAttribute('type', 'text/javascript' );
script.setAttribute('src', 'http://chat.mysite.com/remote.php');
head.insertBefore(script, head.firstChild );
};

</script>

It means every 1 min it creates a script element in the header which is based on php code in the remote php file (remote.php)

Here the code of remote.php

Code: Select all

<?php
require_once dirname(__FILE__)."/src/pfcinfo.class.php";
$serverId = "myserverid";
$chatinfo= new pfcInfo($serverId);
$users = $chatinfo->getOnlineNick(NULL,10);
$nd_users = count($users);

if ($nd_users > 0) {

   
$connect = "";
   
if ($nd_users==1) {
 
$connect = "<a id="connect-number" href="javascript:void(0)" onclick="openChat();">un connecté</a><br/>";
            
} else {
     
$connect = "<a id="connect-number" href="javascript:void(0)" onclick="openChat();"><span ="chat-connected">$nd_users</span> connectés</a><br/>";
         
}
     
for ($i=0; $i<$nd_users; $i++){
        
$x=$users[$i];
       
if ($i==0) {
       
$connect = $connect."<a id="connect" href="/chat.php" onclick="window.open(this.href, 'chat', 'height=673, width=678, top=100, left=100, toolbar=no, menubar=no, location=no, resizable=yes, scrollbars=no, status=no'); return false;">".$x;
       
} else {
       
$connect = $connect.", ".$x;
       
}
         
}
     
if ($connect != "") {
 
$result = $connect."</a>";
        
if (strlen($result) != strlen($connect)) {
        
$result = $connect."...</a>";
 
}
        
}
        

print <<<ENDLINE
document.getElementById('chat-count').innerHTML = $nd_users;
document.getElementById('chat-count').style.visibility = 'visible'; 
document.getElementById('chat-count').style.display = 'inline';   
document.getElementById('chat-count').style.zIndex = 100;
document.getElementById('chat-connected').innerHTML = '$result';
ENDLINE;

} else {

print <<<ENDLINE
document.getElementById('chat-count').innerHTML = '';
document.getElementById('chat-count').style.visibility = 'hidden';
document.getElementById('chat-count').style.display = 'none';
document.getElementById('chat-count').style.zIndex = 100;
document.getElementById('chat-connected').innerHTML = '';
ENDLINE;

}

?>

It retreives the number of users and loop in order to find the name of the users. In my case i got two <span> elements.

chat-count: it displays the number of chat users

chat-connected: it displays the number of chat users and the list of user name (with link on the chat) : ex: 3 connected , Mike, Paul, Roger


By default chat-count is hidden (css). Once at least one user is on the chat i put it visible.

most important part is so:

Code: Select all

if(nb_users > 0) {
document.getElementById('chat-count').style.display = 'inline';   
document.getElementById('chat-count').style.zIndex = 100;
document.getElementById('chat-connected').innerHTML = '$result';
ENDLINE;

} else {

print <<<ENDLINE
document.getElementById('chat-count').innerHTML = '';
document.getElementById('chat-count').style.visibility = 'hidden';
document.getElementById('chat-count').style.display = 'none';
document.getElementById('chat-count').style.zIndex = 100;
document.getElementById('chat-connected').innerHTML = '';
ENDLINE;

}

I use the scheduler (setInterval) in order to avoid to load directly remote.php (and all the chat classes behind) when the page is opened because when the cache is created for the page it takes more time and i want to avoid this.

But depending on your needs, u can use window.onload call or anything you want.

Hope it could be useful. Specially for you Frumph

I'm just wondering if the fact to create each 1 min a new script element in the html element is a heavy process or not. Any idea? If you have suggestion to improve the code, don't hesitate to provide information.

Regards

[danny900]

To change them, first open index.php in the root of your Php Free Chat folder. Look for several ... This is the time to wait between two refreshes. A refresh is an HTTP request which asks the server if there are new messages to display.
http://singaporepropertyprices.com/all-properties/