2010-05-11 2 views
0

J'utilise le Flowplayer Flash video player pour lire des vidéos MP4 à l'intérieur d'un AnythingSlider. J'ai besoin de détecter lorsque l'utilisateur a cliqué sur le bouton de démarrage de la vidéo pour arrêter le diaporama et permettre à l'utilisateur de voir la vidéo. Je l'ai essayé d'utiliser ce code juste pour avoir une zone d'alerte, mais il ne fait rien (le code est à la fin de la page, avant la balise de fermeture </body>):Comment détectez-vous lorsque Flowplayer a commencé à lire la vidéo?

<script type="text/javascript"> 
    $f("player","global/js/flowplayer/flowplayer-3.1.5.swf",{ 
     onStart: function(clip) { 
      alert('player started');     
     } 
    }); 
</script> 

Le Flowplayer est mis en œuvre comme partie du html5media library, qui détecte automatiquement si le navigateur peut gérer la balise <video>; sinon, il remplace la balise d'ancrage ci-dessous avec le Flowplayer:

<video id="vid" width="372" height="209" 
    poster="global/vid/bbq-poster.jpg" controls preload> 
    <source id="videoSource" src="global/vid/BBQ_Festival.mp4" 
     type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' 
     onerror="fallback(this.parentNode)" ></source> 
    <a 
     href="global/vid/BBQ_Festival.mp4" 
     style="display:block;width:372px;height:209px; padding-left:5px; " 
     id="player"> 
    </a> 
</video> 

Ainsi, l'appel de fonction $ f() est dans un bloc JavaScript à la fin de la page, pour donner au joueur une chance de charger correctement. Qu'est-ce que je fais mal? Merci.

MISE À JOUR: Voici le code HTML généré par Firebug; essayé d'utiliser le "vid" ID pour le joueur et toujours pas de chance.

<object width="100%" height="100%" type="application/x-shockwave-flash" 
    data="http://html5media.googlecode.com/svn/trunk/src/flowplayer.swf" 
    id="vid_api"> 
    <param value="true" name="allowfullscreen"> 
    <param value="opaque" name="wmode"> 
    <param value="always" name="allowscriptaccess"> 
    <param value="high" name="quality"> 
    <param value="false" name="cachebusting"> 
    <param value="#000000" name="bgcolor"> 
    <param value="config={"play":null,"playlist":[{"url":"http://localhost/cms/global/vid/poster.jpg", 
    "scaling":"fit","fadeInSpeed":0,"fadeOutSpeed":0}, 
    {"url":"http://localhost/cms/global/vid/BBQ_Festival.mp4", 
    "autoPlay":false,"autoBuffering":true,"scaling":"fit", 
    "fadeInSpeed":0,"fadeOutSpeed":0}], 
    "clip":{"scaling":"fit","fadeInSpeed":0,"fadeOutSpeed":0}, 
    "plugins":{"controls":{"url":"http://html5media.googlecode.com/svn/trunk/src/flowplayer.controls.swf", 
    "fullscreen":false,"autoHide":"always"}}, 
    "playerId":"vid"}" name="flashvars"></object> 

Répondre

1

Avez-vous essayé:

$f("player", "global/js/flowplayer/flowplayer-3.1.5.swf", { 
    clip: { 
    onStart: function(clip) { 
     alert('poop'); 
    } 
    } 
}); 
+0

Merci, Jan. J'y avais déjà essayé sans succès. Je ne sais pas pourquoi ça ne marche pas. – Alex

+0

le clip: la partie est là où elle est différente de votre code source. As-tu remarqué? Juste pour être sûr :) –

+0

Bonjour, Jan. Merci encore. Oui, essayé le code ci-dessus et pas de chance. Veuillez noter la mise à jour de la question originale ci-dessus: J'ai ajouté le code Flowplayer généré en utilisant Firebug. Aussi essayé "vid" et "vid_api" comme l'ID du joueur et toujours pas de chance. – Alex

1

Au lieu de onStart, utilisez onBufferFull. J'utilisais onStart et parfois la vidéo était encore en mémoire tampon et onStart était déjà déclenchée. Utilisant onBufferFull, je maintenant que la vidéo a tamponné un minimum et il a réellement commencé à jouer sur l'écran. Si vous souhaitez qu'un événement soit déclenché juste au début de la vidéo, assurez-vous de l'enregistrer dans un drapeau "tamponné pour la 1ère fois". onBufferFull est appelé dans les morceaux chaque fois que la vidéo a tamponné un minimum (je crois que la documentation dit 3 secondes) pour être joué. J'espère que cela aide.

Questions connexes