Merge pull request AgoraIO#74 from AgoraIO/tool/dev/lj

Tool/dev/lj

TroubleShooting/Agora-WebRTC-Troubleshooting/.gitignore

@@ -22,3 +22,4 @@ yarn-error.log*
 
 local_settings.js
 deploy.sh
+package-lock.json

TroubleShooting/Agora-WebRTC-Troubleshooting/package.json

@@ -11,6 +11,7 @@
     "echarts": "^4.7.0",
     "register-service-worker": "^1.0.0",
     "v-charts": "^1.19.0",
+    "vconsole": "^3.3.4",
     "vue": "^2.5.16",
     "vuetify": "^1.0.19"
   },

TroubleShooting/Agora-WebRTC-Troubleshooting/src/App.vue

@@ -271,20 +271,19 @@
           <v-dialog v-model="dialog" persistent max-width="360">
             <v-card>
               <v-card-title>
-                <v-tabs v-model="currentProfile">
+                <v-tabs>
                   <v-tab
                     v-for="(item, index) in ProfileForTry"
-                    @click="retry"
-                    :disabled="trying"
+                    @click="retry(index)"
                     :key="index"
                   >
-                    {{item}}
+                    {{item.resolution}}
                   </v-tab>
                 </v-tabs>
               </v-card-title>
               <v-card-text>
                 <div id="modal-video" v-if="!errMsgForTry">
-
+                  <div v-if="!showVideo">{{text.videoText}}</div>
                 </div>
                 <div v-else>{{errMsgForTry}}</div>
               </v-card-text>
@@ -312,10 +311,16 @@
 </template>
 
 <script>
+import  VConsole  from  'vconsole'
 import AgoraRtc from "agora-rtc-sdk";
 const langs = ['zh', 'en'];
 import { profileArray, APP_ID } from "./utils/settings";
 import * as i18n from './utils/i18n'
+
+// If need mobile phone terminal debugging
+// let vConsole = new VConsole()
+// console.log("test")
+
 export default {
   name: "App",
   components: {
@@ -333,8 +338,8 @@ export default {
       browserInfo: navigator.appVersion || "Current Browser",
       language: navigator.language.match(/^zh/) ? 0 : 1,
       sdkVersion: AgoraRtc.VERSION,
-      trying: false,
       snackbar: false,
+      showVideo: false,
       dialog: false,
       currentTestSuite: "-1",
       inputVolume: 0,
@@ -397,7 +402,20 @@ export default {
         ]
       },
       errMsgForTry: "",
-      ProfileForTry: ["480p_1", "720p_1", "1080p_1"],
+      ProfileForTry: [
+        {
+          resolution: "480p_1",
+          isSuccess: false
+        },
+        {
+          resolution: "720p_1",
+          isSuccess: false
+        },
+        {
+          resolution: "1080p_1",
+          isSuccess: false
+        },
+      ],
       currentProfile: 0
     };
   },
@@ -619,7 +637,7 @@ export default {
           audio: true,
           screen: false
         });
-        this.sendStream.setVideoProfile(profile.enum);
+        this.sendStream.setVideoProfile(profile.resolution);
         this.sendStream.init(
           () => {
             this.sendStream.play("test-send");
@@ -703,7 +721,7 @@ export default {
           ? (testSuite.extra = this.t("fully_supported"))
           : (testSuite.extra = this.t("some_functions_may_be_limited"));
         this.handleMicrophoneCheck();
-      }, 3000);
+      }, 1000);
     },
 
     handleMicrophoneCheck() {
@@ -735,7 +753,7 @@ export default {
               testSuite.extra = this.t("microphone_works_well");
             }
             this.handleSpeakerCheck();
-          }, 7000);
+          }, 1000);
         },
         err => {
           // do next test
@@ -805,7 +823,7 @@ export default {
 
       setTimeout(() => {
         this.handleConnectivityCheck();
-      }, 1500);
+      }, 500);
     },
 
     async handleConnectivityCheck() {
@@ -823,7 +841,7 @@ export default {
           this.testing = false;
           this.currentTestSuite = "5";
           this.snackbar = true;
-        }, 1500);
+        }, 500);
         return false;
       }
       // go on
