Issue reported: mozilla#416
Reported by: @codingisacopingstrategy

@codingisacopingstrategy
codingisacopingstrategy commented on 19 Nov 2014
Hello.

I am leveraging the Popcorn start and stop events to make DOM elements appear for the length of a track event.

However, when I go back in time, before a track has reached its end point, the end event is never fired, and thus multiple DOM elements stay ‘activated’.

Is this correct? I understand, conceptually, that events ‘end’ when the timeline reaches the point where they end, but for me the event also ‘ends’ if the timeline moves before their beginning…

I imagine it is not easy to change this behaviour in Popcorn—
is there then such a way that I can manually trigger a plugins end event, to work around this?

Thanks!

@ScottDowne
Contributor
ScottDowne commented on 19 Nov 2014
A track event is a range between start and end times. It should be firing the end event when it leaves the range. So after the end time or before the start.

@codingisacopingstrategy
codingisacopingstrategy commented on 19 Nov 2014
OK. Thanks!

So maybe it’s due to my specific implementation that the end events do not get fired.

I have:
event 0 to 5
event 5 to 10

The driver is paused.
The page loads,

start fires at 0.

I set currentTime to 5
stop fires for event 0 to 5,
start fires for event 5 to 10

I set currentTime to 0
start fires for event 0 to 5

no stop event for 5 to 10

Is that plausible?
I’ll see if I can make a JSfiddle

@ScottDowne
Contributor
ScottDowne commented on 19 Nov 2014
Yeah the end should fire. A js fiddle would help.

@codingisacopingstrategy
codingisacopingstrategy commented on 2 Dec 2014
Sorry for not getting to the point—
I’m trying to replicate my example,

But Popcorn doesn’t seem to recognise my plugin:

http://jsfiddle.net/schr/w05vsg4q/5/

(It doesn’t recognize the 'aa' method I thought I defined)

Cheers,
Eric

UPDATE: sorry, I figured out what was I was doing wrong. Now at http://jsfiddle.net/schr/w05vsg4q/13/
Still having problems with some jQuery unrelated to Popcorn so I’ll ping when I’ve got that figured out and there’s a JSFiddle that isolates the Popcorn trouble I have!

@codingisacopingstrategy
codingisacopingstrategy commented on 24 Nov 2015
OK, almost a year later I managed to create a jsfiddle with an example.

It’s still quite a lot of code, unfortunately.
Here it is:

http://jsfiddle.net/schr/w05vsg4q/28/

There are four events.

0 to 5
5 to 10
10 to 15
15 to 20
first setting currentTime to 0 triggers start for event 1.
then setting currentTime to 5 triggers end for event 1, and start for event 2
then setting currentTime to 10 triggers end for event 2, and start for event 3
then setting currentTime to 15 triggers end for event 3 and start for event 4
However, going back from the last event:

then setting currentTime to 10 triggers start for event 3
it does not trigger end for event 4!

This problem does not happen if i go back from event 3 to event 2, or example.
It only happens with the last event.

Hope you can give me clues as to what is going on?
cheers!

Eric

@ScottDowne
Contributor
ScottDowne commented on 24 Nov 2015
Yup, I see the bug, that's not behaving how it's expected.

I think the bug is in the player, which, were replaced with media wrappers.

I edited 3 lines in your fiddle to replace it with a null wrapper which is the replacement for baseplayer.

http://jsfiddle.net/w05vsg4q/29/

Removed:

// initialise the player
Popcorn.player("baseplayer");
var driver = Popcorn.baseplayer("#timeline");
Added:

// initialise the player
var wrapper = Popcorn.HTMLNullVideoElement( "#timeline" );
// give the player element some duration info
wrapper.src = "#t=,60";
var driver = Popcorn( wrapper );
Hope null wrapper is a sufficient replacement for baseplayer for you. Baseplayer is depreciated: http://popcornjs.org/popcorn-docs/players/

@ScottDowne
Contributor
ScottDowne commented on 24 Nov 2015
Oh, I should probably add it's working as expected with the null wrapper.

@codingisacopingstrategy
codingisacopingstrategy commented on 24 Nov 2015
Wow, thanks for the quick reply—
I’ll check out if I can integrate the rest of my code with the null wrapper!

For null wrapper, do I always need to provide the duration info?
In the case of the slide show, for instance, the length is basically dynamic
dependent on the events registered.

Cheers,

@codingisacopingstrategy
codingisacopingstrategy commented on 24 Nov 2015
I found out I did need to set the length info like you do in the example, I now set it to a ridiculously long amount as a quick hack :)

@ScottDowne
Contributor
ScottDowne commented on 25 Nov 2015
What I have done in the past is check what tracks I am adding and update the time as needed.

Issue reported: mozilla#444
Reported by: @chadananda

querySelectorAll is being called with a raw id value. This will not work with HTML5 style ids which are not CSS compatible.

For example, simply using a simple numeric id (id='1') results in the error:

Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '#1 ' is not a valid selector.

An official css.escape() method is in the works
http://dev.w3.org/csswg/cssom/#the-css.escape%28%29-method

Meanwhile, Mathias Bynens has provided a polyfill:
https://github.com/mathiasbynens/CSS.escape

Issue reported: mozilla#409
Reported by: @puterleat

It's currently not possible (I think) to use the code plugin through a json data file. Peeking here:

https://github.com/mozilla/popcorn-js/blob/master/parsers/parserJSON/popcorn.parserJSON.js

It seems like the json structure is passed straight to the plugin call, so the onstart and onframe values are always going to be strings and therefore not callable. Functions aren't valid json, so it seems like the code plugin would have to be special cased to eval the string in some way?

Just to be clear, I'd like to do something like

{
  "code": {
    "start": 10,
    "onStart": "function(){alert("hello")};"
  }
},

Issue reported: mozilla#406
Reported by: @syl22-00

@syl22-00
Contributor
syl22-00 commented on 30 Jul 2014
On some versions of Firefox (30, 31 and 32, tested on Mac and Linux), the loadedmetadata event is not fired with youtube videos. It is fired correctly on Aurora (33), tested on both Mac and Linux.

@ScottDowne
Contributor
ScottDowne commented on 31 Jul 2014
Aurora fixes it? That's good news.

I was playing around with this here: https://bugzilla.mozilla.org/show_bug.cgi?id=1046388

There is a YouTube ticket on their end filed that I think is our issue.

@syl22-00 syl22-00 referenced this issue in pculture/unisubs on 31 Jul 2014
Closed
New embedder not working on some versions of Firefox #1622
@syl22-00
Contributor
syl22-00 commented on 31 Jul 2014
Thanks @ScottDowne for looking into this, this is very annoying.

Maybe the reason why it works on aurora is because it somehow forces html5?

@syl22-00
Contributor
syl22-00 commented on 31 Jul 2014
It seems like Youtube/Google has already fixed it upstream. Thanks a lot for your quick workaround

@syl22-00 syl22-00 closed this on 31 Jul 2014
@ScottDowne
Contributor
ScottDowne commented on 31 Jul 2014
Still busted for me.

@syl22-00 syl22-00 reopened this on 31 Jul 2014
@syl22-00
Contributor
syl22-00 commented on 31 Jul 2014
Sorry, you're right, it is still not working, but I am sure I saw it working earlier today.

@ilyakatz
Contributor
ilyakatz commented on 4 Dec 2014
@syl22-00 this seems to be youtube related not popcorn. last month, vimeo had the same problem, not much that popcorn can do about this, right?

Issue reported: mozilla#412
Reported by: @alien09

@alien09
alien09 commented on 7 Nov 2014
can anyone suggest ... what have to do... to add another plugin in popcorn Maker....

@ScottDowne
Contributor
ScottDowne commented on 7 Nov 2014
Popcorn Maker, as in popcorn.webmaker.org?

All plugins there are created for it, and it doesn't currently support custom plugins.

If you wanted to add a new one, you would need to open an issue on https://github.com/mozilla/popcorn.webmaker.org proposing the new plugin, then a patch with the plugin would need to be created and reviewed.

