Search code examples
androidhtmlcordovahtml5-videocordova-plugins

Android PhoneGap HTML5video

I am looking for an HTML 5 video plugin for PhoneGap.

I found a plugin at GitHub but there maybe something wrong as I have the following issues:

  • I don't know where to place the plugin.xml
  • I don't know how to to link with it <video> tag
  • and it's not working with PhoneGap

this javascript function now

function start(){
    window.plugins.html5video.initialize({"video1" : "movie.mp4"});
    window.plugins.html5video.play("video1");
}

04-24 09:52:59.305: E/Web Console(740): Uncaught TypeError: Cannot call method 'initialize' of undefined at file:///android_asset/www/index.html:44

Solution

  • After several attempts I solved this way:

    • I have installed Git
    • I have installed the plugin HTML5Video for Cordoba with command cordova plugin add https://github.com/jaeger25/Html5Video.git (with this command, the project has run automatically configured to use the plugin)
    • I created the folder platforms\androis\res\raw\ where I copied the video splash.mp4

    • In the html file (in my case \www\splash.html) I insert this code in HEAD:

      <script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="Html5Video.js"></script>
<script>
    // Wait for device API libraries to load
    //
    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    // device APIs are available
    //
    function onDeviceReady() {
        window.plugins.html5Video.initialize({
            "splashvideo" : "splash.mp4"
        })
        window.plugins.html5Video.play("splashvideo");
    }
</script>

    and this is the BODY code

    <body onload="onLoad()">
    <video id="splashvideo" autobuffer controls="false"></video>
</body>

    It's work for me ;)