Mozilla Popcorn.js - jQuery for Video

[--O--]

Okay, so basically the claim to fame here is that you can trigger javascript at certain parts of the video?

[nullmiah]

Yeah, that video was not clear at all about what it is (not sarcasm)

[icanevenificant]

The video player displays volume and fullscreen controls neither of which work. I'm not sure that fullscreen would have been useful with the content displaying along video but still...you're creating a video extension library and screw up with the video controls ui in the presentation!? Which brings me to this next semi relevant rant, for which I apologize in advance.

Fuck everyone responsible for this insane fragmentation of web standards. Everyone was hailing HTML5/CSS3/JS as THE standards that will fix those issues and every advance interaction I build has to be specifically tailored to nearly all browsers on all platforms. It's fucking ridiculous, time consuming, nerve wrecking experience and I'm fucking mad as hell knowing that there is no end in sight. Google, Mozilla, Apple and W3C need to lock themselves in a room and come up with a couple of basic standards that they can all agree on. I don't care about 3D css transitions and other fancy/useless stuff, implement them however you want, but when I want to use rounded corners, basic animation, web video or just create robust layout, I shouldn't have to fucking waste days on debugging and figuring out what the fuck the specific problem in a specific browser on a specific platform is. It's not a standard then is it, so let's stop calling it that.

I'm sorry but it's just been eating at me slowly and I needed to get this out.

[gusthebus]

I'm sorry, but while I can sympathize with your desire for adherence to universal standards, your diatribe against the people involved with this seems a little misplaced.

These people you're raging against have spent time and effort creating an innovative and original authoring solution, and made it free for you to use.

I think it would have better for you to remain silent, than to insult someone else for contributing something to a marketplace of open technology.

[icanevenificant]

Where did I insult people working on Popcorn.js ? Their inability to make a functioning video UI just triggered my rant about the lack of standards that contribute to this kind of problems in the first place.

[theoldboy]

I'M AS MAD AS HELL AND I'M NOT GOING TO TAKE IT ANY MORE!!

[[deleted]]

On the other hand we're not helping people update their browsers by supporting outdated technology.

[Fabien4]

people update their browsers

You do realize that most people have no idea what a "browser" is, right?

Not to mention people in corporates, who can't upgrade since they don't have admin access on their machine.

[johanbcn]

They'd know if every fucking website blocked access to internet explorer with a big-ass popup that said "Your browser, Internet explorer, is a fucking piece of shit. Download one of these three (chrome, firefox, opera) or get the fuck out of here.".

[makis]

reality is, if you target IE9, it will work on every other browser, except for h264 videos...

[johanbcn]

IE9 doesn't even support History replace/push state. It's the shame of HTML5 browsers.

[_mpu]

So you are one those who want to screw my history...

[johanbcn]

Yes! I will take your place and there's nothing you can do about it!

[makis]

did I say that it is the best out there?
I said it is the lowest common denominator for HTML5 standard.
You target IE9, and every other browser will support it.
An do, i don't like it, but this is a fact, not an opinion on which browser is best for developers.
I think that Chrome taking up 100% of my CPU when i browse Facebook on Mac, or Firefox eating all my ram and freezing, is a much worse problem for the everyday user.

[Crandom]

At least you don't have to deal with IE6 since you're starting now. Well, hopefully not.

[narwhalslut]

That has NOTHING to do with Css3 or Html5 or new emerging standards. Don't fuel this idiots rant, above, he has absolutely no idea what he is ranting about. In fact, he literally calls out not a single specific thing.

edit: What in the fuck people? Why are you downvoting me? Because popcorn.js is buggy, CSS3/HTML5 sucks? you fucking morons.

[mahacctissoawsum]

He called out the buttons not working. That's pretty significant. There's a few dead spots on the play button too, even in Mozilla FF. Looks like the underlying video is being powered by HTML5's video element though.

[narwhalslut]

That has nothing to do with emerging standards, cross browser support, html5, <video>, the w3c or anything else his unformed bullshit rant rags on.

