Tutorial Avanzati V1

Chi è on-line? (Versione AJAX) by Stefano Silvestrini

Categoria: Sviluppo e Hack
Sottotitolo: #0 Creare un blocco utenti on-line basato su AJAX!
Autore: slyss
Data: 12/1/2008
Sommario: Un guida completa sulla costruzione di un blocco "Utenti on-line" basato su AJAX. Il blocco si ricaricherà senza bisogno di caricare l'intera pagina mostrando di volta in volta gli EFFETTIVI utenti presenti sul sito.

Come promesso, eccomi a scrivere un bel tutorial del blocco Utenti on line AJAX che trovate in home di Xoops Italia.

I vantaggi dell'AJAX sono molteplici e nel nostro caso particolare ci aiuta a ricaricare un blocchetto (contenente una query) senza dover ricaricare l'intera pagina.

PASSO 1:

Copiate ed incollate questo codice dentro una pagina vuota:

<?php
include 'mainfile.php';

// Hack by Stefano Silvestrini - www.stefanosilvestrini.com
// 12 gennaio 2008
// Per cortesia non levare i crediti

	$sql = "SELECT * FROM ".$xoopsDB->prefix('online')." ORDER BY online_updated DESC";

	$result = $xoopsDB->query($sql);
	
	if(!$result) {
       echo "Errore: ".mysql_error();
       exit;
       }

	echo"
	<div style='font-size: 11px;'>
	";
	
	$count = 0;

	while($myrow = $xoopsDB->fetchArray($result)) {
	
	if ($myrow['online_uid'] == '0') {
		$username = 'Anonimo';
		} else {
		$username = "<a href='http://www.tuosito.com/userinfo.php?uid=".$myrow['online_uid']."'><b>".$myrow['online_uname']."</b></a>";
		}
		
		if ($count !=0) {$start=', ';}
		
		echo"".$start."".$username."";
		
		$count++;
	
		} // chiudo il while

	echo" (Totale: ".$count.")</div>";
?>


salvate il file come users-on-line.php e chiudete.

Prendete il file users-on-line.php appena creato e mettetelo nella root del vostro sito Xoops.

PASSO 2:

Andiamo in amministrazione e creiamo un blocco personalizzato HTML ed inseriamo questo codice:

<script type="text/javascript">
function Ajax(){
var xmlHttp;
	try{	
		xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
	}
	catch (e){
		try{
			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
		}
		catch (e){
		    try{
				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e){
				alert("No AJAX!?");
				return false;
			}
		}
	}

xmlHttp.onreadystatechange=function(){
	if(xmlHttp.readyState==4){
		document.getElementById('ReloadThis').innerHTML=xmlHttp.responseText;
		setTimeout('Ajax()',5000);
	}
}
xmlHttp.open("GET","http://www.vostrosito.com/users-on-line.php",true);
xmlHttp.send(null);
}

window.onload=function(){
	setTimeout('Ajax()',1000);
}
</script>

<div id="ReloadThis">
<div align="center" style="padding-top: 3px;"><img src="http://www.vostrosito.com/images/loading.gif"></div>
</div>


andando a modificare www.vostrosito.com con l'url del sito Xoops ed andando ad inserire nella cartella "images" una gif di loading a vostra scelta (cercate su google images).

PASSO 3:

Questo passo non è obbligatorio ma è importante qualora volessimo rendere lo script funzionante sempre al 100%.

Entrate via ftp e modificate il vostro file .htaccess (o createlo se non esiste ancora nella root del vostro sito).

All'interno del file .htaccess inserite:

RewriteEngine On
Options +FollowSymlinks
rewritecond %{http_host} ^vostrosito.com [nc]
rewriterule ^(.*)$ http://www.vostrosito.com/$1 [r=301,nc]


andando a modificare la stringa vostrosito.com a seconda del vostro url.

Spero di aver fatto cosa gradita a tutti!

HAPPY XOOPS A TUTTI!

Stefano

NB: questo hack potrebbe aumentare le query al vostro db. In due mesi di utilizzo qui su XI non abbiamo riscontrato alcun errore. Se doveste riscontrarne siete pregati di segnalarmelo. Grazie
Tutorial Avanzati V1
URL: http://www.xoopsitalia.org/modules/article/view.article.php/c16/62