How To Use kiwappVideo.js

kiwappVideo.js is a kiwapp.js based labrary which provides you simple methods to play video using native on Android and iOS.

It can not work without Kiwapp.js loaded in your application. You have to initialize kiwapp before using the kiwappVideo methods.

Initialize Player

Once Kiwapp is initialized, you can create a Player bridge. The player needs a configuration to work.
The library include a default configuration to lazy launch the player.
But if you want more customization, you have to pass it a config object at the initialization.

 

        		
      

      

        


  



Creating the configuration.
Here the player will mask all the webview surface.

        		
        
var config = {
    origin_x : 0,
    origin_y : 0,
    width    : window.innerWidth,
    height   : window.innerHeight
};

var player = new KWPlayer(config);




        		
      

      

        

  



  

    
    Player Methods
  






All the player methods are bridges calling native. 

Then these are all asynchronous. 

To trigger callbacks when the calls are made, the Player trigger events you can listen.

  

  

  



        		
        




        		
      

      

        

  



  

    
    Play a video
  






Once your player is ready, you can play videos. 

BE CARREFULL, YOU'LL NOT SEE YOUR VIDEO IF YOUR HTML BODY ISN'T TRANSPARENT.

  

  

  



        		
        




        		
      

      

        


  



The method "play" of your player takes three arguments.

        		
        




        		
      

      

        


  



The relative path to the video :

        		
        
var path = 'assets/myVideo.mp4';




        		
      

      

        


  



[Optionnal - Default : 0] The start time of the video :

        		
        
var startTime = 10;




        		
      

      

        


  



[Optionnal - Default : 1] The times the video will play again :

        		
        
var nbOfPlay = 2;




        		
      

      

        


  



Listening the play action :

        		
        
player.on('KWPlayer:play', function(){
    console.log("The video is playing.");
});




        		
      

      

        


  



Playing the video :

        		
        
player.play(path, startTime, nbOfPlay);




        		
      

      

        

  



  

    
    Pause a video
  






If a video is playing, you can pause it.

  

  

  



        		
        




        		
      

      

        


  



Listening the pause action :

        		
        
player.on('KWPlayer:pause', function(){
    console.log("The video is pausing.");
});




        		
      

      

        


  



Pausing the current video :

        		
        
player.pause();




        		
      

      

        

  



  

    
    Resume a video
  






If a video is in pause mode, you can resume it.

  

  

  



        		
        




        		
      

      

        


  



Listening the resume action :

        		
        
player.on('KWPlayer:resume', function(){
    console.log("The video is resuming.");
});




        		
      

      

        


  



Resuming the current video

        		
        
player.resume();




        		
      

      

        

  



  

    
    Stop a video
  






if a video is playing, you can stop it.

  

  

  



        		
        




        		
      

      

        


  



Listening the stop action :

        		
        
player.on('KWPlayer:stop', function(){
    console.log("The video is stopping.");
});




        		
      

      

        


  



Stopping the current video

        		
        
player.stop();




        		
      

      

        

  



  

    
    Change sound volume
  






You can dynamically chnge the sound volume.

  

  

  



        		
        




        		
      

      

        


  



The value has to be betwenn 0 and 100 :

        		
        
var soundVolume = 50;




        		
      

      

        


  



Changing sound volume :

        		
        
player.sound(soundVolume);




        		
      

      

        

  



  

    
    Know when a video is finished
  






You can listen the video player to know when a video is finished and have a callback.

  

  

  



        		
        




        		
      

      

        


  



Listening the end of the video :

        		
        
player.on('KWPlayer:finish', function(path){
    console.log("The video "+path+" is finished.");
});