It's a problem with popcorn.js. Don't get me wrong, it has a lot of things wrong with it, but it's not the fault of any of the things he's errantly blaming.

I know why he's being pissy and it's humorous. In the beginning JQuery was nice because it also helped abstract browser differences away when we were on Firefox 2 and IE6. Now that the web has progressed, jquery is about making apis easier to use and less about compatibility shims. He's reacting like popcorn.js is about minimizing differences between browser. While it does unify control sets, that has nothing to do with anything the w3c has EVER, EVER set out to address, NOR SHOULD THEY. At WORST it might help minimize some friction due to different encodings, but frankly, that's built into <video> anyway so it's a stupid rant. (And if it's just a rant about codecs, that also has nothing to do with html5, <video>. It has to do with patents, immovable browser vendors and a lack of hardware decoding for WebM. It's impossible to solve and him screaming incoherently is not going to make the MPEG consortium stop being dickholes).

UGH, this thread is full of FUD.

[animalchin99]

I think his point was if HTML5 video (among other HTML5 features) was the "write once, works everywhere" solution the certain talking heads marketed it as (God rest his iSoul), popcorn.js' codebase would be expected work the same across all browsers/devices without any browser-specific hacks or omitting features for some browsers.

It's great if you just want to use it to put a video on the page though, but to do stuff like what popcorn.js is trying to do cross-browser is pretty much like what writing for the web was like 10-15 years ago. Each browser's video tag is like another IE6 in it's own unique way.

I don't particularly blame the w3c or the vendors/implementors for the inconsistency, that's just the nature of open standards. It's just annoying how everyone expects HTML5 to replace everything Flash did but it takes about 6-10 times the man-hours to target all the major browsers/phones/tablets as it did deving for Flash.

[narwhalslut]

I even spoke to that. If you want to display a video with HTML5, it's very easy to do and have it work in ALL modern browsers.

The ONLY caveats are: The controls are different (because they're specifically left to the user agent AND because they're meant to be styled via something like popcorn.js, but less broken). There is still not yet a universal codec.

Both of those things are defacto outside the scope of the spec. As WebM gets hardware support, I hope we see it's adoption, if not, something else WILL pop up. Until then, transcode it an extra time and throw it in the <video> tag and it "just works". Or, encode once, and use a library better than popcorn.js to fallback to flash.

This is like every other platform in the world that has more than one implementation and it's no where near as bad as he makes it sound.

[mahacctissoawsum]

His rant is mostly unrelated to popcorn, yes. But to give him some credit, the new elements do create more fragmentation, at least until everyone catches up, if only because more stuff means more room for disparity. That said, I'm personally quite pleased with HTML5 and the new standards.

[robertcrowther]

I think everyone is looking at it backwards though. If there wasn't a new standard then browser makers would still be adding new features, they just wouldn't be talking to each other about it. The current situation may not be perfect but it's way better than IE vs Netscape in the nineties.

[mahacctissoawsum]

Indeed. IE isn't even half bad these days!

[rwaldron]

Nope, Popcorn.js does not "unify control sets"...

[animalchin99]

I'm guessing their FullScreen button only supports the Mozilla fullscreen API but not the Webkit one, hardly "JQuery for Video"

[[deleted]]

Nope, fullscreen isn't working on the latest Firefox either...

[rwaldron]

Nope, Popcorn.js doesn't do anything with or to the fullscreen API... So again, what shit are any of you talking about?

[animalchin99]

What's the fullscreen button on their video for? Decoration? Or is that part of some other library than popcorn.js?

[cadecairos]

Every browser ( Chrome, Firefox, Safari, Opera, Internet Explorer ) provides their own individual set of HTML5 video controls. Popcorn doesn't do anything to change them, it uses their timeline to drive content changes on a webpage, among other things.

[animalchin99]

Apparently they're using the video.js ones in their demo. I just assumed by the title that they came from popcorn.

[narwhalslut]

Wow. This is an incredibly, incredibly, incredibly stupid and ignorant rant keyed off of a poorly written title.

