# API

The player is the instance object.

let player=new Player({
  id:'mse',
  url:'/mp4/'
})

# Attributes

# Method

# play

• explanation:play the video
• examples:

player.play()

# pause

• explanation: pause the video
• examples:

player.pause()

# reload

• explanation: reload the video
• examples:

player.reload()

# destroy

• explanation: destroy the player
• examples:

player.destroy(isDelDom) // param isDelDom: true means to delete internal DOM element | false means to keep internal DOM element，default true

# canPlayType

• explanation: Detect whether your browser can play different types of videos
• examples:

player.canPlayType('video/mp4; codecs="avc1.64001E, mp4a.40.5"')

# getBufferedRange

• explanation: Returns the current buffer segment time range, 'start' indicates the buffer start time, and 'end' indicates the buffer end time.
• return: [start,end]
• examples:

player.getBufferedRange()

# getPIP

• explanation: The player gets the picture-in-picture and can customize the conditions for triggering the picture-in-picture function, which is not limited to the use of the player control.
• examples:

player.getPIP()

# exitPIP

• explanation: The player restores the picture-in-picture and can customize the conditions for triggering the restoration of the picture-in-picture function, which is not limited to the use of the player control.
• examples:

player.exitPIP()

# start

• explanation: Start the player, start is generally the player internal implicit call, the main function is to add video to the DOM
• param: url video address
• examples:

player.start(url)

# replay

• explanation: The player replays, and the replay component invokes this method.
• examples:

player.replay()

# install [static method]

• explanation: Plugins installation method.
• examples:

Player.install('play',function(){})

# switch video url

player.src = 'new url'

# switch poster url

player.poster = 'new poster url'

# Event

# Event Registration/Logout

# permanent registration

player.on('eventName',function(){
  //The eventName can be found in the above query
})

# one time registration

player.once('eventName',function(){

})

# event logout

player.off('eventName',function(){

})

# event trigger

player.emit('eventName')

# Life Cycle

# Instantiation Completed

The player invokes the Player for instantiation. After the instantiation is completed, the ready event is triggered. It can be determined whether the instantiation is completed by listening to the ready. The instantiation mainly includes custom UI generation, event binding, plugin instantiation. code show as below:

let player=new Player({/*configuration*/});
player.once('ready',()=>{console.log('ready')})

# End of Video Generation

Considering the limitations of saving video traffic and HTTP connections, when the PC-side player instantiates, only the UI takes effect and no video is generated. Only after the player is clicked and played, the video tag is created to pull the video for playback. If you want to capture the opportunity to create video, listen for the complete event. code show as below:

let player=new Player({/*configuration*/});
player.once('complete',()=>{console.log('complete')})

However, it is worth noting that there is native video that will be created if the mobile phone does not using the whitelisted . Since some models have bugs in the inserted video, it will generate video directly when the player is instantiated. The execution of this action is in the mobile plugin, so it means that the complete event will precede the ready event.

# Instance destroyed

When the player destroys the instance, it will trigger the destroy event. The code is as follows:

let player=new Player({/*configuration*/});
player.once('destroy',()=>{console.log('destroy')})

• Wrong

  let player=new Player({/*configuration*/});
  setTimeout(function () {
    player.once('ready',()=>{console.log('ready')})
  }, 1000);
  

• Correct

  let player=new Player({/*configuration*/});
  player.once('ready',()=>{
    setTimeout(function () {
      console.log('ready')
    }, 1000);
  })
  

# Auxiliary library

# util

• createDom
• hasClass
• addClass
• removeClass
• toggleClass
• findDom
• format
• event

# sniffer

• browser
• platform
• version
• device