[PHP] Chat e Scrollbar!
[PHP] Chat e Scrollbar! postato il 11/07/2011 17:31:46 nel forum programmazione, open source e hosting e modificato da wolfkiba94 il 11/07/2011 17:33:31
Hey ragazzi salve!
Come ho già detto nel forum di presentazione, sto creando un gdr senza l'uso di un gdrcd. Da una settimana sto lavorando alla chat di gioco, fatta tutta con PHP e MYSQL, ho trovato utile inserire i sussurri, le abilità e beh tutto quello che una buona chat di gioco dovrebbe avere.
Oggi mi sono accorto che se scrivo troppi messaggi ( logicamente ) comprare la scrollbar che deve essere, ad ogni reload, riportata verso il basso per leggere l'ultima ruolata. Vorrei chiedervi a voi esperti, in che modo posso far scendere la scrollbar in basso a tutto automaticamente.
E' un impresa fare un gdr con le poche conoscenze che mi ritrovo, però sto facendo esperienza e grazie a voi posso imparare tanto.
Oltre a questo, cosa che voi considerate forse una cavolata di facilità assurda, vorrei fare in modo che quando l'utente invia la ruolata ( alla pressione del input INVIO ) si aggiornasse il frame che contiene tutte le ruolata. E' javascript? Potreste spiegarmi come fare?
Vi prego di rispondere in modo preciso, tenete conto che sono proprio un iniziato ^^"
Grazie ragazzi
CRSED: F.O.A.D. ↗11/07/2011 17:55:04 e modificato da whisperingmists il 11/07/2011 18:09:58
basta piazzare questo fra l'<head></head> del codice:
<script>
function scrollAutomatico() {
scroll(0,20000000);
}
</script>
quel numero scrolla verso il basso fino a 20 milioni di pixel! è ovviamente un numero indicativo, se non vuoi rischiare potresti comodamente impostare un window.location su un div piazzato alla fine della chat.
poi imposti il refresh della pagina automatico con un semplicissimo:
<meta http-equiv="refresh" content="5">
il 5 corrisponde a 5 secondi, ho messo un numero a caso, puoi impostarlo come preferisci.
ed infine basta richiamare nel body lo script in questa maniera:
<body onload="scrollAutomatico()">
spero di essere stato utile! (:
Raja Dunia ↗
11/07/2011 18:31:08 e modificato da leoblacksoul il 11/07/2011 18:32:33
Il metodo sopra funziona fino a un certo limite, ma è un po' barbaro.
Direi che il metodo migliore e che funziona sempre per fare lo scrolling di un elemento è questo, da eseguire nel frame che contiene la chat dopo che hai stampato i nuovi messaggi:
<script type="text/javascript">
myChat=parent.document.getElementById('IDDelFrameChat');//Non è detto che questo funzioni dipende dalla struttura della tua pagina.
myChat.scrollTop = myChat.scrollHeight;
</script>
Questo è il sistema di base. Io lo ritengo scomodo per gli utenti, in quanto se vogliono non possono andare a rileggere la chat precedente, perchè ogni x secondi il frame scrolla giù in automatico. Per attenuare l'effetto puoi fare in modo che PHP stampi il codice che ti ho scritto solo se ci sono nuovi messaggi da visualizzare.
Io sulle mie chat ho fatto in modo che l'elemento non faccia proprio lo scrolling se l'utente sta rileggendo del testo più in alto, ma per farlo ci vuole un po' più di impegno. C'era un bel link che lo spiegava, ma non lo trovo più
Creare una chat con i frame da zero è sicuramente un ottimo esercizio per imparare, ma una volta fatta ti consiglio di provare qualcosa di più moderno; diciamo che i frame non sono proprio cose che si usano nei siti web di oggi...a parte rare eccezioni (vedi inclusione delle mappe di GoogleMaps >.<) XD
Project Entropy ↗
11/07/2011 19:11:25 e modificato da wolfkiba94 il 11/07/2011 19:26:52
Immaginavo che l'uso dei frame era forse datato, ma per le mie conoscenze beh è stato il piu "semplice" e "versatile" metodo xD
Naturalmente un giorno spero di realizzare qualcosa di piu aggiornato, ma per ora meglio fare qualcosa anche se poco innovativa, farla bene!
Grazie a tutti e due, mi avete dato ben due versioni da testare, gentilezza assoluta ^^
Bene ora mi metto all'opera, speriamo in bene!
EDIT:
Ho dovuto usare il metodo "barbaro" che funziona bene, l'ultimo non mi funzionava, di sicuro la colpa è mia e delle mie scarse conoscenze ^^" ma voglio comunque ringraziarvi infinitamente ^^
Posso fare un ultima richiesta ragazzi? Scusatemi, ma vorrei un ultima cosa per questa noob-chat ( ^^" ) ovvero che una volta schiacciato l'input di invio si aggiornasse la pagina chat.php ( quella che prende tutte le ruolate dal database e le stampa ).
Grazie infinite!
Enlisted ↗
11/07/2011 20:13:50 e modificato da leoblacksoul il 11/07/2011 20:14:22
giusto, me ne ero scordato. XD
ok, ci riprovo con il mio codice XD
<script type="text/javascript">
myChat=document.body;
myChat.scrollTop = myChat.scrollHeight;
</script>
Ora....per aggiornare il frame quando clicchi sull'invio, devi usare l'evento OnSubmit del form di invio del messaggio.
Sarebbe utile sapere la struttura della tua pagina, altrimenti non so come andare a pescare il tuo frame. Ti posto un esempio:
Probabilmente tu avrai il tuo form fatto così
<form method="post">
<input type="text" name="testo"/>
<input type="submit" name="Invia" value="Invia"/>
</form>
Dovremmo modificarlo così:
<form method="post" onSubmit="window.top.nomeframe.window.location.reload();">
<input type="text" name="testo"/>
<input type="submit" name="Invia" value="Invia"/>
</form>
Dove nomeframe è il nome che hai dato al frame che contiene il testo della chat. Ripeto, potrebbe non funzionare dato che non so come hai strutturato la tua pagina
Tiles Survive ↗
11/07/2011 20:52:22
Infatti non funziona, ( anche se è anche colpa della mia inesperienza ).
Ti spiego come è organizzato il mio sistema di chat. Ho una pagina che al suo interno racchiude due frame.
<frame src="Chat.php" name="Chat" id="Frame_Chat" title="Frame_Chat" />
<frame src="Input.php" name="Input" scrolling="No" noresize="noresize" id="Frame_Input" title="Frame_Input" />
Una cosa del genere. Poi ho in Chat.php un codice che riprende tutto quello che è inserito all'interno del database nella tabella Chat.
Poi ho un ulteriore pagina chiamata Input.php che invia i dati al database.
Sono stato disordinato vero? ^^"
11/07/2011 21:08:13
mi sa che ho sbagliato quello che era da mettere dentro all'onSubmit. Prova con questo:
parent.frames[0].location.reload();
Seconda Era ↗
11/07/2011 21:21:43
leoblacksoul ha scritto: mi sa che ho sbagliato quello che era da mettere dentro all'onSubmit. Prova con questo:
parent.frames[0].location.reload();
In che pagina devo inserirlo? Sempre dove stà l'input? ( grazie per la pazienza! )
11/07/2011 21:25:04 e modificato da leoblacksoul il 11/07/2011 21:25:48
si devi metterlo nel form dell'Input.php
quello dovrebbe sostituire i codice che ti avevo messo prima dentro al
<form method="post" onSubmit="METTILO QUI">
11/07/2011 21:38:23
leoblacksoul ha scritto: si devi metterlo nel form dell'Input.php
quello dovrebbe sostituire i codice che ti avevo messo prima dentro al
<form method="post" onSubmit="METTILO QUI">
Se non sbaglio mi aggiorna la pagina dove sta l'input o.o
Storie di Agarthi ↗
11/07/2011 21:48:19
Sto studiando php e mysql con molta dedizione, preferisco fare una cosa per volta, piano piano crescerò. Questo progetto mi occorre piu per fare esperienza che per avere successo.
Il giorno in cui deciderò di sfondare nel mondo dei gdr a livelli professionali, di sicuro sarò prima reduce da tanti studi, questo gdr è per capire cosa ho imparato fino ad ora ^^.
Rispondi alla Discussione Segui Discussione Inoltra Discussione Forum Programmazione, Open Source e Hosting Elenco Forum
Articoli, Interviste e altre Risorse!