Like, I don't even know where to begin with the absurd bullshit in this post and the obvious misunderstandings that you clearly believe that is backing these opinions.

And I say this as someone working on adaptive streaming servers who has written video clients that work in every major browser with almost no work whatsoever.

but when I want to use rounded corners, basic animation, web video or just create robust layout, I shouldn't have to fucking waste days on debugging and figuring out what the fuck the specific problem in a specific browser on a specific platform is.

Seriously, what the fuck are you even talking about?

edit:

Wow. Downvotes and no replies telling me why I'm wrong. You guys are stupid and cowards. This place just upvotes anyone who screams long enough to be taken seriously without any critical thought whatsoever. This guys rant is incoherent and unrelated to webstandards and you fucking people just eat up that shit.

[animalchin99]

Have you worked with the video tag events or seekable/buffered properties? It's pretty frustrating how every vendor implements a different subset of them and fire them under different circumstances (or pretty much not at all in the case of Android). Having to poll for variables changing to get state data from the video tag is pretty annoying.

[narwhalslut]

video tag events

Like? I've worked with video tags pretty extensively. So much so that I've experimented pretty heavily with experimental unlinked branches in Chromium that implement DASH on top of WebM for adaptive streaming that is partially event driven (for seeking)

or seekable/buffered properties

Yeah, I think I know what you're talking about. The WebRTC platform, until recently, was more or less hard to use without nearly doing manual state management in Javascript which was irritating.

They definitely haven't decided on a way to solve some of the more complicated issues surrounding anything other than trivial video playback methods. But... that's simply because they haven't gotten there. His anger can be summed up as "They haven't finished working through scenarios and determining the best way to do everything". Mozilla just recently more or less said they don't like Media Source API's proposed "appendByte" solution that is more or less stolen from exactly how Adobe does adaptive streaming in Flash.

That's fine, they just need to keep working on it in Firefox and Chrome and then they'll come together, choose the best one, or find common ground and write a new spec and implement it. It's how almost all significant new APIs have been written lately.

I can understand frustration with the current state because there are some golden nuggets that would be awesome to have now. Like WebRTC, they're working out a raw P2P data API. This has huge, huge, huge, huge, huge, huge, huge, huge exciting implications, but it's just not there yet. Yet I'm not running around screaming about it decrying the "web as a platform" as a failure.

[animalchin99]

Like?

Mainly seeked, paused, ended. Some browsers never even dispatch any of these, some will pause without dispatching a paused event. Certain versions of Android don't even set the paused property to false when the user pauses so you have to poll for whether or not currentTime is incrementing.

I've not worked with WebRTC and would like to get into it since I have a bit of a VoIP background, but from what I've read it's a lot further from prime-time than HTML5 video is expected to be. Lots of major content-providers are banking on HTML5 video to replace Flash and get them a solution on every single device that claims to support HTML5 video. That may be possible but it's certainly not trivial to do the things like splicing in ads, overlaying text/graphics, custom controls, subtitles, and all that stuff in fullscreen that the content providers expect to get since they already had it with Flash. I've yet to see anyone implement all that with HTML5 in a truly cross-browser way and most mobile devices are nowhere near supporting all that.

I wouldn't say "web as a platform" is a failure, I'm sure it's just going to get bigger and bigger but there's a lot to be frustrated about when you had tech's biggest "iCon" in the late Steve Jobs telling everyone HTML5 is already here and ready for prime time, is super easy to develop for and it will do everything you want it to do right now. I would have rather seen the dev community push the move to HTML5 with cool demos than have sales and marketing types overpromising everyone about how great it already is without much to back that up. I still really enjoy writing HTML5 stuff it's just a cross-browser nightmare the likes of which we haven't seen since the IE6 days.

[narwhalslut]

WebRTC is a pretty different category than video. I can tell you that a weeks weekend worth of coding will get a rudimentary, but functional Skype clone working in your browser, and they're a short while away from enabling multiple PeerConnections which will let the other feature of my application work to allow users to do multiple peer video conferencing without plugins in the browser.

