How to Make YouTube webapp run in own process

[NeshyD]

Hello everyone,

I'm sure there has been a post before on how to make any webapp run in fullscreen, but I thought I would post this especially with the new YouTube Webapp that was released recently.


So let's cut right to the chase! To make the YouTube WebApp run in full screen, make sure to sync the following code as a bookmark (call it 'WebApp' or something similar) to your iOS device.

javascript:var%20meta=document.createElement(%22meta%22);meta.name=%22apple-mobile-web-app-capable%22;meta.content=%22yes%22;document.getElementsByTagName(%22head%22).item(0).appendChild(meta);alert(%22Fullscreen%20enabled%22);

Once you have the bookmark, navigate on your iOS device to YouTube Mobile (m.youtube.com). After it loads, open up your bookmarks and select the 'WebApp' bookmark and it should pop-up saying 'fullscreen enabled'. With that, you can now save it to the homescreen ('plus' sign then 'Add to Homescreen').

If everything goes to plan, you should have a full working YouTube webapp running in full screen, just as if it was a native iOS App! It works fairly well, and with iOS4, it even supports the media controls, which is a nice touch.

By the way, this can also be used for other WebApps (Google Voice, Buzz, GMail).

Hope this helps anyone and sorry for this large post!

Neshy

 

[andromedaan]

Nice !! I'll give it a try

 

[androiphone]

great tip, didnt know you could do this

 

[Glaxx]

This is awesome. Thanks for sharing!

 

[Frenchjay]

Followed all the steps and it did not work

 

[deenybird]

thanks for the great tip neshy! 5 starred thread!
with this little tip I can now background youtube and still get the audio!

you can do this all right from the phone. Highlight and copy the code, add any bookmark, then edit it and replace the url with the code.

 

[anonymous guy]

tag to try this out later

 

[jmccray]

thanks for the great tip neshy! 5 starred thread!
with this little tip I can now background youtube and still get the audio!

you can do this all right from the phone. Highlight and copy the code, add any bookmark, then edit it and replace the url with the code.

for some reason mine won't let me replace the URL on the phone. is there another way?

edit: google and found the answer nvm!!!!

 

[anonymous guy]

I got it to work - the only problem is I'm on the iPhone 4 and it displays low-resolution artwork for the icon

 

[dZp]

Thanks, great tip!
Works fine.

 

[Evgenyy]

Awesome! I was wondering how to do this. Thanks a lot for the tip!

 

[Gamst]

When I try and sign in, it goes full screen again? When I try to access favourites etc, it does the same. Is this the case for everyone else?

 

[hchavarria]

Wirelessly posted (Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_0_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8A306 Safari/6531.22.7)

This works great. Thanks for the tip. The YouTube app has now become obsolete in the iPhone, it's to bad that the icon is not high resolution.

 

[PabloGS]

Black StatusBar?

Well... The original idea was to add the YouTube web app as a full screen app to my springboard, since you can play background music using safari. The real app doesn't allow you to do this. This however is obsolete, since full screen web apps won't allow any background audio either as I found out :/

However I encountered one problem: The StatusBar on iOS7 is plain Black when I added YouTube this way to my springboard.

Any idea why?

Edit:

I just modified a bookmarklet to add the status-bar-style to the head and it didn't help.

Here's the bookmarklet:

javascript:(function()%7Bvar%20a=document.getElementsByTagName('head').item(0);if(document.querySelectorAll('meta%5Bname=apple-mobile-web-app-capable%5D').length==0)%7Bvar%20c=document.createElement('meta');c.name='apple-mobile-web-app-capable';c.content='yes';a.appendChild(c)%7D;if(document.querySelectorAll('meta%5Bname=apple-mobile-web-app-status-bar-style%5D').length==0)%7Bvar%20b=document.createElement('meta');b.name='apple-mobile-web-app-status-bar-style';b.content='default';a.appendChild(b)%7Dalert('App%20Mode%20Activated')%7D)();

where b.content can either be:
default
black
black-translucent

I assume UIStatusBarStyleLightContent isn't supported either...

Safari HTML Reference: Supported Meta Tags

Just out of curiosity: Any clue?