example - JWPlayer Javascript API para Android Webview
jwplayer html5 example (2)
Puede consultar el código a continuación para JWPlayer to Webview
private void createVideoHtml(File flvDirectory, File htmlFile, String videofilename)
{
String htmlPre = "<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"></head><body style=''margin:0; padding:0;''>";
String htmlCode =
"<script type=''text/javascript'' src=''"+ flvDirectory.getAbsolutePath() + "/jwplayer.js''></script>" +
"<div id=''mediaspace''>EZ Stream TV FLV Player</div>" +
"<script type=''text/javascript''>" +
"jwplayer(''mediaspace'').setup({" +
"''flashplayer'': ''"+ flvDirectory.getAbsolutePath() + "/player.swf'', ''file'': ''" + videofilename + "'', ''backcolor'': ''FFFFFF'', ''frontcolor'': ''000000'', ''lightcolor'': ''000000''," +
"''screencolor'': ''000000'', ''volume'': ''100'', ''autostart'': ''true'', ''mute'': ''false'', ''quality'': ''false'', ''controlbar'': ''bottom'', ''width'': ''100%'', ''height'': ''100%''," +
"events: { " +
"onComplete: function() { alert(''COMPLETED'');}" +
"}});" +
"</script>";
String htmlPost = "</body></html>";
String finalHTML = htmlPre + htmlCode + htmlPost;
try {
FileWriter f = new FileWriter(htmlFile);
PrintWriter p = new PrintWriter(f);
p.print(finalHTML);
p.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
webView = (WebView)findViewById(R.id.web_player);
webView.getSettings().setBuiltInZoomControls(false);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setPluginsEnabled(true);
webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
webView.getSettings().setAllowFileAccess(true);
webView.setInitialScale(60);
webView.setBackgroundColor(Color.BLACK);
getWindow().addFlags(128);
webView.getSettings().setUserAgentString("Mozilla/5.0 (Windows; U; Windows NT 6.1; en-GB; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2 (.NET CLR 3.5.30729)");
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsAlert(WebView view, String url, String message, final android.webkit.JsResult result)
{
Log.d(TAG, message);
new AlertDialog.Builder(view.getContext()).setMessage(message).setCancelable(true).show();
result.confirm();
return true;
}
});
Estoy intentando que JWPlayer devuelva una alerta cuando ocurren algunos eventos específicos de un reproductor flash que reproduce un video local. Si se da cuenta del código a continuación, en Completo, JWPlayer debería devolver una alerta, que puede ser interceptada por onJsAlert desde setWebChromeClient para que pueda hacer cosas con esa información. ¿Estoy haciendo algo mal?
Una posible razón, puedo encontrar aquí: la interacción de JWplayer Javascript no funciona porque se está cargando localmente. ¿Hay alguna manera de evitar este problema? ¿Sería más fácil cargar de alguna manera llamando a localhost? ¿Es eso posible?
Para aquellos de ustedes que tienen curiosidad acerca de por qué genero un archivo HTML en lugar de solo tener que moverme de los activos, después de explorar Internet para descubrir cómo hacer funcionar correctamente un reproductor FLV local, la mejor opción era generar el archivo HTML con información personalizada y escriba el archivo en el mismo directorio que FLV (de ahí la función FileWriter).
Código HTML para incrustar JWPlayer:
private void createVideoHtml(File flvDirectory, File htmlFile, String videofilename)
{
String htmlPre = "<!DOCTYPE html><html lang=/"en/"><head><meta charset=/"utf-8/"></head><body style=''margin:0; padding:0;''>";
String htmlCode =
"<script type=''text/javascript'' src=''"+ flvDirectory.getAbsolutePath() + "/jwplayer.js''></script>" +
"<div id=''mediaspace''>EZ Stream TV FLV Player</div>" +
"<script type=''text/javascript''>" +
"jwplayer(''mediaspace'').setup({" +
"''flashplayer'': ''"+ flvDirectory.getAbsolutePath() + "/player.swf'', ''file'': ''" + videofilename + "'', ''backcolor'': ''FFFFFF'', ''frontcolor'': ''000000'', ''lightcolor'': ''000000''," +
"''screencolor'': ''000000'', ''volume'': ''100'', ''autostart'': ''true'', ''mute'': ''false'', ''quality'': ''false'', ''controlbar'': ''bottom'', ''width'': ''100%'', ''height'': ''100%''," +
"events: { " +
"onComplete: function() { alert(''COMPLETED'');}" +
"}});" +
"</script>";
String htmlPost = "</body></html>";
String finalHTML = htmlPre + htmlCode + htmlPost;
try {
FileWriter f = new FileWriter(htmlFile);
PrintWriter p = new PrintWriter(f);
p.print(finalHTML);
p.close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
Código para webview y manejo de la alerta Javscript:
webView = (WebView)findViewById(R.id.web_player);
webView.getSettings().setBuiltInZoomControls(false);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setPluginsEnabled(true);
webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
webView.getSettings().setAllowFileAccess(true);
webView.setInitialScale(60);
webView.setBackgroundColor(Color.BLACK);
getWindow().addFlags(128);
webView.getSettings().setUserAgentString("Mozilla/5.0 (Windows; U; Windows NT 6.1; en-GB; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2 (.NET CLR 3.5.30729)");
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsAlert(WebView view, String url, String message, final android.webkit.JsResult result)
{
Log.d(TAG, message);
new AlertDialog.Builder(view.getContext()).setMessage(message).setCancelable(true).show();
result.confirm();
return true;
}
});
Tuve el mismo problema mientras trabajaba con jwplayer, mi conclusión fue que el evento onComplete no es confiable en algunos casos. ¿Puede comparar otros eventos que funcionen como el evento onTime?
De lo contrario, use el evento onIdle y mida el tiempo restante (getDuration - getPosition) para obtener un evento onComplete personalizado.