# 实现视频打点

客服人员可通过菊风视频能力平台的视频打点功能，在视频通过过程中针对每次问答进行打点定位并标记风险问题点（关键节点）；
帮助质检人员快速、精准定位业务流程风险；
质检人员无需反复观看视频，提高质检效率。

在集成视频打点功能前，确保已初始化插件，已开启通话内远程录制（视频客服默认开启远程录制）。

# 终端集成

在开启远程录制时，可对录制视频记录关键性信息，最多纪录不超过200字符的关键性信息。

在建立通话，开启远程视频录制之后，可以调用远程视频打点功能。
在通话内，调用视频打点的功能，就可以记录信息。
通话结束后，在业务管理平台上可以查看录制的视频文件，包括视频的打点记录。

var webPlugin = new WebPlugin();

/**
  * @desc 视频打点
  * @param {string} timespan - 时间戳，毫秒
  * @param {string} info - 打点信息
  */
var dotText = dotTextarea.value;
if (dotText.length > 200) {
  alertDialog('提示', '打点信息长度不可超过200个字符');
  return;
} else {
  webPugin.SetVideoDot(Date.now().toString(), dotTextarea.value);
  dotTextarea.value = '';
}

# 安装

下载压缩包文件 (opens new window)
通过 npm 安装

npm install --save videojs-marker-plugin

# 用法

注: videojs-marker-plugin 依赖 videojs 需要先在项目中引入 videojs.

<script src="//path/to/video.min.js"></script>
<script src="//path/to/videojs-marker-plugin.min.js"></script>
<script>
  var player = videojs('my-video');

  player.markerPlugin({
    //  打点信息
    markers: [
      {
        offset: 1,
        type: 'text',
        data: {
          content: 'content1'
        }
      },
      {
        offset: 2,
        type: 'text',
        data: {
          content: 'content2'
        }
      },
    ],
    // 是否展示右侧面板
    panel: true
  });
</script>

# require 引入

var videojs = require('video.js');

// The actual plugin function is exported by this module, but it is also
// attached to the `Player.prototype`; so, there is no need to assign it
// to a variable.
require('videojs-marker-plugin');

var player = videojs('my-video');

player.markerPlugin({
  //  打点信息
  markers: [
    {
      offset: 1,
      type: 'text',
      data: {
        content: 'content1'
      }
    },
    {
      offset: 2,
      type: 'text',
      data: {
        content: 'content2'
      }
    },
  ],
  // 是否展示右侧面板
  panel: true
});

# 参数和接口

name	type	description
markers	Array	一个包含打点信息的数组
panel	boolean	是否展示右侧打点信息面板

markerPlugin({
  markers: [
    //  MarkerPointInfo
    {
      //  这条打点记录相对于视频时间轴的零点的偏移量(以秒为单位), 会跟据该值决定打点显示在进度条中的位置.
      offset: 1,
      //  打点类型, 目前仅有 `text` 类型
      type: 'text',
      //  打点数据, content内为打点文本内容
      data: {
        content: 'content'
      }
    }
  ],
  panel: true
})

# 更新打点信息

plugin.updateOptions({
  markers: [
    {
      offset: 1,
      type: 'text',
      data: {
        content: 'content'
      }
    }
  ],
  panel: true
});