@yeeyoon/library 3.6.6 → 3.6.9
Sign up to get free protection for your applications and to get access to all the features.
- package/lib/components/CommonModal/FixedVideo/index.jsx +68 -0
- package/lib/components/CommonModal/FixedVideo/styles.less +1935 -0
- package/lib/components/CommonModal/index.js +48 -0
- package/lib/components/CommonModal/styles.less +17 -0
- package/lib/components/Header/components/NewVersion/config.json +240 -0
- package/lib/components/Header/components/NewVersion/index.jsx +26 -2
- package/lib/components/Header/components/NewVersion/styles.less +32 -0
- package/lib/components/Header/index.jsx +14 -3
- package/lib/components/Header/utils.js +40 -6
- package/lib/components/Icons/index.jsx +5 -1
- package/lib/utils/request.js +6 -6
- package/package.json +4 -2
@@ -0,0 +1,68 @@
|
|
1
|
+
/*
|
2
|
+
* @Author: Erlin
|
3
|
+
* @Date: 2022-06-10 11:26:40
|
4
|
+
* @LastEditors: Erlin
|
5
|
+
* @LastEditTime: 2022-06-10 12:09:01
|
6
|
+
* @Description:
|
7
|
+
*/
|
8
|
+
import React from 'react';
|
9
|
+
import PropTypes from 'prop-types';
|
10
|
+
import videojs from 'video.js';
|
11
|
+
import 'videojs-flash';
|
12
|
+
import styles from './styles.less';
|
13
|
+
|
14
|
+
const videoOption = {
|
15
|
+
autoplay: true,
|
16
|
+
controls: true,
|
17
|
+
responsive: true,
|
18
|
+
fluid: true,
|
19
|
+
sources: [],
|
20
|
+
};
|
21
|
+
export const FixedVideo = (props) => {
|
22
|
+
const videoRef = React.useRef(null);
|
23
|
+
const playerRef = React.useRef(null);
|
24
|
+
const { src, poster, type, onReady } = props;
|
25
|
+
|
26
|
+
React.useEffect(() => {
|
27
|
+
// make sure Video.js player is only initialized once
|
28
|
+
if (!playerRef.current) {
|
29
|
+
const videoElement = videoRef.current;
|
30
|
+
if (!videoElement) return;
|
31
|
+
videoOption['sources'] = [{ src, poster, type }];
|
32
|
+
const player = (playerRef.current = videojs(
|
33
|
+
videoElement,
|
34
|
+
videoOption,
|
35
|
+
() => {
|
36
|
+
onReady && onReady(player);
|
37
|
+
}
|
38
|
+
));
|
39
|
+
}
|
40
|
+
}, [src]);
|
41
|
+
|
42
|
+
// Dispose the Video.js player when the functional component unmounts
|
43
|
+
React.useEffect(() => {
|
44
|
+
return () => {
|
45
|
+
if (playerRef.current) {
|
46
|
+
playerRef.current.dispose();
|
47
|
+
playerRef.current = null;
|
48
|
+
}
|
49
|
+
};
|
50
|
+
}, []);
|
51
|
+
|
52
|
+
return (
|
53
|
+
<div className={styles.container}>
|
54
|
+
<div data-vjs-player>
|
55
|
+
<video ref={videoRef} className="video-js vjs-big-play-centered" />
|
56
|
+
</div>
|
57
|
+
</div>
|
58
|
+
);
|
59
|
+
};
|
60
|
+
|
61
|
+
FixedVideo.propTypes = {
|
62
|
+
src: PropTypes.string,
|
63
|
+
poster: PropTypes.string,
|
64
|
+
type: PropTypes.string,
|
65
|
+
onReady: PropTypes.string,
|
66
|
+
};
|
67
|
+
|
68
|
+
export default FixedVideo;
|