@alien09
alien09 commented on 9 Nov 2014
Thanks..

Issue posted: mozilla#200
Posted by: @aphid

Running playbackRate() on a baseplayer element returns 'undefined', and setting it doesn't seem to affect the apparent rate at which it plays.

disclaimer: i'm using CDN'd popcornjs, so sorry if this is a dupe

Issue reported: mozilla#437
Reported by: @nevetssoftware

In the wrapper HTMLSoundCloudAudioElement, in changeSrc() this call is made

SC.get( "/resolve", { url: aSrc }, function( data ) {

It would be handy if the wrapper "kept" the data so that it could be used by the calling javascript.

Thanks

Issue reported: mozilla#350
Reported by: @sreekumar-kr

@sreekumar-kr
sreekumar-kr commented on 10 Oct 2013
No description provided.

@dsbaars
dsbaars commented on 12 May 2015
This could have used some more background information when reporting, but +1 for this.

I have found some solutions to this, which are not cross-browser compatible. I will make some examples later to reproduce this with the solutions I have found.

Issue reported: mozilla#430
Reported by: @stevemao

@stevemao
Contributor
stevemao commented on 21 Jan 2015
YouTube player auto plays and pauses at the beginning. I can understand if autoplay is false but if its true , there is an obvious glitch. This is more obvious on iPad.

Reading through the source in popcorn.HTMLYouTubeVideoElement.js It forces an initial play on the video and then pause. This causes the glitch. I modified the source so the video will not pause but still running fine. What's the intentions of the play, pause and play logic if autoplay is true or its a bug?

@stevemao stevemao changed the title from YouTube player auto starts and pause at the beginning. to YouTube player auto starts and pauses at the beginning even if autoplay is true. on 21 Jan 2015
@stevemao
Contributor
stevemao commented on 21 Jan 2015
Also if autoplay is false, I think it shouldn't force a play but instead defer all events and once the video starts to play, dispatch these events. This way user will not see the initial play and pause, and can still see the initial image on the video (if letting user see the image is one of the purposes of not playing it automatically).

@ScottDowne
Contributor
ScottDowne commented on 21 Jan 2015
That's to trigger a ready state and start buffering.

Otherwise it won't buffer until the user hits play, causing a wait.

@stevemao
Contributor
stevemao commented on 21 Jan 2015
Well, if autoplay is true this does not make too much difference (only one split second wait for buffering) but a glitch.

If autoplay is false I think it would be better to let dev choose if they want the video start buffering or not.

@ScottDowne
Contributor
ScottDowne commented on 22 Jan 2015
Maybe we can attach this functionality to preload?

Example, if preload is true, it goes through the existing play/pause hack to trigger buffering, if preload is false, it waits for user interaction before buffering?

The reason for the need to reduce the wait as much as possible, even if it is a split second, is to have wrappers sequenced together and seemingly play as one clip.

I never could get YouTube working well on ios, so it never was a priority.

Also might be possible to hide the video until a loadedmetadata event is fired, then display it, hiding the glitch.

@stevemao
Contributor
stevemao commented on 22 Jan 2015
I like the preload option. +1

I'm not sure how well it works to hide the glitch. Does it hide the sound as well? Will it cause a different kind of glitch? There are too much to test I think.

@ScottDowne
Contributor
ScottDowne commented on 22 Jan 2015
Yeah sound does get muted, but youtube has sync issues with their muted event and what actually happens when it is Flash.

Come to think of it, now that YouTube has HTML5 used in most cases, which performs much better than flash back when I first wrote this hack, that the delay might not be too bad.

It used to cause a delay of 2-3 seconds when it was only Flash.

Might be worth investigating removing the hack.

@stevemao
Contributor
stevemao commented on 22 Jan 2015
+1 Makes sense

Issue reported: mozilla#429
Reported by: @apricated

@apricated
apricated commented on 20 Jan 2015
Noticing some issues with embed iframes from YouTube, when browser tries to load Flash version of YT's player (Safari on Mac; Firefox on Windows and Mac). Is there a way to force Popcorn to prefer the HTML5 player -- or a fork/plugin that does the same?

@ScottDowne
Contributor
ScottDowne commented on 20 Jan 2015
The YouTube wrapper should default to HTML5 if not explicitly told otherwise.

YouTube then falls back to flash if HTML5 is not available.

Or, that's how it should work, and if it's not, it sounds like a bug.

@apricated
apricated commented on 23 Jan 2015
@ScottDowne

Thanks for the reply.

Looked into it further, and noticed the Flash player was being invoked both when the YouTube video played successfully, and when it failed.

It's totally intermittent; the same code will work one moment, and fail the next, with no difference in output to the error console.

Could be the same as this issue:
mozilla#423

Issue posted: mozilla#323
Posted by: @warp1337

@warp1337
warp1337 commented on 27 Jun 2013
See:

http://jsfiddle.net/popcornjs/7Ku6T/1/

@kaushikgandhi
kaushikgandhi commented on 1 Oct 2013
Thats because the pop.play() gets executed before it loads from the sound cloud

I tried with setTimeOut it works fine

setTimeout(function(){
pop.play();
},9000);
http://jsfiddle.net/7Ku6T/39/

@ScottDowne
Contributor
ScottDowne commented on 1 Oct 2013
You can use a canplayall event for this.

Example: http://jsfiddle.net/7Ku6T/40/

On 1 October 2013 11:02, kaushik gandhi [email protected] wrote:

Thats because the pop.play() gets executed before it loads from the sound
cloud

I tried with setTimeOut it works fine

setTimeout(function(){
pop.play();
},9000);
http://jsfiddle.net/7Ku6T/39/

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/323#issuecomment-25457062
.

@warp1337
warp1337 commented on 1 Oct 2013
Thank you, I'll try that when I can find some spare time!

Issue reported: mozilla#453
Reported by: @kristofferwiklund

@kristofferwiklund
kristofferwiklund commented on 1 Jul 2015
I have a very simple page.

Video

On Mac and Safari the video is autoplaying as it should

I have also tried loading the video with:

document.addEventListener("DOMContentLoaded", function () {
var pop = Popcorn.youtube(
'#video',
'https://www.youtube.com/watch?v=F7HcoKv11i0' );
pop.play();
}, false);
As documented here http://popcornjs.org/popcorn-with-youtube. (Btw the demo is not working because of old version of popcornjs)

@TwoD
Contributor
TwoD commented on 9 Jul 2015
I have looked into this briefly and it appears that the YouTube plugin is getting stuck in onFirstPause, waiting for getCurrentTime() to return 0, which it never does.

There is a player.seekTo(0) in onFirstPlayed() just before the player is paused. The paused event does fire, but the current time is stuck at just a few 1/100s when it does.
Simply changing the getCurrentTime() comparison to make it > 0.2s or so will make it work reliably (autoplay, cues, seeking etc).

Stranglely enough, the problem only appears to happen when the files are fetched from the browser cache. Refreshing from the server with Ctrl+F5 made it autoplay without the change.

Issue reported: mozilla#346
Reported by: arnaudbreton

Hi,

In the Youtube Player API documentation, they mention an unstarted state (-1).

This state is triggered when playing videos part of a list, like these ones: http://www.youtube.com/watch?v=ZXrHkIz-krE&list=PLjTlxb-wKvXNSDfcKPFH2gzHGyjpeCZmJ&index=1

For the moment, the Youtube's wrapper does not trigger this state so it's impossible to catch it from the outside (except by listening to message posted by the Youtube's iFrame).

I've did it in my own version of Popcorn-JS, taking the shortest path: arnaudbreton/popcorn-js@484e9c9

I'm now wondering how to integrate it in the official version, using the cleaner solution?

Thanks for your help.

Issue posted: mozilla#284
Posted by: @taneross

taneross commented on 10 Feb 2013
I get the controls and the bar, but not the large arrow. Help?

@jbuck
Owner
jbuck commented on 10 Feb 2013
Sure, what browser are you using? Do you have some code that shows this?

@taneross
taneross commented on 14 Feb 2013
init
this.pop = Popcorn( "#ourvideo" );
this.video = this.$('#video-source');
this.video.attr("src",model.video);

the html from firebug: (github isn't showing code so I removed the "< >" on the video and source tags
video id="ourvideo" width="100%" height="auto" controls="" poster="http://www.injunuity.org/beta/backbone/images/posterimg.jpg" tabindex="0">
source id="video-source" src="http://www.injunuity.org/beta/sites/default/files/buried.webm">/source>
</video

@taneross
taneross commented on 18 Feb 2013
Im using Firefox, chrome, safari, don't have the arrow in any browser

Issue posted: mozilla#320
Posted by: @joelransom

@joelransom
joelransom commented on 23 Jun 2013
When I first started using Popcorn i had no problem using the YouTube player on iOS. The user had to press play, but otherwise everything worked.

Now, the play button does not even appear. The Popcorn.js fiddle for demonstrating the youtube player exhibits this behavior: http://jsfiddle.net/popcornjs/whvkP/

Just want to clarify if this is a bug or expected behavior/limitation.

Thanks.

@ScottDowne
Contributor
ScottDowne commented on 24 Jun 2013
It is not intended. How long ago was this breakage? Days or months?

I'm on Android atm and while it plays for me the experience is pretty choppy. The video itself has a hard time playing.

We have not changed much as far as I know on our end so I fear something may of changed in ios youtube or flash. More detective work is required.

@joelransom
joelransom commented on 24 Jun 2013
It has been this way over a month. I put a question about it on SO in May but got no bites. So I'd say it was working 2 months ago.

At the time of the SO post I also said "The video will start to load, you can see the title, but then instead of a prominent "Play" button you get a black screen with a miniscule white dot in the center. If you press that barely visible dot the video will play and the popcorn code will execute fine."I don't seem to be able to start it at all now, perhaps that is intermittent.

I don't believe I've updated my popcorn.js libraries, so I tend to agree that something may have changed on their end. I'm running 1.3 if that helps any.

Thanks,

Joel

@mindmelting
Contributor
mindmelting commented on 23 Aug 2013
I am also seeing this behaviour...

@ckng
ckng commented on 24 Sep 2013
Using 1.4, Youtube player not working under iOS Chrome/Safari.

So are Popcorn Youtube and Popcorn 101.

@ScottDowne
Contributor
ScottDowne commented on 24 Sep 2013
I'm going to look into this.

It seems the YouTube API auto plays on first interaction, like a seek. So
if the first thing the player does is a seek, it is going to autoplay. It
also doesn't start to load until the play. The YouTube wrapper popcorn uses
tries to be HTML5 like as much as it can, so this autoplay "feature" needs
to be triggered and done with in order to get to that HTML5 feel.

Autoplay on first seek filed with YouTube for more info:
http://code.google.com/p/gdata-issues/issues/detail?id=2916&can=1&q=reporter%3Ascott.downe%40gmail.com&colspec=API%20ID%20Type%20Status%20Priority%20Stars%20Summary

This autoplay is removed using a play/pause call before we fire the ready
event. That play/pause is not going to work on mobile, it has to be a user
interacted play, and not an API play.

It is still doable, and we probably need to make a special case for iOs.

Oddly enough, works in FF mobile on android.

Also, I keep fighting with issues like this and YouTube. It keeps coming
back to the fact that YouTube is optimized for straight, user interacted
playthrough, not API calls. The API is secondary.

The above ticket is a good example of this. Playing on first seek makes a
lot of sense for UI/UX point of view. If a user clicks seek on the YouTube
player they likely want to play shortly after. However, that kind of
feature should be moved into the controls play button, and not the API
itself. The play button should and can handle this, and the API should do
exactly what I asked it to do, and no more. You can see their point of
view, but you can also see how they don't get the API point of view by
their comment in the ticket. "I don't understand the use case for needing
to call seekTo() on an unstarted player" UI and API is the same thing to
them.

So, if we need to hit play before we're ready, but we need to be ready
before we hit play, we have the bug above.

I'm fairly sure this can be fixed, just saying why it does what it does, by
looking at the code. A fix would need to consider desktop too, and work
around this somehow.

I would rather not have to wait for interaction before loading by default
on desktop, it already takes long enough.

Whew, sorry for the wall of text, but it's a complex problem.

Filed it here: https://bugzilla.mozilla.org/show_bug.cgi?id=920103

On 24 September 2013 11:51, CK Ng [email protected] wrote:

Using 1.4, Youtube player not working under iOS Chrome/Safari.

So are Popcorn Youtube http://popcornjs.org/popcorn-with-youtube and Popcorn
101 http://popcornjs.org/popcorn-101.

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/320#issuecomment-25017187
.

@joelransom
joelransom commented on 24 Sep 2013
Thanks for the update Scott. If I can help in any way let me know.

—
Sent from Mailbox for iPhone

On Tue, Sep 24, 2013 at 9:41 AM, ScottDowne [email protected]
wrote:

I'm going to look into this.
It seems the YouTube API auto plays on first interaction, like a seek. So
if the first thing the player does is a seek, it is going to autoplay. It
also doesn't start to load until the play. The YouTube wrapper popcorn uses
tries to be HTML5 like as much as it can, so this autoplay "feature" needs
to be triggered and done with in order to get to that HTML5 feel.
Autoplay on first seek filed with YouTube for more info:
http://code.google.com/p/gdata-issues/issues/detail?id=2916&can=1&q=reporter%3Ascott.downe%40gmail.com&colspec=API%20ID%20Type%20Status%20Priority%20Stars%20Summary
This autoplay is removed using a play/pause call before we fire the ready
event. That play/pause is not going to work on mobile, it has to be a user
interacted play, and not an API play.
It is still doable, and we probably need to make a special case for iOs.
Oddly enough, works in FF mobile on android.
Also, I keep fighting with issues like this and YouTube. It keeps coming
back to the fact that YouTube is optimized for straight, user interacted
playthrough, not API calls. The API is secondary.
The above ticket is a good example of this. Playing on first seek makes a
lot of sense for UI/UX point of view. If a user clicks seek on the YouTube
player they likely want to play shortly after. However, that kind of
feature should be moved into the controls play button, and not the API
itself. The play button should and can handle this, and the API should do
exactly what I asked it to do, and no more. You can see their point of
view, but you can also see how they don't get the API point of view by
their comment in the ticket. "I don't understand the use case for needing
to call seekTo() on an unstarted player" UI and API is the same thing to
them.
So, if we need to hit play before we're ready, but we need to be ready
before we hit play, we have the bug above.
I'm fairly sure this can be fixed, just saying why it does what it does, by
looking at the code. A fix would need to consider desktop too, and work
around this somehow.
I would rather not have to wait for interaction before loading by default
on desktop, it already takes long enough.
Whew, sorry for the wall of text, but it's a complex problem.
Filed it here: https://bugzilla.mozilla.org/show_bug.cgi?id=920103
On 24 September 2013 11:51, CK Ng [email protected] wrote:

Using 1.4, Youtube player not working under iOS Chrome/Safari.

So are Popcorn Youtube http://popcornjs.org/popcorn-with-youtube and Popcorn
101 http://popcornjs.org/popcorn-101.

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/320#issuecomment-25017187
.

Reply to this email directly or view it on GitHub:
mozilla#320 (comment)

@haksudol haksudol referenced this issue in anbadovideo/anbado-video on 14 Nov 2013
Closed
On mobile environment, youtube and vimeo video could not be played #25
@wsl
wsl commented on 21 Dec 2013
It's indeed the autoplay which breaks it on ipad.

In the

/popcorn-js/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js

in the onPlayerReady function (around line 108) some tricks are done for autoseek & mute for initial loading. The player.playVideo(); in that function breaks it for the iPad because the youtube API does not allow autoplay on iPad. It should always start with a user interaction

If you comment the player.playVideo(); line it works (for me).

http://stackoverflow.com/questions/16661217/popcorn-js-on-mobile-browser-youtube-play-button-does-not-appear

@ScottDowne
Contributor
ScottDowne commented on 21 Dec 2013
The only thing it is going to break is preload and autoplay. Some desktop
apps require this.

I wonder if we can just turn off that initial play by setting up a
preload=none, and from there force preload to be none on a mobile app. It
won't fix iphone but it'll fix ipad.

On 20 December 2013 20:54, Wessel [email protected] wrote:

It's indeed the autoplay which breaks it on ipad.

In the

/popcorn-js/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js

in the onPlayerReady function (around line 108) some tricks are done for
autoseek & mute for initial loading. The player.playVideo(); in that
function breaks it for the iPad because the youtube API does not allow
autoplay on iPad. It should always start with a user interaction

If you comment the player.playVideo(); line it works (for me).

http://stackoverflow.com/questions/16661217/popcorn-js-on-mobile-browser-youtube-play-button-does-not-appear

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/320#issuecomment-31054108
.

@wsl
wsl commented on 2 Jan 2014
Removing this player.playVideo(); also breaks the play() function (because the mediaReady is not set because the preload is not done). So should only be done when autoplay is not possible.

I'm looking into: http://stackoverflow.com/a/17836886/273143
for feature detection of the autoplay function. Or you do think iOS detection sufficient?

This http://stackoverflow.com/q/7120703/273143 also describes a nice hack in the first update: create a small initialization video with just a play button and if that has been started iOS seems to accept that as enabling the youtube API.

This last trick is usable for me but I can imagine it's too specific for popcornjs.

@ScottDowne
Contributor
ScottDowne commented on 3 Jan 2014
Hm, maybe we leave the feature detection or browser detection up to the
code controlling popcorn, and just have that be passed to the youtube
wrapper? So, have the code controlling popcorn figure it out, and then
enable or disable autoplay via some sort of config?

On 2 January 2014 16:32, Wessel Louwris [email protected] wrote:

Removing this player.playVideo(); also breaks the play() function (because
the mediaReady is not set because the preload is not done). So should only
be done when autoplay is not possible.

I'm looking into: http://stackoverflow.com/a/17836886/273143
for feature detection of the autoplay function. Or you do think iOS
detection sufficient?

This http://stackoverflow.com/q/7120703/273143 also describes a nice hack
in the first update: create a small initialization video with just a play
button and if that has been started iOS seems to accept that as enabling
the youtube API.

This last trick is usable for me but I can imagine it's too specific for
popcornjs.

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/320#issuecomment-31486510
.

@xangadix
xangadix commented on 17 Apr 2014
for completeness I would add:
if ( navigator.userAgent.toLowerCase().indexOf("ipad") == -1 ) player.playVideo()

With a code comment, and/or a link to this thread, this fixes the bug for 99% of the users, and instructs any developer on the how and why of this addition.

I've just tested it again and behaviour on ipad is now in agreement with Apple TOS. Apple won't allow preloading or autoplay of video, now a user has to click to 'enable' the video, and then the popcorn wrapper takes over. That is to say, for any video without autoplay, the user has to click again on play. This may seem weird from a usability standpoint, but is exactly how it should be according to apple tos.

@jtomaszewski
jtomaszewski commented on 18 Apr 2015
Seems like we have to forget about .play() method when running play for the first time - user has to click on the youtube's applet on its' own to make it play.

Also, we've got an autoplay bug here: this line forces the youtube video to be autoplayed, so instead of seeing youtube's image with 'play icon', we'll just see a dark background (thus, the user has no idea that he should click on it to make it play).

My solution:

comment this line with if (!navigator.userAgent.match(/(iPad|iPhone|iPod)/g)) conditional
force the user to actually click the 'youtube' applet to make it play
Propably i'll have to do the same workarounds in other wrappers (f.e. soundcloud).

@xangadix
xangadix commented on 26 Apr 2015
Hey Jacek,

Couldn't agree more, in my own fork I've forced this behavior on all
players to keep it consistent for my clients, haven't had a complaint about
it since. Also, make sure to hide any and all custom controls you might
have. I've noticed that my users tend to press the play button under the
video first, not noticing the big red youtube play button. So now I fade in
the controls after the youtube video is 'activated' and actually works. (
top of my head; that is the "videoloaded" callback )

cheers.
Daan

On Sat, Apr 18, 2015 at 1:37 PM, Jacek Tomaszewski <[email protected]

wrote:

Seems like we have to forget about .play() method when running play for
the first time - user has to click on the youtube's applet on its' own to
make it play.

Also, we've got an autoplay bug here: this line
https://github.com/mozilla/popcorn-js/blob/master/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js#L122
forces the youtube video to be autoplayed, so instead of seeing youtube's
image with 'play icon', we'll just see a dark background (thus, the user
has no idea that he should click on it to make it play).

My solution:

comment this line
https://github.com/mozilla/popcorn-js/blob/master/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js#L122
with if (!navigator.userAgent.match(/(iPad|iPhone|iPod)/g)) conditional
force the user to actually click the 'youtube' applet to make it play
—
Reply to this email directly or view it on GitHub
mozilla#320 (comment).

@jtomaszewski
jtomaszewski commented on 30 May 2015
I noticed the same problem appears on Android 5 (Lollipop)... anybode else encountered it too? I had to to changed my regexpes to if (!navigator.userAgent.match(/(iPad|iPhone|iPod|Android 5)/g)) , to fix it.

jtomaszewski added a commit to jtomaszewski/popcorn-js that referenced this issue on 11 Jun 2015
@jtomaszewski
Don't automatically trigger .play() in Soundcloud/Youtube elements, i… …
37604f9
@jtomaszewski
jtomaszewski commented on 11 Jun 2015
I've fixed it in youtube & soundcloud elements in jtomaszewski/popcorn-js@37604f9 . Propably similar fix is needed for other elements, like vimeo for example.

It works correctly right now. Remeber to set popcorn.autoplay = false;.

Tests are missing unfortunately atm. Maybe someone wants to create a pull request , also with tests?

Issue reported: mozilla#451
Reported by: @djvs

@djvs
djvs commented on 22 Jun 2015
This patch was manually added into current stable popcorn-complete.js (to mimic future popcorn-complete releases):

https://github.com/mozilla/popcorn-js/pull/441/files?diff=split

such that Vimeo and YouTube methods all work (Popcorn.youtube, Popcorn.HTMLYoutubeVideoElement, etc.). Player starts and stops correctly on click. However, all video controls are missing, and calling popcorn.controls(true) has no effect, for:

        // "vidid", "vidurl", "elemid" all valid
        var vidurl = "http://player.vimeo.com/video/" + vidid;
        var player = new Popcorn.HTMLVimeoVideoElement("#"+elemid);
        player.src = vidurl;
        player = new Popcorn(player);
        player.controls(true);

Going into inspector and manually adding "controls" attribute to the video element inside the iframe does, however, enable the controls. Shouldn't adding it be a fallback for these wrappers or something similar? My only alternative is DOM manipulation inside the iframe...

Issue reported: mozilla#427
Reported by: @apricated

@apricated
apricated commented on 30 Dec 2014
I have a designated #player element on a page, and can load media into it via a Popcorn instance. However, if I wanted to load media from another source (and replace the old media with it), what would be the most efficient way to do that?

Some background:
I've experimented with the src attribute and load method for the Popcorn instance, but couldn't get this to work. I then tried a combination of clearing the children of the #player element (which removes the iframe/player appended from YouTube, Soundcloud, etc.), and running a destroy method on the Popcorn instance; but this is resulting in constant barrage of errors in the console, saying:

Uncaught TypeError: Cannot read property 'postMessage' of null

Can I reuse a Popcorn Smart Media Wrapper, or is there some other method than what I've tried which is more efficient and less error prone?

@socialtechno
socialtechno commented on 30 Dec 2014
I find @brianchirls Inception plugin very useful for that, but I have not tried it with the smart wrapper. https://github.com/brianchirls/popcorn-inception

Issue reported: mozilla#452
Reported by: @cvcmatthewmorgan

I understand that this might be a continuation to mozilla#430 but I felt this was a separate issue to do with the same section of code.

I am happy to contribute a pull request to fix the issue along with mozilla#430 but would like to discuss workflow here first.

Given the use of the following code, the start time is ignored.

document.addEventListener("DOMContentLoaded", function() {
var popcorn = Popcorn.smart("#video", "http://www.youtube.com/watch?v=eTKs27KcL00&t=10s");
}, false);
In the middle of onFirstPlay() there is a line that resets the video back to 0 which causes this to occur.

Suggested changes:

onFirstPlay() makes use of the start or t player variables instead of always going to 0.
onFirstPlay() should be triggered if player.seekTo() is going to be triggered or if preload() is required.
onFirstPlay() should not pause if autoplay is true.

Issue posted: mozilla#318
Posted by: @nilsel

Using this code:
<video data-timeline-sources="subs.ttml" ...>
gives:
TypeError: 'null' is not an object (evaluating 'source.match( /(.*)/$/ )[ 2 ]')
in popcorn-complete.js:2794

Changing data-timeline-sources to "./subs.ttml" seems to work, not a critical bug in my book :).

Just came across popcorn-js after a few days searching for something to handle ttml-subtitles without using flash, this looks promising!

Issue reported: mozilla#349
Reported by: @rockingskier

@rockingskier
rockingskier commented on 2 Oct 2013
When the Vimeo video is password protected the player is created but with Vimeo's password overlay (as you'd want). However no events are fired either before or after entering the password.

I have tried most events and none of them fire.

As an example I have Big Buck Bunny hidden behind a password.

Enter password: hippo
See no events firing
Press play
Still no events
Re-run fiddle
See 'durationchange' is fired
Press play
Lots of 'timeupdate' events
(Posted on SO as well)

@ScottDowne
Contributor
ScottDowne commented on 3 Oct 2013
This is a bug, and an unexpected use case.

What happens is normally popcorn waits for the video to be ready and sets
up needed data to connect with the video, including events.

What I think in the case of the password protected video, the video does
not register any events to popcorn, including ready, until the password is
entered, but I suspect by the time the password is entered, the needed
vimeo events, like ready and duration change, have already been fired and
missed because they were blocked by the password. Because we never got a
ready event, we never setup any other events.

Once the password has been entered once, refreshing the page caches the
password and everything works. Something to look into.

I suspect this is fixable.

On 2 October 2013 11:47, Ben [email protected] wrote:

When the Vimeo video is password protected the player is created but with
Vimeo's password overlay (as you'd want). However no events are fired
either before or after entering the password.

