update

src/Rtcp.js

@@ -120,7 +120,7 @@ export default class Rtcp extends EventEmitter {
             var o = this.inputChannel;
 			if(!this.actived || !this.inputChannel || this.inputChannel.readyState === "open"){
 				if(o != null){
-					console.log('发送webrtc数据：'+e)
+					// console.log('发送webrtc数据：'+e)
 					o.send(e)
 				}
 			}

src/Socket.js

@@ -1,273 +1,324 @@
-import Heartbeat from "./Heartbeat.js"
-import Timeout from "./Timeout.js"
-import InitNetworkTimeoutError from "./error/InitNetworkTimeoutError.js"
-import {reporter} from "./Reporter.js"
-import util from "./util.js"
-import InternalError from "./error/InternalError.js"
-import Logger from "./Logger.js"
+import Heartbeat from "./Heartbeat.js";
+import Timeout from "./Timeout.js";
+import InitNetworkTimeoutError from "./error/InitNetworkTimeoutError.js";
+import { reporter } from "./Reporter.js";
+import util from "./util.js";
+import InternalError from "./error/InternalError.js";
+import Logger from "./Logger.js";
 
-const logger = new Logger('ws')
+const logger = new Logger("ws");
 export default class Socket extends EventEmitter {
-    constructor(e) {
-        super();
-        E(this, "_ws");
-        E(this, "_openTimer");
-        E(this, "connected", !1);
-        E(this, "_hasTimeout", !1);
-        E(this, "heartbeat");
-        E(this, "latency", (e,t)=>this.send({
-            id: "checkLatency",
-            data: JSON.stringify(e),
-            packet_id: t
-        }));
-        E(this, "send", e=>{
-            if (this.wsNoReady())
-            {
-                return;
-            }
-            const t = JSON.stringify(e);
-            e.id !== "heartbeat" && logger.info("send ws frame", t);
-            this._ws.send(t)
-            // console.log('socket发送数据：'+t)
-        }
-        );
-        E(this, "startGame", ()=>{
-            const {roomId: e, userId: t, avatarId: r, skinId: n, role: o, avatarComponents: a, versionId: s, rotationRenderType: l, isAllSync: u, nickname: c, avatarScale: h, appId: f, camera: d, player: _, firends: g, syncByEvent: m, areaName: v, attitude: y, pathName: b, person: T, roomTypeId: C="", syncToOthers: A, hasAvatar: S, prioritySync: P, extra: R={}, removeWhenDisconnected: M} = this.network.room.currentNetworkOptions;
-            R.removeWhenDisconnected = M;
-            const x = {
-                id: "start",
-                room_id: e,
-                user_id: t,
-                trace_id: util.uuid(),
-                data: JSON.stringify({
-                    avatar_components: JSON.stringify(a),
-                    avatar_id: r,
-                    skin_id: n,
-                    is_host: o ? o == "host" : !0,
-                    skin_data_version: n !== void 0 && s !== void 0 ? n + s : void 0,
-                    rotation_render_type: l,
-                    is_all_sync: u,
-                    nick_name: encodeURIComponent(c || ""),
-                    app_id: f,
-                    camera: d,
-                    player: _,
-                    person: T,
-                    firends: JSON.stringify(g),
-                    sync_by_event: m,
-                    area_name: v,
-                    path_name: b,
-                    attitude: y,
-                    room_type_id: C,
-                    syncToOthers: A,
-                    hasAvatar: S,
-                    avatarSize: h,
-                    prioritySync: P,
-                    extra: JSON.stringify(R)
-                })
-            };
-            this.send(x);
-            const mt = JSON.parse(x.data);
-            delete mt.token;
-            logger.infoAndReportMeasurement({
-                metric: "startGame",
-                extra: mt,
-                startTime: Date.now()
-            })
-        }
-        );
-        this.network = e,
-        this.heartbeat = new Heartbeat({
-            ping: t=>{
-                var r;
-                if (!this.connected) {
-                    this.heartbeat.stop(),
-                    (r = e.room.stats) == null || r.assign({
-                        rtt: 0
-                    });
-                    return
-                }
-                this.send({
-                    id: "heartbeat",
-                    data: t
-                })
-            }
-            ,
-            pong(t) {
-                var r;
-                (r = e.room.stats) == null || r.assign({
-                    rtt: t
-                })
-            }
-        })
-    }
+  constructor(e) {
+    super();
+    E(this, "_ws");
+    E(this, "_openTimer");
+    E(this, "connected", !1);
+    E(this, "_hasTimeout", !1);
+    E(this, "heartbeat");
+    E(this, "latency", (e, t) =>
+      this.send({
+        id: "checkLatency",
+        data: JSON.stringify(e),
+        packet_id: t,
+      })
+    );
+    E(this, "send", (e) => {
+      if (this.wsNoReady()) {
+        return;
+      }
+      const t = JSON.stringify(e);
+      e.id !== "heartbeat" && logger.info("send ws frame", t);
+      this._ws.send(t);
+      // console.log('socket发送数据：'+t)
+    });
+    E(this, "startGame", () => {
+      const {
+        roomId: e,
+        userId: t,
+        avatarId: r,
+        skinId: n,
+        role: o,
+        avatarComponents: a,
+        versionId: s,
+        rotationRenderType: l,
+        isAllSync: u,
+        nickname: c,
+        avatarScale: h,
+        appId: f,
+        camera: d,
+        player: _,
+        firends: g,
+        syncByEvent: m,
+        areaName: v,
+        attitude: y,
+        pathName: b,
+        person: T,
+        roomTypeId: C = "",
+        syncToOthers: A,
+        hasAvatar: S,
+        prioritySync: P,
+        extra: R = {},
+        removeWhenDisconnected: M,
+      } = this.network.room.currentNetworkOptions;
+      R.removeWhenDisconnected = M;
+      const x = {
+        id: "start",
+        room_id: e,
+        user_id: t,
+        trace_id: util.uuid(),
+        data: JSON.stringify({
+          avatar_components: JSON.stringify(a),
+          avatar_id: r,
+          skin_id: n,
+          is_host: o ? o == "host" : !0,
+          skin_data_version: n !== void 0 && s !== void 0 ? n + s : void 0,
+          rotation_render_type: l,
+          is_all_sync: u,
+          nick_name: encodeURIComponent(c || ""),
+          app_id: f,
+          camera: d,
+          player: _,
+          person: T,
+          firends: JSON.stringify(g),
+          sync_by_event: m,
+          area_name: v,
+          path_name: b,
+          attitude: y,
+          room_type_id: C,
+          syncToOthers: A,
+          hasAvatar: S,
+          avatarSize: h,
+          prioritySync: P,
+          extra: JSON.stringify(R),
+        }),
+      };
+      this.send(x);
+      const mt = JSON.parse(x.data);
+      delete mt.token;
+      logger.infoAndReportMeasurement({
+        metric: "startGame",
+        extra: mt,
+        startTime: Date.now(),
+      });
+    });
+    (this.network = e),
+      (this.heartbeat = new Heartbeat({
+        ping: (t) => {
+          var r;
+          if (!this.connected) {
+            this.heartbeat.stop(),
+              (r = e.room.stats) == null ||
+                r.assign({
+                  rtt: 0,
+                });
+            return;
+          }
+          this.send({
+            id: "heartbeat",
+            data: t,
+          });
+        },
+        pong(t) {
+          var r;
+          (r = e.room.stats) == null ||
+            r.assign({
+              rtt: t,
+            });
+        },
+      }));
+  }
 
-    get connection() {
-        return this._ws
-    }
-    start() {
-        this._hasTimeout = !1;
-        const e = this.getAddress();
-        logger.info(`connecting to ${e}`);
-        const t = Date.now();
-        this._ws = new WebSocket(e),
-        this._openTimer = new Timeout(()=>{
-            const r = `Failed to open websocket in ${DEFAULT_OPEN_TIMEOUT_MS} ms`;
-            this._hasTimeout = !0,
-            this.emit("socketClosed", new InitNetworkTimeoutError(r))
-        }
-        ,DEFAULT_OPEN_TIMEOUT_MS),
-        this._ws.onopen = ()=>{
-            var r;
-            (r = this._openTimer) == null || r.clear(),
-            this.connected = !0,
-            this.heartbeat.start(),
-            this.network.room.currentNetworkOptions.reconnect || (logger.infoAndReportMeasurement({
-                metric: "wsOpenedAt",
-                group: "joinRoom",
-                startTime: this.network.room._startTime
+  get connection() {
+    return this._ws;
+  }
+  start() {
+    this._hasTimeout = !1;
+    const e = this.getAddress();
+    logger.info(`connecting to ${e}`);
+    const t = Date.now();
+    (this._ws = new WebSocket(e)),
+      (this._openTimer = new Timeout(() => {
+        const r = `Failed to open websocket in ${DEFAULT_OPEN_TIMEOUT_MS} ms`;
+        (this._hasTimeout = !0),
+          this.emit("socketClosed", new InitNetworkTimeoutError(r));
+      }, DEFAULT_OPEN_TIMEOUT_MS)),
+      (this._ws.onopen = () => {
+        var r;
+        (r = this._openTimer) == null || r.clear(),
+          (this.connected = !0),
+          this.heartbeat.start(),
+          this.network.room.currentNetworkOptions.reconnect ||
+            (logger.infoAndReportMeasurement({
+              metric: "wsOpenedAt",
+              group: "joinRoom",
+              startTime: this.network.room._startTime,
             }),
             logger.infoAndReportMeasurement({
-                metric: "wsOpenedCost",
-                group: "joinRoom",
-                startTime: t
-            }))
-        }
-        ,
-        this.handleWSEvent()
-    }
-    getAddress() {
-        const {wsServerUrl: e, reconnect: t, sessionId: r, token: n, roomId: o, userId: a, pageSession: s} = this.network.room.currentNetworkOptions
-          , l = this.network.room.skinId;
-        let u = e;
-        t && (u = u + `?reconnect=true&lastSessionID=${r}`);
-        const c = `userId=${a}&roomId=${o}&pageSession=${s}` + (this.network.room.isHost ? `&skinId=${l}` : "") + (n ? `&token=${n}` : "");
-        return u = u.indexOf("?") > -1 ? u + "&" + c : u + "?" + c,
-        u
-    }
-    handleWSEvent() {
-        const e = this._ws;
-        e.addEventListener("error", t=>{
-            this.connected = !1,
-            logger.error("webscoket error", t),
-            this.emit("socketClosed", new InternalError("connect to address error: " + this.network.room.currentNetworkOptions.wsServerUrl))
-        }
-        ),
-        e.addEventListener("close", t=>{
-            this.connected = !1,
-            this._onClose(t)
+              metric: "wsOpenedCost",
+              group: "joinRoom",
+              startTime: t,
+            }));
+      }),
+      this.handleWSEvent();
+  }
+  getAddress() {
+    const {
+        wsServerUrl: e,
+        reconnect: t,
+        sessionId: r,
+        token: n,
+        roomId: o,
+        userId: a,
+        pageSession: s,
+      } = this.network.room.currentNetworkOptions,
+      l = this.network.room.skinId;
+    let u = e;
+    t && (u = u + `?reconnect=true&lastSessionID=${r}`);
+    const c =
+      `userId=${a}&roomId=${o}&pageSession=${s}` +
+      (this.network.room.isHost ? `&skinId=${l}` : "") +
+      (n ? `&token=${n}` : "");
+    return (u = u.indexOf("?") > -1 ? u + "&" + c : u + "?" + c), u;
+  }
+  handleWSEvent() {
+    const e = this._ws;
+    e.addEventListener("error", (t) => {
+      (this.connected = !1),
+        logger.error("webscoket error", t),
+        this.emit(
+          "socketClosed",
+          new InternalError(
+            "connect to address error: " +
+              this.network.room.currentNetworkOptions.wsServerUrl
+          )
+        );
+    }),
+      e.addEventListener("close", (t) => {
+        (this.connected = !1), this._onClose(t);
+      }),
+      //接收数据
+      e.addEventListener("message", (t) => {
+        if (!t || this._hasTimeout || !this.connected) return;
+        let r = null;
+        try {
+          r = JSON.parse(t.data);
+          // console.log('接收socket数据：'+t.data)
+        } catch (o) {
+          logger.error(o);
+          return;
         }
-        ),
-        //接收数据
-        e.addEventListener("message", t=>{
-            if (!t || this._hasTimeout || !this.connected)
-                return;
-            let r = null;
-            try {
-                r = JSON.parse(t.data)
-                // console.log('接收socket数据：'+t.data)
-            } catch (o) {
-                logger.error(o);
-                return
-            }
-            if (!r)
-                return;
-            const n = r.id;
-            
-            if (!!n)
-                switch (n !== "heartbeat" && logger.info(`receive ws frame: ${t.data}`),
-                n) {
-                case "fail":
-                    break;
-                case "init":
-                    try {
-                        const o = r.data.slice(-37, -1);
-                        reporter.updateBody({
-                            serverSession: o
-                        })
-                    } catch (o) {
-                        console.error(o)
-                    }
-                    this.network.rtcp.start();
-                    break;
-                case "heartbeat":
-                    this.heartbeat.pong(r.data);
-                    break;
-                case "offer":
-                    this.network.rtcp.setRemoteDescription(r.data, this.network.stream.el);
-                    break;
-                case "ice_candidate":
-                    this.network.rtcp.addCandidate(r.data);
-                    break;
-                case "start":
-                    this.emit("gameRoomAvailable", r);
-                    break;
-                case "error":
-                    try {
-                        const {Code: o, Msg: a} = JSON.parse(r.data);
-                        if (o) {
-                            if (o == 3003)
-                                return this.emit("socketClosed", new TokenExpiredError);
-                            if (authenticationErrorCodes.indexOf(o) > -1)
-                                return this.emit("socketClosed", new AuthenticationError("\u9274\u6743\u9519\u8BEF:" + a));
-                            {
-                                const s = util.getErrorByCode(o);
-                                this.emit("socketClosed", new s(a))
-                            }
-                        }
-                    } catch (d) {
-                        const _ = new InternalError("JSON.parse websocket data error: " + r.data);
-                        logger.error(d, _);
-                        this.emit("socketClosed", _)
-                    }
-                    break;
-                case "checkLatency":
-                    {
-                        const o = r.packet_id
-                          , a = r.data.split(",");
-                        this.onLatencyCheck({
-                            packetId: o,
-                            addresses: a
-                        });
-                        break
-                    }
-                default:
-                    logger.warn("unkown ws message type", n, r)
+        if (!r) return;
+        const n = r.id;
+
+        if (!!n)
+          switch (
+            (n !== "heartbeat" && logger.info(`receive ws frame: ${t.data}`), n)
+          ) {
+            case "fail":
+              break;
+            case "init":
+              try {
+                const o = r.data.slice(-37, -1);
+                reporter.updateBody({
+                  serverSession: o,
+                });
+              } catch (o) {
+                console.error(o);
+              }
+              this.network.rtcp.start();
+              break;
+            case "heartbeat":
+              this.heartbeat.pong(r.data);
+              break;
+            case "offer":
+              this.network.rtcp.setRemoteDescription(
+                r.data,
+                this.network.stream.el
+              );
+              break;
+            case "ice_candidate":
+              this.network.rtcp.addCandidate(r.data);
+              break;
+            case "start":
+              console.log("server start", JSON.stringify(r));
+              this.emit("gameRoomAvailable", r);
+              break;
+            case "error":
+              try {
+                const { Code: o, Msg: a } = JSON.parse(r.data);
+                if (o) {
+                  if (o == 3003)
+                    return this.emit("socketClosed", new TokenExpiredError());
+                  if (authenticationErrorCodes.indexOf(o) > -1)
+                    return this.emit(
+                      "socketClosed",
+                      new AuthenticationError("\u9274\u6743\u9519\u8BEF:" + a)
+                    );
+                  {
+                    const s = util.getErrorByCode(o);
+                    this.emit("socketClosed", new s(a));
+                  }
                 }
-        }
-        )
-    }
-    onLatencyCheck(e) {
-        const t = [...new Set(e.addresses || [])];
-        Promise.all(t.map(r=>({
-            [r]: 9999
-        }))).then(r=>{
-            const n = Object.assign({}, ...r);
-            this.latency(n, e.packetId)
-        }
-        )
-    }
-    wsNoReady() {
-        return this._ws.readyState == WebSocket.CLOSED || this._ws.readyState == WebSocket.CLOSING || this._ws.readyState == WebSocket.CONNECTING
-    }
-    prepareReconnect() {
-        this._close({
-            code: WS_CLOSE_RECONNECT,
-            reason: "reconnect"
-        })
-    }
-    _onClose({code: e, reason: t}) {
-        this._openTimer && this._openTimer.clear(),
-        logger.warn(`ws closed: ${e} ` + t),
-        [WS_CLOSE_RECONNECT, WS_CLOSE_NORMAL].includes(e) || this.emit("socketClosed", new InternalError("Websocket error"))
-    }
-    _close({code: e, reason: t}) {
-        var r;
-        (r = this._ws) == null || r.close(e, t)
-    }
-    quit() {
-        this._close({
-            code: WS_CLOSE_NORMAL,
-            reason: "quit"
-        })
-    }
-}
+              } catch (d) {
+                const _ = new InternalError(
+                  "JSON.parse websocket data error: " + r.data
+                );
+                logger.error(d, _);
+                this.emit("socketClosed", _);
+              }
+              break;
+            case "checkLatency": {
+              const o = r.packet_id,
+                a = r.data.split(",");
+              this.onLatencyCheck({
+                packetId: o,
+                addresses: a,
+              });
+              break;
+            }
+            default:
+              logger.warn("unkown ws message type", n, r);
+          }
+      });
+  }
+  onLatencyCheck(e) {
+    const t = [...new Set(e.addresses || [])];
+    Promise.all(
+      t.map((r) => ({
+        [r]: 9999,
+      }))
+    ).then((r) => {
+      const n = Object.assign({}, ...r);
+      this.latency(n, e.packetId);
+    });
+  }
+  wsNoReady() {
+    return (
+      this._ws.readyState == WebSocket.CLOSED ||
+      this._ws.readyState == WebSocket.CLOSING ||
+      this._ws.readyState == WebSocket.CONNECTING
+    );
+  }
+  prepareReconnect() {
+    this._close({
+      code: WS_CLOSE_RECONNECT,
+      reason: "reconnect",
+    });
+  }
+  _onClose({ code: e, reason: t }) {
+    this._openTimer && this._openTimer.clear(),
+      logger.warn(`ws closed: ${e} ` + t),
+      [WS_CLOSE_RECONNECT, WS_CLOSE_NORMAL].includes(e) ||
+        this.emit("socketClosed", new InternalError("Websocket error"));
+  }
+  _close({ code: e, reason: t }) {
+    var r;
+    (r = this._ws) == null || r.close(e, t);
+  }
+  quit() {
+    this._close({
+      code: WS_CLOSE_NORMAL,
+      reason: "quit",
+    });
+  }
+}

src/Workers.js

@@ -62,7 +62,7 @@ export default class Workers {
       (this.SaveMediaStream = false),
       (this.packetsLost = 0),
       (this.showAllReceivedMetadata = false),
-      (this.firstMediaArraval = 0),
+      (this.firstMediaArrival = 0),
       (this.firstMediaReceived = false),
       (this.firstYUVDecoded = 0),
       (this.firstRender = 0),
@@ -465,6 +465,7 @@ export default class Workers {
     const i = Date.now(),
       o = i - e.data.postTs;
     this.postMessageWaitArray.add(o);
+
     if (!this.firstYUVReceived) {
       this.firstYUVDecoded = e.data.yuv_ts;
       const k = this.firstYUVDecoded - this.rtcp.network.room._startTime;
@@ -472,8 +473,8 @@ export default class Workers {
         metric: "firstYUVDecodedAt",
         value: k,
         group: "joinRoom",
-      }),
-        (this.firstRender = Date.now());
+      });
+      this.firstRender = Date.now();
       const j = this.firstYUVDecoded - this.rtcp.network.room._startTime;
       defaultLogger.infoAndReportMeasurement({
         metric: "firstRenderAt",
@@ -784,6 +785,11 @@ export default class Workers {
   UpdateYUV() {
     var i, o;
     const e = this.getPtr;
+
+    // console.log("UpdateYUV", this.getPtr);
+    // console.log("UpdateYUV", this.cachedMetas[e]);
+    // console.log("UpdateYUV",  this.cachedStreams[e]);
+
     if (this.cachedMetas[e] != null && !this.cachedRender[e]) {
       const s = Date.now();
       if (this.firstUpdateYUV) {
@@ -793,16 +799,19 @@ export default class Workers {
           metric: "firstUpdateStreamLength",
           value: $,
           group: "joinRoom",
-        }),
-          (this.firstUpdateYUV = false);
+        });
+        this.firstUpdateYUV = false;
       }
-      this.cachedStreams[e] != null &&
+
+      if (this.cachedStreams[e] != null) {
+        console.log("cachedStreams", this.cachedStreams[e], e);
         this.executeFunction("stream", {
           stream: this.cachedStreams[e],
           width: this.cachedResolution[e].width,
           height: this.cachedResolution[e].height,
           pts: this.cachedPtss[e],
         });
+      }
 
       const c = Date.now();
       this.cachedStreams[e] != null &&
@@ -1172,8 +1181,8 @@ export default class Workers {
         (this.decoderWorker.postMessage(Dt, [At.buffer]),
         !this.firstMediaReceived)
       ) {
-        this.firstMediaArraval = Date.now();
-        const Ct = this.firstMediaArraval - this.rtcp.network.room._startTime;
+        this.firstMediaArrival = Date.now();
+        const Ct = this.firstMediaArrival - this.rtcp.network.room._startTime;
 
         defaultLogger.infoAndReportMeasurement({
           metric: "firstMediaArravalAt",
@@ -1298,12 +1307,12 @@ export default class Workers {
           //有效Iframe
           console.error("IT", fCnt, It);
           console.error("IT", fCnt, JSON.stringify(Rt));
-          console.log("IT-fCnt", It.data);
+          // console.log("IT-fCnt", It.data);
 
           // this.downloadBlob(
           //   It.data.subarray(It.metaLen, It.metaLen + It.mediaLen),
-          //   `${It.frameCnt}.264`,
-          //   "application/json"
+          //   `${It.frameCnt}.v2p.264`,
+          //   "application/octet-stream"
           // );
 
           if (this.inPanoMode) {
@@ -1320,15 +1329,16 @@ export default class Workers {
             !this.firstMediaReceived)
           ) {
             // this.downloadBlob([gt.buffer], `gt.h264`, "application/octet-stream");
-            this.firstMediaArraval = Date.now();
+            this.firstMediaArrival = Date.now();
             const Dt =
-              this.firstMediaArraval - this.rtcp.network.room._startTime;
+              this.firstMediaArrival - this.rtcp.network.room._startTime;
             defaultLogger.infoAndReportMeasurement({
               metric: "firstMediaArravalAt",
               value: Dt,
               group: "joinRoom",
-            }),
-              (this.firstMediaReceived = true);
+            });
+            
+            this.firstMediaReceived = true;
           }
         } else
           this.cacheFrameComposes[At].size > nt &&
@@ -1406,7 +1416,7 @@ export default class Workers {
     }
     this.noWasmBytesReceived += e.byteLength;
     const o = JSON.parse(this.Stringify(i));
-    console.log("接受webrtc请求：" + JSON.stringify(o));
+    // console.log("接受webrtc请求：" + JSON.stringify(o));
     this.executeFunction("signal", {
       signal: o,
       pts: -1,

src/XMaterialComponent.js

@@ -1,317 +1,464 @@
-import XVideoRawYUV from "./XVideoRawYUV"
-import Logger from "./Logger.js"
+import XVideoRawYUV from "./XVideoRawYUV";
+import Logger from "./Logger.js";
 
-const logger = new Logger('XMaterial')
+const logger = new Logger("XMaterial");
 export default class XMaterialComponent {
-    constructor(e, t) {
-        E(this, "scene");
-        E(this, "engine");
-        E(this, "yuvInfo");
-        E(this, "shaderMode");
-        E(this, "_panoInfo");
-        E(this, "_dynamic_size");
-        E(this, "_dynamic_babylonpose");
-        E(this, "_dynamic_textures");
-        E(this, "_dynamic_shaders");
-        E(this, "_scenemanager");
-        E(this, "_videoTexture");
-        E(this, "_videoElement");
-        E(this, "_lowModelShader");
-        E(this, "_defaultShader");
-        E(this, "_inputYUV420", !0);
-        E(this, "_inputPanoYUV420", !0);
-        E(this, "_videoRawYUVTexArray");
-        E(this, "_isUpdateYUV", !0);
-        E(this, "initMaterial", async()=>new Promise((resolve,t)=>{
-            this._initDefaultShader();
-            if(this.shaderMode == 2){
-                this.initDynamicData(this._panoInfo.dynamicRange, this._panoInfo.width, this._panoInfo.height).then(()=>{
-                    this._initPureVideoShader();
-                    this._prepareRender(this.yuvInfo);
-                })
-            }
-            else if(this.shaderMode == 1){
-                this._initPureVideoShader();
-                this._prepareRender(this.yuvInfo);
-            }
-            // else if(this.shaderMode == 0){
-            //     resolve(!0)
-            // }
-            resolve(!0)
-            // this.shaderMode == 2 ? this.initDynamicData(this._panoInfo.dynamicRange, this._panoInfo.width, this._panoInfo.height).then(()=>{
-            //     this._initPureVideoShader(),
-            //     this._prepareRender(this.yuvInfo)
-            // }
-            // ) : this.shaderMode == 1 ? (this._initPureVideoShader(),
-            // this._prepareRender(this.yuvInfo)) : this.shaderMode == 0,
-            // resolve(!0)
-        }));
+  constructor(e, t) {
+    E(this, "scene");
+    E(this, "engine");
+    E(this, "yuvInfo");
+    E(this, "shaderMode");
+    E(this, "_panoInfo");
+    E(this, "_dynamic_size");
+    E(this, "_dynamic_babylonpose");
+    E(this, "_dynamic_textures");
+    E(this, "_dynamic_shaders");
+    E(this, "_scenemanager");
+    E(this, "_videoTexture");
+    E(this, "_videoElement");
+    E(this, "_lowModelShader");
+    E(this, "_defaultShader");
+    E(this, "_inputYUV420", !0);
+    E(this, "_inputPanoYUV420", !0);
+    E(this, "_videoRawYUVTexArray");
+    E(this, "_isUpdateYUV", !0);
+    E(
+      this,
+      "initMaterial",
+      async () =>
+        new Promise((resolve, t) => {
+          this._initDefaultShader();
+          if (this.shaderMode == 2) {
+            this.initDynamicData(
+              this._panoInfo.dynamicRange,
+              this._panoInfo.width,
+              this._panoInfo.height
+            ).then(() => {
+              this._initPureVideoShader();
+              this._prepareRender(this.yuvInfo);
+            });
+          } else if (this.shaderMode == 1) {
+            this._initPureVideoShader();
+            this._prepareRender(this.yuvInfo);
+          }
+          // else if(this.shaderMode == 0){
+          //     resolve(!0)
+          // }
+          resolve(!0);
+          // this.shaderMode == 2 ? this.initDynamicData(this._panoInfo.dynamicRange, this._panoInfo.width, this._panoInfo.height).then(()=>{
+          //     this._initPureVideoShader(),
+          //     this._prepareRender(this.yuvInfo)
+          // }
+          // ) : this.shaderMode == 1 ? (this._initPureVideoShader(),
+          // this._prepareRender(this.yuvInfo)) : this.shaderMode == 0,
+          // resolve(!0)
+        })
+    );
 
-        E(this, "_initPureVideoContent", focal_width_height=>{
-            if(this._inputYUV420){
-                if(this._videoRawYUVTexArray.getVideoYUVTex(0) != null){
-                    this._lowModelShader.setTexture("texture_video", this._videoRawYUVTexArray.getVideoYUVTex(0));
-                    this._lowModelShader.setFloat("isYUV", 1);
-                    BABYLON.Texture.WhenAllReady([this._videoRawYUVTexArray.getVideoYUVTex(0)], ()=>{
-                        this._changePureVideoLowModelShaderCanvasSize(focal_width_height)
-                    })
-                }
+    E(this, "_initPureVideoContent", (focal_width_height) => {
+      if (this._inputYUV420) {
+        if (this._videoRawYUVTexArray.getVideoYUVTex(0) != null) {
+          this._lowModelShader.setTexture(
+            "texture_video",
+            this._videoRawYUVTexArray.getVideoYUVTex(0)
+          );
+          this._lowModelShader.setFloat("isYUV", 1);
+          BABYLON.Texture.WhenAllReady(
+            [this._videoRawYUVTexArray.getVideoYUVTex(0)],
+            () => {
+              this._changePureVideoLowModelShaderCanvasSize(focal_width_height);
             }
-            // else{
-            //     this._videoElement = e.videoElement;
-            //     this._videoTexture || (this._videoTexture = new VideoTexture("InterVideoTexture",this._videoElement,this.scene,!0,!1));
-            //     BABYLON.Texture.WhenAllReady([this._videoTexture], ()=>{
-            //         this._changePureVideoLowModelShaderCanvasSize({
-            //             width: this._videoElement.height,
-            //             height: this._videoElement.width,
-            //             fov: e.fov
-            //         })
-            //     });
-            //     this._lowModelShader.setTexture("texture_video", this._videoTexture);
-            //     this._lowModelShader.setFloat("isYUV", 0);
-            // }
-        });
-
-        E(this, "_changePureVideoLowModelShaderCanvasSize", e=>{
-            var lowModelShader;
-            const fov = e.fov || 50
-            const width = e.width || 720
-            const height = e.height || 1280
-            const focus = width / (2 * Math.tan(Math.PI * fov / 360));
-            (lowModelShader = this._lowModelShader) == null || lowModelShader.setVector3("focal_width_height", new BABYLON.Vector3(focus,width,height))
+          );
         }
-        );
+      }
+      // else{
+      //     this._videoElement = e.videoElement;
+      //     this._videoTexture || (this._videoTexture = new VideoTexture("InterVideoTexture",this._videoElement,this.scene,!0,!1));
+      //     BABYLON.Texture.WhenAllReady([this._videoTexture], ()=>{
+      //         this._changePureVideoLowModelShaderCanvasSize({
+      //             width: this._videoElement.height,
+      //             height: this._videoElement.width,
+      //             fov: e.fov
+      //         })
+      //     });
+      //     this._lowModelShader.setTexture("texture_video", this._videoTexture);
+      //     this._lowModelShader.setFloat("isYUV", 0);
+      // }
+    });
 
-        E(this, "updateRawYUVData", (stream,width,height,fov=-1)=>{
-            var o, a;
-            fov == -1 && (fov = this.yuvInfo.fov);
-            if (this._isUpdateYUV == !0) {
-                console.log('执行：updateRawYUVData')
-                const s = {
-                    width: width,
-                    height: height,
-                    fov: fov
-                }
-                const videosResOriArrayIndex = this._videoRawYUVTexArray.findId(width, height)
-                const currentVideoId = this._videoRawYUVTexArray.getCurrentVideoTexId();
+    E(this, "_changePureVideoLowModelShaderCanvasSize", (e) => {
+      var lowModelShader;
+      const fov = e.fov || 50;
+      const width = e.width || 720;
+      const height = e.height || 1280;
+      const focus = width / (2 * Math.tan((Math.PI * fov) / 360));
+      (lowModelShader = this._lowModelShader) == null ||
+        lowModelShader.setVector3(
+          "focal_width_height",
+          new BABYLON.Vector3(focus, width, height)
+        );
+    });
 
-                if(currentVideoId < 0 || videosResOriArrayIndex != currentVideoId || fov != this.yuvInfo.fov)
-                {
-                    this.yuvInfo.width = width;
-                    this.yuvInfo.height = height;
-                    this.yuvInfo.fov = fov;
-                    this._videoRawYUVTexArray.setCurrentVideoTexId(videosResOriArrayIndex);
-                    this._changeVideoRes(videosResOriArrayIndex);
-                    this._changePureVideoLowModelShaderCanvasSize(s);
-                    this._scenemanager.cameraComponent.cameraFovChange(s);
-                    this._scenemanager.yuvInfo = s;
-                }
+    E(this, "updateRawYUVData", (stream, width, height, fov = -1) => {
+      var o, a;
+      fov == -1 && (fov = this.yuvInfo.fov);
+      if (this._isUpdateYUV == !0) {
+        console.log("执行：updateRawYUVData");
+        const s = {
+          width: width,
+          height: height,
+          fov: fov,
+        };
+        const videosResOriArrayIndex = this._videoRawYUVTexArray.findId(
+          width,
+          height
+        );
+        const currentVideoId = this._videoRawYUVTexArray.getCurrentVideoTexId();
 
-                let VideoTexture = this._videoRawYUVTexArray.getVideoYUVTex(videosResOriArrayIndex)
-                if(VideoTexture != null){
-                    VideoTexture.update(stream)
-                    VideoTexture.updateSamplingMode(BABYLON.Texture.BILINEAR_SAMPLINGMODE)
-                
-                }
-                //(o = this._videoRawYUVTexArray.getVideoYUVTex(videosResOriArrayIndex)) == null || o.update(stream),
-                //(a = this._videoRawYUVTexArray.getVideoYUVTex(videosResOriArrayIndex)) == null || a.updateSamplingMode(BABYLON.Texture.BILINEAR_SAMPLINGMODE)
-            }
+        if (
+          currentVideoId < 0 ||
+          videosResOriArrayIndex != currentVideoId ||
+          fov != this.yuvInfo.fov
+        ) {
+          this.yuvInfo.width = width;
+          this.yuvInfo.height = height;
+          this.yuvInfo.fov = fov;
+          this._videoRawYUVTexArray.setCurrentVideoTexId(
+            videosResOriArrayIndex
+          );
+          this._changeVideoRes(videosResOriArrayIndex);
+          this._changePureVideoLowModelShaderCanvasSize(s);
+          this._scenemanager.cameraComponent.cameraFovChange(s);
+          this._scenemanager.yuvInfo = s;
         }
+
+        let VideoTexture = this._videoRawYUVTexArray.getVideoYUVTex(
+          videosResOriArrayIndex
         );
-        E(this, "_changeVideoRes", e=>{
-            this._lowModelShader.setTexture("texture_video", this._videoRawYUVTexArray.getVideoYUVTex(e))
+        if (VideoTexture != null) {
+          console.log("stream", stream);
+          VideoTexture.update(stream);
+          VideoTexture.updateSamplingMode(
+            BABYLON.Texture.BILINEAR_SAMPLINGMODE
+          );
         }
-        );
+        //(o = this._videoRawYUVTexArray.getVideoYUVTex(videosResOriArrayIndex)) == null || o.update(stream),
+        //(a = this._videoRawYUVTexArray.getVideoYUVTex(videosResOriArrayIndex)) == null || a.updateSamplingMode(BABYLON.Texture.BILINEAR_SAMPLINGMODE)
+      }
+    });
+    E(this, "_changeVideoRes", (e) => {
+      this._lowModelShader.setTexture(
+        "texture_video",
+        this._videoRawYUVTexArray.getVideoYUVTex(e)
+      );
+    });
 
-        E(this, "initDynamicData", (dynamicRange,width,height)=>new Promise((resolve,reject)=>{
-            this.setDynamicSize(dynamicRange).then(a=>{
-                if (a) {
-                    for (let s = 0; s < dynamicRange; ++s)
-                        (l=>{
-                            this.initDynamicTexture(l, width, height),
-                            this.initDynamicShaders(l).then(()=>{
-                                this._updatePanoShaderInput(l)
-                            }
-                            )
-                        }
-                        )(s);
-                    resolve(!0)
-                } else
-                    reject(new XMaterialError(`[Engine] DynamicRoomSize (${dynamicRange}) is too small`))
-            }
-            )
-        }
-        ).catch(n=>logger.error(`[Engine] ${n}`)));
-        
-        E(this, "_initDefaultShader", ()=>{
-            this._defaultShader == null && (this._defaultShader = new BABYLON.GridMaterial("GridShader",this.scene),
-            this._defaultShader.gridRatio = 50,
-            this._defaultShader.lineColor = new BABYLON.Color3(0,0,.5),
-            this._defaultShader.majorUnitFrequency = 1,
-            this._defaultShader.mainColor = new BABYLON.Color3(.6,.6,.6),
-            this._defaultShader.backFaceCulling = !1)
-        }
+    E(this, "initDynamicData", (dynamicRange, width, height) =>
+      new Promise((resolve, reject) => {
+        this.setDynamicSize(dynamicRange).then((a) => {
+          if (a) {
+            for (let s = 0; s < dynamicRange; ++s)
+              ((l) => {
+                this.initDynamicTexture(l, width, height),
+                  this.initDynamicShaders(l).then(() => {
+                    this._updatePanoShaderInput(l);
+                  });
+              })(s);
+            resolve(!0);
+          } else
+            reject(
+              new XMaterialError(
+                `[Engine] DynamicRoomSize (${dynamicRange}) is too small`
+              )
+            );
+        });
+      }).catch((n) => logger.error(`[Engine] ${n}`))
+    );
+
+    E(this, "_initDefaultShader", () => {
+      this._defaultShader == null &&
+        ((this._defaultShader = new BABYLON.GridMaterial(
+          "GridShader",
+          this.scene
+        )),
+        (this._defaultShader.gridRatio = 50),
+        (this._defaultShader.lineColor = new BABYLON.Color3(0, 0, 0.5)),
+        (this._defaultShader.majorUnitFrequency = 1),
+        (this._defaultShader.mainColor = new BABYLON.Color3(0.6, 0.6, 0.6)),
+        (this._defaultShader.backFaceCulling = !1));
+    });
+    E(this, "_initPureVideoShader", () => {
+      if (this._lowModelShader == null) {
+        const e = new BABYLON.ShaderMaterial(
+          "PureVideoShader",
+          this.scene,
+          {
+            vertexSource: pureVideoVertex,
+            fragmentSource: pureVideoFragment,
+          },
+          {
+            attributes: [
+              "uv",
+              "position",
+              "world0",
+              "world1",
+              "world2",
+              "world3",
+            ],
+            uniforms: ["view", "projection", "worldViewProjection", "world"],
+            defines: ["#define SHADOWFULLFLOAT"],
+          }
         );
-        E(this, "_initPureVideoShader", ()=>{
-            if (this._lowModelShader == null) {
-                const e = new BABYLON.ShaderMaterial("PureVideoShader",this.scene,{
-                    vertexSource: pureVideoVertex,
-                    fragmentSource: pureVideoFragment
-                },{
-                    attributes: ["uv", "position", "world0", "world1", "world2", "world3"],
-                    uniforms: ["view", "projection", "worldViewProjection", "world"],
-                    defines: ["#define SHADOWFULLFLOAT"]
-                });
-                e.setTexture("shadowSampler", null),
-                e.setMatrix("lightSpaceMatrix", null),
-                e.setFloat("haveShadowLight", 0),
-                e.setTexture("texture_video", null),
-                e.setFloat("isYUV", this._inputYUV420 ? 1 : 0),
-                e.setFloat("fireworkLight", 0),
-                e.setVector3("fireworkLightPosition", new BABYLON.Vector3(0,0,0)),
-                e.setVector3("focal_width_height", new BABYLON.Vector3(772.022491,720,1280)),
-                e.backFaceCulling = !1,
-                this._lowModelShader = e
+        e.setTexture("shadowSampler", null),
+          e.setMatrix("lightSpaceMatrix", null),
+          e.setFloat("haveShadowLight", 0),
+          e.setTexture("texture_video", null),
+          e.setFloat("isYUV", this._inputYUV420 ? 1 : 0),
+          e.setFloat("fireworkLight", 0),
+          e.setVector3("fireworkLightPosition", new BABYLON.Vector3(0, 0, 0)),
+          e.setVector3(
+            "focal_width_height",
+            new BABYLON.Vector3(772.022491, 720, 1280)
+          ),
+          (e.backFaceCulling = !1),
+          (this._lowModelShader = e);
+      }
+    });
+    E(
+      this,
+      "setDynamicSize",
+      (e) =>
+        new Promise((t, r) => {
+          e >= 1 && e <= 100
+            ? ((this._dynamic_size = e), t(!0))
+            : ((this._dynamic_size = 1), t(!1));
+        })
+    );
+    E(this, "_isInDynamicRange", (e) => e < this._dynamic_size && e >= 0);
+    E(this, "initDynamicTexture", (e, t, r) => {
+      this._isInDynamicRange(e) &&
+        (this._dynamic_textures[e] != null &&
+          (this._dynamic_textures[e].dispose(),
+          (this._dynamic_textures[e] = null)),
+        (this._dynamic_textures[e] = new BABYLON.RawTexture(
+          null,
+          t,
+          r * 1.5,
+          BABYLON.Engine.TEXTUREFORMAT_LUMINANCE,
+          this.scene,
+          !1,
+          !0,
+          BABYLON.Texture.NEAREST_SAMPLINGMODE,
+          BABYLON.Engine.TEXTURETYPE_UNSIGNED_BYTE
+        )),
+        (this._dynamic_textures[e].name =
+          "Pano_Dynamic_" + e + "_" + Date.now()));
+    });
+    E(
+      this,
+      "initDynamicShaders",
+      (e) => (
+        logger.info("[Engine] Material init dynamic shader."),
+        new Promise((t, r) => {
+          this._dynamic_shaders[e] != null &&
+            this._dynamic_shaders[e].dispose();
+          const n = new BABYLON.ShaderMaterial(
+            "Pano_Shader_" + e,
+            this.scene,
+            {
+              vertexSource: panoVertex,
+              fragmentSource: panoFragment,
+            },
+            {
+              attributes: [
+                "uv",
+                "position",
+                "world0",
+                "world1",
+                "world2",
+                "world3",
+              ],
+              uniforms: ["view", "projection", "worldViewProjection", "world"],
+              defines: ["#define SHADOWFULLFLOAT"],
             }
-        }
-        );
-        E(this, "setDynamicSize", e=>new Promise((t,r)=>{
-            e >= 1 && e <= 100 ? (this._dynamic_size = e,
-            t(!0)) : (this._dynamic_size = 1,
-            t(!1))
-        }
-        ));
-        E(this, "_isInDynamicRange", e=>e < this._dynamic_size && e >= 0);
-        E(this, "initDynamicTexture", (e,t,r)=>{
-            this._isInDynamicRange(e) && (this._dynamic_textures[e] != null && (this._dynamic_textures[e].dispose(),
-            this._dynamic_textures[e] = null),
-            this._dynamic_textures[e] = new BABYLON.RawTexture(null,t,r * 1.5,BABYLON.Engine.TEXTUREFORMAT_LUMINANCE,this.scene,!1,!0,BABYLON.Texture.NEAREST_SAMPLINGMODE,BABYLON.Engine.TEXTURETYPE_UNSIGNED_BYTE),
-            this._dynamic_textures[e].name = "Pano_Dynamic_" + e + "_" + Date.now())
-        }
-        );
-        E(this, "initDynamicShaders", e=>(logger.info("[Engine] Material init dynamic shader."),
-        new Promise((t,r)=>{
-            this._dynamic_shaders[e] != null && this._dynamic_shaders[e].dispose();
-            const n = new BABYLON.ShaderMaterial("Pano_Shader_" + e,this.scene,{
-                vertexSource: panoVertex,
-                fragmentSource: panoFragment
-            },{
-                attributes: ["uv", "position", "world0", "world1", "world2", "world3"],
-                uniforms: ["view", "projection", "worldViewProjection", "world"],
-                defines: ["#define SHADOWFULLFLOAT"]
-            });
-            n.setTexture("texture_pano", null),
-            n.setVector3("centre_pose", new BABYLON.Vector3(0,0,0)),
+          );
+          n.setTexture("texture_pano", null),
+            n.setVector3("centre_pose", new BABYLON.Vector3(0, 0, 0)),
             n.setFloat("isYUV", this._inputPanoYUV420 ? 1 : 0),
             n.setTexture("shadowSampler", null),
             n.setMatrix("lightSpaceMatrix", null),
             n.setFloat("haveShadowLight", 0),
             n.setFloat("fireworkLight", 0),
-            n.setVector3("fireworkLightPosition", new BABYLON.Vector3(0,0,0)),
-            n.backFaceCulling = !1,
-            this._dynamic_shaders[e] = n,
-            t(!0)
-        }
-        )));
-        this._scenemanager = e,
-        this.scene = e.Scene,
-        this.engine = this.scene.getEngine(),
-        this.shaderMode = 1,
-        this._dynamic_textures = [],
-        this._dynamic_shaders = [],
-        this._dynamic_babylonpose = [],
-        this._videoRawYUVTexArray = new XVideoRawYUV(this.scene,t.videoResOriArray),
-        this.shaderMode = t.shaderMode,
-        t.yuvInfo != null && (this.yuvInfo = t.yuvInfo),
-        t.panoInfo != null && this.setPanoInfo(t.panoInfo)
-    }
+            n.setVector3("fireworkLightPosition", new BABYLON.Vector3(0, 0, 0)),
+            (n.backFaceCulling = !1),
+            (this._dynamic_shaders[e] = n),
+            t(!0);
+        })
+      )
+    );
+    (this._scenemanager = e),
+      (this.scene = e.Scene),
+      (this.engine = this.scene.getEngine()),
+      (this.shaderMode = 1),
+      (this._dynamic_textures = []),
+      (this._dynamic_shaders = []),
+      (this._dynamic_babylonpose = []),
+      (this._videoRawYUVTexArray = new XVideoRawYUV(
+        this.scene,
+        t.videoResOriArray
+      )),
+      (this.shaderMode = t.shaderMode),
+      t.yuvInfo != null && (this.yuvInfo = t.yuvInfo),
+      t.panoInfo != null && this.setPanoInfo(t.panoInfo);
+  }
 
-    stopYUVUpdate() {
-        this._isUpdateYUV = !1
-    }
-    allowYUVUpdate() {
-        this._isUpdateYUV = !0
-    }
-    setPanoInfo(e) {
-        this._panoInfo = e
-    }
-    _prepareRender(focal_width_height) {
-        if(focal_width_height){
-            this._initPureVideoContent(focal_width_height)
-            this._updatePureVideoShaderInput()
-        }
+  stopYUVUpdate() {
+    this._isUpdateYUV = !1;
+  }
+  allowYUVUpdate() {
+    this._isUpdateYUV = !0;
+  }
+  setPanoInfo(e) {
+    this._panoInfo = e;
+  }
+  _prepareRender(focal_width_height) {
+    if (focal_width_height) {
+      this._initPureVideoContent(focal_width_height);
+      this._updatePureVideoShaderInput();
     }
-    getPureVideoShader() {
-        return this._lowModelShader
+  }
+  getPureVideoShader() {
+    return this._lowModelShader;
+  }
+  getDefaultShader() {
+    return this._defaultShader;
+  }
+  updatePanoPartYUV(e, t, r) {
+    const n = t.subarray(0, r.width * r.height),
+      o = t.subarray(r.width * r.height, r.width * r.height * 1.25),
+      a = t.subarray(r.width * r.height * 1.25),
+      s = this._panoInfo.width,
+      l = this._panoInfo.height;
+    if (this._dynamic_textures[e] != null) {
+      const u = this._dynamic_textures[e].getInternalTexture();
+      if (u != null && u != null) {
+        const c = this.engine._getTextureTarget(u);
+        this.engine._bindTextureDirectly(c, u, !0),
+          this.engine.updateTextureData(
+            u,
+            n,
+            r.startX,
+            l * 1.5 - r.startY - r.height,
+            r.width,
+            r.height
+          ),
+          this.engine.updateTextureData(
+            u,
+            o,
+            r.startX * 0.5,
+            (l - r.startY - r.height) * 0.5,
+            r.width * 0.5 - 1,
+            r.height * 0.5 - 1
+          ),
+          this.engine.updateTextureData(
+            u,
+            a,
+            r.startX * 0.5 + s * 0.5,
+            (l - r.startY - r.height) * 0.5,
+            r.width * 0.5,
+            r.height * 0.5
+          ),
+          this.engine._bindTextureDirectly(c, null);
+      }
     }
-    getDefaultShader() {
-        return this._defaultShader
-    }
-    updatePanoPartYUV(e, t, r) {
-        const n = t.subarray(0, r.width * r.height)
-          , o = t.subarray(r.width * r.height, r.width * r.height * 1.25)
-          , a = t.subarray(r.width * r.height * 1.25)
-          , s = this._panoInfo.width
-          , l = this._panoInfo.height;
-        if (this._dynamic_textures[e] != null) {
-            const u = this._dynamic_textures[e].getInternalTexture();
-            if (u != null && u != null) {
-                const c = this.engine._getTextureTarget(u);
-                this.engine._bindTextureDirectly(c, u, !0),
-                this.engine.updateTextureData(u, n, r.startX, l * 1.5 - r.startY - r.height, r.width, r.height),
-                this.engine.updateTextureData(u, o, r.startX * .5, (l - r.startY - r.height) * .5, r.width * .5 - 1, r.height * .5 - 1),
-                this.engine.updateTextureData(u, a, r.startX * .5 + s * .5, (l - r.startY - r.height) * .5, r.width * .5, r.height * .5),
-                this.engine._bindTextureDirectly(c, null)
-            }
-        }
-    }
-    changePanoImg(e, t) {
-        if (logger.info(`[Engine] changePanoImg, id=${e}, pose=${t.pose.position.x},${t.pose.position.y},${t.pose.position.z}`),
-        !this._isInDynamicRange(e))
-            return logger.error(`[Engine] ${e} is bigger than dynamic size set in PanoInfo`),
-            Promise.reject(new XMaterialError(`[Engine] ${e} is bigger than dynamic size set in PanoInfo`));
-        const r = ue4Position2Xverse(t.pose.position);
-        return r && (this._dynamic_babylonpose[e] = {
-            position: r
+  }
+  changePanoImg(e, t) {
+    if (
+      (logger.info(
+        `[Engine] changePanoImg, id=${e}, pose=${t.pose.position.x},${t.pose.position.y},${t.pose.position.z}`
+      ),
+      !this._isInDynamicRange(e))
+    )
+      return (
+        logger.error(
+          `[Engine] ${e} is bigger than dynamic size set in PanoInfo`
+        ),
+        Promise.reject(
+          new XMaterialError(
+            `[Engine] ${e} is bigger than dynamic size set in PanoInfo`
+          )
+        )
+      );
+    const r = ue4Position2Xverse(t.pose.position);
+    return (
+      r &&
+        (this._dynamic_babylonpose[e] = {
+          position: r,
         }),
-        new Promise((n,o)=>{
-            try {
-                typeof t.data == "string" ? (this.setPanoYUV420(!1),
-                this._dynamic_textures[e].updateURL(t.data, null, ()=>{
-                    this._dynamic_textures[e].updateSamplingMode(BABYLON.Texture.NEAREST_SAMPLINGMODE)
-                }
-                )) : (this.isPanoYUV420() == !1 && this.initDynamicTexture(e, this._panoInfo.width, this._panoInfo.height),
-                this.setPanoYUV420(!0),
-                this._dynamic_textures[e].update(t.data),
-                this._dynamic_textures[e].updateSamplingMode(BABYLON.Texture.NEAREST_SAMPLINGMODE)),
-                n(this)
-            } catch (a) {
-                o(new XMaterialError(`[Engine] ChangePanoImg Error! ${a}`))
-            }
+      new Promise((n, o) => {
+        try {
+          typeof t.data == "string"
+            ? (this.setPanoYUV420(!1),
+              this._dynamic_textures[e].updateURL(t.data, null, () => {
+                this._dynamic_textures[e].updateSamplingMode(
+                  BABYLON.Texture.NEAREST_SAMPLINGMODE
+                );
+              }))
+            : (this.isPanoYUV420() == !1 &&
+                this.initDynamicTexture(
+                  e,
+                  this._panoInfo.width,
+                  this._panoInfo.height
+                ),
+              this.setPanoYUV420(!0),
+              this._dynamic_textures[e].update(t.data),
+              this._dynamic_textures[e].updateSamplingMode(
+                BABYLON.Texture.NEAREST_SAMPLINGMODE
+              )),
+            n(this);
+        } catch (a) {
+          o(new XMaterialError(`[Engine] ChangePanoImg Error! ${a}`));
         }
-        ).then(n=>(t.fov != null && this._scenemanager.cameraComponent.changeCameraFov(t.fov * Math.PI / 180),
-        this._dynamic_shaders[e].setFloat("isYUV", this._inputPanoYUV420 ? 1 : 0),
-        this._dynamic_shaders[e].setTexture("texture_pano", this._dynamic_textures[e]),
-        this._dynamic_shaders[e].setVector3("centre_pose", this._dynamic_babylonpose[e].position),
-        !0))
-    }
-    setYUV420(e) {
-        this._inputYUV420 = e
-    }
-    isYUV420() {
-        return this._inputYUV420
-    }
-    setPanoYUV420(e) {
-        this._inputPanoYUV420 = e
-    }
-    isPanoYUV420() {
-        return this._inputPanoYUV420
-    }
-    getDynamicShader(e) {
-        return this._dynamic_shaders[e]
-    }
-    _updatePureVideoShaderInput() {
-        /*
+      }).then(
+        (n) => (
+          t.fov != null &&
+            this._scenemanager.cameraComponent.changeCameraFov(
+              (t.fov * Math.PI) / 180
+            ),
+          this._dynamic_shaders[e].setFloat(
+            "isYUV",
+            this._inputPanoYUV420 ? 1 : 0
+          ),
+          this._dynamic_shaders[e].setTexture(
+            "texture_pano",
+            this._dynamic_textures[e]
+          ),
+          this._dynamic_shaders[e].setVector3(
+            "centre_pose",
+            this._dynamic_babylonpose[e].position
+          ),
+          !0
+        )
+      )
+    );
+  }
+  setYUV420(e) {
+    this._inputYUV420 = e;
+  }
+  isYUV420() {
+    return this._inputYUV420;
+  }
+  setPanoYUV420(e) {
+    this._inputPanoYUV420 = e;
+  }
+  isPanoYUV420() {
+    return this._inputPanoYUV420;
+  }
+  getDynamicShader(e) {
+    return this._dynamic_shaders[e];
+  }
+  _updatePureVideoShaderInput() {
+    /*
         var e, t, r, n, o, a, s, l, u, c;
 
         if(this.scene.getLightByName("AvatarLight")){
@@ -362,72 +509,119 @@ export default class XMaterialComponent {
             (c = this._lowModelShader) == null || c.setFloat("haveShadowLight", 0);
         }
         */
-        
-        let lowModelShader = this._lowModelShader
-        if(lowModelShader!= null){
-            if(this.scene.getLightByName("AvatarLight")){
-                lowModelShader.setFloat("haveShadowLight", 1);
 
-                let avatarLight = this.scene.getLightByName("AvatarLight")
-                let shadow = void 0
-                if(avatarLight != null){
-                    shadow = avatarLight.getShadowGenerator()
-                }
+    let lowModelShader = this._lowModelShader;
+    if (lowModelShader != null) {
+      if (this.scene.getLightByName("AvatarLight")) {
+        lowModelShader.setFloat("haveShadowLight", 1);
 
-                if(shadow == null){
-                    lowModelShader.setTexture("shadowSampler",void 0)
-                    lowModelShader.setMatrix("lightSpaceMatrix",void 0)
-                }
-                else{
-                    lowModelShader.setTexture("shadowSampler",shadow.getShadowMapForRendering())
-                    lowModelShader.setMatrix("lightSpaceMatrix",shadow.getTransformMatrix())
-                }
-            }
-            else{
-                lowModelShader.setTexture("shadowSampler", this._videoTexture);
-                lowModelShader.setMatrix("lightSpaceMatrix", new Matrix);
-                lowModelShader.setFloat("haveShadowLight", 0);
-            }
+        let avatarLight = this.scene.getLightByName("AvatarLight");
+        let shadow = void 0;
+        if (avatarLight != null) {
+          shadow = avatarLight.getShadowGenerator();
         }
 
-        if (this.scene.getLightByName("fireworkLight"))
-        {
-            this.scene.registerBeforeRender(()=>{
-                
-                this._lowModelShader.setFloat("fireworkLight", this.scene.getLightByName("fireworkLight").getScaledIntensity());
-                var fireworkLight = this.scene.getLightByName("fireworkLight")
-                if(fireworkLight == null){
-                    this._lowModelShader.setVector3("fireworkLightPosition",  void 0);
-                }
-                else{
-                    this._lowModelShader.setVector3("fireworkLightPosition",  fireworkLight.position);
-                }
-                //this._lowModelShader.setVector3("fireworkLightPosition", (h = this.scene.getLightByName("fireworkLight")) == null ? void 0 : h.position);
-            });
-        }
-        else {
-            const pointLight = new BABYLON.PointLight("fireworkLight",new BABYLON.Vector3(0,0,0),this.scene);
-            pointLight.intensity = 0
+        if (shadow == null) {
+          lowModelShader.setTexture("shadowSampler", void 0);
+          lowModelShader.setMatrix("lightSpaceMatrix", void 0);
+        } else {
+          lowModelShader.setTexture(
+            "shadowSampler",
+            shadow.getShadowMapForRendering()
+          );
+          lowModelShader.setMatrix(
+            "lightSpaceMatrix",
+            shadow.getTransformMatrix()
+          );
         }
+      } else {
+        lowModelShader.setTexture("shadowSampler", this._videoTexture);
+        lowModelShader.setMatrix("lightSpaceMatrix", new Matrix());
+        lowModelShader.setFloat("haveShadowLight", 0);
+      }
     }
-    _updatePanoShaderInput(e) {
-        var t, r, n, o, a, s, l, u, c, h;
-        if (this._isInDynamicRange(e))
-            if (this.scene.getLightByName("AvatarLight") ? ((t = this._dynamic_shaders[e]) == null || t.setFloat("haveShadowLight", 1),
-            (o = this._dynamic_shaders[e]) == null || o.setTexture("shadowSampler", (n = (r = this.scene.getLightByName("AvatarLight")) == null ? void 0 : r.getShadowGenerator()) == null ? void 0 : n.getShadowMapForRendering()),
-            (l = this._dynamic_shaders[e]) == null || l.setMatrix("lightSpaceMatrix", (s = (a = this.scene.getLightByName("AvatarLight")) == null ? void 0 : a.getShadowGenerator()) == null ? void 0 : s.getTransformMatrix())) : ((u = this._dynamic_shaders[e]) == null || u.setTexture("shadowSampler", null),
-            (c = this._dynamic_shaders[e]) == null || c.setMatrix("lightSpaceMatrix", new Matrix),
-            (h = this._dynamic_shaders[e]) == null || h.setFloat("haveShadowLight", 0)),
-            this.scene.getLightByName("fireworkLight"))
-                this.scene.registerBeforeRender(()=>{
-                    var f;
-                    this._dynamic_shaders[e].setFloat("fireworkLight", this.scene.getLightByName("fireworkLight").getScaledIntensity()),
-                    this._dynamic_shaders[e].setVector3("fireworkLightPosition", (f = this.scene.getLightByName("fireworkLight")) == null ? void 0 : f.position)
-                }
-                );
-            else {
-                const f = new BABYLON.PointLight("fireworkLight",new BABYLON.Vector3(0,0,0),this.scene);
-                f.intensity = 0
-            }
+
+    if (this.scene.getLightByName("fireworkLight")) {
+      this.scene.registerBeforeRender(() => {
+        this._lowModelShader.setFloat(
+          "fireworkLight",
+          this.scene.getLightByName("fireworkLight").getScaledIntensity()
+        );
+        var fireworkLight = this.scene.getLightByName("fireworkLight");
+        if (fireworkLight == null) {
+          this._lowModelShader.setVector3("fireworkLightPosition", void 0);
+        } else {
+          this._lowModelShader.setVector3(
+            "fireworkLightPosition",
+            fireworkLight.position
+          );
+        }
+        //this._lowModelShader.setVector3("fireworkLightPosition", (h = this.scene.getLightByName("fireworkLight")) == null ? void 0 : h.position);
+      });
+    } else {
+      const pointLight = new BABYLON.PointLight(
+        "fireworkLight",
+        new BABYLON.Vector3(0, 0, 0),
+        this.scene
+      );
+      pointLight.intensity = 0;
     }
-}
+  }
+  _updatePanoShaderInput(e) {
+    var t, r, n, o, a, s, l, u, c, h;
+    if (this._isInDynamicRange(e))
+      if (
+        (this.scene.getLightByName("AvatarLight")
+          ? ((t = this._dynamic_shaders[e]) == null ||
+              t.setFloat("haveShadowLight", 1),
+            (o = this._dynamic_shaders[e]) == null ||
+              o.setTexture(
+                "shadowSampler",
+                (n =
+                  (r = this.scene.getLightByName("AvatarLight")) == null
+                    ? void 0
+                    : r.getShadowGenerator()) == null
+                  ? void 0
+                  : n.getShadowMapForRendering()
+              ),
+            (l = this._dynamic_shaders[e]) == null ||
+              l.setMatrix(
+                "lightSpaceMatrix",
+                (s =
+                  (a = this.scene.getLightByName("AvatarLight")) == null
+                    ? void 0
+                    : a.getShadowGenerator()) == null
+                  ? void 0
+                  : s.getTransformMatrix()
+              ))
+          : ((u = this._dynamic_shaders[e]) == null ||
+              u.setTexture("shadowSampler", null),
+            (c = this._dynamic_shaders[e]) == null ||
+              c.setMatrix("lightSpaceMatrix", new Matrix()),
+            (h = this._dynamic_shaders[e]) == null ||
+              h.setFloat("haveShadowLight", 0)),
+        this.scene.getLightByName("fireworkLight"))
+      )
+        this.scene.registerBeforeRender(() => {
+          var f;
+          this._dynamic_shaders[e].setFloat(
+            "fireworkLight",
+            this.scene.getLightByName("fireworkLight").getScaledIntensity()
+          ),
+            this._dynamic_shaders[e].setVector3(
+              "fireworkLightPosition",
+              (f = this.scene.getLightByName("fireworkLight")) == null
+                ? void 0
+                : f.position
+            );
+        });
+      else {
+        const f = new BABYLON.PointLight(
+          "fireworkLight",
+          new BABYLON.Vector3(0, 0, 0),
+          this.scene
+        );
+        f.intensity = 0;
+      }
+  }
+}

src/main.js

@@ -35,8 +35,8 @@ const l = async()=>{
             roomId: 'e629ef3e-022d-4e64-8654-703bb96410eb',
             userId: nickname,
             // wsServerUrl: 'wss://uat-eks.xverse.cn/ws',
-            // wsServerUrl: "ws://localhost:6688/ws",
-            wsServerUrl: "wss://meta-socket.4dage.com/ws",
+            wsServerUrl: "ws://localhost:6688/ws",
+            // wsServerUrl: "wss://meta-socket.4dage.com/ws",
             appId: "10016",
             token: " ",
             nickname: nickname,

src/v2Decoder/index.js

@@ -997,6 +997,7 @@ if ("function" === typeof importScripts) {
 
   Decoder.prototype.startEmiter = function () {
     self.decoder.startEmit = true;
+
     if (cachedFirstFrame != undefined) {
       self.postMessage(cachedFirstFrame, [cachedFirstFrame.data.buffer]);
       console.log("cachedFirstFrame", cachedFirstFrame);
@@ -1142,6 +1143,7 @@ if ("function" === typeof importScripts) {
       printConsole.error("null content in decoder", "5999");
       return;
     }
+
     var content_size = content.byteLength;
     // var cacheBuffer = Module._malloc(content_size)
     // var resultBuffer = Module._malloc(64)
@@ -1149,6 +1151,7 @@ if ("function" === typeof importScripts) {
     const index = data.frameCnt % CACHE_BUF_LENGTH;
     mediaArray[index].decode_ts = Date.now();
     var objData;
+
     if (content_size != 0) {
       // var date = Date.now()
       // var curDate = Date.now()
@@ -1223,7 +1226,7 @@ if ("function" === typeof importScripts) {
       var poc = Module.getValue(resultBuffer + 32, "i32");
       var pts = data.frameCnt;
 
-      // console.log('ret',ret)
+      console.log('ret',ret)
 
       if (ret != 0) {
         printConsole.log(
@@ -1248,6 +1251,7 @@ if ("function" === typeof importScripts) {
       lastPoc = poc;
       this.receivedYUV++;
       let end_ts = Date.now();
+
       fdt = end_ts - start_ts;
       if (fdt + self.decoder.getFrameInterval > 84) {
         this.JankTimes++;
@@ -1267,6 +1271,7 @@ if ("function" === typeof importScripts) {
         // printConsole.error('No buffer to save YUV after decoding, pts is ' + String(pts), '5002')
         return;
       }
+
       var first_available_buffer = YUVArray.shift();
       var yuv_data = first_available_buffer.buffer;
 
@@ -1302,7 +1307,6 @@ if ("function" === typeof importScripts) {
         meta: data.meta,
         metadata: data.metadata,
       };
-      console.log("objData", objData);
     } else {
       objData = {
         t: MessageEvent.DecodeMessage,
@@ -1317,6 +1321,7 @@ if ("function" === typeof importScripts) {
     }
     if (this.startEmit) {
       if (objData.data != null) {
+        // console.log("hey", pts, objData, objData.data);
         self.postMessage(objData, [objData.data.buffer]);
         send_out_buffer += 1;
         this.receivedEmit++;
@@ -1329,6 +1334,8 @@ if ("function" === typeof importScripts) {
         cachedFirstFrame = objData;
       }
     }
+    console.log("this.startEmit", this.startEmit);
+
     // if (cacheBuffer != null) {
     //   Module._free(cacheBuffer)
     //   cacheBuffer = null
@@ -1344,6 +1351,7 @@ if ("function" === typeof importScripts) {
   Decoder.prototype.receiveBuffer = function (data) {
     framesReturned++;
     send_out_buffer -= 1;
+    console.log("receiveBuffer", data);
     YUVArray.push({ status: 0, buffer: data.buffer });
   };
 
@@ -1457,6 +1465,7 @@ if ("function" === typeof importScripts) {
         self.decoder.resetDecoder();
         break;
       case 5: // Start emit
+        // debugger
         self.decoder.startEmiter();
         break;
       case 6: // Start Record