@tencentcloud/roomkit-electron-vue3 2.3.3

package/src/TUIRoom/utils/adapter.ts

@@ -0,0 +1,36 @@
+import { isWeChat } from './environment';
+declare let uni: any;
+
+export const clipBoard = (data: any): Promise<{
+  code: number,
+  data?: any,
+  err?: any
+}> => new Promise((resolve, reject) => {
+  if (!isWeChat) {
+    try {
+      navigator.clipboard.writeText(`${data}`);
+      resolve({ code: 0, data });
+    } catch (err) {
+      reject({ code: -1, err });
+    }
+    return;
+  }
+  uni.setClipboardData({
+    data,
+    success() {
+      uni.getClipboardData({
+        success(data: any) {
+          resolve({ code: 0, data });
+        },
+        fail(err: any) {
+          reject({ code: -1, err });
+        },
+      });
+    },
+    fail(err: any) {
+      reject({ code: -1, err });
+    },
+  });
+});
+
+

package/src/TUIRoom/utils/aegis/config.ts

@@ -0,0 +1,22 @@
+/**
+ * Configuration required isUploadLoaded, aegisId, projectName
+ * isUploadLoaded: Upload loaded event
+ * isUploadDetailEvent: Upload loaded and other events
+ * aegisId: aegis Id
+ * projectName: projectName
+ */
+
+const { VITE_RUNTIME_ENV } = import.meta.env;
+const isUploadLoaded = ['github', 'official'].indexOf(VITE_RUNTIME_ENV) !== -1;
+const isUploadDetailEvent = VITE_RUNTIME_ENV === 'official';
+
+const aegisId = 'iHWefAYqooXkVQhcyK';
+
+const projectName = 'TUIRoomKit-Electron';
+
+export {
+  isUploadLoaded,
+  isUploadDetailEvent,
+  aegisId,
+  projectName,
+};

package/src/TUIRoom/utils/aegis/index.ts

@@ -0,0 +1,62 @@
+
+import { isUploadLoaded, isUploadDetailEvent, aegisId, projectName } from './config';
+
+let aegis: any;
+
+const script = document.createElement('script');
+script.type = 'text/javascript';
+script.src = 'https://cdn-go.cn/aegis/aegis-sdk/latest/aegis.min.js';
+document.getElementsByTagName('head')[0].appendChild(script);
+
+script.onload = () => {
+  // @ts-ignore
+  // eslint-disable-next-line no-undef
+  aegis = new Aegis({
+    id: aegisId,
+    uin: '',
+    reportApiSpeed: true, // interface speed measurement
+    reportAssetSpeed: true, // Static resource speed measurement
+    spa: true, // spa Page open
+  });
+  if (roomAegis.storedReportEventList) {
+    roomAegis.storedReportEventList.forEach((data) => {
+      aegis.reportEvent(data);
+    });
+  }
+};
+
+class TUIRoomAegis {
+  private sdkAppId: number = 0;
+  private projectName: string = projectName;
+  private isUploadLoaded: boolean = isUploadLoaded;
+  private isUploadDetailEvent: boolean = isUploadDetailEvent;
+  private hasUploadedEventList: Array<string> = [];
+
+  storedReportEventList: Array<any> = [];
+
+  setSdkAppId(sdkAppId: number) {
+    this.sdkAppId = sdkAppId;
+  }
+
+  reportEvent(data: { name: string, ext1: string }) {
+    if (!this.isUploadLoaded) {
+      return;
+    }
+    const { name: eventName, ext1: eventDesc } = data;
+    if (this.isUploadDetailEvent || eventName === 'loaded') {
+      const uploadData = { ...data, ext2: this.projectName, ext3: this.sdkAppId };
+      if (aegis) {
+        if (this.hasUploadedEventList.indexOf(`${eventName}_${eventDesc}`) < 0) {
+          this.hasUploadedEventList.push(`${eventName}_${eventDesc}`);
+          aegis.reportEvent(uploadData);
+        }
+      } else {
+        this.storedReportEventList.push(uploadData);
+      }
+    }
+  }
+}
+
+const roomAegis = new TUIRoomAegis();
+
+export default roomAegis;

