[chat in php] barra di scorrimento in automatico

[Alix2204]

Salve,

Vorrei che barra di scorrimento verticale che compare nella chat si posizionasse sempre in basso, in modo che sia sempre visibile l'ultimo messaggio inviato.

Sapreste dirmi come posso fare in modo che questo avvenga?

Grazie in anticipo per l'eventuale aiuto!


P.S. vi sposto il codice della chat

<?php

/*
 * File: chatbody.php
 * Descrizione: Corpo della chat.
 * Check: OK.
*/

// Avvia una nuova sessione o riprende una sessione già creata
session_start();

// Include i file necessari
include('inc/config.inc.php');
include('inc/template.inc.php');
include('inc/db.inc.php');
include('inc/check.inc.php');

// Recupera l'id della locazione
if(isset($_GET['loc'])) {
	$loc_id = $_GET['loc'];
} else {
	$loc_id = 1; // Stanza di default (Es. Una schermata di benvenuto o la mappa)
}

// Variabili
$content = '';
$query1 = "SELECT msg_user, msg_text, msg_png, msg_pname FROM chat WHERE msg_time > (NOW() - INTERVAL 60 MINUTE) AND msg_loc = '$loc_id' ORDER BY msg_time ASC";

// Recupera i messaggi entro un certo intervallo dall'ultimo aggiornamento
if($results1 = $db->query($query1)) {
	while($row1 = $results1->fetch_assoc()) {
		// Variabili
		$user_id = $row1['msg_user'];
		$msg = trim($row1['msg_text']);
		$png = $row1['msg_png'];
		$pname = $row1['msg_pname'];
		$cmd = $msg{0};
		$off = $msg{1};
		// Account
			$query = "SELECT account_id FROM users WHERE user_id = '$user_id'";
			if($results = $db->query($query)) {
				$row = $results->fetch_assoc();
				$account_id = $row['account_id'];
			}
		
		switch($cmd) {
		// Messaggio Master
		case "*":
			// Variabili
			$query2 = "SELECT account_master FROM accounts WHERE account_id = '$account_id'";

			// Recupera i dati
			if($results2 = $db->query($query2)) {
				$row2 = $results2->fetch_assoc();
				if($row2['account_master'] == 1) {
					$content .= '<div align="center"><div class="box_content" align="center">';
					$content .= htmlentities(substr($msg, 1));
					$content .= '</div></div>';
					$content = bbtext($content);
				}
				$results2->close();
			}

			break;
		// Azione
		case "+":
			// Variabili
			$query3 = "SELECT user_name, user_surname FROM users WHERE user_id = '$user_id'";
			$content .= '<div class="text_action">';

			// Recupera i dati
			if($results3 = $db->query($query3)) {
				$row3 = $results3->fetch_assoc();
				$content .= ''.$row3['user_name'].': ';
				$results3->close();
			}
			$content .= substr($msg, 1);
			$content .= '</div>';

			break;
		// Messaggio PNG
		case "§":
			// Variabili
			$query3 = "SELECT account_master FROM accounts WHERE account_id = '$account_id'";

			// Recupera i dati
			if($results3 = $db->query($query3)) {
				$row3 = $results3->fetch_assoc();
				if(($row3['account_master'] == 1) AND ($png == '1')) {
					$content .= '<div class="text_master">';
					$content .= ''.htmlentities(ucfirst($pname)).': ';
					$results3->close();
					$content .= '<span class="text_default">';
					$content .= substr($msg, 1);
					$content .= '</span></div>';
				}
			}
			break;
		// Lancio dei Dadi o Messaggio Off	
		case "/":
		if ($off != '/'){
			// Variabili
			$query3 = "SELECT user_name, user_surname FROM users WHERE user_id = '$user_id'";
			$content .= '<div class="text_action">';

			// Recupera i dati
			if($results3 = $db->query($query3)) {
				$row3 = $results3->fetch_assoc();
				$content .= ''.$row3['user_name'].' tira ';
				$results3->close();
			}

			$content .= htmlentities(substr($msg, 1));
			$content .= "</div>";
		} else {
			$query3 = "SELECT user_name, user_surname FROM users WHERE user_id = '$user_id'";
			$content .= '<div class="text_off">';
			if($results3 = $db->query($query3)) {
				$row3 = $results3->fetch_assoc();
				$content .= ''.$row3['user_name'].' : //';
				$results3->close();
				$content .= htmlentities(substr($msg, 2));
				$content .= '</div>';
		}
		}
			break;
			
		default:
			// Variabili
			$query4 = "SELECT user_name, user_surname FROM users WHERE user_id = '$user_id'";
			$content .= '<div class="text_default">';

			// Recupera la razza del personaggio
			if($results4 = $db->query($query4)) {
				$row4 = $results4->fetch_assoc();
				$content .= '';
				$content .= ''.$row4['user_name'].': ';
				$content .= '';
				$results4->close();
			}
			$content .= htmlentities($msg);
			$content .= '</div>';

			break;
		}
	}

	// Lista delle tag speciali
	$tags = array('temp_title' => $g_name, 'temp_content' => $content, 'temp_loc' => $loc_id);

	// Carica il template e formatta le tag speciali
	$temp = new template('style/chatbody.template.html');
	$temp->replace($tags);

	// Visualizza l'output
	echo $temp->show();

	$results1->close();
}

