From 5c9e8f476e2267ae74e8b03191b62d83ef260e5d Mon Sep 17 00:00:00 2001
From: yujiaxinwt <1157613664@qq.com>
Date: Fri, 30 Jun 2023 18:20:58 +0800
Subject: [PATCH] =?UTF-8?q?sdk=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 sdk/demo/demo.html       | 114 ++++++++++++++++++++++++++++++++++++---
 sdk/index.html           | 114 ++++++++++++++++++++++++++++++++++++---
 sdk/src/AppController.js |  27 ++++++++--
 sdk/src/CanvasPlayer.js  |   7 +--
 sdk/src/TouchHandler.js  |   4 ++
 5 files changed, 246 insertions(+), 20 deletions(-)

diff --git a/sdk/demo/demo.html b/sdk/demo/demo.html
index 2eff316..4bdcd17 100644
--- a/sdk/demo/demo.html
+++ b/sdk/demo/demo.html
@@ -95,6 +95,42 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
       .play-ctr-btn-mobile {
         flex: 1;
       }
+      .message-modal {
+        display: none;
+        width: 300px;
+        height: 200px;
+        position: absolute;
+        z-index: 999;
+        top: 50%;
+        left: 50%;
+        background-color: #fff;
+        border: 1px solid #dfe1e6;
+        border-radius: 5px;
+        transform: translate(-50%, -50%);
+      }
+      .header-content {
+        height: 20%;
+        line-height: 20%;
+        text-align: center;
+        font-size: 16px;
+      }
+      .body-content {
+        text-align: center;
+        height: 40%;
+      }
+
+      .footer-content {
+        height: 20%;
+        border-top: 1px solid #dfe1e6;
+      }
+
+      .button-alone {
+        width: 100%;
+        height: 100%;
+        border: none;
+        text-align: center;
+        background-color: #fff;
+      }
     </style>
   </head>
 
@@ -129,6 +165,17 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
         <div id="network-info">
           网络时延 <span id="network-delay"></span>ms 码率 <span id="network-bit-rate"></span>kbps
         </div>
+        <div class="message-modal" id="messageModal">
+          <div class="header-content">
+            <p>温馨提示</p>
+          </div>
+          <div class="body-content">
+            <p class="msg" id="msgContent"></p>
+          </div>
+          <div class="footer-content">
+            <button class="button-alone" onclick="closeModal()">退出</button>
+          </div>
+        </div>
       </div>
     </div>
     <div class="section-center">
@@ -157,6 +204,15 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
     <script type="text/javascript"
             src="<%= htmlWebpackPlugin.files.chunks.CloudApp.entry %>"></script>
     <script type="text/javascript">
+      // 从url中获取ip和port
+      var urlParams = new URLSearchParams(window.location.search);
+      var urlIp = urlParams.get('ip');
+      var urlPort = urlParams.get('port');
+      if (urlIp && urlPort) {
+        let hostStr = urlIp + ':' + urlPort;
+        sessionStorage.setItem('cloudPhoneHost', hostStr);
+      }
+
       var cloudPhoneHost = sessionStorage.getItem('cloudPhoneHost');
       if (cloudPhoneHost) {
         var hostParams = cloudPhoneHost.split(':');
@@ -222,6 +278,8 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
           };
           var normalStates = [STATE_CONFIG.STARTED, STATE_CONFIG.RESUMED, STATE_CONFIG.MEDIA_CONFIG_SUCCESS];
           document.getElementById("loading").style.display = normalStates.includes(state) ? 'none' : 'block';
+          showAlertModal(data);
+          startsuccessCallBack(data);
         });
 
         cloudapp.on("netStateChange", function (event, data) {
@@ -255,16 +313,26 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
       }
 
       function exit() {
-        cloudapp.exit()
+        cloudapp.exit();
         var networkInfoElement = document.getElementById('network-info');
         networkInfoElement.hidden = true;
 
-        sessionStorage.removeItem('cloudPhoneHost');
-        const currentUrl = window.location.href;
-        if (currentUrl.indexOf('demo.html') > -1) {
-          window.location.href = currentUrl.replace('demo.html', 'enter.html');
-        } else {
-          window.location.href = currentUrl.replace('index', '');
+        let isAppUse = false;
+        try {
+          CasCallback.exit();
+          isAppUse = true;
+        } catch (error) {
+          isAppUse = false;
+        }
+        
+        if (!isAppUse) {
+          sessionStorage.removeItem('cloudPhoneHost');
+          const currentUrl = window.location.href;
+          if (currentUrl.indexOf('demo.html') > -1) {
+            window.location.href = currentUrl.replace('demo.html', 'enter.html');
+          } else {
+            window.location.href = currentUrl.replace('index', '');
+          }
         }
       }
 
@@ -321,6 +389,38 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
           }
         }
       }
