Tempo fa abbiamo visto come utilizzare la libreria javascript SWFobject per visualizzare un file flv all’interno di una pagina html, utilizzando il JW Flv player.
Se abbiamo ben presente come pubblicare un video in questo modo, sarà un gioco da ragazzi impostare il player per la riproduzione di una playlist di file FLV. Quindi il tutorial che segue presuppone la conoscenza di tutto quello che abbiamo visto nel post dedicato alla pubblicazione di file FLV in una pagina HTML.
Fatta questa dovuta premessa possiamo cominciare…
Sappiamo come specificare al player il file flv da riprodurre, usando questa riga di codice:
s1.addVariable("file","nomedelfile.flv");Se vogliamo vogliamo che il player, anzichè visualizzare un singolo video, riproduca una playlist di filmati flv, potremo semplicemente specificare il file XML che la contiene, al posto del file .FLV.
s1.addVariable("file","playlist.xml");Rispetto agli altri parametri, come ad esempio il colore di sfondo del player, opzione fullscreen, ecc., resta valido quanto spiegato nell’altro tutorial. Bisognerà tuttavia fare attenzione a certi parametri aggiuntivi dovuti al fatto che verrà riprodotta una playlist. Specificheremo l’altezza effettiva del video: il player swf dovrà infatti contenere quest’ultimo più uno spazio dedicato alle altre tracce della playlist. Disabiliteremo la riproduzione casuale, e faremo il modo che le dimensioni del filmato si adattino al player mantenendo invariate le proporzioni. Attiveremo infine le thumbnail (quindi nella playlist dovremo speficare anche il percorso delle relative immagini).
s1.addVariable("displayheight","225");
s1.addVariable("shuffle","false");
s1.addVariable("overstretch","true");
s1.addVariable("thumbsinplaylist","true");Il codice per pubblicare la nostra playlist, ammesso che SWFObject.js (ricordiamoci di richiamarlo nell’html), il file mediaplayer.swf, e il file XML si trovino nella stessa directory della pagina html, sarebbe quindi il seguente:
<script type="text/javascript" src="swfobject.js"></script>
<div id="container"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</div>
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
var s1 = new SWFObject("swf/mediaplayer.swf","mediaplayer","320","350","7");
s1.addVariable("width","320");
s1.addVariable("height","350");
s1.addVariable("file","xml/playlist.xml");
s1.addVariable("displayheight","225");
s1.addVariable("overstretch","fit");
s1.addVariable("shuffle","false");
s1.addVariable("thumbsinplaylist","true");
s1.write("container");
</script>È dunque necessario prepare un file XML con la playlist. Vediamo come costruire questo file. Bastera un editor di testo qualsiasi, come blocco note o textedit.
Nome dell'autoere
percorsodelfilevideo.flv
<img alt="" />eventualeimmaginethumb.jpg
Nome dell'autore 2
percorsodelfilevideo2.flv
<img alt="" />eventualeimmaginethumb2.jpgÈ chiaro che ogni traccia della playlist corrisponde ad un elemento nel file XML.
All’interno dell’elemento poi specificheremo di volta in volta titolo, autore, il nome ed il percorso del file flv, e infine la thumbnail da visualizzare nel player.
Mi raccomando ai percorsi dei file: se pensate di aver fatto tutto per bene, e comunque i video non si vedono è possibile che abbiate sbagliato il percorso dei file richiamati nella playlist… ricordate che il percorso è relativo al file SWF!
(Ma, stranamente, per le immagini il percorso è relativa alla posione del file hmtl).
Se ancora non è tutto chiarissimo, niente paura, come al solito ho preparato l’esempio.
ciao dani. sto cercando siti dove posso trovare plugin per color correction free. o cmq programmi per color video free. cmq mi servono plugin.?
inoltre hai mai visto http://www.videocopilot.com?
Ciao Daniele molto bello ed interessante…ti volevo chiedere una cosa…..è possibile mandare in play tutti i video senza selezionarli uno dietro l’altro in automatico……grazie.
Cia Daniele, interessanti i tuoi consigli, ma purtroppo non sono riuscito a realizzare a pieno la playlist. Vedo i filmati ma non visualizzo la la playlist. Il player vicino al pulsante di avvio/stop in basso a sinistra possiede anche due pulsanti (frecce) avanti e indietro. Con quelle riesco a pasare al filmato successivo o al precedente ma della playlist manco l’ombra. Noto che nel tuo script viene richiamato il file mediaplayer.swf ma dal sito dell’autore da te indicato scarico il file player.swf. Dipenderà da quello? Puoi darmi una mano per favore eventualmente inviandomi il tuo file mediaplayer.swf. Grazie di cuore
Ciao Dani, acnhe io sono riuscito a fare “IN PARTE LA PLAYLIST” cioe non mi si vede la play list dove e possibile scegliere i video ma i vari filmai mi si vedono in un singolo player consecutivamente e come se avrei unito tutti i filmati in un solo… Come fare????
Ho un altro problema… non mi si vedono le thumbnails e relativo testo…perchè? Ho copiato giusto…
Non capisco come fare per poter avviare i video da qualsiasi posizione senza dover aspettare che venga tutto scaricato, se sposto la progress bar in una posizione che non è stata ancora scaricata il player non me lo fa vedere
Ciao Gossip,
sono abbastanza ceerto che quest funzione non sia supportata dal jwplayer…
iè una feature importante, vedro di trovare qualcosa nei prossimi giorni.
Altra cosa che non sono riuscito a capire è se c’è un modo, per i video hostati su megavideo, per risalire dal link del tipo:
http://www.megavideo.com/?v=38V973Q8
al url sorgente:
http://www05.megavideo.com/files/0e8125fef7351d694042087be249bb35/
…direttamente tramite player. Manualmente è abbastanza semplice, basta uno sniffer per protocollo http o l’estenzione per firefox (downloadhelper), il problema è che saltuariamente i link al url sorgente cambiano ed il player non trova + la fonte, quindi sono costretto ad aggiornare tutti i link manualmente nella playlist…
non mi si vedono le thumbsnail, e nn capisco come mai.
lo spazio prima del titolo c’è ma è vuoto…
@kob4yashi: potrebbe essere un problema di percorso dell’immagine nell’Xml. Considera che il percorso che inserisci nell’xml deve essere relativo alla posizione del file swf.
Ciao Daniele… spero che risponderai anche se l’articolo è di aprile!!! Volevo sapere come mettere la playlist a destra? Grazie comunque per il tutorial!
caro dniele volevo sapere come si mettono i thumbnail in un video; mi escono i fotogrammi tutti neri
scusate ma riesco a creare la playlist, ma e’ normale che il player non passi direttamente al filmato successivo?? e’ possibile fare un loop di tutta la playlist completa senza dover premere avanti?
Ciao, anch’io come Alessandro avrei bisogno di sapere se c’è un modo per visualizzare la playlist a destra (please, please, please…).
In ogni caso ti ringrazio per il tutorial, funziona alla grande, complimenti sinceri!
Ovviamente per destra intendo lateralmente al video e non sovrapposto ad esso, dunque a destra, sinitra, sotto, sopra… purchè al di fuori
Ciao ragazzi,
è possibile specificare nella playlist l’orario di inizio dei video, quindi creare un palinsesto che “legge” l’orario di messa in onda dei filmati?
ciao Daniele sono riuscito a creare perfettamente la play list seguendo la tua guida.
Ora volevo implementare la pagina con un upload in modo da garantire a dei miei amici registrati di fare upload dei loro video sul mio sito e fin qua nessun problema. Ma come fare in modo che il file XML contenente le informazioni neccessari per consentire la visualizzazione dei video nel player si aggiorni automaticamente non appena il video a stato uplodato sul sito?
un altra domanda, o creato la playlist ma ce il modo di vedere i video in schermo pieno. magari un pulsantino sul player. Grazie
Ciao Daniele,
sono arrivato al tuo blog perchè da un paio di settimane sono alle prese con questo ottimo, devo dire, player e ho condiviso la maggior parte dei dubbi e dei problemi che hanno avuto gli utenti che mi hanno preceduto nelle varie risposte.
Per quanto riguarda la visualizzazione di player, dei file e (parzialmente) della playlist non ho problema.
L’unica cosa che mi lascia perplesso è questa:
ho creato una playlist in .xml che riporto qui sotto
nome dell’autore
titolo del video
percorso\video.flv
nome dell’autore
titolo del video
percorso\video.flv
il problema è che viene visualizzato solo il titolo del video e non l’autore che è ‘piazzato’ sulla riga superiore. Come mai?
Grazie anticipatamente per la risposta.
Daniele o necessita di vedere i video in fullscreen, mi puoi aiutare per favore, o creato la playlisti ma non ce modo di vedere i video a schermo intero che devo fare? Grazie ancora
Ciao Salvo,
per il fulscreen prova ad aggiungere:
s1.addParam(”allowfullscreen”,”true”);
tra i parametri che passi al player.
dovrebbe funzionare
Michelangelo, mi sembra strano… se segui l’esempio dovrebbe essere visualizzato tutto correttamente. Sei sicuro di aver scritto correttamente il file XML?
Ti chiedo scusa, ma nella fretta non ho scritto il codice completo, che riporto qui sotto (mi sembra che sia tutto in regola, a meno che non debba intervenire sulle dimensioni del riquadro della playlist)
nome dell’autore
titolo del video
percorso\video.flv
nome dell’autore
titolo del video
percorso\video.flv
Michelangelo non puoi postare xml nei commenti (non vengono visualizzati i tag), magar metti il link alla playlist, se è on-line..
hai ragione scusa!
L’ho messo qui (spero vada bene)
http://michelangelo.altervista.org/pagine/playlist.xml
Daniele i parametri s1.addParam(”allowfullscreen”,”true”);
li avevo gia aggiunti ma niente. Cmq anche nel tuo esempio non va in full screen. Aiutami ne o urgente bisogno Grazie
ok daniele o risolto il fullscreen ma ora mi serve che il player esegua in automatico tutti i video presenti nella playlist, senza dover selezionarlo uno per uno. Ti ringrazio se risolvo questo giuro che non ti ropero piu le scatole. Grazie
Questo tutorial è magnifico grazie!!!
Ho pero’ un problema ..ho letto che anche altri come me non sono riusciti a visualizzare la playlist…
Cosa ho sbagliato? Grazie per la tua risposta!
Saluti!!!
Ciao Daniele, anche io come Domenico ho la assoluta necessità di fare in modo che i video flv contenuti nella playlist partano all’orario giusto.
Quindi vorrei sapere se è possibile specificare nella playlist l’orario di inizio dei video, in modo che i filmati vadano all’orario previsto, proprio come accade per una normale trasmissione tv. E quale potrebbe essere il codice da inserire nel player?
Rispondi plaese!
Grazie Nick
Ho risolto grazie!
Il problema era con mediaplayer.swf.
Ora compare la playlist…
Ciao Daniele
Ho lo stesso problema di Rinaldo :”Vedo i filmati ma non visualizzo la la playlist. Il player vicino al pulsante di avvio/stop in basso a sinistra possiede anche due pulsanti (frecce) avanti e indietro. Con quelle riesco a pasare al filmato successivo o al precedente ma della playlist manco l’ombra”
Ho provato a ricontrollare il percorso delle immagini ed è corretto, anche perchè prima di cliccare play, viene visualizzata l’immagine desiderata.
Cortesemente potresti dirmi qual è il problema
grazie
Ciao Daniele
Ho lo stesso problema di Rinaldo :”Vedo i filmati ma non visualizzo la la playlist. Il player vicino al pulsante di avvio/stop in basso a sinistra possiede anche due pulsanti (frecce) avanti e indietro. Con quelle riesco a pasare al filmato successivo o al precedente ma della playlist manco l’ombra”
Ho provato a ricontrollare il percorso delle immagini ed è corretto, anche perchè prima di cliccare play, viene visualizzata l’immagine desiderata.
Cortesemente potresti dirmi qual è il problema
grazie
Daniele ciao. Dunque il problema persiste però ti volevo porre alla tua attenzione il sguente codice :
var s1 = new SWFObject(’player-viral.swf’,'mediaplayer-viral’,'330′,’250′,’10′);
A differenza del tuo Tutorial visualizzo il player solo richiamandolo come player-viral . Trattasi di una versione nuova rispetto al tuo tutorial.? Forse per questo che non vedo la playlist ?
Grazie