I have tried most events and none of them fire.

As an example I have Big Buck Bunnyhttp://jsfiddle.net/rockingskier/7hXCd/5/hidden behind a password.

Enter password: hippo
See no events firing
Press play
Still no events
Re-run fiddle
See 'durationchange' is fired
Press play
Lots of 'timeupdate' events
(Posted on SOhttp://stackoverflow.com/questions/19133840/popcornjs-password-protected-vimeo-video-events-not-firedas well)

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/349
.

Issue reported: mozilla#355
Reported by: @vadim-bulochnik

Hi!

I'm using popcorn null wrapper and in IE10 custom events may not be triggered in case calling play() from click event.

It sounds strange, but please check my example here: http://fiddle.jshell.net/vadim_bulochnik/7wtRL/2/show/

You can see that in IE10 only 'play' event fires, while in all other browsers 'timeupdate' event also fires (and in IE11 also ok).
I've tried to debug this issue and found that sometimes IE10 just ignores document.dispatchEvent() in popcorn._MediaElementProto.js on line 120.

After googling I found that seems this is a known bug:
http://connect.microsoft.com/IE/feedback/details/786395/dispatchevent-doesnt-trigger-click-when-called-from-on-click-reactivated
http://connect.microsoft.com/IE/feedback/details/802397/ie9-ie10-events-can-be-sent-to-the-wrong-listeners

Have you ever experienced a similar problem? Maybe there is a workaround?

Thanks!
Vadim

Issue reported: mozilla#445
Reported by: @shubsengupta

@shubsengupta
shubsengupta commented on 4 Jun 2015
Popcorn JS is not working with YouTube video
http://jsfiddle.net/pakf2sta/
EDIT: Following new style
http://jsfiddle.net/qrnbor9m/1/

Could be in reference to mozilla#440?

@shubsengupta
shubsengupta commented on 4 Jun 2015
Issue resolved with mozilla#441

Issue reported: mozilla#439
Reported by: @ryandang

popcorn.on("error") event doesn't trigger when there are more than 1 bad video source
http://jsfiddle.net/RyanDang/5cpzqcmq/

Issue reported: mozilla#433
Reported by: @zang

there's a high demand for popcorn js to work with videojs. I am wondering if you have is on the roadmap.

Thanks in advanced,
Lucy

Issue reported: mozilla#378
Reported by: @binarykitchen

@binarykitchen
binarykitchen commented on 5 Feb 2014
I wonder if it's easy to style the video players easily with CSS on popcorn-js?

Most 3d party video players like videojs place new div elements for the control bar, the play button etc so that it becomes easier to syle.

Does popcorn-js have/allow this?

@binarykitchen
binarykitchen commented on 5 Feb 2014
Or it is safe to wrap the popcorn video player with another video player library like videojs?

@ScottDowne
Contributor
ScottDowne commented on 5 Feb 2014
Yeah it should work with videojs, something else, or your own custom
controls.
On 2014-02-05 1:15 AM, "Michael Heuberger" [email protected] wrote:

Or it is safe to wrap the popcorn video player with another video player
library like videojs?

Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/378#issuecomment-34140515
.

@binarykitchen
binarykitchen commented on 5 Feb 2014
Thanks! Have you tried with own custom controls yet?

@ScottDowne
Contributor
ScottDowne commented on 5 Feb 2014
The controls use in popcorn.webmaker.org are custom. You'll see them after
publishing a project. While it would be possible to use them they are
designed with popcorn.webmaker in mind.
On 2014-02-05 7:36 AM, "Michael Heuberger" [email protected] wrote:

Thanks! Have you tried with own custom controls yet?

Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/378#issuecomment-34161886
.

@binarykitchen
binarykitchen commented on 5 Feb 2014
Hmmm... interesting, thanks.

But how come nobody has tried to add stylish controls yet for such a big project?

@ScottDowne
Contributor
ScottDowne commented on 5 Feb 2014
Popcorn.js itself currently doesn't set out to solve the problem of custom
controls, because others have solved that. I can see a lot of value in
making it as easy as possible to use other controls plugins, so if you find
it hard to use videojs or others, that's something we can fix.

On 5 February 2014 07:54, Michael Heuberger [email protected]:

Hmmm... interesting, thanks.

But how come nobody has tried to add stylish controls yet for such a big
project?

Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/378#issuecomment-34162938
.

@binarykitchen
binarykitchen commented on 6 Feb 2014
I see and that makes sense. But it might be dangerous using 3rd party libraries like videojs because they can mess up with the event handling. When popcorn listens to i.E. play events and videojs is manipulating these, then things can go wrong ... I need some kind of assurance that both go well together.

Issue reported: mozilla#345
Reported by: @MarkMurphy

On line 535 of the downloadable uncompressed version of popcorn.js Popcorn.util.toSeconds does not pass this.options.frameRate as a second argument.

The same is true for line 594 of the exec method.

EDIT: There are actually multiple calls to the toSeconds method from within popcorn where it doesn't pass the frameRate option and in addition to that, there are places where "framerate" is used instead of "frameRate"

Issue reported: mozilla#440
Reported by: @syl22-00

@syl22-00
Contributor
syl22-00 commented on 7 May 2015
Currently, calls to duration() always return 236 seconds on any Youtube video. This is what the call to the Youtube data API returns. The version 2 of the Youtube data API is deprecated, it should not be used anymore.

@syl22-00 syl22-00 referenced this issue on 7 May 2015
Merged
Removed dependency on deprecated Youtube data API v2. mozilla#441
@RushabhJoshi
RushabhJoshi commented on 13 May 2015
When/where can I get popcorn-complete.min.js ?
Thanks in advance.

@syl22-00
Contributor
syl22-00 commented on 13 May 2015
Once you compile, it's in the dist/ folder.

Issue posted: mozilla#238
Posted by: @thomasmery

Hi,

I am having trouble understanding how width and height are set on a Vimeo video element instance

the code in the wrapper tries to get the width and height from the parent element (a div in my case)

but I could only get it working when setting dimensions as inline styles and replacing line 79 and 80 with :

width: parseInt(parent.style.width)|0 ? parseInt(parent.style.width) : MIN_WIDTH,
height: parseInt(parent.style.height)|0 ? parseInt(parent.style.height) : MIN_HEIGHT,

Also I could not set a width or height in the options when creating the player

I am probably doing something wrong but would lova a little help

thnks

Issue reported: mozilla#370
Reported by: @anabelle

@anabelle
anabelle commented on 15 Jan 2014
I have created a simple sequence of videos using popcorn.js following the documentation: http://popcornjs.org/popcorn-docs/modules/#sequence

I need the sequence to loop after ending so I added a listener like:

function playsequence(){
sequence.play();
}
sequence.listen( 'canplaythrough', playsequence );
sequence.listen( 'ended', playsequence );
The thing is that when the sequence ends, the last video is repeated once and then it stops.

Any idea on how could I get a loop for the entire sequence?

@ScottDowne
Contributor
ScottDowne commented on 16 Jan 2014
I would recommend using the sequencer plugin that popcorn.webmaker.org uses.

You can find an example here:
https://github.com/mozilla/popcorn.webmaker.org/blob/master/public/templates/assets/plugins/sequencer/popcorn.sequencer.html

On 15 January 2014 16:29, Anabelle Handdoek [email protected]:

I have created a simple sequence of videos using popcorn.js following the
documentation: http://popcornjs.org/popcorn-docs/modules/#sequence

I need the sequence to loop after ending so I added a listener like:

function playsequence(){
sequence.play();
}
sequence.listen( 'canplaythrough', playsequence );
sequence.listen( 'ended', playsequence );

The thing is that when the sequence ends, the last video is repeated once
and then it stops.

Any idea on how could I get a loop for the entire sequence?

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/370
.

@anabelle
anabelle commented on 16 Jan 2014
I've been looking at sequencer but I can't find good documentation.

I managed to do it using sequence like this:

clips = [
{
src: "/video/720_1.mp4",
in: 0,
out: videos_duracion
},
{
src: "/video/720_2.mp4",
in: 0,
out: videos_duracion
}
];

loop = 0;
function init(){
if( typeof sequence != "undefined" ){
sequence.remove();
}
sequence = Popcorn.sequence(
"broadcast",
clips
);
sequence.listen( 'canplaythrough', sequence.play() );
sequence.listen( 'ended', init );
console.log( loop );
loop = loop+1;
}

init();
It seems to be working fine, although it sometimes stops randomly after several repetitions without throwing any error.

Issue posted: mozilla#248
Posted by: @gfranko

When using the popcorn.js code plugin, is it possible to pass more than one start/end rule object? I realize I could very easily call the code() method as many times as I needed, but I just wanted to see if there was already an elegant way to handle this.

The documentation shows how to use one rule like this:

var pop = Popcorn( "#video" );

pop.code({
    start: 1,
    end: 3,
    onStart: function( options ) {
        document.getElementById( "test1" ).innerHTML = "Yes";
    },
    onEnd: function( options ) {
        document.getElementById( "test1" ).innerHTML = "No";
    }
});

Thanks!

Issue reported: mozilla#436
Reported by: @Realmaker

Hi,
how can I add an prev and next Button to navigate through the different events? The video should move there also. Is this possible?

Issue reported: mozilla#417
Reported by: @scottgarner

@scottgarner
scottgarner commented on 21 Nov 2014
A formerly working Popcorn instance created with HTMLVimeoVideoElement is now totally unresponsive (can't play, won't trigger events), but doesn't throw errors. I'm wondering if Vimeo just pushed a player update that broke something?

When running the HTMLVimeoVideoElement Tests, I don't get past T02, which times out.

Here's my info from the test: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.62 Safari/537.36

I also tested in Chrome and Safari. The Youtube wrapper seems to work fine.

@JohannesHoppe
JohannesHoppe commented on 21 Nov 2014
I'm experiencing the same issue! :-(

@rfernand
rfernand commented on 21 Nov 2014
Same problem here. The play call and the triggers doesn't work. Tried with popcorn-complete.js version 1.3 and then with version 1.5.6.

@scottgarner scottgarner referenced this issue in processing/Processing-Hour-Of-Code on 22 Nov 2014
Closed
Vimeo Player Issues #69
@rjmacarthy
rjmacarthy commented on 22 Nov 2014
I am having the same issues, I assume that vimeo have changed something which is causing the triggers not to work now. Is there any chance that this can be fixed? It appeared to break about two days ago, as I was testing and developing with Vimeo videos the day before...

Thanks.

@scottgarner
scottgarner commented on 22 Nov 2014
Yes, it died for me on the 20th in the middle of working on a project. Looks like the current player version is dated to the 17th, but who knows when they pushed it into production.

https://f.vimeocdn.com/p/2.5.21/js/player.js

The previous version is still up, too, but it's hard to compare them because the minify variables have changed.

@scottgarner
scottgarner commented on 22 Nov 2014
Okay, after some digging it looks like the whole problem is with the player_id sent to identify the player.

Apparently if this id is numeric, the new Vimeo player doesn't return it properly. A quick fix is to use the prefix argument for popcorn.guid() in the Vimeo wrapper code:

playerUID = Popcorn.guid(),

becomes

playerUID = Popcorn.guid("player_"),

@scottgarner scottgarner referenced this issue on 22 Nov 2014
Open
Prefix player_id in Vimeo wrapper to work around bug in current player mozilla#418
@bytebrain
bytebrain commented on 24 Nov 2014
Your patch is not working for me? I'm having the same issues.

@rjmacarthy
rjmacarthy commented on 24 Nov 2014
This worked for me, I have tested it today.

Line 5289 - popcorn-complete.js

Change :

playerUID = Popcorn.guid(),
To:

playerUID = Popcorn.guid("player_"),
If you are using a wrapper, then change the line inside the Vimeo wrapper section.

@bytebrain
bytebrain commented on 24 Nov 2014
The underscore was missing indeed :) Thanks!