+
+      function showAlertModal(data) {
+        const modalEle = document.getElementById('messageModal');
+        const msgEle = document.getElementById('msgContent');
+        const startSuccessState = 512;
+        // 连接成功需要关闭已显示的弹框
+        if (data.state === startSuccessState) {
+          if(modalEle.style.display === 'block') {
+            modalEle.style.display = 'none';
+            return;
+          }
+        }
+        if (data.tip) {
+          msgEle.innerHTML = data.tip;
+          modalEle.style.display = 'block';
+        }
+      }
+
+      function closeModal() {
+        const modalEle = document.getElementById('messageModal');
+        modalEle.style.display = 'none';
+        exit();
+      }
+
+      function startsuccessCallBack(data){
+        const connectSuccessState = 2048;
+        if (data.state === connectSuccessState) {
+          try {
+            CasCallback.startSuccessCallback();
+          } catch (error) {}
+        }
+      }
     </script>
   </body>
 
diff --git a/sdk/index.html b/sdk/index.html
index 77c56e9..ad7e654 100644
--- a/sdk/index.html
+++ b/sdk/index.html
@@ -16,7 +16,6 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
 
 <!DOCTYPE html>
 <html>
-
   <head>
     <title>h5 demo</title>
     <meta charset="utf-8" />
@@ -95,6 +94,43 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
         font-size: 14px;
       }
 
+      .message-modal {
+        display: none;
+        width: 300px;
+        height: 200px;
+        position: absolute;
+        z-index: 999;
+        top: 50%;
+        left: 50%;
+        background-color: #fff;
+        border: 1px solid #dfe1e6;
+        border-radius: 5px;
+        transform: translate(-50%, -50%);
+      }
+      .header-content {
+        height: 20%;
+        line-height: 20%;
+        text-align: center;
+        font-size: 16px;
+      }
+      .body-content {
+        text-align: center;
+        height: 40%;
+      }
+
+      .footer-content {
+        height: 20%;
+        border-top: 1px solid #dfe1e6;
+      }
+
+      .button-alone {
+        width: 100%;
+        height: 100%;
+        border: none;
+        text-align: center;
+        background-color: #fff;
+      }
+
     </style>
   </head>
 
@@ -132,6 +168,17 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
         <div id="network-info">
           网络时延 <span id="network-delay"></span>ms 码率 <span id="network-bit-rate"></span>kbps
         </div>
+        <div class="message-modal" id="messageModal">
+          <div class="header-content">
+            <p>温馨提示</p>
+          </div>
+          <div class="body-content">
+            <p class="msg" id="msgContent">hhhhhhhhhhh</p>
+          </div>
+          <div class="footer-content">
+            <button class="button-alone" onclick="closeModal()">退出</button>
+          </div>
+        </div>
       </div>
     </div>
     <div style="margin: 20px auto 10px;">
@@ -170,6 +217,15 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
     <script type="text/javascript"
             src="<%= htmlWebpackPlugin.files.chunks.CloudApp.entry %>"></script>
     <script type="text/javascript">
