Merge pull request #1 from renoanzhou/master

直播JS-SDK Demo

.eslintignore

@@ -0,0 +1 @@
+**/*.html

.eslintrc.js

@@ -0,0 +1,97 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true
+  },
+  plugins: ['sonarjs'],
+  'extends': [
+    'eslint:recommended'
+  ],
+  rules: {
+    // 调试
+    'no-console': [
+      'error',
+      { 'allow': ['info', 'warn', 'error', 'time', 'timeEnd'] }
+    ],
+    'no-debugger': 'error',
+
+    // 基本
+    'semi': ['error', 'always'],
+    'indent': ['error', 2, {
+      'SwitchCase': 1
+    }],
+    'brace-style': ['error', '1tbs', {
+      'allowSingleLine': true
+    }],
+    'quotes': ['error', 'single'],
+
+    // 变量
+    'new-cap': 'error',
+    'camelcase': 'error',
+    'no-use-before-define': ['error', {
+      'functions': false,
+      'classes': false,
+      'variables': true
+    }],
+    'no-unused-vars': 'error',
+
+    // 空白与换行
+    'semi-spacing': 'error',
+    'array-bracket-spacing': ['error', 'never'],
+    'block-spacing': ['error', 'always'],
+    'computed-property-spacing': 'error',
+    'comma-spacing': 'error',
+    'func-call-spacing': 'error',
+    'key-spacing': 'error',
+    'keyword-spacing': 'error',
+    'no-trailing-spaces': 'error',
+    'no-whitespace-before-property': 'error',
+    'space-before-blocks': 'error',
+    'space-before-function-paren': ['error', {
+      anonymous: 'never',
+      named: 'never',
+      asyncArrow: 'always'
+    }],
+    'space-in-parens': 'error',
+    'space-infix-ops': 'error',
+    'space-unary-ops': 'error',
+    'spaced-comment': ['error', 'always', {
+      'block': {
+        'markers': ['!'],
+        'balanced': true
+      }
+    }],
+    'object-curly-spacing': ['error', 'always'],
+    'object-property-newline': ['error', {
+      allowAllPropertiesOnSameLine: true
+    }],
+    'operator-linebreak': ['error', 'after'],
+    'eol-last': ['error', 'always'],
+    'padded-blocks': 0,
+
+    // 逗号
+    'comma-dangle': ['error', 'only-multiline'],
+    'comma-style': 'error',
+
+    // 其他
+    'no-extra-bind': 'error',
+    'no-extra-label': 'error',
+    'no-floating-decimal': 'error',
+    'no-implied-eval': 'error',
+    'no-iterator': 'error',
+    'no-loop-func': 'error',
+    'no-multi-spaces': 'error',
+    'no-proto': 'error',
+    'no-script-url': 'error',
+    'no-throw-literal': 'error',
+    'no-useless-call': 'error',
+    'no-with': 'error',
+    'no-constant-condition': 'error',
+    'no-empty': ['error', {
+      'allowEmptyCatch': true
+    }],
+    'no-lonely-if': 0,
+    'curly': ['error', 'multi-line'],
+    'wrap-iife': ['error', 'inside']
+  }
+};

README.md

@@ -0,0 +1,78 @@
+# 直播JS-SDK DEMO
+
+
+## 介绍
+
+为了帮助客户更好地理解、接入「**POLYV 直播 JavaScript SDK**」，本项目提供了一个标准的 demo 以供参考。
+
+### Demo 功能点
+| 分类 | 功能 | 支持情况 |
+|---|---|---|
+| 聊天室 | 欢迎语 | ✔ |
+| | 点赞 | ✔ |
+| | 送花 | ✔ |
+| | 聊天信息 | ✔ |
+| | 只看主持人 | ✔ |
+| | 设置昵称 | ✔ |
+| | 连接超时提醒 | ✔ |
+| | 在线列表 | ✔ |
+| | 提问 | ✔ |
+| 播放器 | 音量设置 | ✔ |
+| | 暂停/恢复播放 | ✔ |
+| | seek | ✔ |
+| | 切换倍速 | ✔ |
+| | 关闭或显示讲师摄像头 | ✔ |
+| | 切换当前线路 | ✔ |
+| | PPT翻页 | ✔ |
+| | 发送弹幕 | ✔ |
+| | 隐藏/恢复弹幕 | ✔ |
+| | 切换清晰度(需支持多码率) | ✔ |
+| | 支持回放 | ✔ |
+| 互动功能 | 公告(聊天室显示) | ✔ |
+| | 签到 | ✘ |
+| | 答题卡 | ✘ |
+| | 问卷 | ✘ |
+| | 抽奖 | ✘ |
+
+### 浏览器兼容性
+- 支持主流 PC 浏览器，包括 Chrome、Safari、Edge、Firefox、IE(>=10) 等 。
+- 支持主流移动端浏览器或 WebView，包括 UC 浏览器、QQ 浏览器、微信浏览器、各厂商自带浏览器等。
+
+
+## 运行 demo
+
+Demo 的源码位于项目的 src 目录下。注意，直接双击 index.html *无法* 完全正常运行。请通过 Nginx、Apache 或 IIS 等应用程序服务器配置一个本地 http 地址进行访问。
+
+您还可以结合 POLYV 官方文档查阅 demo 源码：
+
+- [直播 JavaScript SDK 使用文档](https://dev.polyv.net/2019/liveproduct/l-sdk/web-sdk/)
+- [直播聊天室JS-SDK](https://dev.polyv.net/2019/liveproduct/zblts/chat_js_sdk/)
+- [直播API签名规则](https://dev.polyv.net/2018/liveproduct/l-api/notice/sign/)
+
+
+## 补充说明
+
+### 已知问题
+- 切换主副屏后，弹幕无法在主屏幕上显示。
+
+### 安全性说明（重要）
+- 实际使用时，请*不要*将 appSecret 暴露在前端，本 demo 仅为演示。
+
+### 关于自动播放
+设置了 autoplay 参数后, 使用 PC Chrome 浏览器打开 demo 页可能会出现静音自动播放的情况, 这是浏览器的自动播放策略导致的。关于 Chrome 的自动播放策略请参考 [Autoplay Policy Changes(国内网络可能打不开)](https://developers.google.com/web/updates/2017/09/autoplay-policy-changes)。
+
+此外， 移动端不支持自动播放。
+
+### 关于回放
+播放器的配置参数[type](https://dev.polyv.net/2019/liveproduct/l-sdk/web-sdk/#i-7)会影响播放器的回放：
+- 设置为 `auto` 时，根据频道的实际设置自动选择播放类型，也是 demo 页的设置。此时播放器会按以下优先级播放视频：
+  1. 直播；
+  2. 回放列表视频；
+  3. 第一个暂存视频。
+- 设置为 `live` 时，不播放回放。
+- 设置为 `vod` 时，需要设置 vid 参数去指定某个回放。vid 的值可以通过 SDK 的实例方法 getPlaybackLists 获取。
+
+### Demo 使用的第三方库
+- [blueimp-md5](https://github.com/blueimp/JavaScript-MD5) 版本 2.11.0
+- [jquery](https://github.com/jquery/jquery) 版本 2.2.4
+- [Cross-Domain AJAX](https://github.com/MoonScript/jQuery-ajaxTransport-XDomainRequest) 兼容IE9