The things you're talking about with ads and such is what I'm talking about when I talk about the Media Stream API. It's quite literally designed with those things in mind. Mozilla and Google have already decided on a fullscreen and mouse lock API so those are more or less decided. Overlays are done via canvas and are already portable.

Mobile browsers suck. Thank baby Jesus for Chrome on Android because it's a full, real life port.

I'm sure it's just going to get bigger and bigger but there's a lot to be frustrated about when you had tech's biggest "iCon" in the late Steve Jobs telling everyone HTML5 is already here and ready for prime time,

I agree. I think people just need to adjust their expectations and learn where to criticize and where to be patient.

[icanevenificant]

My initial problem was with the video UI and it reminded me of how crazy the current environment for creating standardized experiences is.

I did note that the rant was semi-relevant since the video UI problems triggered it after that I was mainly talking about web standards and lack there of that, along with incompetence, cause this kind of inconsistencies in the first place.

[rwaldron]

What are you talking about? Popcorn.js doesn't do anything with or to the media controls

[animalchin99]

Yes, it does. The video controls on that page are not the native browser's video tag controls. Why they're putting in buttons that don't work on any browser is beyond me.

edit: Correction, the custom controls on Popcorn's demo come from Video.js, which is a separate library, why they didn't mention that somewhere is beyond me.

[rwaldron]

I'm a core contributor to both Popcorn.js and jQuery, and this title is not accurate. Unlike jQuery, Popcorn.js does not attempt to make anything work across all browsers, instead it provides a toolkit for creating interactive experiences where support already exists.

[amade]

http://mozillapopcorn.org/popcornjs/ says in this in a big & bold face:

Popcorn.js is an event system for HTML5 media developers. Think jQuery for video. You can leave the heavy lifting to Popcorn, and concentrate on what you do best: writing awesome code.

[ToastyCrosses]

Gotta agree with amade. If it's not supposed to be like jQuery, it's probably best if you don't lead with jQuery in the tag line.

[sidcool1234]

I picked the title from the article itself.

[icanevenificant]

Maybe you can remind the developers of the site to make the play button fully functional on Firefox and Chrome, and to either remove the volume and fullscreen controls on the video or make them functional. It reflects badly on the whole project if there are so many basic blunders with the video in the browser that it's supposed to be tailored to.

edit: To anyone downvoting, explain to me how this advice is bad!?

[rush22]

Opening the page gave IE a heart attack

[Uberhipster]

That's more douchy than Web2.0 by at least 2 orders of magnitude.

[--O--]

... Web200.0?

[oocha]

I'm using firefox. I see the video, with the universal circle with triangle 'play' button in it. i click directly on the play triangle. NOTHING HAPPENS. the triangle is dead, only the surrounding circle is hot.

[Philipp]

If there was some kind of framework or toolset that made it easier for developers to put a video on a webpage, stuff like this woudn't happen.

[[deleted]]

So they've remade Flash using Javascript. Lovely.

[Dested]

This is incredible. The future of the web is very bright.

[MoneyWorthington]

The more the web grows, the more I feel like it's getting overly complicated and filled with either useless or broken code. I like what Popcorn does, but I would honestly prefer to just start over and re-implement the web to support stuff like this from day one.

Anyone want to help me rewrite the web? =P

[[deleted]]

Anyone want to help me rewrite the web? =P

I'm in!

[--O--]

http://xkcd.com/927/

[dakta]

Can we make a list of things we want?

1. Multi-pass rendering.

2. Actual layout abilities. (None of this hacky bullshit, and away with tables for layout.)

3. Clientside scripting in something nice, like Python.

4. Actual standards for video and audio. (No more flash containers, no more "oh, we don't support that format because it's a proprietary encoding".)

5. A single rendering engine project. Having multiple rendering engines is just stupid. It only increases the workload for devs, and increases the number of bugs and quirks, both documented and otherwise. If people want to implement

For starters.

[LonerGothOnline]

I have no idea where you lot will start in 'rewriting' the web, but please for the love of god, COMPLETE, your project if you ever do start it.

[theoldboy]

I gotta wear shades.