Play YouTube Video in Javascript Metro App

Question

Hi!

I'm looking for the best/easiest way to play a YouTube video in a Javascript Metro App? I tried the PlayerFramework, but I didn't succeed with that. I got a "unsupported video format or invalid path" error. When I tried to IFrame it, I got a problem with winControl.

Any pointers in the right direction are appreciated!

/Anders 

---

Bratland

Answer 1

Are you trying to play a Flash video or an HTML5 video? By default YouTube uses Flash, but some (not all!) videos are available in HTML5 format if sign up for their HTML5 beta at www.youtube.com/html5 .

Metro style apps cannot play Flash videos, but shouldn't have trouble with the HTML5 ones.

--Rob

Answer 2

HI

So what's the problem with wincontrol?

Use this for Youtobe.html:

 <iframe width="853" height="480" src="http://www.youtube.com/embed/JW5meKfy3fY" frameborder="0" allowfullscreen>
   </iframe>

And in default html

HTML: 
<div id="Youtubevedio"></div>
js:
WinJS.UI.Pages.render("/Youtube.html",document.getElementById("Youtubevedio"));

That's work fine.

Answer 3

HI

So what's the problem with wincontrol?

Use this for Youtobe.html:

 <iframe width="853" height="480" src="http://www.youtube.com/embed/JW5meKfy3fY" frameborder="0" allowfullscreen>
   </iframe>

And in default html

HTML: 
<div id="YoutoBeVedio"></div>
js:
WinJS.UI.Pages.render("/Youtobe.html",document.getElementById("YoutoBeVedio"));

That's work fine.

sorry,i follow step don't work,

Is not ?

default html in add

1.default HTML: <div id="YoutoBeVedio"></div>

2.default js:WinJS.UI.Pages.render("/Youtobe.html",document.getElementById("YoutoBeVedio"));

and new Youtobe.html in add

<iframe width="853" height="480" src="http://www.youtube.com/embed/JW5meKfy3fY" frameborder="0" allowfullscreen>
   </iframe>

Answer 4

Hi

Fix some typo, Please try again.

And not all the video support this.

Please refer to this link:

http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/11658d4f-de1b-47cd-8b31-56267e778f81

Answer 5

Thanks Dino for the reply,

That's work fine,but don't play.

Because ActiveX Plug-in,Adobe Flash Player not install in Metro app.

js metro app:

Answer 6

Are you trying to play a Flash video or an HTML5 video? By default YouTube uses Flash, but some (not all!) videos are available in HTML5 format if sign up for their HTML5 beta at www.youtube.com/html5 .

Metro style apps cannot play Flash videos, but shouldn't have trouble with the HTML5 ones.

--Rob

This only work for HTML5 videos.

Answer 7

i did join the html5 trial,but youtube still in flash mode in windows8 ie.

i upload mp4 file on youtube.

Answer 8

See this:

http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html

-Jeff

---

Jeff Sanders (MSFT)

Answer 9

Hi

As Rob said, it's only support html5 vedio not Flash vedio.

please refer to this thread:

http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/c54d7934-e860-4d63-887e-1b2d0e1da0ea/