Browse Source

Merge branch 'bugfix/player' of shaojing/video_player into master

narrowizard 5 years ago
parent
commit
3dc9d798c7
3 changed files with 27 additions and 6 deletions
  1. 20
    0
      README.md
  2. 1
    0
      package.json
  3. 6
    6
      src/video/api.js

+ 20
- 0
README.md View File

@@ -20,4 +20,24 @@ Build dist.
20 20
 
21 21
 ```bash
22 22
 $ npm run build
23
+```
24
+
25
+
26
+## Install package.
27
+
28
+```bash
29
+$ npm install https://git.links123.net/links123.com/video_player.git --save
30
+```
31
+
32
+## Usage
33
+
34
+```javascript
35
+import { DefaultPlayer as Video } from 'react-html5video';
36
+import 'react-html5video/dist/styles.css';
37
+
38
+const Player = () => (
39
+  <Video autoPlay>
40
+    <source src="demo.mp4" type="video/mp4" />
41
+  </Video>
42
+)
23 43
 ```

+ 1
- 0
package.json View File

@@ -13,6 +13,7 @@
13 13
     "i:demo": "npm run install:demo",
14 14
     "test": "jest --env=jsdom",
15 15
     "test:watch": "npm run test -- --watch",
16
+    "prepare": "npm run build",
16 17
     "build": "webpack --display-error-details",
17 18
     "build:demo": "cd demo && webpack",
18 19
     "deploy:demo": "node scripts/deploy:demo.js",

+ 6
- 6
src/video/api.js View File

@@ -5,12 +5,12 @@
5 5
  * set. To be primarily used in `mapVideoElToProps`.
6 6
  */
7 7
 export const togglePause = (videoEl, { paused }) => {
8
-    if (paused) {
9
-        videoEl.play();
10
-        document.querySelector("#videoTitle").style.display = 'none';
11
-    } else {
12
-        videoEl.pause();
13
-        document.querySelector("#videoTitle").style.display = '';
8
+    const videoTitleEl = document.getElementById("videoTitle")
9
+
10
+    paused ? videoEl.play() : videoEl.pause();
11
+
12
+    if (videoTitleEl) {
13
+        videoTitleEl.style.display = paused ? 'none' : '';
14 14
     }
15 15
 };
16 16