# progresspreview

player progress bar preview plugin，不建议改动。SourceCode

pluginName: progresspreview

功能说明:

1. Time preview when the mouse is hovered
2. Thumbnail preview
3. Preview of key points and display of text
4. Frame preview image background when the progress bar is dragged

The plugin will also read the progressDot on playerConfig to render the plot point。The data structure please seeconfig.progressDot

# config

# mode

• @type: String
• default: ``, 枚举值有short和production

preview display type

# defaultText

• @type: String
• default: ``

The text is displayed by default when the mouse is hovered

# isShowThumbnail

• @type: Boolean
• default: true

Whether to show thumbnail preview on the progress bar, The preconditions for the configuration to take effect is that playerConfig.thumbnail is not null

# isShowCoverPreview

• @type: Boolean
• default: false

Whether to add a preview of the video area when fast forwarding/rewinding

# API

// iSpot data structure
const iSpot = {
  id: Number,      // Mark the unique identifier, used to index when deleting
  time: Number,    // Show time point
  duration?: Number,    // The length of the progress bar marking point
  text?: String,   // Custom text at the dot
  color?: '#fff',  // The display color of the indicator point of the progress bar
  style?: { [propName: String]: String | Number }
}

# createDot(iSpot)

• @desc: Add a story point
• @param: { Object } iSpot

# updateDot(iSpot)

• @desc: Update a story point -@param: { Object } iSpot

# deleteDot(id)

• @desc: Delete a story point
• @param: { int } id

# deleteAllDots()

• @desc: Delete all points

# updateAllDots(iSpots)

• @desc: Update points
• @param: { Array } iSpots

# changeThumbnail(thumbnailConfig)

• @desc: Update Thumbnail Config
• @param: { Object } thumbnailConfig Thumbnail Config Object

# hooks

# previewClick

• @desc: Preview image click

E.g:

  //enable preview image click hook
  player.usePluginHooks('progresspreview','previewClick', (plugin, time) => {
    console.log('...args', time)
    return true
  })