package/src/TUIRoom/utils/common/cookieStorage.js

@@ -0,0 +1,71 @@
+/* eslint-disable no-param-reassign */
+import Cookies from 'js-cookie';
+import logger from './logger';
+
+const SEVEN_DAYS = 7; // default 7 days
+const ONE_DAY_MILLISECOND = 864e5; // one day in milliseconds
+
+const cookieStorage = {
+  set(key, value, options = {}) {
+    // If using "file://" access protocol, the "document.domain" is empty string
+    if (document.domain) {
+      Cookies.set(key, value, options);
+    } else {
+      // Date type of options.expires must be number or Date. If not, use the default
+      if (typeof options.expires !== 'number' && !(options.expires instanceof Date)) {
+        options.expires = SEVEN_DAYS;
+      }
+      if (typeof options.expires === 'number') {
+        options.expires = new Date(Date.now() + options.expires * ONE_DAY_MILLISECOND);
+      }
+      if (options.expires) {
+        options.expires = options.expires.toUTCString();
+      }
+      window.localStorage.setItem(
+        `cookie_${key}`,
+        JSON.stringify({
+          value,
+          options,
+        }),
+      );
+    }
+  },
+  get(key) {
+    if (document.domain) {
+      return Cookies.get(key);
+    }
+    let value = null;
+    let cookieItem = window.localStorage.getItem(`cookie_${key}`);
+    if (cookieItem) {
+      try {
+        cookieItem = JSON.parse(cookieItem);
+        if (cookieItem?.options?.expires) {
+          const expires = new Date(cookieItem.options.expires).getTime();
+          if (expires > Date.now()) {
+            value = cookieItem.value;
+          } else {
+            // cookie has expired, remove it
+            this.remove(key);
+          }
+        } else {
+          // invalid cookie value
+          this.remove(key);
+        }
+      } catch (err) {
+        logger.warn(`[CookieStorage] come across invalid key/value: ${key}:${cookieItem}`);
+        this.remove(key);
+      }
+    }
+
+    return value;
+  },
+  remove(key) {
+    if (document.domain) {
+      Cookies.remove(key);
+    } else {
+      window.localStorage.removeItem(`cookie_${key}`);
+    }
+  },
+};
+
+export default cookieStorage;

package/src/TUIRoom/utils/common/logger/index.ts

@@ -0,0 +1,68 @@
+/*
+ * @Description: logger
+ * @Date: 2022-04-11 19:39:55
+ * @LastEditTime: 2022-04-12 11:37:24
+ */
+import { EUserEventNames } from './logger-constants';
+import { LogLevelType, LogContext, getLogPrefix } from './logger-utils';
+
+let currentLogLevel = LogLevelType.LOG_LEVEL_DEBUG;
+
+const logger = {
+  debug(...args: any[]) {
+    if (currentLogLevel <= LogLevelType.LOG_LEVEL_DEBUG) {
+      console.debug(`${getLogPrefix(LogContext.RENDER)}`, ...args);
+    }
+  },
+  log(...args: any[]) {
+    if (currentLogLevel <= LogLevelType.LOG_LEVEL_LOG) {
+      console.log(`${getLogPrefix(LogContext.RENDER)}`, ...args);
+    }
+  },
+  info(...args: any[]) {
+    if (currentLogLevel <= LogLevelType.LOG_LEVEL_INFO) {
+      console.info(`${getLogPrefix(LogContext.RENDER)}`, ...args);
+    }
+  },
+  warn(...args: any[]) {
+    if (currentLogLevel <= LogLevelType.LOG_LEVEL_WARN) {
+      console.warn(`${getLogPrefix(LogContext.RENDER)}`, ...args);
+    }
+  },
+  error(...args: any[]) {
+    if (currentLogLevel <= LogLevelType.LOG_LEVEL_ERROR) {
+      console.error(`${getLogPrefix(LogContext.RENDER)}`, ...args);
+    }
+  },
+  setLevel(newLevel: number) {
+    if (
+      newLevel >= LogLevelType.LOG_LEVEL_DEBUG &&
+      newLevel <= LogLevelType.LOG_LEVEL_NON_LOGGING
+    ) {
+      console.log(
+        `${getLogPrefix(
+          LogContext.RENDER
+        )} set log level from ${currentLogLevel} to ${newLevel}`
+      );
+      currentLogLevel = newLevel;
+
+      if ((window as any).electron?.ipcRenderer) {
+        (window as any).electron.ipcRenderer.send(
+          EUserEventNames.ON_CHANGE_LOG_LEVEL,
+          newLevel
+        );
+      }
+    } else {
+      console.error(
+        `${getLogPrefix(
+          LogContext.RENDER
+        )} logger.setLevel() invalid params:${newLevel}`
+      );
+    }
+  },
+  getLevel() {
+    return currentLogLevel;
+  },
+};
+
+export default logger;

