CODEWITHSUNDEEP
objective-cipadyoutube
Aisha
Aisha

Reputation: 1559

Play youtube videos in fullscreen auto

I am trying to play a youtube video using youtube embedded player in my ipad app. I want that as soon as the user clicks on the video thumbnail the video automatically should be loaded fullscreen on switching to landscape mode in ipad. Currently the user has to click the fullscreen button to play the video in fullscreen mode. I want the same effect that is seen when we play the video using the default youtube app that comes with ipad.

This is the code that I am using to play you tube video on ipad.

embedHTML = @"<object width=\"640\" height=\"390\">
<param name=\"movie\"value=\"http://www.youtube.com/v/IYX_Ql-3U10&fs=1\">
<param name=\"allowFullScreen\" value=\"true\"></param>
<param name=\"allowScriptAccess\" value=\"always\"></param>
<embed id=\"yt\" src=\"http://www.youtube.com/v/youtube_video_id&fs=1\" 
type=\"application/x-shockwave-flash\" position=\"fixed\" 
allowfullscreen=\"true\" allowScriptAccess=\"always\"
 width=\"640\" height=\"390\"></embed></object>";

And if this is not possible does anybody know if there is a reason or documentation supporting this decision.

Upvotes: 6

Views: 6964

Answers (4)

Tyler Hunnefeld
Tyler Hunnefeld

Reputation: 1

With respect to the authors of the other answers, it is completely possible to do this using UIWebViews in iOS AND without leveraging private APIs. Here's a pretty simple method to do so.

- (void)playYoutubeVideo:(NSString *)videoId {
    UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectZero];
    webView.center = self.view.center; //Technically not needed, I've found it looks better with this added (when the video is done playing it looks better while being minimized)
    webView.mediaPlaybackRequiresUserAction = NO;
    [self.view addSubview:webView];

    NSString *youTubeVideoHTML = [NSString stringWithFormat:@"<html><head><style>body{margin:0px 0px 0px 0px;}</style></head> <body> <div id=\"player\"></div> <script> var tag = document.createElement('script'); tag.src = 'http://www.youtube.com/player_api'; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width:'768', height:'1024', videoId:'%@', events: { 'onReady': onPlayerReady } }); } function onPlayerReady(event) { event.target.playVideo(); } </script> </body> </html>", videoId];

   [webView loadHTMLString:youTubeVideoHTML baseURL: [NSBundle mainBundle].bundleURL];
}

The crux of this implementation is using a UIWebView with a frame of CGRectZero together with custom HTML/Javascript that handles autoplaying the video. With the UIWebView with the CGRectZero frame, the user doesn't see any annoying intermediate page before the video is autoplayed, and the HTML/Javascript does the heavy lifting involved with getting the page to autoplay the video.

There's a slight delay before the video is presented. I haven't found a way to eliminate this couple second delay unfortunately.

Upvotes: 0

Casey
Casey

Reputation: 166

I was able to access this functionality from a subview titled FigPluginView within the youtube player's webview, using the iOS youtube helper iOS-youtube-player-helper. FigPluginView class dump reference

Create a custom UIView class header that exposes the following method:

#import <Foundation/Foundation.h> 
@interface WMFigPluginView : NSObject

-(void)scriptEnterFullScreen;

@end

Import the custom FigPluginView and YouTube player to the ViewController interface()

    #import <youtube-ios-player-helper/YTPlayerView.h>
    #import "WMFigPluginView.h"

    @property(nonatomic, strong) YTPlayerView *playerView;

Use the following methods to init the youtube player, monitor state change, find and call the fullscreen script within the FigPluginView.

- (void)presentYoutubeVideo {
    if ([self.view.subviews containsObject:_playerView]){
        [_playerView removeFromSuperview];
    }
    CGRect playerFrame = CGRectMake(0, 0, 0, 0);
    _playerView = [[YTPlayerView alloc]initWithFrame:playerFrame];
    _playerView.delegate = self;
    [_playerView.webView setAllowsInlineMediaPlayback: NO];
    [self.view addSubview:_playerView];
    [self.playerView loadWithVideoId:@"YouTubeVideoID" playerVars:@{@"showinfo":@0,@"modestbranding":@1,@"autoplay":@1,@"playsinline":@0}];
}

-(void)playerViewDidBecomeReady:(YTPlayerView *)playerView {
    [_playerView playVideo];
}

-(void)playerView:(YTPlayerView *)playerView didChangeToState:(YTPlayerState)state {
    //stop activity indicator
    if (state == kYTPlayerStateBuffering) {
        //start activity indicator
    }
    if (state == kYTPlayerStatePlaying) {
        WMFigPluginView *figPluginView = (WMFigPluginView*)[self findFigPluginView:_playerView.webView];
        [figPluginView scriptEnterFullScreen];
    }
}

- (UIView *)findFigPluginView:(UIView *)view {
    for (__unsafe_unretained UIView *subview in view.subviews) {
        if ([NSStringFromClass(subview.class) hasSuffix:@"FigPluginView"]) {
            return subview;
        } else if (subview.subviews.count > 0) {
            return [self findFigPluginView:subview];
        }
    }
    return nil;
}

Hope this helps!

Upvotes: 4

Engeor
Engeor

Reputation: 328

Looks like there is no straightforward solution. If my client will want it (I will know in a few days :-)) I will probably try to open new controller with webview that covers entire screen and then autoplay it like in this post: How to make YouTube video starts to play automatically inside UIWebView

Upvotes: 0

Yehonatan
Yehonatan

Reputation: 1182

You can't, it's not allowed :)

Upvotes: 4

Related Questions