$(document).ready(function() {
$('iframe').each(function() {
var src = $(this).attr('src');
// Replace youtube vids
var ytprefix = "http://www.youtube.com/embed/";
if(src.indexOf(ytprefix) != -1) {
replaceYT(this, src.substring(ytprefix.length));
}
});
$('object').each(function() {
var srcel = $('param[name="src"]', this);
var src = $(srcel).attr('value');
// Replace youtube vids
var ytprefix = "http://www.youtube.com/v/";
if(src.indexOf(ytprefix) != -1) {
replaceYT(this, src.substring(ytprefix.length));
}
});
});
function replaceYT(el, code) {
if(code.indexOf("/") != -1) {
code = code.substring(0, code.indexOf("/"));
}
if(code.indexOf("?") != -1) {
code = code.substring(0, code.indexOf("?"));
}
var atag = $("<a href='vnd.youtube:" + code +"'><img class='youtubeimg' src='file:///android_asset/youtube-play-button.png' style='background:url(http://img.youtube.com/vi/" + code + "/0.jpg)'/></a>");
$(el).replaceWith(atag);
}
Just load in jquery and this script. This will replace youtube iframes and object tags with a screenshot from the video and a link to youtube. Tested on a SE Xperia X10 & Nexus 7.
Set up your webview to handle youtube like this:
WebViewClient mWebClient = new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if (url.startsWith("http://www.youtube.com") || url.startsWith("vnd.youtube")){
startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
return true;
}
return false;
}
};