@JohannesHoppe
JohannesHoppe commented on 24 Nov 2014
Many thanks, the fix works f0r me! :-)

@tdurand
tdurand commented on 25 Nov 2014
well done !

@atommyb
atommyb commented on 25 Nov 2014
+1 - works for me too.

@OCannings
OCannings commented on 25 Nov 2014
+1 fixes the issue for me

Issue posted: mozilla#305
Posted by: @jondot

@jondot
jondot commented on 26 Mar 2013
Hi,
Looks like Chrome beta (possibly non-beta too) not playing via the #play() interface.

To reproduce, hook remote debugging to your mobile device, and within Chrome Beta, go to http://popcornjs.org and issue a Popcorn('#video').play() in the Javascript Console on your desktop (which is remote debugging the mobile Chrome).

Nothing will happen.

Thanks.

@rwaldron
Contributor
rwaldron commented on 26 Mar 2013
My lazy, unconfirmed answer would be that browsers on mobile devices
require "human opt-in" to playback HTML5 media and fail silently when api
calls are made.

(Now I'm going to set this up and test)

Rick

On Tue, Mar 26, 2013 at 11:34 AM, Dotan J. Nahum
[email protected]:

Hi,
Looks like Chrome beta (possibly non-beta too) not playing via the #play()
interface.

To reproduce, hook remote debugging to your mobile device, and within
Chrome Beta, go to http://popcornjs.org and issue a
Popcorn('#video').play() in the Javascript Console on your desktop (which
is remote debugging the mobile Chrome).

Nothing will happen.

Thanks.

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/305
.

@jondot
jondot commented on 26 Mar 2013
I think you're right. Though I thought this only includes 'autoplay' to avoid unattended battery drain and not explicit Javascript calls.
Thanks in any case

@rwaldron
Contributor
rwaldron commented on 27 Mar 2013
On Tuesday, March 26, 2013, Dotan J. Nahum wrote:

I think you're right. Though I thought this only includes 'autoplay' to
avoid unattended battery drain and not explicit Javascript calls.
Thanks in any case

Explicit JavaScript calls would allow a side channel autoplay

Rick

—

Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/305#issuecomment-15488327
.

Issue reported: mozilla#434
Reported by: @jtomaszewski

@jtomaszewski
jtomaszewski commented on 5 Mar 2015
Currently we have function destroyPlayer() { ... } methods in every wrapper like soundcloud/youtube, but they are hidden in private scope and can't be called manually. Thus, if I want to f.e. destroy my soundcloud wrapper and to create youtube wrapper, I will receive Uncaught TypeError: Cannot read property 'postMessage' of null errors, because callbacks haven't been removed (similar to mozilla#427).

Simple adding of self.destroy = destroyPlayer; line to popcorn.HTMLYouTubeVideoElement.js and popcorn.HTMLSoundCloudAudioElement.js solves the problem.

I can make a pull request for that, but I'd want to be sure, that it's the best way to do it?

jtomaszewski added a commit to jtomaszewski/popcorn-js that referenced this issue on 11 Jun 2015
@jtomaszewski
Add .destroy() method to media wrappers (mozilla#434)
3e44144
@jtomaszewski
jtomaszewski commented on 11 Jun 2015
I added .destroy() method to all media wrappers in jtomaszewski/popcorn-js@3e44144 .

IMHO it's okay to merge. Optionally, we could add a common test case for all wrappers.

Issue reported: mozilla#438
Reported by: @RushabhJoshi

popcorn smart
vimeo link not working

https://vimeo.com/channels/staffpicks/68768275

Issue reported: mozilla#443
Reported by: @JpEncausse

@JpEncausse
JpEncausse commented on 28 May 2015
Hi,
I have a GUI like popcorn webmaker to display events on a track. I add events with the folowing code:

popcorn.myplugin({ start: 1, end: 2, duration: 1, custiom: 'x' });
What is the proper way to clear this event or all events when my GUI update the start / end ? I assume clearing popcorn.data.trackEvents is not enought :-)

Should I provide an Id ? If yes I assume it should be something like myInternalId + '_' + start ?

Regards,
Jp

@JpEncausse JpEncausse referenced this issue in mozilla/popcorn.webmaker.org on 30 May 2015
Closed
Proper way to update TrackEvents ? #609
@mjschranz
Contributor
mjschranz commented on 18 Jun 2015
If you want to remove all trackEvents period you will need to simply loop over them and call popcorn.removeTrackEvent( trackEvent._id ). You can provide your own ID when creating a plugin in the format of p.myplugin({ id; 'asdf' })

Clearing popcorn.data.trackEvents is generally speaking a bad idea.

Issue reported: mozilla#428
Reported by: @socialtechno

Can anyone explain why the googlemaps plugin does not work on http://popcornjs.org/googlemaps (or in any environment I create myself?)

Issue reported: mozilla#423
Reported by: @shubsengupta

@shubsengupta
shubsengupta commented on 14 Dec 2014
Trying to use Popcorn.js with a YouTube video in Safari, however it doesn't seem to be working. Was fine up until about a week ago, but not sure if something in the YouTube API changed that broke this. Seems to be working fine in Chrome/Firefox, and also working fine across all the major browsers with a Vimeo video.

@ilyakatz
Contributor
ilyakatz commented on 23 Dec 2014
Works over here. Over the past few months i've noticed that Vimeo/Youtube have stopped working at random times.

Issue reported: mozilla#408
Reported by: @thomasfredericks

Google maps tweening with hard coded locations does not work as can be seen in map4 (fith map from left). Also, that specific googlemap throws this error :
Uncaught TypeError: Cannot read property 'spherical' of undefined popcorn.googlemap.js:237tween popcorn.googlemap.js:237isMapSetup popcorn.googlemap.js:347(anonymous function)

Issue posted: mozilla#322
Posted by: @vadim-bulochnik

@vadim-bulochnik
vadim-bulochnik commented on 26 Jun 2013
Hi there!

First of all, sorry, because I posted the same ticket at Lighthouse. But I can't find it in the tickets list, so I decided to re-post this issue here.

When using popcorn.js 1.3 with baseplayer all binded events doesn't fires again in case seeking backward.
You can check example here: http://jsfiddle.net/vadim_bulochnik/VNPDc/

Thanks!
Vadim

@ScottDowne
Contributor
ScottDowne commented on 2 Jul 2013
We've fixed this in a move to new media wrappers to replace players.

The null wrapper is what you want. Source code is here:
https://github.com/mozilla/popcorn-js/blob/master/wrappers/null/popcorn.HTMLNullVideoElement.js

You'll also want to update your popcorn.js to be like what is in here:
https://github.com/mozilla/popcorn-js

This is stuff we've done after 1.3 that has not yet been made into an
official 1.4. Most of the recent changes between 1.3 and 1.4 relate to
players and wrappers.

If memory serves me, you'll want to include these files:

Then you can create a null media by just doing "var popcorn =
Popcorn.smart("#id", "#t=,100");" With 100 being in second the duration you
want your null media to be.

Let me know if you have any issues or more questions!

Scott

On 26 June 2013 05:32, vadim-bulochnik [email protected] wrote:

Hi there!

First of all, sorry, because I posted the same ticket at Lighthouse. But I
can't find it in the tickets list, so I decided to re-post this issue here.

When using popcorn.js 1.3 with baseplayer all binded events doesn't fires
again in case seeking backward.
You can check example here: http://jsfiddle.net/vadim_bulochnik/VNPDc/

Thanks!
Vadim

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/322
.

@vadim-bulochnik
vadim-bulochnik commented on 4 Jul 2013
Hi Scott,

Thank you very much, it works now!

Just a couple notices, because I don't really know if it is expected behaviours or bugs:

method duration() always returns NaN
method emit() not works at all, but I see no errors
And also one question: is it possible to set duration via option (after popcorn instance already created)?

And again thanks to all team for the cool library and great support!

Best regards,
Vadim

@ScottDowne
Contributor
ScottDowne commented on 4 Jul 2013
Hi Vadim

Glad it helped :)

Duration and emit should work, so sounds like a bug. I'll look into it. Do
you have some code samples that demonstrate this handy?

We currently don't support dynamic duration changes. In Popcorn Maker we
handled this by creating a new popcorn instance and importing any of the
track events from the previous one. We have a bug filed on this but it's
not the easiest fix.

Thanks,
Scott

On 4 July 2013 04:06, vadim-bulochnik [email protected] wrote:

Hi Scott,

Thank you very much, it works now!

Just a couple notices, because I don't really know if it is expected
behaviours or bugs:

method duration() always returns NaN
method emit() not works at all, but I see no errors
And also one question: is it possible to set duration via option (after
popcorn instance already created)?

And again thanks to all team for the cool library and great support!

Best regards,
Vadim

—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/322#issuecomment-20464157
.

@vadim-bulochnik
vadim-bulochnik commented on 5 Jul 2013
Hi Scott,

Here is the example: http://jsfiddle.net/vadim_bulochnik/9t7WK/6/
But duration() now works ok, don't know why didn't work before, maybe some kind of magic :)

