react_hsbc_teller 1.2.6 → 1.2.7

package/package.json

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

package/packages/pages/foot/foot.jsx

@@ -66,7 +66,7 @@ export default class foot extends Component {
           );
           const defaultList = (
               <div className="total totalTwo">
-                  {
+                  {/* {
                       isWhiteboard&&<div className='footHover' onClick={this.switchExternal.bind(this)}>
                       <div className="one">
                           <img className="imgClass" src={require("../../assets/img/switchExternal.png").default} alt="" />
@@ -75,7 +75,7 @@ export default class foot extends Component {
                           </div>
                       </div>
                       </div>
-                  }
+                  } */}
                   
                   {
                       menus.map((item,index)=>{
@@ -90,6 +90,16 @@ export default class foot extends Component {
                               </div>
                               } */}
                               {
+                      item == 'BOARD'&&<div className='footHover' onClick={this.switchExternal.bind(this)}>
+                      <div className="one">
+                          <img className="imgClass" src={require("../../assets/img/switchExternal.png").default} alt="" />
+                          <div className="text">
+                              白板
+                          </div>
+                      </div>
+                      </div>
+                  }
+                              {
                                  item == 'SHARE' && <div className="one" onClick={this.sharedScreen.bind(this)}>
                                   <img className="imgClass" src={require("../../assets/img/Projection_screen.png").default} alt="" />
                                   <div className="text">

package/packages/pages/video/video.jsx

@@ -35,6 +35,7 @@ let pictureInPictureVideo
 let mix_stream
 let worker
 let streamShare
+let muteJson = new Map()
 message.config({
   getContainer: ()=>document.getElementById('allHSBC')
 })
@@ -1443,7 +1444,9 @@ class Video extends Component {
 
       } else if (Mival.typeId == 3100) {
         if (Mival.data.sessionId == this.state.sessionId) {
+          muteJson.set(Mival.data.userId, JSON.stringify(Mival)) 
           if (Mival.data.userId == this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId1").innerText).uid) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoOne: false
@@ -1456,6 +1459,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId2").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId2").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoTwo: false
@@ -1468,6 +1472,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId3").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId3").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoThree: false
@@ -1480,6 +1485,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId4").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId4").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoFour: false
@@ -1492,6 +1498,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId5").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId5").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoFive: false
@@ -1504,6 +1511,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId6").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId6").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoSix: false
@@ -1516,31 +1524,8 @@ class Video extends Component {
 
           }
 
-          if (Mival.data.userId == (document.getElementById("feedId6").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId6").innerText).uid : '')) {
-            if (Mival.muteStatus == 0) {
-              this.setState({
-                voiceVideoSix: false
-              })
-            } else if (Mival.muteStatus == 1) {
-              this.setState({
-                voiceVideoSix: true
-              })
-            }
-
-          }
-          if (Mival.data.userId == (document.getElementById("feedId6").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId6").innerText).uid : '')) {
-            if (Mival.muteStatus == 0) {
-              this.setState({
-                voiceVideoSix: false
-              })
-            } else if (Mival.muteStatus == 1) {
-              this.setState({
-                voiceVideoSix: true
-              })
-            }
-
-          }
           if (Mival.data.userId == (document.getElementById("feedId7").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId7").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoSeven: false
@@ -1553,6 +1538,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId8").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId8").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoEight: false
@@ -1565,6 +1551,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId9").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId9").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoNine: false
@@ -1577,6 +1564,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId10").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId10").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoTen: false
@@ -1589,6 +1577,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId11").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId11").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoEleven: false
@@ -1601,6 +1590,7 @@ class Video extends Component {
 
           }
           if (Mival.data.userId == (document.getElementById("feedId12").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId12").innerText).uid : '')) {
+            muteJson.delete(Mival.data.userId)
             if (Mival.muteStatus == 0) {
               this.setState({
                 voiceVideoTwelve: false
@@ -1873,6 +1863,12 @@ class Video extends Component {
       };
       this.mpaasSig(data);
     };
+    this.test_controller.OnSendTextMsgSucc = (msgId)=>{
+      console.log('发送成功',msgId)
+    }
+    this.test_controller.OnSendTextMsgFailed  =(msgId, code, msg)=>{
+      console.log('发送失败',msgId,code, msg)
+    }
     // 发布媒体流成功
     this.test_controller.OnPublishSucc = (sid) => {
       console.log('发布媒体流成功', sid)
@@ -1901,6 +1897,16 @@ class Video extends Component {
         this.timer = setInterval(
           () => {
             if(!this.state.voiceStatue && this.state.analyserHeight.get(sid).toFixed(2) > 0.1) {
+              // this.test_controller.SendTextMsg(JSON.stringify({
+              //   'typeId': 3200,
+              //   'decibelValue': this.state.analyserHeight.get(sid).toFixed(2),
+              //   "data": {
+              //     'sessionId': this.state.sessionId,
+              //     'userId': this.props.tellerAccount,
+              //     'data': (new Date()).valueOf()
+              //   }
+
+              // }))
               callNimIM('sendCustomCmdMsg', {
                 customId: this.state.imRoomId,
                 content: JSON.stringify({
@@ -1935,6 +1941,171 @@ class Video extends Component {
     this.test_controller.OnSubscribeSucc = (feed, sid) => {
       console.log('订阅媒体流成功', feed, sid);
       this.appGetUsername(sid)
+      console.log(muteJson,muteJson.size)
+      if(muteJson.size > 0) {
+        let userId = ''
+        if (muteJson.get(this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId1").innerText).uid)) {
+          userId = this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId1").innerText).uid
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoOne: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoOne: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId2").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId2").innerText).uid : '')) {
+          userId = document.getElementById("feedId2").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId2").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoTwo: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoTwo: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId3").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId3").innerText).uid : '')) {
+          userId = document.getElementById("feedId3").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId3").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoThree: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoThree: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId4").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId4").innerText).uid : '')) {
+          userId = document.getElementById("feedId4").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId4").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoFour: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoFour: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId5").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId5").innerText).uid : '')) {
+          userId = document.getElementById("feedId5").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId5").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoFive: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoFive: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId6").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId6").innerText).uid : '')) {
+          userId = document.getElementById("feedId6").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId6").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoSix: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoSix: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId7").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId7").innerText).uid : '')) {
+          userId = document.getElementById("feedId7").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId7").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoSeven: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoSeven: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId8").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId8").innerText).uid : '')) {
+          userId = document.getElementById("feedId8").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId8").innerText).uid : ''
+
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoEight: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoEight: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId9").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId9").innerText).uid : '')) {
+          userId = document.getElementById("feedId9").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId9").innerText).uid : ''
+
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoNine: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoNine: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId10").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId10").innerText).uid : '')) {
+          userId = document.getElementById("feedId10").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId10").innerText).uid : ''
+
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoTen: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoTen: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId11").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId11").innerText).uid : '')) {
+          userId = document.getElementById("feedId11").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId11").innerText).uid : ''
+
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoEleven: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoEleven: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        if (muteJson.get(document.getElementById("feedId12").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId12").innerText).uid : '')) {
+          userId = document.getElementById("feedId12").innerText ? this.seeList(this.state.roomCustomerList, 'feedId', document.getElementById("feedId12").innerText).uid : ''
+          if (JSON.parse(muteJson.get(userId)).muteStatus == 0) {
+            this.setState({
+              voiceVideoTwelve: false
+            })
+          } else if (JSON.parse(muteJson.get(userId)).muteStatus == 1) {
+            this.setState({
+              voiceVideoTwelve: true
+            })
+          }
+          muteJson.delete(userId)
+        }
+        console.log(muteJson,muteJson.length)
+      }
     };
     // 订阅媒体流失败
     this.test_controller.OnSubscribeFailed = (
@@ -2089,7 +2260,9 @@ class Video extends Component {
             if (config_param !== undefined) {
               config_param.need_volume_analyser = true
               console.log(config_param)
-              this.test_controller.Subscribe(config_param)
+              setTimeout(() => {
+                this.test_controller.Subscribe(config_param)
+              }, 2000);
             }
           })
         }
@@ -2122,12 +2295,11 @@ class Video extends Component {
         })
       }, function (code, message, data) {
       })
