globals.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383
  1. import Connection from "./connection";
  2. import _sodium from "libsodium-wrappers";
  3. import { CursorData } from "./message";
  4. import { loadVp9 } from "./codec";
  5. import { checkIfRetry, version } from "./gen_js_from_hbb";
  6. import { initZstd, translate } from "./common";
  7. import PCMPlayer from "pcm-player";
  8. window.curConn = undefined;
  9. window.isMobile = () => {
  10. return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent)
  11. || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0, 4));
  12. }
  13. export function isDesktop() {
  14. return !isMobile();
  15. }
  16. export function msgbox(type, title, text) {
  17. if (!type || (type == 'error' && !text)) return;
  18. const text2 = text.toLowerCase();
  19. var hasRetry = checkIfRetry(type, title, text) ? 'true' : '';
  20. onGlobalEvent(JSON.stringify({ name: 'msgbox', type, title, text, hasRetry }));
  21. }
  22. function jsonfyForDart(payload) {
  23. var tmp = {};
  24. for (const [key, value] of Object.entries(payload)) {
  25. if (!key) continue;
  26. tmp[key] = value instanceof Uint8Array ? '[' + value.toString() + ']' : JSON.stringify(value);
  27. }
  28. return tmp;
  29. }
  30. export function pushEvent(name, payload) {
  31. payload = jsonfyForDart(payload);
  32. payload.name = name;
  33. onGlobalEvent(JSON.stringify(payload));
  34. }
  35. let yuvWorker;
  36. let yuvCanvas;
  37. let gl;
  38. let pixels;
  39. let flipPixels;
  40. let oldSize;
  41. if (YUVCanvas.WebGLFrameSink.isAvailable()) {
  42. var canvas = document.createElement('canvas');
  43. yuvCanvas = YUVCanvas.attach(canvas, { webGL: true });
  44. gl = canvas.getContext("webgl");
  45. } else {
  46. yuvWorker = new Worker("./yuv.js");
  47. }
  48. let testSpeed = [0, 0];
  49. export function draw(frame) {
  50. if (yuvWorker) {
  51. // frame's (y/u/v).bytes already detached, can not transferrable any more.
  52. yuvWorker.postMessage(frame);
  53. } else {
  54. var tm0 = new Date().getTime();
  55. yuvCanvas.drawFrame(frame);
  56. var width = canvas.width;
  57. var height = canvas.height;
  58. var size = width * height * 4;
  59. if (size != oldSize) {
  60. pixels = new Uint8Array(size);
  61. flipPixels = new Uint8Array(size);
  62. oldSize = size;
  63. }
  64. gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
  65. const row = width * 4;
  66. const end = (height - 1) * row;
  67. for (let i = 0; i < size; i += row) {
  68. flipPixels.set(pixels.subarray(i, i + row), end - i);
  69. }
  70. onRgba(flipPixels);
  71. testSpeed[1] += new Date().getTime() - tm0;
  72. testSpeed[0] += 1;
  73. if (testSpeed[0] > 30) {
  74. console.log('gl: ' + parseInt('' + testSpeed[1] / testSpeed[0]));
  75. testSpeed = [0, 0];
  76. }
  77. }
  78. /*
  79. var testCanvas = document.getElementById("test-yuv-decoder-canvas");
  80. if (testCanvas && currentFrame) {
  81. var ctx = testCanvas.getContext("2d");
  82. testCanvas.width = frame.format.displayWidth;
  83. testCanvas.height = frame.format.displayHeight;
  84. var img = ctx.createImageData(testCanvas.width, testCanvas.height);
  85. img.data.set(currentFrame);
  86. ctx.putImageData(img, 0, 0);
  87. }
  88. */
  89. }
  90. export function sendOffCanvas(c) {
  91. let canvas = c.transferControlToOffscreen();
  92. yuvWorker.postMessage({ canvas }, [canvas]);
  93. }
  94. export function setConn(conn) {
  95. window.curConn = conn;
  96. }
  97. export function getConn() {
  98. return window.curConn;
  99. }
  100. export async function startConn(id) {
  101. setByName('remote_id', id);
  102. await curConn.start(id);
  103. }
  104. export function close() {
  105. getConn()?.close();
  106. setConn(undefined);
  107. }
  108. export function newConn() {
  109. window.curConn?.close();
  110. const conn = new Connection();
  111. setConn(conn);
  112. return conn;
  113. }
  114. let sodium;
  115. export async function verify(signed, pk) {
  116. if (!sodium) {
  117. await _sodium.ready;
  118. sodium = _sodium;
  119. }
  120. if (typeof pk == 'string') {
  121. pk = decodeBase64(pk);
  122. }
  123. return sodium.crypto_sign_open(signed, pk);
  124. }
  125. export function decodeBase64(pk) {
  126. return sodium.from_base64(pk, sodium.base64_variants.ORIGINAL);
  127. }
  128. export function genBoxKeyPair() {
  129. const pair = sodium.crypto_box_keypair();
  130. const sk = pair.privateKey;
  131. const pk = pair.publicKey;
  132. return [sk, pk];
  133. }
  134. export function genSecretKey() {
  135. return sodium.crypto_secretbox_keygen();
  136. }
  137. export function seal(unsigned, theirPk, ourSk) {
  138. const nonce = Uint8Array.from(Array(24).fill(0));
  139. return sodium.crypto_box_easy(unsigned, nonce, theirPk, ourSk);
  140. }
  141. function makeOnce(value) {
  142. var byteArray = Array(24).fill(0);
  143. for (var index = 0; index < byteArray.length && value > 0; index++) {
  144. var byte = value & 0xff;
  145. byteArray[index] = byte;
  146. value = (value - byte) / 256;
  147. }
  148. return Uint8Array.from(byteArray);
  149. };
  150. export function encrypt(unsigned, nonce, key) {
  151. return sodium.crypto_secretbox_easy(unsigned, makeOnce(nonce), key);
  152. }
  153. export function decrypt(signed, nonce, key) {
  154. return sodium.crypto_secretbox_open_easy(signed, makeOnce(nonce), key);
  155. }
  156. window.setByName = (name, value) => {
  157. switch (name) {
  158. case 'remote_id':
  159. localStorage.setItem('remote-id', value);
  160. break;
  161. case 'connect':
  162. newConn();
  163. startConn(value);
  164. break;
  165. case 'login':
  166. value = JSON.parse(value);
  167. curConn.setRemember(value.remember == 'true');
  168. curConn.login(value.password);
  169. break;
  170. case 'close':
  171. close();
  172. break;
  173. case 'refresh':
  174. curConn.refresh();
  175. break;
  176. case 'reconnect':
  177. curConn.reconnect();
  178. break;
  179. case 'toggle_option':
  180. curConn.toggleOption(value);
  181. break;
  182. case 'image_quality':
  183. curConn.setImageQuality(value);
  184. break;
  185. case 'lock_screen':
  186. curConn.lockScreen();
  187. break;
  188. case 'ctrl_alt_del':
  189. curConn.ctrlAltDel();
  190. break;
  191. case 'switch_display':
  192. curConn.switchDisplay(value);
  193. break;
  194. case 'remove':
  195. const peers = getPeers();
  196. delete peers[value];
  197. localStorage.setItem('peers', JSON.stringify(peers));
  198. break;
  199. case 'input_key':
  200. value = JSON.parse(value);
  201. curConn.inputKey(value.name, value.down == 'true', value.press == 'true', value.alt == 'true', value.ctrl == 'true', value.shift == 'true', value.command == 'true');
  202. break;
  203. case 'input_string':
  204. curConn.inputString(value);
  205. break;
  206. case 'send_mouse':
  207. let mask = 0;
  208. value = JSON.parse(value);
  209. switch (value.type) {
  210. case 'down':
  211. mask = 1;
  212. break;
  213. case 'up':
  214. mask = 2;
  215. break;
  216. case 'wheel':
  217. mask = 3;
  218. break;
  219. }
  220. switch (value.buttons) {
  221. case 'left':
  222. mask |= 1 << 3;
  223. break;
  224. case 'right':
  225. mask |= 2 << 3;
  226. break;
  227. case 'wheel':
  228. mask |= 4 << 3;
  229. }
  230. curConn.inputMouse(mask, parseInt(value.x || '0'), parseInt(value.y || '0'), value.alt == 'true', value.ctrl == 'true', value.shift == 'true', value.command == 'true');
  231. break;
  232. case 'option':
  233. value = JSON.parse(value);
  234. localStorage.setItem(value.name, value.value);
  235. break;
  236. case 'peer_option':
  237. value = JSON.parse(value);
  238. curConn.setOption(value.name, value.value);
  239. break;
  240. case 'input_os_password':
  241. curConn.inputOsPassword(value);
  242. break;
  243. default:
  244. break;
  245. }
  246. }
  247. window.getByName = (name, arg) => {
  248. let v = _getByName(name, arg);
  249. if (typeof v == 'string' || v instanceof String) return v;
  250. if (v == undefined || v == null) return '';
  251. return JSON.stringify(v);
  252. }
  253. function getPeersForDart() {
  254. const peers = [];
  255. for (const [id, value] of Object.entries(getPeers())) {
  256. if (!id) continue;
  257. const tm = value['tm'];
  258. const info = value['info'];
  259. if (!tm || !info) continue;
  260. peers.push([tm, id, info]);
  261. }
  262. return peers.sort().reverse().map(x => x.slice(1));
  263. }
  264. function _getByName(name, arg) {
  265. switch (name) {
  266. case 'peers':
  267. return getPeersForDart();
  268. case 'remote_id':
  269. return localStorage.getItem('remote-id');
  270. case 'remember':
  271. return curConn.getRemember();
  272. case 'toggle_option':
  273. return curConn.getOption(arg) || false;
  274. case 'option':
  275. return localStorage.getItem(arg);
  276. case 'image_quality':
  277. return curConn.getImageQuality();
  278. case 'translate':
  279. arg = JSON.parse(arg);
  280. return translate(arg.locale, arg.text);
  281. case 'peer_option':
  282. return curConn.getOption(arg);
  283. case 'test_if_valid_server':
  284. break;
  285. case 'version':
  286. return version;
  287. }
  288. return '';
  289. }
  290. let opusWorker = new Worker("./libopus.js");
  291. let pcmPlayer;
  292. export function initAudio(channels, sampleRate) {
  293. pcmPlayer = newAudioPlayer(channels, sampleRate);
  294. opusWorker.postMessage({ channels, sampleRate });
  295. }
  296. export function playAudio(packet) {
  297. opusWorker.postMessage(packet, [packet.buffer]);
  298. }
  299. window.init = async () => {
  300. if (yuvWorker) {
  301. yuvWorker.onmessage = (e) => {
  302. onRgba(e.data);
  303. }
  304. }
  305. opusWorker.onmessage = (e) => {
  306. pcmPlayer.feed(e.data);
  307. }
  308. loadVp9(() => { });
  309. await initZstd();
  310. console.log('init done');
  311. }
  312. export function getPeers() {
  313. try {
  314. return JSON.parse(localStorage.getItem('peers')) || {};
  315. } catch (e) {
  316. return {};
  317. }
  318. }
  319. function newAudioPlayer(channels, sampleRate) {
  320. return new PCMPlayer({
  321. channels,
  322. sampleRate,
  323. flushingTime: 2000
  324. });
  325. }
  326. export function copyToClipboard(text) {
  327. if (window.clipboardData && window.clipboardData.setData) {
  328. // Internet Explorer-specific code path to prevent textarea being shown while dialog is visible.
  329. return window.clipboardData.setData("Text", text);
  330. }
  331. else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
  332. var textarea = document.createElement("textarea");
  333. textarea.textContent = text;
  334. textarea.style.position = "fixed"; // Prevent scrolling to bottom of page in Microsoft Edge.
  335. document.body.appendChild(textarea);
  336. textarea.select();
  337. try {
  338. return document.execCommand("copy"); // Security exception may be thrown by some browsers.
  339. }
  340. catch (ex) {
  341. console.warn("Copy to clipboard failed.", ex);
  342. // return prompt("Copy to clipboard: Ctrl+C, Enter", text);
  343. }
  344. finally {
  345. document.body.removeChild(textarea);
  346. }
  347. }
  348. }