How to do post-processing on YouTube videos for simple video effects?

Question

I'm trying to implement 'mirrored' playback (any right-handed person in a video will appear to be left-handed in a mirrored video) on any YouTube video, but I can't seem to find any resources for manipulating a video, once recorded and uploaded. I was hoping for a simple YouTube player API level access to basic post-processing, but after digging around all three provided APIs (iframe, JavaScript, ActionScript) it looks like I am out of luck.

I was looking into inspecting the network packets for the FLV object in hopes of manually reversing the images, but then I thought I might use that as a last resort. How might you go about doing simple post-processing like mirrored playback? Is there something in the API that I'm missing? Something outside of the APIs that I could try?

Any and all suggestions are welcome.

NodeNodeNode · Answer 1 · 2013-09-19T22:43:16.527

1

Can you use css to rotate the element along the y axis and turn it around 180 degrees?

<div id="controlDiv"><iframe id="yt" width="100%" height="100%"></iframe></div>

#controlDiv{
   transform: rotateY(180deg); 
   -webkit-transform: rotateY(180deg); 
   -moz-transform: rotateY(180deg); 
}

edited Sep 19 '13 at 22:43

answered Sep 18 '13 at 15:11

NodeNodeNode

215
1
3
9

Thanks for the suggestion! I can't get this working on YouTube with Firefox's inspector. Can you get this working anywhere? – Brian Kung Sep 19 '13 at 15:44
True, you'll have to wrap the iframe in another div and use css on that. Youtube dominates the iframe once instantiated and it's pretty much impossible to control afterwards. – NodeNodeNode Sep 19 '13 at 22:41
It doesn't seem to work even when I apply the css to the parent div. Any thoughts? – Brian Kung Sep 20 '13 at 01:57
1

Ya you're right, if you add transitions you can see that it actually _does_ turn around, but it looks like the back of youtube videos is opaque and black so you can't see anything :( The webkit only alternative to that is to use the css property -webkit-box-reflect. But the only cross browser alternative looks like seems to be something like canvas to print the video as an image and and reflect it on the canvas. I'm pretty sure canvas can do that natively. Check that out and see if it works. If not I'll make a jsFiddle :D – NodeNodeNode Sep 24 '13 at 13:56
I know nothing about canvas, let me see if I can figure it all out some weekend. I appreciate the tips! – Brian Kung Sep 24 '13 at 18:37

score 0 · Accepted Answer · answered Mar 18 '13 at 14:47

0

You can use https://www.youtube.com/editor

There is not an API for this yet but follow YouTube Developers blog and YouTube Dev G+ Page for announcements.

answered Mar 18 '13 at 14:47

Ibrahim Ulukaya

12,767
1
33
36

Thanks Ibrahim! I'm not going to hold my breath for this particular feature to be implemented, I'll just be sad that I couldn't do it as easily as I'd hoped. If you could point me toward any extremely hacky ways to do it, I'd be very appreciative :) – Brian Kung Mar 19 '13 at 01:13

How to do post-processing on YouTube videos for simple video effects?

2 Answers2