-      if(this.state.voiceStatue) {
         callNimIM('sendCustomCmdMsg', {
           customId: this.state.imRoomId,
           content: JSON.stringify({
             'typeId': 1013,
-            'muteStatus': 1,
+            'muteStatus': this.state.voiceStatue ? 1 : 0,
             'data': {
               'sessionId': this.state.sessionId,
               'userId': this.props.tellerAccount
@@ -2136,7 +2308,7 @@ class Video extends Component {
         }, function (code, message, data) {
           console.log(data)
         })
-      }
+      
       let array = this.state.roomCustomerList;
       let newArray = [...array];
       newArray.push({
@@ -2303,7 +2475,9 @@ class Video extends Component {
             config_param.need_volume_analyser = true
             console.log(config_param)
 
-            this.test_controller.Subscribe(config_param)
+            setTimeout(() => {
+              this.test_controller.Subscribe(config_param)
+            }, 2000);
 
           }
           // })
@@ -2784,7 +2958,7 @@ class Video extends Component {
       let number = 0
       for (var i = 0; i < 40; i++) {
         
-        let energy = (dataArray[step * i] / 256.0) * 80;
+        let energy = (dataArray[step * i] / 256.0) * 100;
         number = number + energy
         ctx.beginPath();
         ctx.fillStyle = this.props.voiceColor;
@@ -2795,7 +2969,6 @@ class Video extends Component {
         let startY = y1 - height  // 绘制起始点y
         ctx.fillRect(startX, startY, width, height)
         if(document.getElementById('publish_video1').name == sid && i == 39) {
-          console.log(number / 40 / 70,number / 40)
           this.state.analyserHeight.set(sid,number / 40 / 70)
             this.state.analyserHeight = this.state.analyserHeight
         }
@@ -3772,35 +3945,19 @@ class Video extends Component {
       this.signCanvas.current.canvas.drawing.toDataURL('image/png').replace(/data.+?;base64,/, "")
     )
   }
-  switchExternalAge = ()=>{
-    if(this.state.isSharedScreen) {
-      this.state.isSharedScreen = false
-      this.setState({
-        
-        screenName: '共享模式'
-      });
-      this.tabTitlesClick('RMScreen', 'delect')
-      if (this.state.isPictureInPicture) {
-        document.exitPictureInPicture()
-      }
-    }
 
-    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("allHSBC").getBoundingClientRect().left;
+    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
-    const height = bottom - top + 10
-    const x = left - 20 > 0 ? left - 20 : 0
+    const width = right - left + 50
+    const height = bottom - top
     canvas.width = width;
     canvas.height = height;
     videoMedia.addEventListener('play', (event) =>{
@@ -3809,7 +3966,7 @@ class Video extends Component {
       loop()
       function loop() {
           if (!$this.paused && !$this.ended) {
-            cobj.drawImage(videoMedia, x, top, width, height, 0, 0,width, height,);
+            cobj.drawImage(videoMedia, left, top, width, height, 0, 0,width, height,);
               setTimeout(loop, 1000 / 10); // drawing at 30fps
           }
       }
@@ -3844,6 +4001,9 @@ class Video extends Component {
       preferCurrentTab:true,
   })
   .then((stream) => {
+    if(streamShare) {
+      streamShare.getTracks().forEach(track => track.stop());
+    }
     videoMedia.srcObject = stream;
     stream.getVideoTracks()[0].applyConstraints({
       width: document.body.offsetWidth,
@@ -3881,12 +4041,9 @@ class Video extends Component {
           document.exitPictureInPicture()
         }
       }
-      this.navigatorClick()
-    } else {
-      this.messageClick('当前已经切换RM白板','success')
-
     }
-
+    
+    this.navigatorClick()
   }
   }
   switchSelect = (value) => {
@@ -4677,7 +4834,7 @@ class Video extends Component {
             invitationClick={this.invitationClick}
             customerFaceClick={this.customerFaceClick}
             ocrClick={this.ocrClick}
-            switchExternal={this.switchExternalAge}
+            switchExternal={this.switchExternal}
             inspection={this.inspection}
           ></Foot>
           <Modal cancelText="取消" okText="确定" visible={this.state.isModalVisible} onOk={this.handleOk}
@@ -4827,7 +4984,7 @@ sessionId: "",
   microphoneSize: 25,
   fontSize: '14',
   fontFamily: 'auto',
-  menus: ['SHARE', 'FRIES', 'OCR', 'INVITE', 'PIP'],
+  menus: ['BOARD','SHARE', 'FRIES', 'OCR', 'INVITE', 'PIP'],
   customLeaveRoom: '客户离开房间',
   meetingInfo: {
     title: '--',