The iPhone needs the embed tag in the youtube embed code. It wont work with just the object tag
The youtube embed code is in youtube.inc file
I tried overriding the function in my template but it didnt work
This is the function - function theme_emvideo_youtube_flash
tried this
function mytheme_theme_emvideo_youtube_flash
and
function phptemplate_theme_emvideo_youtube_flash
neither worked
However editing the youtube.inc file and adding the embed tag to the youtube code works
Now it works like a charm
You can set the video to display at 640x385 youtube widescreen and it still works on the iphone
So you have a big desktop video that also works on the iPhone
Great that you are trying to produce code that validates, but it wont work on the iPhone
I did a test using just the object tag myself and it wouldnt work
Also if you try and use the swfobject.js it just says you need to install flash when you view on the iPhone
Here the function
The only thing i have changed is to add the embed tag
/**
* The embedded flash displaying the youtube video.
*/
function theme_emvideo_youtube_flash($embed, $width, $height, $autoplay, $options = array()) {
static $count;
$output = '';
if ($embed) {
$fullscreen = isset($options['fullscreen']) ? $options['fullscreen'] : variable_get('emvideo_youtube_full_screen', 1);
$fullscreen_value = $fullscreen ? "true" : "false";
$fs = $fullscreen ? "&fs=$fullscreen" : "";
$related = isset($options['related']) ? $options['related'] : variable_get('emvideo_youtube_show_related_videos', 0);
$related = "rel=$related";
$autoplay = isset($options['autoplay']) ? $options['autoplay'] : $autoplay;
$autoplay_value = $autoplay ? '&autoplay=1' : '';
$show_colors = isset($options['show_colors']) ? $options['show_colors'] : variable_get('emvideo_youtube_show_colors', FALSE);
$colors = '';
if ($show_colors) {
$color1 = isset($options['color1']) ? $options['color1'] : variable_get('emvideo_youtube_colors_color1', emvideo_YOUTUBE_COLOR1_DEFAULT);
$color2 = isset($options['color2']) ? $options['color2'] : variable_get('emvideo_youtube_colors_color2', emvideo_YOUTUBE_COLOR2_DEFAULT);
$colors='&color1=0x'. emvideo_youtube_convert_color($color1) .'&color2=0x'. emvideo_youtube_convert_color($color2);
}
$border = isset($options['border']) ? $options['border'] : variable_get('emvideo_youtube_show_border', FALSE);
$border = $border ? '&border=1' : '';
$enablejsapi = isset($options['enablejsapi']) ? $options['enablejsapi'] : variable_get('emvideo_youtube_enablejsapi', TRUE);
$enablejsapi = $enablejsapi ? '&enablejsapi=1&playerapiid=ytplayer' : '';
$id = isset($options['id']) ? $options['id'] : 'emvideo-youtube-flash-'. (++$count);
$div_id = isset($options['div_id']) ? $options['div_id'] : 'emvideo-youtube-flash-wrapper-'. $count;
$high_quality = isset($options['high_quality']) ? $options['high_quality'] : variable_get('emvideo_youtube_high_quality', FALSE);
$high_quality = $high_quality ? '&ap=%2526fmt%3D18' : '';
$display_info = isset($options['display_info']) ? $options['display_info'] : variable_get('emvideo_youtube_display_info', FALSE);
$display_info = $display_info ? '&showinfo=0' : '';
$url = "http://www.youtube.com/v/$embed&$related$autoplay_value$colors$border$high_quality$display_info$enablejsapi$fs";
if (variable_get('emfield_swfobject', FALSE) && (module_exists('swfobject_api') || variable_get('emfield_swfobject_location', ''))) {
if (module_exists('swfobject_api')) {
$params['width'] = $width;
$params['height'] = $height;
$params['div_id'] = $id;
$params['allowFullScreen'] = $fullscreen_value;
$output .= theme('swfobject_api', $url, $params, $options, $id);
}
else {
drupal_add_js(variable_get('emfield_swfobject_location', ''));
$output .= <<<FLASH
<div id="$div_id">
Sorry, you need to install flash to see this content.
</div>
<script language="JavaScript" type="text/javascript">
swfobject.embedSWF("$url", "$div_id", "$width", "$height", "8");
</script>
FLASH;
}
}
else {
$output .= <<<FLASH
<div id="$div_id"><object type="application/x-shockwave-flash" height="$height" width="$width" data="$url" id="$id">
<param name="movie" value="$url" />
<param name="allowScriptAcess" value="sameDomain"/>
<param name="quality" value="best"/>
<param name="allowFullScreen" value="$fullscreen_value"/>
<param name="bgcolor" value="#FFFFFF"/>
<param name="scale" value="noScale"/>
<param name="salign" value="TL"/>
<param name="FlashVars" value="playerMode=embedded" />
<param name="wmode" value="transparent" />
<embed width="$width" height="$height" allowfullscreen="$fullscreen_value" allowscriptaccess="always" type="application/x-shockwave-flash" src="$url"></embed>
</object></div>
FLASH;
}
}
return $output;
}
Comment | File | Size | Author |
---|---|---|---|
#1 | 516236.patch | 812 bytes | RobLoach |
Comments
Comment #1
RobLoachLike this?
Comment #2
aaron CreditAttribution: aaron commenteduggh, stupid iphone. that breaks html standards, and we'd worked hard to get this stupid thing working for ff & ie, but be web compliant. then iphone comes along and breaks the whole thing....
i'll have to revisit this; sorry, am not going to put this in the current release, as i don't have time right now :(
Comment #3
CinemaSaville CreditAttribution: CinemaSaville commentedSo has this been handled? Would be great if we could get these YouTube embeds to function properly on iPhone like "Smart YouTube" plugin for Wordpress. With the mobile/iPhone explosion I would consider this crucial functionality.
Comment #4
RobLoachNo, it hasn't been handled. I consider this an iPhone problem, the YouTube videos outputed by Embedded Media Field work perfectly on the Android.
Comment #5
CinemaSaville CreditAttribution: CinemaSaville commentedSo how is the SmartTube plugin accomplishing this?
Comment #6
catorghans CreditAttribution: catorghans commentedI placed the function in my theme and applied the #1 patch. It does work now in my Iphone and FF.
Does it break working in IE or Android now?
(The name of this function in your theme should be #theme#_emvideo_youtube_flash (or phptemplate_emvideo_youtube_flash )
Comment #7
CinemaSaville CreditAttribution: CinemaSaville commentedWhere do you put the function in the theme? I just applied the patch, and it worked fine in Safari and FF as well, but I wouldn't mind making extra sure.
Comment #8
CinemaSaville CreditAttribution: CinemaSaville commentedThis has stopped working now on the iPhone. The embed tags no longer work. Anyone got any ideas?
Comment #9
gilf CreditAttribution: gilf commentedsubscribe
Comment #10
rout CreditAttribution: rout commentedsubscribe
Comment #11
aaron CreditAttribution: aaron commentedMoving to the Media: YouTube queue. I don't have an iPhone, so am unable to help with this. Can you point me to the Smart YouTube plugin, I can see how wp does it (assuming that method still works).
Comment #12
mandclu CreditAttribution: mandclu commentedThere's also a good (and standards compliant) method for providing an iPhone-friendly YouTube embed here:
http://learningtheworld.eu/2009/youtube-embed/
Comment #13
aaron CreditAttribution: aaron commentedThanks, @surge_martin. I modified the code for the fallback method, so please try that (committed to the dev branch of Media: YouTube). If this doesn't work, please re-open.
Comment #14
CinemaSaville CreditAttribution: CinemaSaville commentedHi, I installed this module, and upon enabling it, I got the following message:
Fatal error: Cannot redeclare emvideo_youtube_info() (previously declared in /home/socalmov/public_html/sites/all/modules/emfield/contrib/emvideo/providers/youtube.inc:29) in /home/socalmov/public_html/sites/all/modules/media_youtube/providers/emvideo/youtube.inc on line 46
array(4) { ["type"]=> int(64) ["message"]=> string(158) "Cannot redeclare emvideo_youtube_info() (previously declared in /home/socalmov/public_html/sites/all/modules/emfield/contrib/emvideo/providers/youtube.inc:29)" ["file"]=> string(88) "/home/socalmov/public_html/sites/all/modules/media_youtube/providers/emvideo/youtube.inc" ["line"]=> int(46) } n/a
Am I meant to remove YouTube.inc from the providers folder in emvideo?
Comment #16
smzur22 CreditAttribution: smzur22 commentedsubscribing
Comment #17
ceerwk CreditAttribution: ceerwk commentedsubscribing
Comment #18
joebest CreditAttribution: joebest commentedYour solution worked like a charm! Can something like this be implemented for Blip.tv?
Comment #19
Daniel J Wilcox - Blocked for personal attacks CreditAttribution: Daniel J Wilcox - Blocked for personal attacks commentedBlip.tv's embed player use's .flv files and not mp4 videos
If you upload an mp4 to blip.tv and use their embedded player it will still use a .flv and not the mp4
So Blip.tv embedded players wont work on the iPhone
You can visit your page on blip.tv on the iPhone and it will deliver the mp4, but it wont work embedded on your site
Youtube is the only video sharing site i know of whose embedded player works on the iPhone
Thats because Apple and Google have close links, Google re encoded all their videos as h264 so they could work on mobile devices like the iPhone
If you are using blip.tv you could upload an mp4, grab the link and then use the new html5 video tag to add the video
You have to build an html5 site theme first
You can use the video tag in xhtml and it will work but wont validate
Heres an example of an html5 page i built for a client
http://noelclarke.s3.amazonaws.com/4321/4321_video.html
It you use Safari or Chrome on the desktop you get a large mp4 in the html5 video tag
If you use any other browser it falls back to Flash
Visit the page on the iPhone and you get a smaller mobile version of the mp4
The Flash fallback is automatically generated with a couple of lines of jquery
I also have this working in a xhtml5 Drupal site im working on
I use the embed tag for Flash and not the swfobject
The page also validates as html5
I explain how it works in greater details in this comment
http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-html-5-v...
Comment #20
Mac Clemmens CreditAttribution: Mac Clemmens commented@Daniel ... In blip they offer the option to convert the file to m4v, which allows it to work on the iPhone. You might need a pro account (or pro account trial) to do this, however.
Comment #21
Daniel J Wilcox - Blocked for personal attacks CreditAttribution: Daniel J Wilcox - Blocked for personal attacks commentedYes blip.tv pro will let you create m4v files, but they have discontinued their embedded quicktime player.
So you cant embed the m4v in your site, you would have to grab the link to the m4v and create the embed code manually.
Comment #22
smzur22 CreditAttribution: smzur22 commentedIssue is fixed in iPhone OS 4.
Comment #23
renderfreak CreditAttribution: renderfreak commentedGreat! The dev module fixed the issue for me... thx!!!