And I absolutely understand about complex dynamic duration change functionality, so I will use instance cloning for now.

Thank you!
Vadim

Issue reported: mozilla#348
Reported by: @webnard

@webnard
webnard commented on 1 Oct 2013
I have some plugins that I'm trying to have as precise as possible. Changing to frameAnimation: true improved precision, and it Google Chrome it works perfectly.* In Firefox, the timing is at least a tenth of a second off. When dealing with certain things like muting specific words within a sentence, this can make or break the application.

or at least well enough to be indistinguishable from perfect timing
@ScottDowne
Contributor
ScottDowne commented on 1 Oct 2013
Are you using pure html5 or youtube? This sounds like youtube because in
chrome it uses html5, which is much much more percise, youtube in firefox
uses flash, which is locked to keyframes.

Might be what you're seeing.

On 1 October 2013 14:42, Ian Hunter [email protected] wrote:

I have some plugins that I'm trying to have as precise as possible.
Changing to frameAnimation: true improved precision, and it Google Chrome
it works perfectly.* In Firefox, the timing is at least a tenth of a second
off. When dealing with certain things like muting specific words within a
sentence, this can make or break the application.

or at least well enough to be indistinguishable from perfect timing
—
Reply to this email directly or view it on GitHubhttps://github.com/mozilla/issues/348
.

