# progresspreview

pc端播放器进度条预览插件，不建议改动。源码

pluginName: progresspreview

功能说明:

1. 包括鼠标hover时间预览
2. 缩略图预览(在有缩略帧序列图片配置的时候)
3. 关键点打点预览、文案显示的功能
4. 进度条拖动的时候帧预览图打底

该插件还会读取playerConfig上的progressDot, 来渲染剧情点，具体数据结构请看config.progressDot

# config

# mode

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

预览展示类型

# defaultText

• @type: String
• default: ``

鼠标hover的时候默认展示文案

# isShowThumbnail

• @type: Boolean
• default: true

是否在进度条上展示缩略图预览, 该配置生效的前提是playerConfig.thumbnail存在

# isShowCoverPreview

• @type: Boolean
• default: false

是否添加在快进/快退的时候添加视频区域的预览，该项生效的前提是playerConfig.thumbnail存在

# API

// iSpot结构说明
const iSpot = {
  id: Number, // 标记唯一标识，用于删除的时候索引
  time: Number, // 进度条在此时间戳打点 单位为s
  duration?: Number, // 进度条标识点的时长 默认1s【可选】单位为s
  text?: String, // 打点处的自定义文案
  color?: '#fff', // 进度条标识点的显示颜色【可选】
  style?: { [propName: String]: String | Number } // 进度条标识点的附加样式【可选】
}

# createDot(iSpot)

• @desc: 新增一个故事点
• @param: { Object } iSpot 故事点数据

# updateDot(iSpot)

• @desc: 更新一个故事点 -@param: { Object } iSpot

# deleteDot(id)

• @desc: 删除一个故事点
• @param: { int } id

# deleteAllDots()

• @desc: 删除所有的故事点

# updateAllDots(iSpots)

• @desc: 批量全部更新当前故事点
• @param: { Array } iSpots 要更新的故事点列表

# changeThumbnail(thumbnailConfig)

• @desc: 更新缩略图配置
• @param: { Object } thumbnailConfig 缩略图配置

# hooks

# previewClick

• @desc: 预览图点击

使用方式如下:

  //预览图点击hook启用
  player.usePluginHooks('progresspreview','previewClick', (plugin, time) => {
    // 点击的预览图所在的时间点 plugin是插件实例对象
    console.log('...args', time)
    return true
  })