+      // 从url中获取ip和port
+      var urlParams = new URLSearchParams(window.location.search);
+      var urlIp = urlParams.get('ip');
+      var urlPort = urlParams.get('port');
+      if (urlIp && urlPort) {
+        let hostStr = urlIp + ':' + urlPort;
+        sessionStorage.setItem('cloudPhoneHost', hostStr);
+      }
+
       var cloudPhoneHost = sessionStorage.getItem('cloudPhoneHost');
       if (cloudPhoneHost) {
         var hostParams = cloudPhoneHost.split(':');
@@ -261,6 +317,8 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
 
             var normalStates = [STATE_CONFIG.STARTED, STATE_CONFIG.RESUMED, STATE_CONFIG.MEDIA_CONFIG_SUCCESS];
             document.getElementById("loading").style.display = normalStates.includes(state) ? 'none' : 'block';
+            showAlertModal(data);
+            startsuccessCallBack(data);
           });
 
           cloudapp.on("netStateChange", function (event, data) {
@@ -305,12 +363,22 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
         var networkInfoElement = document.getElementById('network-info');
         networkInfoElement.hidden = true;
 
-        sessionStorage.removeItem('cloudPhoneHost');
-        const currentUrl = window.location.href;
-        if (currentUrl.indexOf('index.html') > -1) {
-          window.location.href = currentUrl.replace('index.html', 'enter.html');
-        } else {
-          window.location.href = currentUrl.replace('index', '');
+        let isAppUse = false;
+        try {
+          CasCallback.exit();
+          isAppUse = true;
+        } catch (error) {
+          isAppUse = false;
+        }
+        
+        if (!isAppUse) {
+          sessionStorage.removeItem('cloudPhoneHost');
+          const currentUrl = window.location.href;
+          if (currentUrl.indexOf('index.html') > -1) {
+            window.location.href = currentUrl.replace('index.html', 'enter.html');
+          } else {
+            window.location.href = currentUrl.replace('index', '');
+          }
         }
       }
 
@@ -361,6 +429,38 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd.
         return decodeURIComponent(encodedStr);
       }
 
+      function showAlertModal(data) {
+        const modalEle = document.getElementById('messageModal');
+        const msgEle = document.getElementById('msgContent');
+        const startSuccessState = 512;
+        // 连接成功需要关闭已显示的弹框
+        if (data.state === startSuccessState) {
+          if(modalEle.style.display === 'block') {
+            modalEle.style.display = 'none';
+            return;
+          }
+        }
+        if (data.tip) {
+          msgEle.innerHTML = data.tip;
+          modalEle.style.display = 'block';
+        }
+      }
+
+      function closeModal() {
+        const modalEle = document.getElementById('messageModal');
+        modalEle.style.display = 'none';
+        exit();
+      }
+
+      function startsuccessCallBack(data){
+        const connectSuccessState = 2048;
+        if (data.state === connectSuccessState) {
+          try {
+            CasCallback.startSuccessCallback();
+          } catch (error) {}
+        }
+      }
+
     </script>
   </body>
 
diff --git a/sdk/src/AppController.js b/sdk/src/AppController.js
index 0dad8b1..3d23f67 100644
--- a/sdk/src/AppController.js
+++ b/sdk/src/AppController.js
@@ -52,7 +52,8 @@ const APP_STATE_FROM_CLIENT = {
     },
     'unreachable': {
         state: 769,
-        message: 'Server unreachable'
+        message: 'Server unreachable',
+        tip: '连接服务器失败，请稍后重试'
     },
     'reconnecting': {
         state: 2816,
@@ -60,9 +61,28 @@ const APP_STATE_FROM_CLIENT = {
     },
     'exit': {
         state: 5888,
-        message: 'Cloud Phone exit'
+        message: 'Cloud Phone exit',
+        tip: '已退出'
     }
 };
+const APP_STATE_ERROR_CODE_TIP = {
+    5888: '已退出',
+    769: '连接服务器失败，请稍后重试',
+    2308: '启动失败',
+    4353: '启动失败',
+    770: '资源正在使用中，请稍后',
+    65535: '与服务器连接出现异常',
+    1537: '认证失败',
+    1538: '认证失败',
+    1539: '认证失败',
+    1540: '认证失败',
+    1541: '认证失败',
+    1542: '认证失败',
+    3584: '试玩时间已到',
+    2560: '与服务器连接出现异常',
+    3840: '由于您长时间未操作游戏，服务断开',
+    4096: '切换后台超时'
+};
 const DEFAULT_VALUME_VALUE = 50;
 const WEBSOCKET_READY_STATE = {
     CONNECTING: 0,
@@ -643,7 +663,8 @@ class AppController {
                 break;
         }
 
-        this.appState = {state: Number(resp.code), message: resp.msg};
+        const tip = APP_STATE_ERROR_CODE_TIP[resp.code];
+        this.appState = {state: Number(resp.code), message: resp.msg, tip};
         this.subscribe.trigger('appStateChange', {...this.appState});
         if (needToTellExit) {
             this.appState = APP_STATE_FROM_CLIENT.exit;
diff --git a/sdk/src/CanvasPlayer.js b/sdk/src/CanvasPlayer.js
index c6b2e86..69dbb69 100644
--- a/sdk/src/CanvasPlayer.js
+++ b/sdk/src/CanvasPlayer.js
@@ -39,7 +39,7 @@ class CanvasPlayer extends BaseClass {
         /* javascript-obfuscator:enable */
         this.videoDecoderWorker.addEventListener('message', this.eventMessageHandel.bind(this));
 
-        this.loadjs();
+        // this.loadjs();
     }
 
     setCanvas () {
@@ -57,11 +57,11 @@ class CanvasPlayer extends BaseClass {
         });
     }
 
-    loadjs() {
+    loadjs(decoderType) {
         this.videoDecoderWorker.postMessage({
           type: 'loadwasm',
           libPath: this.options.libPath,
-          decoderType: this.options.decoderType
+          decoderType
         })
     }
     
@@ -157,6 +157,7 @@ class CanvasPlayer extends BaseClass {
     }
 
     decode(data) {
+        console.log('流数据：', data);
         /*global __IS_DEBUG__*/
         if (__IS_DEBUG__) {
             let traceId = window.delayAnalysis.shiftTraceId('receive') || '';
diff --git a/sdk/src/TouchHandler.js b/sdk/src/TouchHandler.js
index 8ba6370..73a9628 100644
--- a/sdk/src/TouchHandler.js
+++ b/sdk/src/TouchHandler.js
@@ -432,6 +432,10 @@ export default class TouchHandler {
      * touchleave ：移动的手指离开一个dom元素。
      */
     sendTouchMsg(touch, action) {
+        // 触控点不在player区域，不发送指令
+        if (touch.x > this.displayBox.width || touch.x < 0 || touch.y < 0 || touch.y > this.displayBox.height) {
+            return;
+        }
         let oritenation = this.isMobile && this.orientation === ORIENTATION_REVERSE_LANDSCAPE ? 0 : ORIENTATION_ORIGIN[this.orientation];
         const msg = {
             ...touch,
-- 
Gitee