package/src/TUIRoom/utils/common/logger/logger-constants.ts

@@ -0,0 +1,15 @@
+/**
+ * This constant defines the module, i.e., it is used for each ts module in the main directory, and also for the main/preload.
+ * js module, which is defined here in the node.js module format, and can be used for both of these types of modules.
+ *
+ * If this is defined as an ES 6 module (using import/export ),
+ * the preload.js module cannot be used because the preload.js file is a native node.js module executable,
+ * which can be considered for subsequent use if preload.js takes on too many responsibilities and has greater code complexity.
+ */
+export enum EUserEventNames {
+  ON_CHANGE_LOG_LEVEL = 'onChangeLogLevel',
+}
+
+export default {
+  EUserEventNames,
+};

package/src/TUIRoom/utils/common/logger/logger-utils.ts

@@ -0,0 +1,38 @@
+export const LogLevelType = {
+  LOG_LEVEL_DEBUG: -1,
+  LOG_LEVEL_LOG: 0,
+  LOG_LEVEL_INFO: 1,
+  LOG_LEVEL_WARN: 2,
+  LOG_LEVEL_ERROR: 3,
+  LOG_LEVEL_NON_LOGGING: 4, // No logging level, no logs will be printed
+};
+
+export enum LogContext {
+  MAIN = 'main-process',
+  RENDER = 'render-process',
+}
+
+function padMs(ms: number) {
+  const len = ms.toString().length;
+  let ret;
+  switch (len) {
+    case 1:
+      ret = `00${ms}`;
+      break;
+    case 2:
+      ret = `0${ms}`;
+      break;
+    default:
+      ret = ms;
+      break;
+  }
+
+  return ret;
+}
+
+export function getLogPrefix(context: LogContext) {
+  const date = new Date();
+  return `${date.toLocaleTimeString('en-US', {
+    hour12: false,
+  })}.${padMs(date.getMilliseconds())} [${context}]:`;
+}

package/src/TUIRoom/utils/common/mitt.js

@@ -0,0 +1,2 @@
+import Mitt from 'mitt';
+export default new Mitt();

package/src/TUIRoom/utils/common.ts

@@ -0,0 +1,26 @@
+import { getUrlParam } from './utils';
+
+/**
+ * Get Language
+ * @returns language
+ */
+export function getLanguage() {
+  let language = getUrlParam('lang') || localStorage.getItem('tuiRoom-language') || navigator.language || 'zh';
+  language = language.replace(/_/, '-').toLowerCase();
+
+  if (language === 'zh-cn' || language === 'zh') {
+    language = 'zh-CN';
+  } else if (language === 'en' || language === 'en-us' || language === 'en-GB') {
+    language = 'en-US';
+  }
+  return language;
+}
+
+/**
+ * Determine if a string is a number
+ * @returns boolean
+ */
+export function checkNumber(roomId: string) {
+  const reg = /^\d+$/;
+  return reg.test(roomId);
+}