Issue reported: mozilla#369
Reported by: @anabelle

I am creating a sequence by following the documentation at: http://popcornjs.org/popcorn-docs/modules/#sequence

I see we can set one source file per clip, but to achieve full browser support I think 3 formats of each video are needed.

How can I specify multiple video formats in a sequence?

Issue reported: mozilla#410
Reported by: @Melatonin64

In most platforms, when using frameAnimation, currentTime() returns an updated value on each frame() call (60 fps).
However, it appears that on Android Chrome (v38), the value of currentTime() is updated only about 4 times per second.
See this jsfiddle: http://jsfiddle.net/JVUdb/167/

Issue reported: mozilla#339
Reported by: @vollnhals

Hello,

I have a plugin that displays a div above the video. I set the start param to 0.
The start function of my plugin is called when the video starts. But if the video loops then the start function is not called again.

I noticed that when i change the start param to 1 then the start function is called again after looping.

I need the start function to be always called after looping.

Regards,
Lion

Issue reported: mozilla#398
Reported by: @jywsn

@jywsn
jywsn commented on 9 May 2014
Calling play(N) with a time parameter N does not work on iOS 7. The clip will start playing at the beginning. The only way I could get it to start playing at a specified time was to use currentTime(n), bind a listener to the 'seeked' event, and then call play() in the associated callback.