@@ -863,37 +881,50 @@ export default {
             ${ this.t('Video_Packet_Loss')}: ${ videoPacketLoss } % </br>
             ${ this.t('Audio_Packet_Loss')}: ${ audioPacketLoss } % </br>`;
           }
-        }, 1500);
-      }, 21500);
+        }, 500);
+      }, 1500);
     },
 
     haveATry() {
       this.snackbar = false;
       this.dialog = true;
-      this.retry();
+      this.ProfileForTry.forEach((item) => {
+        let index = this.profiles.findIndex((profile) => {
+          return profile.resolution === item.resolution
+        })
+        if(index === -1) {
+          return
+        } 
+        item.isSuccess = this.profiles[index].status === 'resolve'
+      })
+      this.retry(0);
     },
 
-    retry() {
-      this.trying = true;
+    retry(currentIndex) {
       if (this.sendStream) {
         this.sendStream.stop();
         this.sendStream.close();
       }
+      //If the resolution is equal to not supported, 1. Do not play video stream; 2. Give error prompt
+      if (this.ProfileForTry[currentIndex].isSuccess) {
+        this.showVideo = true
+      } else {
+        this.showVideo = false
+        return
+      }
       this.sendStream = AgoraRtc.createStream({
         streamID: this.sendId,
         video: true,
         audio: true,
         screen: false
       });
-      this.sendStream.setVideoProfile(this.ProfileForTry[this.currentProfile]);
+      this.sendStream.setVideoProfile(this.ProfileForTry[currentIndex].resolution);
       this.sendStream.init(
         () => {
           this.sendStream.play("modal-video");
-          this.trying = false;
         },
         err => {
           this.errMsgForTry = err.msg;
-          this.trying = false;
         }
       );
     },

TroubleShooting/Agora-WebRTC-Troubleshooting/src/utils/i18n/en.js

@@ -48,5 +48,6 @@ export default {
   'packet_loss': 'Packet Loss',
   'Video_Packet_Loss': 'Video Packet Loss',
   'Audio_Packet_Loss': 'Audio Packet Loss',
-  'some_functions_may_be_limited': 'Some functions may be limited'
+  'some_functions_may_be_limited': 'Some functions may be limited',
+  'videoText': 'The device does not support the current resolution'
 }

TroubleShooting/Agora-WebRTC-Troubleshooting/src/utils/i18n/zh.js

@@ -49,4 +49,5 @@ export default {
   'Video_Packet_Loss': '视频包丢失',
   'Audio_Packet_Loss': '音频包丢失',
   'some_functions_may_be_limited': '有些功能受限',
+  'videoText': '设备不支持当前分辨率',
 }

TroubleShooting/Agora-WebRTC-Troubleshooting/src/utils/settings.js

@@ -1,11 +1,11 @@
 export const profileArray = [
-  {enum: '120p', width: 160, height: 120},
-  {enum: '180p', width: 320, height: 180},
-  {enum: '240P', width: 320, height: 240},
-  {enum: '360p', width: 640, height: 360},
-  {enum: '480p', width: 640, height: 480},
-  {enum: '720p', width: 1280, height: 720},
-  {enum: '1080p', width: 1920, height: 1080}
+  {resolution: '120p_1', width: 160, height: 120},
+  {resolution: '180p_1', width: 320, height: 180},
+  {resolution: '240P_1', width: 320, height: 240},
+  {resolution: '360p_1', width: 640, height: 360},
+  {resolution: '480p_1', width: 640, height: 480},
+  {resolution: '720p_1', width: 1280, height: 720},
+  {resolution: '1080p_1', width: 1920, height: 1080}
 ]
 
-export const APP_ID = '' // input your app id here
+export const APP_ID = ''  // input your app id here