-
[Antonio].
User deleted
Nuvoletta Nuovi Messaggi in Real-Time
L'aggiornamento del vecchio ed obsoleto script "Nuvoletta Stile Netlog" è stato completato.
Anteprime
Firefox
Internet Explorer 8 - 7
- 
Safari 5
Note allo Script
Sembrava ieri quando decisi di oltrepassare i noiosi limiti e la staticità di HTML e CSS e dimostrare la mia cratività con l'uso del Javascript.
Ricordo un Topic sul Report, quando ero ancora un assiduo frequentatore (non che ora non lo sia in effetti
), con una richiesta di una "Nuvoletta" che notificasse la presenza di nuovi Post.
Allora proposi una semplice e statica soluzione in HTML, successivamente, però, mi fu chiesto di aggiungere qualche effetto, e proprio per questo motivo decisi di studiare un pò di Javascript.
I primi risultati furono disastrosi, pagine che scomparivano, crash del Browser, errori improvvisi, ma grazie a qualche risorsa trovata su Internet riuscì a mettere in piedi qualcosa di molto confuso e buggato, ma ero già ad un ottimo punto (http://nuvolettalog.forumcommunity.net/).
Decisi di pubblicare lo Script, e venne adottato da moltissimi Forum, cosa che non ritenevo possibile.
Con il passar del tempo decisi che dovevano essere apportati numerosi cambiamenti, ma un motivo tira l'altro, lo lasciai senza alcun modifica o miglioramento per un anno, quando otto giorni fa ho deciso che era ora...Differenze tra le due versioni
Caratteristica V. 1 V. 2.1 Nuvoletta personalizzabile tramite CSS Sì Sì Iframe sempre aggiornato Sì (30s) Sì (10s) Effetto dissolvenza Sì (bug) Sì Scomparsa completa Nuvoletta No Sì Notifica soltanto nel caso di nuovi Post/Topic effettivi (Aggiornamento in Real-Time) No Sì (10s) Personalizzazione semplificata dallo Script No Sì Stop della dissolvenza al passaggio del Mouse, e ripartenza al rilascio No Sì Lunghezza codice compresso (caratteri) ~1400 ~3000 Installazione
Posizionate questo codice in Codice HTML > Codice HTML che sarà mostrato in tutte le pagine sotto il logo del sito:
CODICE<script type="text/javascript">
<!--
//Script By Antonio - http://ffmagazine.forumfree.it/
stt = {
"siteId" : "", // Specificare ID del Sito - PARAMETRO OBBLIGATORIO
"coloreTesto" : "000000",
"coloreLink" : "000000",
"urlLibero" : "&nodate=1",
"altezza" : "50",
"larghezza" : "190",
"immagineSfondo" : "https://skin.forumfree.net/1568/sezioni.png",
"posizioneSfondo" : "left bottom repeat-x",
"coloreSfondo" : "F2F2F2",
"larghezzaBordo" : "1",
"coloreBordo" : "8B8B8B",
"tipoBordo" : "solid",
"bordiCurvi" : 1,
"posizione" : "br",
"margini" : "30",
"mostraAlCaricamento" : 1,
"tempoDissolvenza" : 1000,
"tempoNuvoletta" : 7500
};
//-->
</script>
<script type="text/javascript" src="//ffmagazine.forumfree.net/antonio/cloud.js"></script>Configurazione
La parte da modificare è la seguente:
CODICEstt = {
"siteId" : "", // Specificare ID del Sito - PARAMETRO OBBLIGATORIO
"coloreTesto" : "000000",
"coloreLink" : "000000",
"urlLibero" : "&nodate=1",
"altezza" : "50",
"larghezza" : "190",
"immagineSfondo" : "http://skin.forumfree.net/1568/sezioni.png",
"posizioneSfondo" : "left bottom repeat-x",
"coloreSfondo" : "F2F2F2",
"larghezzaBordo" : "1",
"coloreBordo" : "8B8B8B",
"tipoBordo" : "solid",
"bordiCurvi" : 1,
"posizione" : "br",
"margini" : "30",
"mostraAlCaricamento" : 1,
"tempoDissolvenza" : 1000,
"tempoNuvoletta" : 7500
};
vediamo come:Attributo Spiegazione Valori "siteId" L'ID (ForumFree) del forum su cui si sta inserendo lo script Unico parametro obbligatorio, necessario per far funzionare correttamente lo script
Numero intero positivo (es. l'ID del FF Magazine è 86793)"coloreTesto" Il colore del testo all'interno della Nuvoletta Qualsiasi colore esadecimale (senza l'#)
?wiki=Colori_HTML"coloreLink" Il colore dei link all'interno della Nuvoletta Qualsiasi colore esadecimale (senza l'#)
?wiki=Colori_HTML"urlLibero" Un qualsiasi testo composto da attributi che si aggiunge automaticamente alla fine del Link dell'Iframe, utile per specificare ulteriori preferenze (Opzionale) Attributi ricavabili da qui: ?wiki=Ultime_discussioni_sul_proprio_sito (Voce: Parametri opzionali) "altezza" L'altezza della Nuvoletta Un qualsiasi valore numerico (attenzione a specificare solo un numero senza l'uso di indicatori come px, pt, %, ecc.). "larghezza" La larghezza della Nuvoletta Un qualsiasi valore numerico (attenzione a specificare solo un numero senza l'uso di indicatori come px, pt, %, ecc.) "immagineSfondo" Un'immagine di sfondo (Opzionale) Un link di un immagine di sfondo hostata su Internet, senza nessun'altra aggiunta "posizioneSfondo" La posizione e le opzioni di ripetizione dell'immagine di Sfondo (Solo in caso di presenza del suddetto parametro) position & repeat (Esempio: "bottom left repeat-x") "coloreSfondo" Il colore dello Sfondo Qualsiasi colore esadecimale (senza l'#)
?wiki=Colori_HTML"larghezzaBordo" La larghezza del Bordo della Nuvoletta Un qualsiasi valore numerico (attenzione a specificare solo un numero senza l'uso di indicatori come px, pt, %, ecc.)
Scrivere "0" in caso non si desideri bordo)"coloreBordo" Il colore del Bordo (Opzionale) Qualsiasi colore esadecimale (senza l'#)
?wiki=Colori_HTML"tipoBordo" Lo stile del Bordo (Opzionale) solid, double, ecc.
css_border.asp"bordiCurvi" Includere dei bordi curvi (Solo Firefox e Safari) 1 = Si;
0 = No"posizione" Posizione rispetto alla pagina della Nuvoletta "bl" = In basso a sinistra;
"br" = In basso a destra;
"tl" = In alto a sinistra;
"tr" = In alto a destra"margini" La distanza dal margine della pagina Un qualsiasi valore numerico (attenzione a specificare solo un numero senza l'uso di indicatori come px, pt, %, ecc.) "mostraAlCaricamento" Mostrare la nuvoletta subito al caricamento della pagina 1 = Si;
0 = No"tempoDissolvenza" Velocità della dissolvenza Valore numerico in millisecondi "tempoNuvoletta" Tempo durante il quale la nuvoletta rimane opaca Valore numerico in millisecondi
Ecco un esempio di codice scritto da me per adattare lo Script alla The Bad Touch Skin di Dadz:CODICEst={
"siteId": "", // Specificare ID del Sito - PARAMETRO OBBLIGATORIO
"coloreTesto":"5F5F5F",
"coloreLink":"136D9F",
"urlLibero":"&nodate=1&font='segoe ui',arial&size=12",
"altezza":"50",
"larghezza":"190",
"immagineSfondo":"http://skin.forumfree.net/1568/sezioni.png",
"posizioneSfondo":"left bottom repeat-x",
"coloreSfondo":"F2F2F2",
"larghezzaBordo":"1",
"coloreBordo":"8B8B8B",
"tipoBordo":"solid",
"bordiCurvi":1,
"posizione":"bl",
"margini":"30",
"mostraAlCaricamento" : 1,
"tempoDissolvenza" : 1000,
"tempoNuvoletta" : 7500
}F.A.Q.
- Perchè lo Script non funziona correttamente?
Le cause possono essere molteplici, da un errore durante la digitazione a una parte di script modificata con errore.
Per prima cosa, controllare che, nella prima parte, tutti i campi siano preceduti e seguiti dalle " " (virgolette) (tranne nel caso di numeri), e siano seguiti dalla , (virgola) (tranne nel caso dell'ultimo).
Se tutto ciò è corretto, dopo aver ricontrollato, saremo disposti a correggere il vostro codice nella discussione di Supporto ufficiale. - Posso rimuovere
//Script By Antonio - https://ffmagazine.forumfree.it/?
Il vostro buonsenso dovrebbe darvi subito una risposta: la scritta non è per nulla invadente per l'utente (infatti nemmeno si vede), si tratta solo di una riga nel codice sorgente. Come avete capito la mia risposta è no, poi fate come volete. - E' possibile includere un tasto di chiusura nella "Nuvoletta"?
L'implementazione dovrebbe essere abbastanza semplice, ma preferisco aspettare le prossime versioni dello Script. - Cosa succede agli utenti che non hanno Javascript abilitato e agli Spider dei motori di ricerca? Lo Script invalida il codice?
Niente di tutto ciò, lo Script: è nascosto per coloro con Javascript disattivato, gli Spider dei motori di ricerca lo saltano come se non ci fosse, e non invalida per niente il codice:
Markup Validation Service: popuptopnews.forumfree.it (eventuali errori non sono correlati allo script) - E' possibile regolare l'altezza della "Nuvoletta" variamente in base al contenuto?
Lo script includeva anche questa feature, adesso non è più possibile.
Conclusioni
Per prima cosa è giusto ricordare, come ho sottinteso prima, che dovete alla prima versione di questo Script il fatto che io oggi sia qui, infatti fu il primo che postai qui al Magazine e successivamente durante le procedure di rinnovamento del Forum venni preso come Moderatore.
Voglio inoltre aggiungere che ho preso imitazione dalle notifiche di Facebook e di Netlog, quindi l'utilizzo è molto utile agli utenti che non vogliono perdersi nemmeno un messaggio di una discussione o semplicemente per abbellire il Forum con qualcosa di nuovo, in caso manchino idee.
Ulteriori consigli sono sempre ben graditi, ma naturalmente nelle mie possibilità (vedi filtri di Forumfree).
Non si tratta di un codice perfetto, ne sono sicuro, la segnalazione di eventuali Bug è cosa buona e giusta.
E' possibile ridistribuire questa guida sui vostri Forum lasciandone inalterati integrità e contenuti/crediti ed inserendo il seguente codice in fondo al messaggio:HTML<div class="textinput" style="margin:1px;padding:4px;display:block;text-align:center"><a title="Nuvoletta Nuovi Messaggi in Real-Time" href="http://ffmagazine.forumfree.it/?t=49693068"><b>Nuvoletta Nuovi Messaggi in Real-Time</b></a>
Realizzata da <a href="http://www.forumfree.it/?act=Profile&MID=3408796">[Antonio]</a> del <a title="Forumfree Magazine - Stai al passo con Forumfree!" href="http://ffmagazine.forumfree.it/?t=48148627"><b>ForumFree Magazine</b></a>.
Guida rilasciata sotto una <a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/3.0/">Licenza Creative Commons 3.0</a>.</div>
Esempio visualizzazione:Nuvoletta Nuovi Messaggi in Real-Time
Realizzata da [Antonio] del ForumFree Magazine.
Guida rilasciata sotto una Licenza Creative Commons 3.0.Topic Ufficiale Supporto Nuvoletta Nuovi Messaggi in Real-Time
[Per ridistribuire la guida sui forum/blog del circuito potete scaricare il file .txt già pronto da cui prelevare l'intero testo del topic, esso si intende già pronto per essere inserito e da non alterare/modificare, neanche parzialmente]
Edited by Paralizer - 21/4/2018, 09:30
. - Perchè lo Script non funziona correttamente?
-
.
Funziona anche con Chrome? . -
[Antonio].
User deleted
Confermo. . -
Eomm.
User deleted
Davvero un ottimo script considerando pure le difficoltà d'implementazione.
Complimenti
. -
[Antonio].
User deleted
Grazie mille 
. -
[Antonio].
User deleted
CITAZIONECodice HTML > Codice HTML che sarà mostrato in tutte le pagine sotto il logo del sito
Per supporto: https://ffmagazine.forumfree.it/?t=49703205. -
.
ho postato qui perchè nel supporto mi dice che la discussione è di sola lettura
è possibile spostare il testo e metterlo più centrato?
metto il link sotto spoiler caso mai cancellatelo
come posso mettere il testo al centro della nuvola?. -
[Antonio].
User deleted
Ti saresti dovuto iscrivere al gruppo dei Lettori.
Ad ogni modo, in linea di massima potresti inserire nel CSS questo:CODICE#cloud iframe {margin: auto 0 auto 40px}
oppureCODICE#cloud iframe {margin: 10px 0 0 40px}
Ma si tratta di una soluzione in linea di massima, dato che l'altezza dell'iFrame può essere sempre variabile.. -
.
non funziona... 
ho risolto
Edited by Christi@n™ - 3/8/2010, 17:11. -
LuigiEdgeworth.
User deleted
e' possibile che con versioni di Firefox precedenti alla 3 nn funziona?
con internet explorer mi funziona
. -
[Antonio].
User deleted
CITAZIONE (LuigiEdgeworth @ 5/8/2010, 20:15)e' possibile che con versioni di Firefox precedenti alla 3 nn funziona?
con internet explorer mi funziona
Non sono completamente sicuro sul fatto che funzioni.
Ad ogni modo si tratta di un problema di poco conto: Mozilla è un browser che si aggiorna automaticamente all'ultima versione disponibile, quindi le copie ancora in circolazione delle vecchie versioni sono pochissime.
Per supporto, o anche per consigli o pensieri: https://ffmagazine.forumfree.it/?t=49703205
Qui chiudo.. -
[Antonio].
User deleted
Parzialmente aggiornato, presto nuove funzioni. . -
.
Scusa, dove posso trovare l'aggiornamento? . -
.
Ho caricato lo script aggiornato . Funziona ma se vado a modificare i parametri del colore, del margine...insomma quelli che si possono modificare la nuvoletta non compare.
Ho la nuvoletta solo se non modifico lo script.
La posizione "br" fa comparire la nuvoletta in alto, al centro ed anche se provi con le altri posizioni rimane sempre lì.. -
.
Cosa è stato aggiornato nello specifico Antonio?
.
Nuvoletta Nuovi Messaggi in Real-Time - Aggiornato (V. 2.1) |
