视频自适应

06f43a9a · 程恺文 · 15abb82d · 06f43a9a · 06f43a9a · 06f43a9a
Commit 06f43a9a authored May 22, 2023 by 程恺文
4 changed files
--- a/packages/base-components/VideoSliderModal/CHANGELOG.md
+++ b/packages/base-components/VideoSliderModal/CHANGELOG.md
 # Change Log

-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

 ## [1.1.15](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.14...@wisdom-components/videoslidermodal@1.1.15) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/videoslidermodal

-
-
-
-
-
 ## [1.1.14](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.13...@wisdom-components/videoslidermodal@1.1.14) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/videoslidermodal

-
-
-
-
-
 ## [1.1.13](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.12...@wisdom-components/videoslidermodal@1.1.13) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/videoslidermodal

-
-
-
-
 ## [1.1.12](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.10...@wisdom-components/videoslidermodal@1.1.12) (2023-05-18)

 ### Bug Fixes

--- a/packages/base-components/VmsVideo/CHANGELOG.md
+++ b/packages/base-components/VmsVideo/CHANGELOG.md
 # Change Log

-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

 ## [1.2.11](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.10...@wisdom-components/VmsVideo@1.2.11) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/VmsVideo

-
-
-
-
-
 ## [1.2.10](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.9...@wisdom-components/VmsVideo@1.2.10) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/VmsVideo

-
-
-
-
-
 ## [1.2.9](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.8...@wisdom-components/VmsVideo@1.2.9) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/VmsVideo

-
-
-
-
 ## [1.2.8](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.7...@wisdom-components/VmsVideo@1.2.8) (2023-05-18)

 **Note:** Version bump only for package @wisdom-components/VmsVideo

--- a/packages/base-components/VmsVideo/src/demos/dmeo1.tsx
+++ b/packages/base-components/VmsVideo/src/demos/dmeo1.tsx
@@ -2,7 +2,7 @@
 * @Author: 634665781 634665781@qq.com
 * @Date: 2023-04-11 13:40:18
 * @LastEditors: 634665781 634665781@qq.com
- * @LastEditTime: 2023-05-18 15:15:16
+ * @LastEditTime: 2023-05-22 10:06:05
 * @FilePath: \wisdom-components\packages\base-components\TestVideo\src\demos\dmeo1.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
@@ -40,14 +40,14 @@ const Demo1 = (props) => {
  let VideoParam = {
    id: '11F102BC-CE03-4E32-AE60-F297934DFE3F', // 398993BB-A795-4237-BE75-B6A7EC9D675
    name: '琼海电信小区', // 设备名称
-    protocol: '萤石云HTTP-FLV', // 萤石EZOPE 萤石HTTP-FLV RTSP GB28181
+    protocol: '萤石EZOPEN', // 萤石EZOPE 萤石HTTP-FLV RTSP GB28181
    username: '6c44c8e92d1c4d75a9818756025df550',
    password: '78b7dc88f9f4bf19c2b1aabfdd995244',
    dataRate: 'Sub', // Main 主码流  Sub 子码流
    pandavmsHost: `ws://192.168.8.27:9876/`, // pandavms后端主机地址 eg:  ws://172.16.19.19:8080/
    address: '236644034',
- //   width: 952,
- //   height: 500,
+    //   width: 952,
+    //   height: 500,
  };

  /* {

--- a/packages/base-components/VmsVideo/src/index.jsx
+++ b/packages/base-components/VmsVideo/src/index.jsx
@@ -2,7 +2,7 @@
 * @Author: 634665781 634665781@qq.com
 * @Date: 2023-04-11 13:40:18
 * @LastEditors: 634665781 634665781@qq.com
- * @LastEditTime: 2023-05-18 15:48:59
+ * @LastEditTime: 2023-05-22 10:29:23
 * @FilePath: \wisdom-components\packages\base-components\VmsVideo\src\index.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
@@ -82,7 +82,7 @@ const Video = (props, ref) => {
          url: `ezopen://open.ys7.com/${VideoInfo.address}/${VideoInfo.channel || 1}.hd.live`,
          templete: 'simple',
          footer: ['talk', 'broadcast', 'hd', 'fullScreen'],
-          width: VideoInfo.width || refs?.current?.offsetWidth|| 952,
+          width: VideoInfo.width || refs?.current?.offsetWidth || 952,
          height: VideoInfo.height || refs?.current?.offsetHeight || 500,
        });

@@ -97,6 +97,29 @@ const Video = (props, ref) => {
        } catch (e) {}
      });
  };
+  const resizeUpdate = (e) => {
+    // 通过事件对象获取浏览器窗口的高度
+    setWidth(refs.current.offsetWidth);
+    setHeight(refs.current.offsetHeight);
+  //  PlayersA?.stop?.()
+  console.log(PlayersA,'视频对象');
+  PlayersA.stop()
+    getToken()
+};
+
+useEffect(() => {
+    // 页面刚加载完成后获取浏览器窗口的大小
+    setWidth(refs.current.offsetWidth);
+    setHeight(refs.current.offsetHeight);
+
+    // 页面变化时获取浏览器窗口的大小 
+    window.addEventListener('resize', resizeUpdate);
+
+    return () => {
+        // 组件销毁时移除监听事件
+        window.removeEventListener('resize', resizeUpdate);
+    }
+}, [])

  if (VideoInfo.protocol != '萤石EZOPEN') {
    useImperativeHandle(ref, () => {