@rwaldron rwaldron self-assigned this on 9 May 2014
@rwaldron
Contributor
rwaldron commented on 9 May 2014
I have some spare cycles to look at this

@rwaldron
Contributor
rwaldron commented on 9 May 2014
@ScottDowne @cadecairos @jbuck my first thought is to actually use @jywsn's work around as the handling mechanism here: https://github.com/mozilla/popcorn-js/blob/master/popcorn.js#L613-L617 I'll keep playing around with this, but if anyone has better ideas, by all means :)

@ScottDowne
Contributor
ScottDowne commented on 10 May 2014
Waiting for seek feels pretty sane to me. I guess iOS 7 isn't handling this for us. If I recall correctly, spec says play and currentTime changes should queue and fire in the correct order, but I feel like it's probably pretty common for something like that to be simply not be implemented yet?

@rwaldron
Contributor
rwaldron commented on 10 May 2014
Maybe we can feature detect for this and only do the special handling path if necessary?

@ScottDowne
Contributor
ScottDowne commented on 10 May 2014
I'm not too sure how we would feature detect this. Feels more like flaw detection than feature detection :P

Would we detect a generic feature we know is not on iOS then act accordingly? That feel like round about browser detection maybe? shrugs

I say don't bother with detection if the seek is not a problem in ff or chrome, and passes the tests.