package/src/TUIRoom/utils/constants.ts

@@ -0,0 +1,9 @@
+
+import * as Vue from 'vue';
+
+export const isVue27 = /^2\.7\.*/.test(Vue.version); // Is it Vue version 2.7
+
+export const isVue3 = /^3\.*/.test(Vue.version);  // Is it Vue version 2.7
+
+// @ts-ignore
+export const isInnerScene = import.meta && import.meta.env && import.meta.env.VITE_RUNTIME_SCENE === 'inner';

package/src/TUIRoom/utils/domOperation.ts

@@ -0,0 +1,184 @@
+import { isWeChat } from './environment';
+
+interface IDomRect {
+  id: string;
+  top: number;
+  left: number;
+  right: number;
+  width: number;
+  bottom: number;
+  height: number;
+  x?: number;
+  y?: number;
+}
+
+interface IScrollInfo {
+  scrollHeight: number;
+  scrollLeft: number;
+  scrollTop: number;
+  scrollWidth: number;
+  id: string;
+}
+
+interface IFields {
+  [key: string] :any;
+}
+
+declare const uni: any;
+
+type registeredPage = 'messageList';
+
+export const instanceMapping = new Map<registeredPage, any>();
+
+/**
+ *
+ * @param selector string: e.g. #app | .class
+ * @param instanceName string
+ * @returns Promise<IDomRect>
+ */
+export function getBoundingClientRect(selector: string | HTMLElement, instanceName?: registeredPage):
+Promise<IDomRect> {
+  if (!selector) return Promise.reject(new Error(`getBoundingClientRect() get error selector ${typeof selector}.`));
+
+  if (window || document) {
+    const dom: HTMLElement | null = typeof selector === 'object' ? selector : document.querySelector(selector);
+    if (!dom) return Promise.reject(new Error(`getBoundingClientRect() can't find ${selector} dom.`));
+    const domRect = dom.getBoundingClientRect();
+    return Promise.resolve({
+      id: dom.id,
+      top: domRect.top,
+      left: domRect.left,
+      right: domRect.right,
+      bottom: domRect.bottom,
+      width: domRect.width,
+      height: domRect.height,
+      x: domRect.x,
+      y: domRect.y,
+    });
+  }
+
+  if (isWeChat) {
+    if (!instanceName) return Promise.reject(new Error('uni.getBoundingClientRect() need instanceName in params.'));
+    const _query = uni.createSelectorQuery().in(instanceMapping.get(instanceName));
+    return new Promise((resolve, reject) => {
+      _query.select(selector).boundingClientRect((data: IDomRect) => {
+        if (data) {
+          resolve(data);
+        }
+      })
+        .exec();
+      setTimeout(() => reject(new Error(`uni.getBoundingClientRect(${selector}) timeout.`)), 500);
+    });
+  }
+
+  return Promise.reject(new Error('getBoundingClientRect() occur error'));
+}
+
+export function getBoundingClientRectSync(selector: string | HTMLElement): IDomRect {
+  if (isWeChat) {
+    throw new Error('getBoundingClientRectSync() can not use in uni-app.');
+  }
+
+  if (window || document) {
+    const dom: HTMLElement | null =      typeof selector === 'object'
+      ? selector
+      : document.querySelector(selector);
+    if (!dom) throw new Error(`getBoundingClientRectSync() can't find ${selector} dom.`);
+    const domRect = dom.getBoundingClientRect();
+    return {
+      id: dom.id,
+      top: domRect.top,
+      left: domRect.left,
+      right: domRect.right,
+      bottom: domRect.bottom,
+      width: domRect.width,
+      height: domRect.height,
+      x: domRect.x,
+      y: domRect.y,
+    };
+  }
+
+  throw new Error('getBoundingClientRectSync() occur error.');
+}
+
+/**
+ *
+ * @param selector string: e.g. #app | .class
+ * @param instanceName string
+ * @returns Promise<IScrollInfo>
+ */
+export function getScrollInfo(selector: string | HTMLElement, instanceName?: registeredPage): Promise<IScrollInfo> {
+  if (!selector) return Promise.reject(new Error(`getScrollInfo() get error selector ${typeof selector}.`));
+
+  if (!isWeChat && window) {
+    const dom: HTMLElement | null = typeof selector === 'object' ? selector : document.querySelector(selector);
+    if (!dom) return Promise.reject(new Error(`getScrollInfo() can't find ${selector} dom.`));
+    return Promise.resolve({
+      id: dom.id,
+      scrollTop: dom.scrollTop,
+      scrollLeft: dom.scrollLeft,
+      scrollWidth: dom.scrollWidth,
+      scrollHeight: dom.scrollHeight,
+    });
+  }
+
+  if (isWeChat) {
+    if (!instanceName) return Promise.reject(new Error('uni.getScrollInfo() need instanceName in params.'));
+    const _query = uni.createSelectorQuery().in(instanceMapping.get(instanceName));
+    return new Promise((resolve, reject) => {
+      _query.select(selector).scrollOffset((data: IScrollInfo) => {
+        if (data) {
+          resolve(data);
+        }
+      })
+        .exec();
+      setTimeout(() => reject(new Error(`uni.getScrollInfo(${selector}) timeout.`)), 500);
+    });
+  }
+
+  return Promise.reject(new Error('getScrollInfo() occur error'));
+}
+
+export function getScrollInfoSync(selector: string | HTMLElement): IScrollInfo {
+  if (isWeChat) {
+    throw new Error('getScrollInfoSync() can not use in uni-app.');
+  }
+
+  if (!isWeChat && window) {
+    const dom: HTMLElement | null =      typeof selector === 'object'
+      ? selector
+      : document.querySelector(selector);
+    if (!dom) throw new Error(`getScrollInfoSync() can't find ${selector} dom.`);
+    return {
+      id: dom.id,
+      scrollTop: dom.scrollTop,
+      scrollLeft: dom.scrollLeft,
+      scrollWidth: dom.scrollWidth,
+      scrollHeight: dom.scrollHeight,
+    };
+  }
+
+  throw new Error('getScrollInfoSync() occur error.');
+}
+
+export function getFields(selector: string | HTMLElement, instanceName?: registeredPage): Promise<IFields> {
+  if (isWeChat) {
+    if (!instanceName) return Promise.reject(new Error('uni.getFields() need instanceName in params.'));
+    const _query = uni.createSelectorQuery().in(instanceMapping.get(instanceName));
+    return new Promise((resolve, reject) => {
+      _query.select(selector).fields({
+        rect: true,
+        size: true,
+        scrollOffset: true,
+      }, (data: IFields) => {
+        if (data) {
+          resolve(data);
+        }
+      })
+        .exec();
+      setTimeout(() => reject(new Error(`get ${selector} fields timeout.`)), 500);
+    });
+  }
+
+  return Promise.reject(new Error('getFields() occur error'));
+}

