react_hsbc_teller 1.1.4 → 1.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react_hsbc_teller",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "description": "React",
   "private": false,
   "main": "lib/hsbc.js",

package/packages/pages/video/video.jsx

@@ -255,6 +255,7 @@ class Video extends Component {
   };
   // 初始化视频
   ConnectMRTC = () => {
+    this.test_controller.SetLocalCodecType("H264")
     const config_param = {};
     config_param.auto_publish_subscribe = 4;
     config_param.media_type = 1;
@@ -1153,6 +1154,9 @@ class Video extends Component {
           if (Mival.type == 1) {
             this.switchExternal()
           } else if (Mival.type == 2) {
+            if(streamShare) {
+              streamShare.getTracks().forEach(track => track.stop());
+            }
             this.tabTitlesClick('RMWhiteboard', 'delect')
             if (this.state.isSharedScreen) {
               this.setState({
@@ -3280,7 +3284,6 @@ class Video extends Component {
     )
   }
   switchExternalAge = ()=>{
-    const that = this
     if(this.state.isSharedScreen) {
       this.state.isSharedScreen = false
       this.setState({
@@ -3293,26 +3296,30 @@ class Video extends Component {
       }
     }
 
+    this.navigatorClick()
+
+  }
+  navigatorClick=()=>{
+    const that = this
     const publish_config = {};
     const canvas = document.createElement('canvas');
     const videoMedia = document.getElementById('manedvideo');
     const cobj = canvas.getContext('2d'); // 获取绘图环境
     const left = document.getElementById("whiteboardDIV").getBoundingClientRect().left;
-    const right = document.getElementById("whiteboardDIV").getBoundingClientRect().right
     const top = document.getElementById("whiteboardDIV").getBoundingClientRect().top
-    const bottom = document.getElementById("whiteboardDIV").getBoundingClientRect().bottom
-    const width = right - left + 10
-    const height = bottom - top - 33
+    const right = document.getElementById("whiteboardDIV").getBoundingClientRect().right
+    const width =  left > 21 ? right : right + left
+    const height = document.getElementById("whiteboardDIV").getBoundingClientRect().height
     canvas.width = width;
     canvas.height = height;
-  videoMedia.addEventListener('play', (event) =>{
+    videoMedia.addEventListener('play', (event) =>{
       var $this = this; //cache
       console.log('addEventListener',!$this.paused,!$this.ended)
       loop()
       function loop() {
           if (!$this.paused && !$this.ended) {
-            cobj.drawImage(videoMedia, left-10, top, width, height, 0, 0,width, height,);
-            setTimeout(loop, 1000 / 10); // drawing at 30fps
+            cobj.drawImage(videoMedia, 0, top, width, height, 0, 0,width, height);
+              setTimeout(loop, 1000 / 10); // drawing at 30fps
           }
       }
       
@@ -3345,10 +3352,14 @@ class Video extends Component {
   })
   .then((stream) => {
     videoMedia.srcObject = stream;
+    stream.getVideoTracks()[0].applyConstraints({
+      width: document.body.offsetWidth,
+      height: document.body.offsetHeight
+    })
     streamShare = stream
     stream.getVideoTracks()[0].onended = async ()=>{
       //单击停止共享按钮后，触发这个事件
-      if(document.getElementById('video20').name && !this.state.isSharedScreen) {
+      if(document.getElementById('video20').name&&!this.state.isSharedScreen) {
         that.test_controller.UnPublish(document.getElementById('video20').name)
       }
       }
@@ -3357,9 +3368,8 @@ class Video extends Component {
   });
   }
   switchExternal = () => {
-    const that = this
+    
     if (!this.state.isWhiteboard) {
-      const publish_config = {};
       this.setState({
         isWhiteboard: true
       })
@@ -3378,67 +3388,7 @@ class Video extends Component {
           document.exitPictureInPicture()
         }
       }
-      const canvas = document.createElement('canvas');
-      const videoMedia = document.getElementById('manedvideo');
-      const cobj = canvas.getContext('2d'); // 获取绘图环境
-      const left = document.getElementById("whiteboardDIV").getBoundingClientRect().left;
-      const right = document.getElementById("whiteboardDIV").getBoundingClientRect().right
-      const top = document.getElementById("whiteboardDIV").getBoundingClientRect().top
-      const bottom = document.getElementById("whiteboardDIV").getBoundingClientRect().bottom
-      const width = right - left + 10
-      const height = bottom - top - 33
-      canvas.width = width;
-      canvas.height = height;
-      videoMedia.addEventListener('play', (event) =>{
-        var $this = this; //cache
-        console.log('addEventListener',!$this.paused,!$this.ended)
-        loop()
-        function loop() {
-            if (!$this.paused && !$this.ended) {
-              cobj.drawImage(videoMedia, left-10, top, width, height, 0, 0,width, height,);
-                setTimeout(loop, 1000 / 10); // drawing at 30fps
-            }
-        }
-        
-        if (document.getElementById('video20').name) {
-          // 代表已经有了进行切流
-          publish_config.publish_device = 5
-          publish_config.media_type = 1
-          publish_config.degradationType=2
-          publish_config.sid = document.getElementById('video20').name
-          publish_config.stream = canvas.captureStream(10)
-          publish_config.video_profile_type = 9
-          this.test_controller.ChangeMediaStream(publish_config);
-        } else {
-  
-          publish_config.media_type = 1
-          publish_config.publish_device = 5
-          publish_config.need_volume_analyser = true
-          publish_config.video_profile_type = 9
-          publish_config.degradationType=2
-          publish_config.stream = canvas.captureStream(10)
-          publish_config.publish_video_id = 'video20'
-          publish_config.publish_streamId_id = 'subscribe_streamId10'
-          publish_config.publish_tag = 'projectionWhiteboard'
-          this.test_controller.Publish(publish_config)
-        }
-    }, 0);
-      navigator.mediaDevices.getDisplayMedia({
-        video: true,
-        preferCurrentTab:true,
-    })
-    .then((stream) => {
-      videoMedia.srcObject = stream;
-      streamShare = stream
-      stream.getVideoTracks()[0].onended = async ()=>{
-        //单击停止共享按钮后，触发这个事件
-        if(document.getElementById('video20').name&&!this.state.isSharedScreen) {
-          that.test_controller.UnPublish(document.getElementById('video20').name)
-        }
-        }
-    }, error => {
-        console.log("Unable to acquire screen capture", error);
-    });
+      this.navigatorClick()
     } else {
       this.messageClick('当前已经切换RM白板','success')
 
@@ -3626,7 +3576,7 @@ class Video extends Component {
             <div className="projection"  style={{background: this.state.tabTitles.length > 0 ? '#f0f0f0' : '#ffffff'}}>
             {tabTitleList}
             {/* <img style={sectionStyle} src={require("../../assets/img/placeholder_bg.png").default} alt="" /> */}
-            <div id="whiteboardDIV" style={{height: this.state.tabTitles.length > 0 ? 'calc(100% - 33px)' : '100%'}}>
+            <div id="whiteboardDIV" style={{height: 'calc(100% - 33px)'}}>
             
               <div className="videoDiv" style={{ display: (this.state.isSelect == 'RMScreen') ? '' : 'none', }}>
                 <div className="videoDiv">

package/packages/pages/video/video.less

@@ -79,7 +79,7 @@
   height: 100%;
 }
 .health{
-  padding: 20px;
+  padding: 20Px;
   background: #f0f0f0;
 }
 .healthVideo{