Popcorn JS - Use of popcorn with Youtube on an iPad or iOS device

StackOverflow https://stackoverflow.com/questions/10588070

Domanda

I am using popcornjs to load an interact with a video from youtube. When I use the code from the documentation:

<html>
  <head>
<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>

<script>
  // ensure the web page (DOM) has loaded
  document.addEventListener("DOMContentLoaded", function () {

       // Create a popcorn instance by calling the Youtube player plugin
     var example = Popcorn.youtube(
       '#video',
       'http://www.youtube.com/watch?v=CxvgCLgwdNk' );

     // add a footnote at 2 seconds, and remove it at 6 seconds
     example.footnote({
       start: 2,
       end: 6,
       text: "Pop!",
       target: "footnotediv"
     });

     // play the video right away
     //example.play(); => commented because you can't autoplay on ios

  }, false);
</script>
  </head>
  <body>
    <div id="video" style="width: 360px; height: 300px;" ></div>
    <div id="footnotediv"></div>
  </body>
</html>

It looks perfect on any browser, but nothing shows on the iPad. When I load a video with popcorn but without using Youtube, it seems to work fine.

What can I do?

È stato utile?

Soluzione

Unfortunately, the ipad doesn't support Flash. We do have a ticket in progress with Popcorn to switch to their HTML5 API, which you can view here:

https://webmademovies.lighthouseapp.com/projects/63272/tickets/329-support-youtube-html5-api-playback-engine

Hope that helps, Brett

Altri suggerimenti

Try using the smart media wrapper:

var example = Popcorn.smart( '#video', 'http://www.youtube.com/watch?v=CxvgCLgwdNk' );

 // add a footnote at 2 seconds, and remove it at 6 seconds
 example.footnote({
   start: 2,
   end: 6,
   text: "Pop!",
   target: "footnotediv"
 });

 // play the video right away
 //example.play(); => commented because you can't autoplay on ios
}, false);

I too am facing the issue, Youtube Popcorn is not working in iPad. But interestingly I found a site using popcorn youtube and it works fine in iPad

Link:

http://www.retn.org/show/south-burlington-school-board-meeting-october-2-2013

So, I guess someone should come up with more specific answer

Edit this file in your code:

https://github.com/mozilla/popcorn-js/blob/master/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js

Comment body part of onPlayerReady() on line no 117 and add following statements in this function in case of iPad.

addYouTubeEvent("play", onFirstPlay);
playerReady = true;
mediaReady = true; 
player.mute();

Reason: Youtube on iPad wants user interaction, you can't start it programmatically and due to player.isMuted() method returns false in case of iPad, addYouTubeEvent("play", onFirstPlay) statement is never called.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top