Refact. Flutter web, peer cards (#7525)

Signed-off-by: fufesou <shuanglongchen@yeah.net>

flutter/web/js/src/codec.js

@@ -25,7 +25,7 @@ export async function loadVp9(callback) {
   // Multithreading is used only if `options.threading` is true.
   // This requires browser support for the new `SharedArrayBuffer` and `Atomics` APIs,
   // currently available in Firefox and Chrome with experimental flags enabled.
-  // 所有主流浏览器均默认于2018年1月5日禁用SharedArrayBuffer
+  // All major browsers disabled SharedArrayBuffer by default on January 5, 2018
   const isSIMD = await simd();
   console.log('isSIMD: ' + isSIMD);
   window.OGVLoader.loadClass(

flutter/web/js/src/connection.ts

@@ -453,6 +453,16 @@ export default class Connection {
     }
   }
 
+  changePreferCodec() {
+    const supported_decoding = message.SupportedDecoding.fromPartial({
+      ability_vp9: 1,
+      ability_h264: 1,
+    });
+    const option = message.OptionMessage.fromPartial({ supported_decoding });
+    const misc = message.Misc.fromPartial({ option });
+    this._ws?.sendMessage({ misc });
+  }
+
   async reconnect() {
     this.close();
     await this.start(this._id);
@@ -549,7 +559,15 @@ export default class Connection {
   handlePeerInfo(pi: message.PeerInfo) {
     localStorage.setItem('last_remote_id', this._id);
     this._peerInfo = pi;
+    if (pi.current_display > pi.displays.length) {
+      pi.current_display = 0;
+    }
+    if (globals.getVersionNumber(pi.version) < globals.getVersionNumber("1.1.10")) {
+      this.setPermission("restart", false);
+    }
     if (pi.displays.length == 0) {
+      this.setOption("info", pi);
+      globals.pushEvent("update_privacy_mode", {});
       this.msgbox("error", "Remote Error", "No Display");
       return;
     }
@@ -559,6 +577,7 @@ export default class Connection {
     if (p) this.inputOsPassword(p);
     const username = this.getOption("info")?.username;
     if (username && !pi.username) pi.username = username;
+    globals.pushEvent("update_privacy_mode", {});
     this.setOption("info", pi);
     if (this.getRemember()) {
       if (this._password?.length) {
@@ -573,6 +592,10 @@ export default class Connection {
     }
   }
 
+  setPermission(name: string, value: Boolean) {
+    globals.pushEvent("permission", { [name]: value });
+  }
+
   shouldAutoLogin(): string {
     const l = this.getOption("lock-after-session-end");
     const a = !!this.getOption("auto-login");
@@ -608,7 +631,7 @@ export default class Connection {
         default:
           return;
       }
-      globals.pushEvent("permission", { [name]: p.enabled });
+      this.setPermission(name, p.enabled);
     } else if (misc.switch_display) {
       this.loadVideoDecoder();
       globals.pushEvent("switch_display", misc.switch_display);

flutter/web/js/src/globals.js

@@ -288,22 +288,19 @@ window.setByName = (name, value) => {
       value = JSON.parse(value);
       localStorage.setItem(name + ':' + value.name, value.value);
       break;
-    case 'option:peer':
+    case 'option:session':
       value = JSON.parse(value);
       curConn.setOption(value.name, value.value);
       break;
+    case 'option:peer':
+      setPeerOption(value);
+      break;
     case 'input_os_password':
       curConn.inputOsPassword(value);
       break;
     case 'check_conn_status':
       curConn.checkConnStatus();
       break;
-    case 'remove_discovered':
-      removeDiscovered(value);
-      break;
-    case 'discover':
-      // TODO: discover
-      break;
     case 'session_add_sync':
       return sessionAdd(value);
     case 'session_start':
@@ -326,6 +323,13 @@ window.setByName = (name, value) => {
     case 'restart':
       curConn.restart();
       break;
+    case 'fav':
+      return localStorage.setItem('fav', value);
+    case 'query_onlines':
+      queryOnlines(value);
+      break;
+    case 'change_prefer_codec':
+      curConn.changePreferCodec(value);
     default:
       break;
   }
@@ -338,22 +342,8 @@ window.getByName = (name, arg) => {
   return JSON.stringify(v);
 }
 
-function getPeersForDart() {
-  const peers = [];
-  for (const [id, value] of Object.entries(getPeers())) {
-    if (!id) continue;
-    const tm = value['tm'];
-    const info = value['info'];
-    if (!tm || !info) continue;
-    peers.push([tm, id, info]);
-  }
-  return peers.sort().reverse().map(x => x.slice(1));
-}
-
 function _getByName(name, arg) {
   switch (name) {
-    case 'peers':
-      return getPeersForDart();
     case 'remote_id':
       return localStorage.getItem('remote-id');
     case 'remember':
@@ -384,8 +374,10 @@ function _getByName(name, arg) {
     case 'translate':
       arg = JSON.parse(arg);
       return translate(arg.locale, arg.text);
-    case 'option:peer':
+    case 'option:session':
       return curConn.getOption(arg);
+    case 'option:peer':
+      return getPeerOption(arg);
     case 'option:toggle':
       return curConn.getToggleOption(arg);
     case 'get_conn_status':
@@ -399,31 +391,27 @@ function _getByName(name, arg) {
     case 'version':
       return version;
     case 'load_recent_peers':
-      const peersRecent = localStorage.getItem('peers-recent');
-      if (peersRecent) {
-        onRegisteredEvent(JSON.stringify({ name: 'load_recent_peers', peers: peersRecent }));
-      }
+      loadRecentPeers();
       break;
     case 'load_fav_peers':
-      const peersFav = localStorage.getItem('peers-fav');
-      if (peersFav) {
-        onRegisteredEvent(JSON.stringify({ name: 'load_fav_peers', peers: peersFav }));
-      }
-      break;
-    case 'load_lan_peers':
-      const peersLan = localStorage.getItem('peers-lan');
-      if (peersLan) {
-        onRegisteredEvent(JSON.stringify({ name: 'load_lan_peers', peers: peersLan }));
-      }
+      loadFavPeers();
       break;
+    case 'fav':
+      return localStorage.getItem('fav') ?? '[]';
     case 'load_recent_peers_sync':
-      return localStorage.getItem('peers-recent') ?? '{}';
-    case 'load_lan_peers_sync':
-      return localStorage.getItem('peers-lan') ?? '{}';
+      return JSON.stringify({
+        peers: JSON.stringify(getRecentPeers())
+      });
     case 'api_server':
       return getApiServer();
     case 'is_using_public_server':
       return !localStorage.getItem('custom-rendezvous-server');
+    case 'get_version_number':
+      return getVersionNumber(arg);
+    case 'audit_server':
+      return getAuditServer(arg);
+    case 'alternative_codecs':
+      return getAlternativeCodecs();
   }
   return '';
 }
@@ -458,14 +446,6 @@ export function getPeers() {
   return getJsonObj('peers');
 }
 
-export function getRecentPeers() {
-  return getJsonObj('peers-recent');
-}
-
-export function getLanPeers() {
-  return getJsonObj('peers-lan');
-}
-
 export function getJsonObj(key) {
   try {
     return JSON.parse(localStorage.getItem(key)) || {};
@@ -486,7 +466,6 @@ export function copyToClipboard(text) {
   if (window.clipboardData && window.clipboardData.setData) {
     // Internet Explorer-specific code path to prevent textarea being shown while dialog is visible.
     return window.clipboardData.setData("Text", text);
-
   }
   else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
     var textarea = document.createElement("textarea");
@@ -507,17 +486,117 @@ export function copyToClipboard(text) {
   }
 }
 
-// ========================== peers begin ==========================
-function removeDiscovered(id) {
+// Dup to the function in hbb_common, lib.rs
+// Maybe we need to move this function to js part.
+export function getVersionNumber(v) {
   try {
-    const v = localStorage.getItem('discovered');
-    if (!v) return;
-    const discovered = JSON.parse(localStorage.getItem('discovered'));
-    delete discovered[id];
-    localStorage.setItem('discovered', JSON.stringify(discovered));
-  } catch (e) {
-    console.error(e);
+    let versions = v.split('-');
+
+    let n = 0;
+
+    // The first part is the version number.
+    // 1.1.10 -> 1001100, 1.2.3 -> 1001030, multiple the last number by 10
+    // to leave space for patch version.
+    if (versions.length > 0) {
+      let last = 0;
+      for (let x of versions[0].split('.')) {
+        last = parseInt(x) || 0;
+        n = n * 1000 + last;
+      }
+      n -= last;
+      n += last * 10;
+    }
+
+    if (versions.length > 1) {
+      n += parseInt(versions[1]) || 0;
+    }
+
+    // Ignore the rest
+
+    return n;
   }
+  catch (e) {
+    console.error('Failed to parse version number: "' + v + '" ' + e.message);
+    return 0;
+  }
+}
+
+function getPeerOption(value) {
+  try {
+    const obj = JSON.parse(value);
+    const options = getPeers()[obj.id] || {};
+    return options[obj.name] || '';
+  }
+  catch (e) {
+    console.error('Failed to get peer option: "' + value + '", ' + e.message);
+  }
+}
+
+function setPeerOption(value) {
+  try {
+    const obj = JSON.parse(value);
+    const id = obj.id;
+    const name = obj.name;
+    const value = obj.value;
+    const peers = getPeers();
+    const options = peers[id] || {};
+
+    if (value == undefined) {
+      delete options[name];
+    } else {
+      options[name] = value;
+    }
+    options["tm"] = new Date().getTime();
+    peers[id] = options;
+    localStorage.setItem("peers", JSON.stringify(peers));
+  }
+  catch (e) {
+    console.error('Failed to set peer option: "' + value + '", ' + e.message);
+  }
+}
+
+// ========================== peers begin ==========================
+function getRecentPeers() {
+  const peers = [];
+  for (const [id, value] of Object.entries(getPeers())) {
+    if (!id) continue;
+    const tm = value['tm'];
+    const info = value['info'];
+    const cardInfo = {
+      id: id,
+      username: info['username'] || '',
+      hostname: info['hostname'] || '',
+      platform: info['platform'] || '',
+      alias: value.alias || '',
+    };
+    if (!tm || !cardInfo) continue;
+    peers.push([tm, id, cardInfo]);
+  }
+  return peers.sort().reverse().map(x => x[2]);
+}
+
+function loadRecentPeers() {
+  const peersRecent = getRecentPeers();
+  if (peersRecent) {
+    onRegisteredEvent(JSON.stringify({ name: 'load_recent_peers', peers: JSON.stringify(peersRecent) }));
+  }
+}
+
+function loadFavPeers() {
+  try {
+    const fav = localStorage.getItem('fav') ?? '[]';
+    const favs = JSON.parse(fav);
+    const peersFav = getRecentPeers().filter(x => favs.includes(x.id));
+    if (peersFav) {
+      onRegisteredEvent(JSON.stringify({ name: 'load_fav_peers', peers: JSON.stringify(peersFav) }));
+    }
+  } catch (e) {
+    console.error('Failed to load fav peers: ' + e.message);
+  }
+}
+
+export function queryOnlines(value) {
+  // TODO: implement this
 }
 // ========================== peers end ===========================
 
@@ -587,6 +666,17 @@ function increasePort(host, offset) {
   return host;
 }
 
+function getAlternativeCodecs() {
+  return JSON.stringify({
+    vp8: 1,
+    av1: 0,
+    h264: 1,
+    h265: 1,
+  });
+}
+// ========================== settings end ===========================
+
+// ========================== server begin ==========================
 function getApiServer() {
   const api_server = localStorage.getItem('api-server');
   if (api_server) {
@@ -604,4 +694,15 @@ function getApiServer() {
   }
   return 'https://admin.rustdesk.com';
 }
-// ========================== settings end ===========================
+
+function getAuditServer(typ) {
+  if (!localStorage.getItem("access_token")) {
+    return '';
+  }
+  const api_server = getApiServer();
+  if (!api_server || api_server.includes('rustdesk.com')) {
+    return '';
+  }
+  return api_server + '/api/audit/' + typ;
+}
+// ========================== server end ============================