package/src/TUIRoom/utils/environment.ts

@@ -0,0 +1,23 @@
+
+import { getPlatform } from '@tencentcloud/universal-api';
+
+
+declare const uni: any;
+
+export const isPC = getPlatform() === 'pc';
+
+export const isH5 = getPlatform() === 'h5';
+
+export const isWeChat = getPlatform() === 'wechat';
+
+export const isApp = getPlatform() === 'app';
+
+export const isUniFrameWork = typeof uni !== 'undefined';
+
+// H5, small programs, apps are considered mobile products, if you need to unify the mobile UI style, you can directly use isMobile to control
+export const isMobile = isH5 || isWeChat || isApp;
+
+export const isElectron = navigator.userAgent?.toLowerCase().indexOf(' electron/') > -1;
+
+// WeiXinBrowser
+export const isWeiXinBrowser = navigator && navigator.userAgent?.toLocaleLowerCase().indexOf('micromessenger') > -1;

package/src/TUIRoom/utils/mediaAbility.ts

@@ -0,0 +1,33 @@
+import { isElectron, isWeChat, isWeiXinBrowser } from './environment';
+import { isFunction } from './utils';
+
+// Whether to support getUserMedia to capture audio and video streams
+// Unsupported Browsers: qq Browser
+export const isGetUserMediaSupported = (function () {
+  if (isElectron || isWeChat) {
+    return true;
+  }
+  return navigator && navigator.mediaDevices && isFunction(navigator.mediaDevices.getUserMedia);
+}());
+
+// Whether or not getDisplayMedia is supported to capture screen sharing
+export const isGetDisplaySupported = (function () {
+  if (isElectron || isWeChat) {
+    return true;
+  }
+  return navigator && navigator.mediaDevices && isFunction(navigator.mediaDevices.getDisplayMedia);
+}());
+
+// Whether or not screen sharing capability is supported
+// Unsupported Browsers: mac 360 Browser
+export const isScreenShareSupported = isGetDisplaySupported && !isWeiXinBrowser;
+
+// Whether or not getting a list of devices is supported
+// Unsupported Browsers: mac 360 Browser
+export const isEnumerateDevicesSupported = (function () {
+  if (isElectron || isWeChat) {
+    return true;
+  }
+  return navigator
+    && navigator.mediaDevices && isFunction(navigator.mediaDevices.enumerateDevices);
+}());