// Chiude la connessione al database
$db->close();

?>

[Marcello007]

ciao ti posso chiedere dove l'hai scaricata?servirebbe anche a me una chat

[Alix2204]

Ciao, questa chat fa parte del pacchetto Accent 2.0, che trovi su www.gdr-online.com, quindi ho il dubbio che forse non fa al caso tuo a meno che non stai costruendo un gioco di ruolo via chat.

[alcio74]

Non so se hai notato, ma la chat di facebook ha lo stesso problema.
Magari dico una baggianata, ma penso che al refresh temporizzato si potrebbe fare in modo che il link punti ad una ancora presente sotto il box di chat e che potresti nascondere con un hidden di CSS.

Spero di avere reso l'idea.... comunque, siamo off-topic, perché con PHP ha poco a che fare.

Sostanzialmente fai gestire la temporizzazione del refresh a javascript, puntando il refresh al link della chat cui passi un'ancora.

// questo è il link che inserirai nel JS che effettua il refresh
chat.php#bottom 

In fondo alla pagina chat.php, che è quella del codice, piazzi un DIV con il seguente codice:

   <div class="chat">
     U1 - qui il testo della chat di utente 1 e utente 2
     U2 - il testo lo prelevi dal DB o da altro metodo
   </div>

   <div class="nascosto">
     <a name="bottom" id="bottom"></a>
   </div> 

La classe CSS del DIV sarà più o meno come segue:

.nascosto {visibility: hidden;} 

Come vedi non ha nulla a che fare con PHP.... e onestamente non l'ho testata per vedere se funziona davvero.
In linea di massima mi sembra che potrebbe andare.
Comunque rimango di un'idea: PHP non è fatto per creare delle chat!

[Alix2204]

Ok, grazie mille!

Ho capito cosa fare, solo che c'è un piccolo problema, ho notato che la pagina in php della chat non ha div, questo perchè chi ha ideato questa chat a separato la grafica dal php, quindi mi chiedo se il div che devo inserire è da mettere nella pagina del template che è una pagina html.

Adesso ti spiego comè gestito il file, cosi forse trovo la soluzione...

Pagina chat.php al cui interno ci sono i richiami ad imput.php e a chatbody.php (che è il codice che ho spostato); all'interno di tutti e 3 i file ci sono i richiami a 3 pagine html che ne gesticono la grafica (e quindi anche i div?).

In più c'è il richiamo in tutti i file precedenti a imports.css, che si richiama altri 3 file css cioè default.css, game.css e general.css (nel cui interno c'è il riferimento all'overflow incriminato).

Quindi rileggendo la tua risposta potrei adattarla allo schema di questa chat inserendo:

in general.css in questo modo:

#chat_content {
height: 100%;
overflow: auto;
}

.nascosto {
	visibility: hidden;
}

e quindi inserire il div che mi hai detto invece che nel php, dentro il template in html? cosi:

<body>
	<div id="chat_content">

		<$temp_content$>

	</div>
   <div class="nascosto">
     <a name="bottom" id="bottom"></a>
   </div>
</body>

L'unico problema ora è la parte del javascript, potrei fare una cosa del genere:

<script language='JavaScript' type='text/javascript'>
function reloadPage(){
document.location.reload();
chat.php#bottom
}
</script>

<body onLoad="setInterval("reloadPage()",5);">

che sostituirei alla riga che ho trovato all'interno del template chatbody.html che fa riferimento alla pagina chatbody.php:

	
	<meta http-equiv="refresh" content="5" charset=iso-8859-1"/>

mmh... dovè che sbaglio? ho fatto delle prove ma non funge.

[alcio74]

Il JS e il meta tag che refresha sono un po' contrastanti: il primo richiama la pagina con l'ancora, il secondo la pagina senza altri riferimenti.
Usa quindi il solo JS e penso potresti togliere il meta-tag.

Fatto sta che al posto di usare la proprietà reload, nel JS, dovresti usare HREF e puntare al link con ancora che ti ho detto io.
Ti ripeto, però, stiamo andando Off-Topic.

<script language='JavaScript' type='text/javascript'>
  function reloadPage(){
     document.location.href = "chatbody.php#bottom";
  }
</script>

Fai un po' questa prova?

[Alix2204]

Niente da fare, anzi adesso non fa neanche il refresh!

per l'off-topic non so che fare... si può far spostare il tutto nella sezione giusto che non saprei qual'è, riaprire da un altra parte non so quanto può servire.

[alcio74]

Puoi postare nel forum di javascript, per esempio.
Tanto non è una questione di PHP questa.

[Alix2204]

ok, grazie per l'aiuto, anche se non c'è l'abbiamo ancora fatta!
sposto di là e semmai metto il link a questa discussione

[alcio74]

Comunque nel frattempo voglio fare delle prove e capire se funziona come dico io!