@rwaldron
Contributor
rwaldron commented on 11 May 2014
Yeah, I think you're right here. iOS has been edge-case for Popcorn.js anyway

Issue reported: mozilla#400
Reported by: @georgemarshall

@georgemarshall
Contributor
georgemarshall commented on 28 May 2014
The YouTube player API offers the following hooks for adjusting the playback rate. If no one beats me to this, my plan will be to circle back in ~48 hours and create a pull request that adds this the wrapper.

https://developers.google.com/youtube/js_api_reference

player.getPlaybackRate();
player.setPlaybackRate(suggestedRate);
player.getAvailablePlaybackRates();
@ScottDowne
Contributor
ScottDowne commented on 28 May 2014
I tried this ages ago, and found that in most cases getAvailablePlaybackRates would only return an array of 1. :(

@jmgirven
jmgirven commented on 27 Aug 2014
I'm not sure if you guys ever got this working or not, but I was just experimenting with this too. In popcorn-complete.js 1.5.6, HTMLYouTubeVideoElement, line 6479: Object.defineProperties, I just added a getter and setter for playbackRate and getAvailablePlaybackRates:

playbackRate: {
get: function() {
return player.getPlaybackRate();
},
set: function( aValue ) {
player.setPlaybackRate(aValue);
self.dispatchEvent( "ratechange" );
}
},

availablePlaybackRates: {
get: function() {
return player.getAvailablePlaybackRates();
}
},
The videos I have been looking at tend to have available playback rates of [0.25, 0.5, 1, 1.25, 1.5, 2]. I know YouTube doesn't provide this for all videos though, so you should check the list before setting a new playbackRate.

You can then change the playbackRate using e.g:

var rate = popcornElement.media.availablePlaybackRates[0];
popcornElement.media.playbackRate = rate;
Does that work for you too?

Issue posted: mozilla#115
Reported by: @jessevondoom

The Vimeo live demo linked to from http://popcornjs.org/popcorn-docs/players/#vimeo doesn't run because it's embed div id is "vimeo" but the pop object is called using "#youtube" — easy/quick fix.

Demo is here: http://jsfiddle.net/popcornjs/gBEek/

Everything works when line 2 of the JS is changed from

var pop = Popcorn.vimeo( "#youtube", "http://vimeo.com/18359846" );

to

var pop = Popcorn.vimeo( "#vimeo", "http://vimeo.com/18359846" );

Issue reported: mozilla#396
Reported by: @jraoult

The changeSrc function sends an JSONP request to get the duration of the video. If this request returns no data (ie the video id doesn't match any video) it logs a message to the console and returns silently instead of triggering an error event.

The HTMLVideoElement for example in that case triggers an error event and the error property is set with a MEDIA_ERR_SRC_NOT_SUPPORTED MediaError (see http://jsfiddle.net/popcornjs/D88FP/)

Issue reported: mozilla#414
Reported by: @codingisacopingstrategy

@codingisacopingstrategy
codingisacopingstrategy commented on 10 Nov 2014
I can’t access the bug tickets https://webmademovies.lighthouseapp.com/projects/63272-popcornjs/tickets/new and changelog https://webmademovies.lighthouseapp.com/projects/63272/changelog

Should these be https://github.com/mozilla/popcorn-js/issues and https://github.com/mozilla/popcorn-js/releases respectively?

There’s also this one but it seems unmaintained…
https://github.com/mozilla/popcorn-js/blob/master/CHANGELOG.md

Cheers,

@codingisacopingstrategy
codingisacopingstrategy commented on 28 Nov 2014
Note that the lighthouse link is also present at http://popcornjs.org/community

Issue reported: mozilla#415
Reported by: @suganthanraj

document.addEventListener("DOMContentLoaded", function () {

        var youtube  = Popcorn.HTMLYouTubeVideoElement('#playlist');
        youtube.src = '//www.youtube.com/embed/WGG7vFW5oNg?list=PLqRSwyqnU1WEECXxN3uN08G24h34EQOko&controls=1';

        yt = Popcorn(youtube );

        yt.controls(true);
        yt.autoplay();
        yt.mute();
        yt.currentTime(10).play();
        yt.loop(true);

        yt.on( 'volumechange', function(e) {
         if(!yt.muted() && muteflag){
            yt.currentTime(0).play();
            muteflag = false;
         }else{
             yt.currentTime(0).play();
             muteflag = false;
         }
        });



      // Update button labels
      yt.on( 'play' , function() {
        paused = false;

      });


     yt.on('pause', function() {
        if(!yt.muted() && muteflag){
           yt.unmute();
           yt.currentTime(0).play();
            muteflag = false;
         }
      });


    }, false);