package/src/TUIRoom/utils/toCanvas.ts

@@ -0,0 +1,70 @@
+const { requestAnimationFrame, cancelAnimationFrame } =  window;
+const canvasWidth = 1280;
+const canvasHeight = 720;
+
+type CanvasImageSource = HTMLImageElement | HTMLVideoElement | HTMLCanvasElement;
+
+export default class ToCanvas {
+  private sourceElement!: CanvasImageSource;
+
+  private timer: any;
+
+  public element!: HTMLCanvasElement;
+
+  private ctx: any;
+
+  constructor(Element: CanvasImageSource) {
+    if (!Element) {
+      return;
+    }
+    this.sourceElement = Element;
+    this.timer = null;
+    this.element = this.initCanvas();
+    this.ctx = this.element.getContext('2d');
+  }
+
+  initCanvas() {
+    const canvas = document.createElement('canvas');
+    canvas.width = canvasWidth;
+    canvas.height = canvasHeight;
+    canvas.style.width = '100%';
+    canvas.style.height = '100%';
+    return canvas;
+  }
+
+  drawFrame() {
+    this.ctx.drawImage(this.sourceElement, 0, 0, canvasWidth, canvasHeight);
+    this.element.style.objectFit = this.sourceElement.style.objectFit;
+    this.element.style.transform = this.sourceElement.style.transform;
+  }
+
+  play() {
+    this.timer = setAnimationFrame(this.drawFrame.bind(this));
+  }
+
+  stop() {
+    clearAnimationFrame(this.timer);
+  }
+}
+
+function setAnimationFrame(render: Function, stepTime = 24) {
+  let lastTime = Date.now();
+  let currentTime;
+  const timer = {
+    id: -1,
+  };
+  function animeLoop() {
+    currentTime = Date.now();
+    if (currentTime - lastTime > stepTime) {
+      lastTime = currentTime;
+      render();
+    }
+    timer.id = requestAnimationFrame(animeLoop);
+  }
+  animeLoop();
+  return timer;
+}
+
+function clearAnimationFrame(timer: any) {
+  cancelAnimationFrame(timer.id);
+}