virtual-human-cf 1.0.5 → 1.0.7

package/README.md

@@ -113,12 +113,24 @@ const onEnded = () => {
 | 事件名 | 说明 | 回调参数 |
 |--------|------|----------|
 | connected | WebSocket 连接成功 | - |
-| highlight | 高亮大屏某区域 | 载荷数据 |
-| showDialog | 显示弹窗 | 载荷数据 |
+| eventNotifaction | 自定义事件接收器 | 载荷数据 |
 | end | 数字人对话结束 | 载荷数据 |
 | pause | 暂停播放 | 载荷数据 |
 | error | 错误事件 | 错误信息 |
-| play_complete | 播放完成 | - |
+| playComplete | 播放完成，数字人对话结束，关闭数字人 | - |
+
+```json
+eventNotifaction => 载荷数据 :{
+  
+    "type": "send_event",
+    // 自定义事件名称
+    "event": "heightlight",
+    // 自定义事件参数
+    "params": {
+        "domid": "wrap-1"
+    }
+}
+```
 
 #### 示例
 
@@ -128,8 +140,8 @@ const onEnded = () => {
     :screen-client-id="clientId"
     :ws-url="websocketUrl"
     @connected="onConnected"
-    @highlight="onHighlight"
-    @showDialog="onShowDialog"
+    @eventNotifaction="onEventNotifaction"
+    @playComplete="onPlayComplete"
     @end="onEnd"
     @error="onError"
   >
@@ -147,12 +159,12 @@ const onConnected = () => {
   console.log('WebSocket 连接成功');
 };
 
-const onHighlight = (payload) => {
-  console.log('高亮事件:', payload);
+const onEventNotifaction = (payload) => {
+  console.log('自定义事件接收:', payload);
 };
 
-const onShowDialog = (payload) => {
-  console.log('显示弹窗:', payload);
+const onPlayComplete = () => {
+  console.log('播放完成');
 };
 
 const onEnd = (payload) => {
@@ -174,23 +186,25 @@ const onError = (error) => {
   <div class="container">
     <VirtualHumanPersona
       :video-src="videoUrl"
+      :visible="personaVisible"
       :is-playing="isPlaying"
       :muted="true"
       :is-dark="isDarkMode"
-      :screen-client-id="clientId"
+      :screen-client-id="activeScreenClientId"
       :ws-url="websocketUrl"
-      @update:isPlaying="(val) => isPlaying = val"
+      @update:isPlaying="onPersonaPlayingUpdate"
+      @update:visible="onPersonaVisibleUpdate"
       @ended="onVideoEnded"
     />
     
     <VirtualHumanEventAdapter
-      :screen-client-id="clientId"
+      :screen-client-id="activeScreenClientId"
       :ws-url="websocketUrl"
       @connected="onConnected"
-      @highlight="onHighlight"
-      @showDialog="onShowDialog"
+      @eventNotifaction="onEventNotifaction"
       @end="onEnd"
       @error="onError"
+      @playComplete="onPlayComplete"
     />
   </div>
 </template>
@@ -202,7 +216,8 @@ import { VirtualHumanPersona, VirtualHumanEventAdapter } from 'virtual-human-cf'
 const videoUrl = ref('/path/to/digital-human-video.mp4');
 const isPlaying = ref(false);
 const isDarkMode = ref(false);
-const clientId = ref('screen-123');
+const personaVisible = ref(true);
+const activeScreenClientId = ref('screen-123');
 const websocketUrl = ref('ws://localhost:8080/ws');
 
 const onConnected = () => {
@@ -213,19 +228,22 @@ const onVideoEnded = () => {
   console.log('视频播放结束');
 };
 
-const onHighlight = (payload) => {
-  console.log('收到高亮指令:', payload);
-};
-
-const onShowDialog = (payload) => {
-  console.log('显示对话框:', payload);
-};
 
 const onEnd = (payload) => {
   console.log('数字人交互结束:', payload);
   isPlaying.value = false;
 };
 
+const onEventNotifaction = (payload) => {
+  console.log('自定义事件接收:', payload);
+};
+
+const onPlayComplete = () => {
+  console.log('播放完成');
+  // 关闭数字人
+  personaVisible.value = false;
+}
+
 const onError = (error) => {
   console.error('发生错误:', error);
 };

package/dist/components/VirtualHumanEventAdapter.vue.d.ts

@@ -13,11 +13,10 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     error: (...args: any[]) => void;
     pause: (...args: any[]) => void;
-    highlight: (...args: any[]) => void;
-    showDialog: (...args: any[]) => void;
+    eventNotifaction: (...args: any[]) => void;
     end: (...args: any[]) => void;
     connected: (...args: any[]) => void;
-    play_complete: (...args: any[]) => void;
+    playComplete: (...args: any[]) => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     screenClientId: {
         type: StringConstructor;
@@ -30,11 +29,10 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
 }>> & Readonly<{
     onError?: ((...args: any[]) => any) | undefined;
     onPause?: ((...args: any[]) => any) | undefined;
-    onHighlight?: ((...args: any[]) => any) | undefined;
-    onShowDialog?: ((...args: any[]) => any) | undefined;
+    onEventNotifaction?: ((...args: any[]) => any) | undefined;
     onEnd?: ((...args: any[]) => any) | undefined;
     onConnected?: ((...args: any[]) => any) | undefined;
-    onPlay_complete?: ((...args: any[]) => any) | undefined;
+    onPlayComplete?: ((...args: any[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/dist/style.css

@@ -1 +1 @@
-.fade-enter-active[data-v-5d741303],.fade-leave-active[data-v-5d741303]{transition:opacity .5s ease,transform .5s ease}.fade-enter-from[data-v-5d741303],.fade-leave-to[data-v-5d741303]{opacity:0;transform:translateY(10px)}.virtual-human-container[data-v-5d741303]{position:fixed;z-index:2147483647;overflow:visible}.video-wrapper[data-v-5d741303]{position:relative;width:100%;height:100%;border-radius:1rem;overflow:hidden;box-shadow:0 10px 25px #0000001a;background:#fff;border:2px solid transparent;transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease}.video-wrapper[data-v-5d741303]:hover{border-color:#409eff}.virtual-human-container.is-dark .video-wrapper[data-v-5d741303]{background:#1f2937;box-shadow:0 10px 25px #00000080}.persona-video[data-v-5d741303]{width:100%;height:100%;object-fit:cover;transform-origin:center;transition:transform .1s ease-out}.resize-handle[data-v-5d741303]{position:absolute;width:20px;height:20px;background:#00000080;border:2px solid rgba(255,255,255,.8);border-radius:4px;cursor:pointer;z-index:20;opacity:0;pointer-events:none;transition:opacity .3s ease,background .2s,border-color .2s}.video-wrapper:hover .resize-handle[data-v-5d741303]{opacity:1;pointer-events:auto}.resize-handle[data-v-5d741303]:hover{background:#000000b3;border-color:#fff}.resize-handle.top-left[data-v-5d741303]{top:10px;left:10px;cursor:nwse-resize}.resize-handle.top-right[data-v-5d741303]{top:10px;right:10px;cursor:nesw-resize}.resize-handle.bottom-left[data-v-5d741303]{bottom:10px;left:10px;cursor:nesw-resize}.resize-handle.bottom-right[data-v-5d741303]{bottom:10px;right:10px;cursor:nwse-resize}.overlay[data-v-5d741303]{position:absolute;top:1rem;right:1rem;z-index:10}.status-badge[data-v-5d741303]{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.status-badge.paused[data-v-5d741303]{background:#ef4444cc}.status-badge.playing[data-v-5d741303]{background:#22c55ecc}.dot[data-v-5d741303]{width:6px;height:6px;border-radius:50%;background-color:#fff}@keyframes pulse-5d741303{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse[data-v-5d741303]{animation:pulse-5d741303 2s cubic-bezier(.4,0,.6,1) infinite}
+.fade-enter-active[data-v-6c9e435e],.fade-leave-active[data-v-6c9e435e]{transition:opacity .5s ease,transform .5s ease}.fade-enter-from[data-v-6c9e435e],.fade-leave-to[data-v-6c9e435e]{opacity:0;transform:translateY(10px)}.virtual-human-container[data-v-6c9e435e]{position:fixed;z-index:2147483647;overflow:visible}.video-wrapper[data-v-6c9e435e]{position:relative;width:100%;height:100%;border-radius:1rem;overflow:hidden;box-shadow:0 10px 25px #0000001a;background:#fff;border:2px solid transparent;transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease}.video-wrapper[data-v-6c9e435e]:hover{border-color:#409eff}.virtual-human-container.is-dark .video-wrapper[data-v-6c9e435e]{background:#1f2937;box-shadow:0 10px 25px #00000080}.persona-video[data-v-6c9e435e]{width:100%;height:100%;object-fit:cover;transform-origin:center;transition:transform .1s ease-out}.resize-handle[data-v-6c9e435e]{position:absolute;width:20px;height:20px;background:#00000080;border:2px solid rgba(255,255,255,.8);border-radius:4px;cursor:pointer;z-index:20;opacity:0;pointer-events:none;transition:opacity .3s ease,background .2s,border-color .2s}.video-wrapper:hover .resize-handle[data-v-6c9e435e]{opacity:1;pointer-events:auto}.resize-handle[data-v-6c9e435e]:hover{background:#000000b3;border-color:#fff}.resize-handle.top-left[data-v-6c9e435e]{top:10px;left:10px;cursor:nwse-resize}.resize-handle.top-right[data-v-6c9e435e]{top:10px;right:10px;cursor:nesw-resize}.resize-handle.bottom-left[data-v-6c9e435e]{bottom:10px;left:10px;cursor:nesw-resize}.resize-handle.bottom-right[data-v-6c9e435e]{bottom:10px;right:10px;cursor:nwse-resize}.overlay[data-v-6c9e435e]{position:absolute;top:1rem;right:1rem;z-index:10}.status-badge[data-v-6c9e435e]{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.status-badge.paused[data-v-6c9e435e]{background:#ef4444cc}.status-badge.playing[data-v-6c9e435e]{background:#22c55ecc}.dot[data-v-6c9e435e]{width:6px;height:6px;border-radius:50%;background-color:#fff}@keyframes pulse-6c9e435e{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse[data-v-6c9e435e]{animation:pulse-6c9e435e 2s cubic-bezier(.4,0,.6,1) infinite}

package/dist/virtual-human-cf.es.js

@@ -1,4 +1,4 @@
-import { defineComponent as j, ref as d, watch as X, onMounted as G, onUnmounted as K, openBlock as P, createBlock as Q, Transition as Z, withCtx as _, createElementBlock as V, normalizeStyle as ee, normalizeClass as te, createElementVNode as R, createCommentVNode as T, createTextVNode as J, renderSlot as ne } from "vue";
+import { defineComponent as j, ref as v, watch as X, onMounted as G, onUnmounted as K, openBlock as S, createBlock as Q, Transition as Z, withCtx as _, createElementBlock as E, normalizeStyle as ee, normalizeClass as te, createElementVNode as R, createCommentVNode as T, createTextVNode as J, renderSlot as ne } from "vue";
 const ae = ["src", "muted"], se = { class: "overlay" }, le = {
   key: 0,
   class: "status-badge paused"
@@ -46,72 +46,72 @@ const ae = ["src", "muted"], se = { class: "overlay" }, le = {
     }
   },
   emits: ["update:isPlaying", "ended", "update:visible"],
-  setup(c, { emit: x }) {
-    const t = c, l = x, u = d(null), Y = d(null), n = d(null), y = d(!1), h = d(400), w = d(500), W = d(16), E = d(16), z = d(!1), b = d(null), A = d(0), D = d(0), s = d(0), o = d(0), r = d(0), v = d(0), g = () => {
+  setup(c, { emit: W }) {
+    const t = c, i = W, r = v(null), Y = v(null), n = v(null), p = v(!1), y = v(400), g = v(500), w = v(16), z = v(16), I = v(!1), h = v(null), M = v(0), A = v(0), k = v(0), s = v(0), l = v(0), u = v(0), b = () => {
       if (n.value && n.value.close(), !(!t.wsUrl || !t.screenClientId))
         try {
-          const i = new URL(t.wsUrl);
-          i.searchParams.append("sessionId", t.screenClientId + "-persona"), n.value = new WebSocket(i.toString()), n.value.onopen = () => {
-            y.value = !0, console.log(`[VirtualHumanPersona] Connected to ${t.wsUrl} for session ${t.screenClientId}-persona`);
+          const o = new URL(t.wsUrl);
+          o.searchParams.append("sessionId", t.screenClientId + "-persona"), n.value = new WebSocket(o.toString()), n.value.onopen = () => {
+            p.value = !0, console.log(`[VirtualHumanPersona] Connected to ${t.wsUrl} for session ${t.screenClientId}-persona`);
           }, n.value.onmessage = (e) => {
             try {
               const a = JSON.parse(e.data);
-              B(a);
+              C(a);
             } catch (a) {
               console.error("[VirtualHumanPersona] Failed to parse message:", e.data, a);
             }
           }, n.value.onerror = (e) => {
             console.error("[VirtualHumanPersona] WebSocket error:", e);
           }, n.value.onclose = () => {
-            y.value = !1, console.log("[VirtualHumanPersona] WebSocket disconnected");
+            p.value = !1, console.log("[VirtualHumanPersona] WebSocket disconnected");
           };
-        } catch (i) {
-          console.error("[VirtualHumanPersona] Failed to initialize WebSocket:", i);
+        } catch (o) {
+          console.error("[VirtualHumanPersona] Failed to initialize WebSocket:", o);
         }
-    }, B = (i) => {
-      const { type: e, action: a } = i;
-      e === "control" && (a === "play" || a === "resume" ? (l("update:isPlaying", !0), l("update:visible", !0)) : a === "pause" ? l("update:isPlaying", !1) : a === "stop" && (l("update:isPlaying", !1), l("update:visible", !1), u.value && (u.value.currentTime = 0)));
+    }, C = (o) => {
+      const { type: e, action: a } = o;
+      e === "control" && (a === "play" || a === "resume" ? (i("update:isPlaying", !0), i("update:visible", !0)) : a === "pause" ? i("update:isPlaying", !1) : a === "stop" && (i("update:isPlaying", !1), i("update:visible", !1), r.value && (r.value.currentTime = 0)));
     };
     X(() => t.screenClientId, () => {
-      t.screenClientId && t.wsUrl && g();
+      t.screenClientId && t.wsUrl && b();
     }), X(() => t.wsUrl, () => {
-      t.screenClientId && t.wsUrl && g();
-    }), X(() => t.isPlaying, (i) => {
-      u.value && (i ? u.value.play().catch((e) => console.error("Video play failed:", e)) : u.value.pause());
+      t.screenClientId && t.wsUrl && b();
+    }), X(() => t.isPlaying, (o) => {
+      r.value && (o ? r.value.play().catch((e) => console.error("Video play failed:", e)) : r.value.pause());
     });
-    const L = () => {
-      t.isPlaying || l("update:isPlaying", !0);
+    const B = () => {
+      t.isPlaying || i("update:isPlaying", !0);
+    }, L = () => {
+      t.isPlaying && i("update:isPlaying", !1);
     }, U = () => {
-      t.isPlaying && l("update:isPlaying", !1);
-    }, f = () => {
-      l("update:isPlaying", !1), l("ended");
-    }, k = (i, e) => {
-      e.preventDefault(), z.value = !0, b.value = i;
-      const a = "clientX" in e ? e.clientX : e.touches[0].clientX, C = "clientY" in e ? e.clientY : e.touches[0].clientY;
-      A.value = a, D.value = C, s.value = h.value, o.value = w.value, r.value = W.value, v.value = E.value, document.addEventListener("mousemove", M), document.addEventListener("mouseup", $), document.addEventListener("touchmove", M, { passive: !1 }), document.addEventListener("touchend", $);
-    }, M = (i) => {
-      if (!z.value) return;
-      i.preventDefault();
-      const e = "clientX" in i ? i.clientX : i.touches[0].clientX, a = "clientY" in i ? i.clientY : i.touches[0].clientY, C = e - A.value, I = a - D.value, F = 200, q = 250, N = 800, O = 1e3;
-      let m = s.value, p = o.value, S = r.value, H = v.value;
-      b.value === "bottom-right" ? (m = s.value + C, H = v.value - I, p = o.value + I) : b.value === "bottom-left" ? (S = r.value + C, m = s.value - C, H = v.value - I, p = o.value + I) : b.value === "top-right" ? (m = s.value + C, p = o.value - I) : b.value === "top-left" && (S = r.value + C, m = s.value - C, p = o.value - I), m < F && (S !== r.value && (S -= F - m), m = F), p < q && (H !== v.value && (H -= q - p), p = q), m > N && (S !== r.value && (S += m - N), m = N), p > O && (H !== v.value && (H += p - O), p = O), h.value = m, w.value = p, W.value = S, E.value = H;
-    }, $ = () => {
-      z.value = !1, b.value = null, document.removeEventListener("mousemove", M), document.removeEventListener("mouseup", $), document.removeEventListener("touchmove", M), document.removeEventListener("touchend", $);
+      i("update:isPlaying", !1), i("ended");
+    }, d = (o, e) => {
+      e.preventDefault(), I.value = !0, h.value = o;
+      const a = "clientX" in e ? e.clientX : e.touches[0].clientX, P = "clientY" in e ? e.clientY : e.touches[0].clientY;
+      M.value = a, A.value = P, k.value = y.value, s.value = g.value, l.value = w.value, u.value = z.value, document.addEventListener("mousemove", $), document.addEventListener("mouseup", N), document.addEventListener("touchmove", $, { passive: !1 }), document.addEventListener("touchend", N);
+    }, $ = (o) => {
+      if (!I.value) return;
+      o.preventDefault();
+      const e = "clientX" in o ? o.clientX : o.touches[0].clientX, a = "clientY" in o ? o.clientY : o.touches[0].clientY, P = e - M.value, x = a - A.value, D = 200, F = 250, q = 800, O = 1e3;
+      let f = k.value, m = s.value, H = l.value, V = u.value;
+      h.value === "bottom-right" ? (f = k.value + P, V = u.value - x, m = s.value + x) : h.value === "bottom-left" ? (H = l.value + P, f = k.value - P, V = u.value - x, m = s.value + x) : h.value === "top-right" ? (f = k.value + P, m = s.value - x) : h.value === "top-left" && (H = l.value + P, f = k.value - P, m = s.value - x), f < D && (H !== l.value && (H -= D - f), f = D), m < F && (V !== u.value && (V -= F - m), m = F), f > q && (H !== l.value && (H += f - q), f = q), m > O && (V !== u.value && (V += m - O), m = O), y.value = f, g.value = m, w.value = H, z.value = V;
+    }, N = () => {
+      I.value = !1, h.value = null, document.removeEventListener("mousemove", $), document.removeEventListener("mouseup", N), document.removeEventListener("touchmove", $), document.removeEventListener("touchend", N);
     };
     return G(() => {
-      t.isPlaying && u.value && u.value.play().catch((i) => console.error("Video play failed:", i)), t.screenClientId && t.wsUrl && g();
+      t.isPlaying && r.value && r.value.play().catch((o) => console.error("Video play failed:", o)), t.screenClientId && t.wsUrl && b();
     }), K(() => {
       n.value && n.value.close();
-    }), (i, e) => (P(), Q(Z, { name: "fade" }, {
+    }), (o, e) => (S(), Q(Z, { name: "fade" }, {
       default: _(() => [
-        c.visible ? (P(), V("div", {
+        c.visible ? (S(), E("div", {
           key: 0,
           class: te(["virtual-human-container", { "is-dark": c.isDark }]),
           style: ee({
-            width: h.value + "px",
-            height: w.value + "px",
-            left: W.value + "px",
-            bottom: E.value + "px"
+            width: y.value + "px",
+            height: g.value + "px",
+            left: w.value + "px",
+            bottom: z.value + "px"
           })
         }, [
           R("div", {
@@ -121,45 +121,47 @@ const ae = ["src", "muted"], se = { class: "overlay" }, le = {
           }, [
             R("video", {
               ref_key: "videoRef",
-              ref: u,
+              ref: r,
               src: c.videoSrc,
               class: "persona-video",
               muted: c.muted,
               playsinline: "",
               loop: "",
-              onPlay: L,
-              onPause: U,
-              onEnded: f
+              autoPlay: "",
+              disablePictureInPicture: "false",
+              onPlay: B,
+              onPause: L,
+              onEnded: U
             }, null, 40, ae),
-            c.visible ? (P(), V("div", {
+            c.visible ? (S(), E("div", {
               key: 0,
               class: "resize-handle top-left",
-              onMousedown: e[0] || (e[0] = (a) => k("top-left", a)),
-              onTouchstart: e[1] || (e[1] = (a) => k("top-left", a))
+              onMousedown: e[0] || (e[0] = (a) => d("top-left", a)),
+              onTouchstart: e[1] || (e[1] = (a) => d("top-left", a))
             }, null, 32)) : T("", !0),
-            c.visible ? (P(), V("div", {
+            c.visible ? (S(), E("div", {
               key: 1,
               class: "resize-handle top-right",
-              onMousedown: e[2] || (e[2] = (a) => k("top-right", a)),
-              onTouchstart: e[3] || (e[3] = (a) => k("top-right", a))
+              onMousedown: e[2] || (e[2] = (a) => d("top-right", a)),
+              onTouchstart: e[3] || (e[3] = (a) => d("top-right", a))
             }, null, 32)) : T("", !0),
-            c.visible ? (P(), V("div", {
+            c.visible ? (S(), E("div", {
               key: 2,
               class: "resize-handle bottom-left",
-              onMousedown: e[4] || (e[4] = (a) => k("bottom-left", a)),
-              onTouchstart: e[5] || (e[5] = (a) => k("bottom-left", a))
+              onMousedown: e[4] || (e[4] = (a) => d("bottom-left", a)),
+              onTouchstart: e[5] || (e[5] = (a) => d("bottom-left", a))
             }, null, 32)) : T("", !0),
-            c.visible ? (P(), V("div", {
+            c.visible ? (S(), E("div", {
               key: 3,
               class: "resize-handle bottom-right",
-              onMousedown: e[6] || (e[6] = (a) => k("bottom-right", a)),
-              onTouchstart: e[7] || (e[7] = (a) => k("bottom-right", a))
+              onMousedown: e[6] || (e[6] = (a) => d("bottom-right", a)),
+              onTouchstart: e[7] || (e[7] = (a) => d("bottom-right", a))
             }, null, 32)) : T("", !0),
             R("div", se, [
-              c.isPlaying ? (P(), V("div", oe, [...e[9] || (e[9] = [
+              c.isPlaying ? (S(), E("div", oe, [...e[9] || (e[9] = [
                 R("span", { class: "dot animate-pulse" }, null, -1),
                 J(" 播放中 ", -1)
-              ])])) : (P(), V("div", le, [...e[8] || (e[8] = [
+              ])])) : (S(), E("div", le, [...e[8] || (e[8] = [
                 R("span", { class: "dot" }, null, -1),
                 J(" 暂停中 ", -1)
               ])]))
@@ -170,12 +172,12 @@ const ae = ["src", "muted"], se = { class: "overlay" }, le = {
       _: 1
     }));
   }
-}), ie = (c, x) => {
+}), ie = (c, W) => {
   const t = c.__vccOpts || c;
-  for (const [l, u] of x)
-    t[l] = u;
+  for (const [i, r] of W)
+    t[i] = r;
   return t;
-}, ue = /* @__PURE__ */ ie(re, [["__scopeId", "data-v-5d741303"]]), ce = /* @__PURE__ */ j({
+}, ue = /* @__PURE__ */ ie(re, [["__scopeId", "data-v-6c9e435e"]]), ce = /* @__PURE__ */ j({
   __name: "VirtualHumanEventAdapter",
   props: {
     // 屏幕客户端ID
@@ -189,103 +191,96 @@ const ae = ["src", "muted"], se = { class: "overlay" }, le = {
       required: !0
     }
   },
-  emits: ["highlight", "showDialog", "end", "pause", "connected", "error", "play_complete"],
-  setup(c, { emit: x }) {
-    const t = c, l = x, u = d(null), Y = d(!1);
-    let n = null, y = 0, h = !1, w = 0;
-    const W = () => {
+  emits: ["eventNotifaction", "end", "pause", "connected", "error", "playComplete"],
+  setup(c, { emit: W }) {
+    const t = c, i = W, r = v(null), Y = v(!1);
+    let n = null, p = 0, y = !1, g = 0, w = !1;
+    const z = () => {
       n || (n = new (window.AudioContext || window.webkitAudioContext)({
         sampleRate: 24e3
-      })), n.state === "suspended" && n.resume();
-    }, E = () => {
-      h && w === 0 && (l("play_complete", t.screenClientId), h = !1);
-    }, z = (s) => {
-      if (W(), !!n)
+      })), n.state === "suspended" && !w && n.resume();
+    }, I = () => {
+      y && g === 0 && (i("playComplete", t.screenClientId), y = !1);
+    }, h = (s) => {
+      if (z(), !!n)
         try {
-          const o = window.atob(s), r = o.length, v = new Uint8Array(r);
-          for (let f = 0; f < r; f++)
-            v[f] = o.charCodeAt(f);
-          const g = new Int16Array(v.buffer), B = new Float32Array(g.length);
-          for (let f = 0; f < g.length; f++)
-            B[f] = g[f] / 32768;
+          const l = window.atob(s), u = l.length, b = new Uint8Array(u);
+          for (let d = 0; d < u; d++)
+            b[d] = l.charCodeAt(d);
+          const C = new Int16Array(b.buffer), B = new Float32Array(C.length);
+          for (let d = 0; d < C.length; d++)
+            B[d] = C[d] / 32768;
           const L = n.createBuffer(1, B.length, 24e3);
           L.getChannelData(0).set(B);
           const U = n.createBufferSource();
-          U.buffer = L, U.connect(n.destination), y < n.currentTime && (y = n.currentTime), U.start(y), y += L.duration, w++, U.onended = () => {
-            w--, E();
+          U.buffer = L, U.connect(n.destination), p < n.currentTime && (p = n.currentTime), U.start(p), p += L.duration, g++, U.onended = () => {
+            g--, I();
           };
-        } catch (o) {
-          console.error("[VirtualHumanEventAdapter] Failed to decode and play audio:", o);
-        }
-    }, b = (s) => {
-      if (!(!n && s !== "stop"))
-        switch (s) {
-          case "play":
-            h = !1, w = 0, y = 0, n && n.state === "suspended" && n.resume();
-            break;
-          case "resume":
-            n && n.state === "suspended" && n.resume();
-            break;
-          case "pause":
-            n && n.state === "running" && n.suspend();
-            break;
-          case "stop":
-            n && (n.close(), n = null), y = 0, h = !1, w = 0;
-            break;
-          case "tts_complete":
-            h = !0, E();
-            break;
-          default:
-            console.warn(`[VirtualHumanEventAdapter] Unknown control action: ${s}`);
+        } catch (l) {
+          console.error("[VirtualHumanEventAdapter] Failed to decode and play audio:", l);
         }
+    }, M = (s) => {
+      switch (s) {
+        case "play":
+          y = !1, g = 0, p = 0, w = !1, n && n.state === "suspended" && n.resume();
+          break;
+        case "resume":
+          w = !1, n && n.state === "suspended" && n.resume();
+          break;
+        case "pause":
+          w = !0, n && n.state === "running" && n.suspend();
+          break;
+        case "stop":
+          w = !1, n && (n.close(), n = null), p = 0, y = !1, g = 0;
+          break;
+        case "tts_complete":
+          y = !0, I();
+          break;
+        default:
+          console.warn(`[VirtualHumanEventAdapter] Unknown control action: ${s}`);
+      }
     }, A = () => {
-      u.value && u.value.close();
+      r.value && r.value.close();
       try {
         const s = new URL(t.wsUrl);
-        s.searchParams.append("sessionId", t.screenClientId + "-event"), u.value = new WebSocket(s.toString()), u.value.onopen = () => {
-          Y.value = !0, l("connected"), console.log(`[VirtualHumanEventAdapter] Connected to ${t.wsUrl} for session ${t.screenClientId}-event`);
-        }, u.value.onmessage = (o) => {
+        s.searchParams.append("sessionId", t.screenClientId + "-event"), r.value = new WebSocket(s.toString()), r.value.onopen = () => {
+          Y.value = !0, i("connected"), console.log(`[VirtualHumanEventAdapter] Connected to ${t.wsUrl} for session ${t.screenClientId}-event`);
+        }, r.value.onmessage = (l) => {
           try {
-            const r = JSON.parse(o.data);
-            D(r);
-          } catch (r) {
-            console.error("[VirtualHumanEventAdapter] Failed to parse message:", o.data, r);
+            const u = JSON.parse(l.data);
+            k(u);
+          } catch (u) {
+            console.error("[VirtualHumanEventAdapter] Failed to parse message:", l.data, u);
           }
-        }, u.value.onerror = (o) => {
-          console.error("[VirtualHumanEventAdapter] WebSocket error:", o), l("error", o);
-        }, u.value.onclose = () => {
+        }, r.value.onerror = (l) => {
+          console.error("[VirtualHumanEventAdapter] WebSocket error:", l), i("error", l);
+        }, r.value.onclose = () => {
           Y.value = !1, console.log("[VirtualHumanEventAdapter] WebSocket disconnected");
         };
       } catch (s) {
-        console.error("[VirtualHumanEventAdapter] Failed to initialize WebSocket:", s), l("error", s);
+        console.error("[VirtualHumanEventAdapter] Failed to initialize WebSocket:", s), i("error", s);
       }
-    }, D = (s) => {
-      const { type: o, payload: r, action: v } = s;
-      switch (console.log("msgmsg", s), o) {
+    }, k = (s) => {
+      const { type: l, payload: u, action: b } = s;
+      switch (console.log("msgmsg-002", s), l) {
         case "audio":
-          const g = (r == null ? void 0 : r.data) || s.data;
-          g && z(g);
+          const C = (u == null ? void 0 : u.data) || s.data;
+          C && h(C);
           break;
-        case "dialog_event":
-          s.event && l(s.event, s.params);
+        case "send_event":
+          s.event && i("eventNotifaction", s);
           break;
         case "control":
-          v && b(v);
-          break;
-        case "highlight":
-          l("highlight", r);
-          break;
-        case "showDialog":
-          l("showDialog", r);
+          b && M(b);
           break;
         case "end":
-          l("end", r);
+          i("end", u);
           break;
         case "pause":
-          l("pause", r);
+          i("pause", u);
           break;
         default:
-          console.warn(`[VirtualHumanEventAdapter] Unknown message type: ${o}`);
+          console.warn(`[VirtualHumanEventAdapter] Unknown message type: ${l}`);
       }
     };
     return X(() => t.screenClientId, () => {
@@ -295,8 +290,8 @@ const ae = ["src", "muted"], se = { class: "overlay" }, le = {
     }), G(() => {
       t.screenClientId && t.wsUrl && A();
     }), K(() => {
-      u.value && u.value.close(), n && n.close();
-    }), (s, o) => ne(s.$slots, "default");
+      r.value && r.value.close(), n && n.close();
+    }), (s, l) => ne(s.$slots, "default");
   }
 }), de = (c) => {
   c.component("VirtualHumanPersona", ue), c.component("VirtualHumanEventAdapter", ce);

package/dist/virtual-human-cf.umd.js

@@ -1 +1 @@
-(function(h,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(h=typeof globalThis<"u"?globalThis:h||self,e(h.VirtualHumanCf={},h.Vue))})(this,function(h,e){"use strict";const F=["src","muted"],O={class:"overlay"},j={key:0,class:"status-badge paused"},J={key:1,class:"status-badge playing"},$=((d,A)=>{const n=d.__vccOpts||d;for(const[s,u]of A)n[s]=u;return n})(e.defineComponent({__name:"VirtualHumanPersona",props:{videoSrc:{type:String,required:!0},visible:{type:Boolean,default:!1},isPlaying:{type:Boolean,default:!1},muted:{type:Boolean,default:!0},isDark:{type:Boolean,default:!1},screenClientId:{type:String,required:!1},wsUrl:{type:String,required:!1}},emits:["update:isPlaying","ended","update:visible"],setup(d,{emit:A}){const n=d,s=A,u=e.ref(null),N=e.ref(null),a=e.ref(null),y=e.ref(!1),w=e.ref(400),k=e.ref(500),I=e.ref(16),S=e.ref(16),x=e.ref(!1),b=e.ref(null),H=e.ref(0),z=e.ref(0),l=e.ref(0),r=e.ref(0),i=e.ref(0),f=e.ref(0),g=()=>{if(a.value&&a.value.close(),!(!n.wsUrl||!n.screenClientId))try{const c=new URL(n.wsUrl);c.searchParams.append("sessionId",n.screenClientId+"-persona"),a.value=new WebSocket(c.toString()),a.value.onopen=()=>{y.value=!0,console.log(`[VirtualHumanPersona] Connected to ${n.wsUrl} for session ${n.screenClientId}-persona`)},a.value.onmessage=t=>{try{const o=JSON.parse(t.data);T(o)}catch(o){console.error("[VirtualHumanPersona] Failed to parse message:",t.data,o)}},a.value.onerror=t=>{console.error("[VirtualHumanPersona] WebSocket error:",t)},a.value.onclose=()=>{y.value=!1,console.log("[VirtualHumanPersona] WebSocket disconnected")}}catch(c){console.error("[VirtualHumanPersona] Failed to initialize WebSocket:",c)}},T=c=>{const{type:t,action:o}=c;t==="control"&&(o==="play"||o==="resume"?(s("update:isPlaying",!0),s("update:visible",!0)):o==="pause"?s("update:isPlaying",!1):o==="stop"&&(s("update:isPlaying",!1),s("update:visible",!1),u.value&&(u.value.currentTime=0)))};e.watch(()=>n.screenClientId,()=>{n.screenClientId&&n.wsUrl&&g()}),e.watch(()=>n.wsUrl,()=>{n.screenClientId&&n.wsUrl&&g()}),e.watch(()=>n.isPlaying,c=>{u.value&&(c?u.value.play().catch(t=>console.error("Video play failed:",t)):u.value.pause())});const W=()=>{n.isPlaying||s("update:isPlaying",!0)},B=()=>{n.isPlaying&&s("update:isPlaying",!1)},m=()=>{s("update:isPlaying",!1),s("ended")},C=(c,t)=>{t.preventDefault(),x.value=!0,b.value=c;const o="clientX"in t?t.clientX:t.touches[0].clientX,V="clientY"in t?t.clientY:t.touches[0].clientY;H.value=o,z.value=V,l.value=w.value,r.value=k.value,i.value=I.value,f.value=S.value,document.addEventListener("mousemove",L),document.addEventListener("mouseup",M),document.addEventListener("touchmove",L,{passive:!1}),document.addEventListener("touchend",M)},L=c=>{if(!x.value)return;c.preventDefault();const t="clientX"in c?c.clientX:c.touches[0].clientX,o="clientY"in c?c.clientY:c.touches[0].clientY,V=t-H.value,U=o-z.value,R=200,X=250,Y=800,D=1e3;let p=l.value,v=r.value,E=i.value,P=f.value;b.value==="bottom-right"?(p=l.value+V,P=f.value-U,v=r.value+U):b.value==="bottom-left"?(E=i.value+V,p=l.value-V,P=f.value-U,v=r.value+U):b.value==="top-right"?(p=l.value+V,v=r.value-U):b.value==="top-left"&&(E=i.value+V,p=l.value-V,v=r.value-U),p<R&&(E!==i.value&&(E-=R-p),p=R),v<X&&(P!==f.value&&(P-=X-v),v=X),p>Y&&(E!==i.value&&(E+=p-Y),p=Y),v>D&&(P!==f.value&&(P+=v-D),v=D),w.value=p,k.value=v,I.value=E,S.value=P},M=()=>{x.value=!1,b.value=null,document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",M),document.removeEventListener("touchmove",L),document.removeEventListener("touchend",M)};return e.onMounted(()=>{n.isPlaying&&u.value&&u.value.play().catch(c=>console.error("Video play failed:",c)),n.screenClientId&&n.wsUrl&&g()}),e.onUnmounted(()=>{a.value&&a.value.close()}),(c,t)=>(e.openBlock(),e.createBlock(e.Transition,{name:"fade"},{default:e.withCtx(()=>[d.visible?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["virtual-human-container",{"is-dark":d.isDark}]),style:e.normalizeStyle({width:w.value+"px",height:k.value+"px",left:I.value+"px",bottom:S.value+"px"})},[e.createElementVNode("div",{class:"video-wrapper",ref_key:"wrapperRef",ref:N},[e.createElementVNode("video",{ref_key:"videoRef",ref:u,src:d.videoSrc,class:"persona-video",muted:d.muted,playsinline:"",loop:"",onPlay:W,onPause:B,onEnded:m},null,40,F),d.visible?(e.openBlock(),e.createElementBlock("div",{key:0,class:"resize-handle top-left",onMousedown:t[0]||(t[0]=o=>C("top-left",o)),onTouchstart:t[1]||(t[1]=o=>C("top-left",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:1,class:"resize-handle top-right",onMousedown:t[2]||(t[2]=o=>C("top-right",o)),onTouchstart:t[3]||(t[3]=o=>C("top-right",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:2,class:"resize-handle bottom-left",onMousedown:t[4]||(t[4]=o=>C("bottom-left",o)),onTouchstart:t[5]||(t[5]=o=>C("bottom-left",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:3,class:"resize-handle bottom-right",onMousedown:t[6]||(t[6]=o=>C("bottom-right",o)),onTouchstart:t[7]||(t[7]=o=>C("bottom-right",o))},null,32)):e.createCommentVNode("",!0),e.createElementVNode("div",O,[d.isPlaying?(e.openBlock(),e.createElementBlock("div",J,[...t[9]||(t[9]=[e.createElementVNode("span",{class:"dot animate-pulse"},null,-1),e.createTextVNode(" 播放中 ",-1)])])):(e.openBlock(),e.createElementBlock("div",j,[...t[8]||(t[8]=[e.createElementVNode("span",{class:"dot"},null,-1),e.createTextVNode(" 暂停中 ",-1)])]))])],512)],6)):e.createCommentVNode("",!0)]),_:1}))}}),[["__scopeId","data-v-5d741303"]]),q=e.defineComponent({__name:"VirtualHumanEventAdapter",props:{screenClientId:{type:String,required:!0},wsUrl:{type:String,required:!0}},emits:["highlight","showDialog","end","pause","connected","error","play_complete"],setup(d,{emit:A}){const n=d,s=A,u=e.ref(null),N=e.ref(!1);let a=null,y=0,w=!1,k=0;const I=()=>{a||(a=new(window.AudioContext||window.webkitAudioContext)({sampleRate:24e3})),a.state==="suspended"&&a.resume()},S=()=>{w&&k===0&&(s("play_complete",n.screenClientId),w=!1)},x=l=>{if(I(),!!a)try{const r=window.atob(l),i=r.length,f=new Uint8Array(i);for(let m=0;m<i;m++)f[m]=r.charCodeAt(m);const g=new Int16Array(f.buffer),T=new Float32Array(g.length);for(let m=0;m<g.length;m++)T[m]=g[m]/32768;const W=a.createBuffer(1,T.length,24e3);W.getChannelData(0).set(T);const B=a.createBufferSource();B.buffer=W,B.connect(a.destination),y<a.currentTime&&(y=a.currentTime),B.start(y),y+=W.duration,k++,B.onended=()=>{k--,S()}}catch(r){console.error("[VirtualHumanEventAdapter] Failed to decode and play audio:",r)}},b=l=>{if(!(!a&&l!=="stop"))switch(l){case"play":w=!1,k=0,y=0,a&&a.state==="suspended"&&a.resume();break;case"resume":a&&a.state==="suspended"&&a.resume();break;case"pause":a&&a.state==="running"&&a.suspend();break;case"stop":a&&(a.close(),a=null),y=0,w=!1,k=0;break;case"tts_complete":w=!0,S();break;default:console.warn(`[VirtualHumanEventAdapter] Unknown control action: ${l}`)}},H=()=>{u.value&&u.value.close();try{const l=new URL(n.wsUrl);l.searchParams.append("sessionId",n.screenClientId+"-event"),u.value=new WebSocket(l.toString()),u.value.onopen=()=>{N.value=!0,s("connected"),console.log(`[VirtualHumanEventAdapter] Connected to ${n.wsUrl} for session ${n.screenClientId}-event`)},u.value.onmessage=r=>{try{const i=JSON.parse(r.data);z(i)}catch(i){console.error("[VirtualHumanEventAdapter] Failed to parse message:",r.data,i)}},u.value.onerror=r=>{console.error("[VirtualHumanEventAdapter] WebSocket error:",r),s("error",r)},u.value.onclose=()=>{N.value=!1,console.log("[VirtualHumanEventAdapter] WebSocket disconnected")}}catch(l){console.error("[VirtualHumanEventAdapter] Failed to initialize WebSocket:",l),s("error",l)}},z=l=>{const{type:r,payload:i,action:f}=l;switch(console.log("msgmsg",l),r){case"audio":const g=(i==null?void 0:i.data)||l.data;g&&x(g);break;case"dialog_event":l.event&&s(l.event,l.params);break;case"control":f&&b(f);break;case"highlight":s("highlight",i);break;case"showDialog":s("showDialog",i);break;case"end":s("end",i);break;case"pause":s("pause",i);break;default:console.warn(`[VirtualHumanEventAdapter] Unknown message type: ${r}`)}};return e.watch(()=>n.screenClientId,()=>{n.screenClientId&&n.wsUrl&&H()}),e.watch(()=>n.wsUrl,()=>{n.screenClientId&&n.wsUrl&&H()}),e.onMounted(()=>{n.screenClientId&&n.wsUrl&&H()}),e.onUnmounted(()=>{u.value&&u.value.close(),a&&a.close()}),(l,r)=>e.renderSlot(l.$slots,"default")}}),G={install:d=>{d.component("VirtualHumanPersona",$),d.component("VirtualHumanEventAdapter",q)}};h.VirtualHumanEventAdapter=q,h.VirtualHumanPersona=$,h.default=G,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(v,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(v=typeof globalThis<"u"?globalThis:v||self,e(v.VirtualHumanCf={},v.Vue))})(this,function(v,e){"use strict";const F=["src","muted"],O={class:"overlay"},j={key:0,class:"status-badge paused"},J={key:1,class:"status-badge playing"},q=((d,A)=>{const n=d.__vccOpts||d;for(const[c,i]of A)n[c]=i;return n})(e.defineComponent({__name:"VirtualHumanPersona",props:{videoSrc:{type:String,required:!0},visible:{type:Boolean,default:!1},isPlaying:{type:Boolean,default:!1},muted:{type:Boolean,default:!0},isDark:{type:Boolean,default:!1},screenClientId:{type:String,required:!1},wsUrl:{type:String,required:!1}},emits:["update:isPlaying","ended","update:visible"],setup(d,{emit:A}){const n=d,c=A,i=e.ref(null),W=e.ref(null),a=e.ref(null),y=e.ref(!1),g=e.ref(400),w=e.ref(500),h=e.ref(16),x=e.ref(16),H=e.ref(!1),b=e.ref(null),z=e.ref(0),B=e.ref(0),C=e.ref(0),l=e.ref(0),s=e.ref(0),u=e.ref(0),k=()=>{if(a.value&&a.value.close(),!(!n.wsUrl||!n.screenClientId))try{const r=new URL(n.wsUrl);r.searchParams.append("sessionId",n.screenClientId+"-persona"),a.value=new WebSocket(r.toString()),a.value.onopen=()=>{y.value=!0,console.log(`[VirtualHumanPersona] Connected to ${n.wsUrl} for session ${n.screenClientId}-persona`)},a.value.onmessage=t=>{try{const o=JSON.parse(t.data);V(o)}catch(o){console.error("[VirtualHumanPersona] Failed to parse message:",t.data,o)}},a.value.onerror=t=>{console.error("[VirtualHumanPersona] WebSocket error:",t)},a.value.onclose=()=>{y.value=!1,console.log("[VirtualHumanPersona] WebSocket disconnected")}}catch(r){console.error("[VirtualHumanPersona] Failed to initialize WebSocket:",r)}},V=r=>{const{type:t,action:o}=r;t==="control"&&(o==="play"||o==="resume"?(c("update:isPlaying",!0),c("update:visible",!0)):o==="pause"?c("update:isPlaying",!1):o==="stop"&&(c("update:isPlaying",!1),c("update:visible",!1),i.value&&(i.value.currentTime=0)))};e.watch(()=>n.screenClientId,()=>{n.screenClientId&&n.wsUrl&&k()}),e.watch(()=>n.wsUrl,()=>{n.screenClientId&&n.wsUrl&&k()}),e.watch(()=>n.isPlaying,r=>{i.value&&(r?i.value.play().catch(t=>console.error("Video play failed:",t)):i.value.pause())});const N=()=>{n.isPlaying||c("update:isPlaying",!0)},T=()=>{n.isPlaying&&c("update:isPlaying",!1)},I=()=>{c("update:isPlaying",!1),c("ended")},f=(r,t)=>{t.preventDefault(),H.value=!0,b.value=r;const o="clientX"in t?t.clientX:t.touches[0].clientX,P="clientY"in t?t.clientY:t.touches[0].clientY;z.value=o,B.value=P,C.value=g.value,l.value=w.value,s.value=h.value,u.value=x.value,document.addEventListener("mousemove",L),document.addEventListener("mouseup",M),document.addEventListener("touchmove",L,{passive:!1}),document.addEventListener("touchend",M)},L=r=>{if(!H.value)return;r.preventDefault();const t="clientX"in r?r.clientX:r.touches[0].clientX,o="clientY"in r?r.clientY:r.touches[0].clientY,P=t-z.value,U=o-B.value,R=200,X=250,Y=800,$=1e3;let m=C.value,p=l.value,E=s.value,S=u.value;b.value==="bottom-right"?(m=C.value+P,S=u.value-U,p=l.value+U):b.value==="bottom-left"?(E=s.value+P,m=C.value-P,S=u.value-U,p=l.value+U):b.value==="top-right"?(m=C.value+P,p=l.value-U):b.value==="top-left"&&(E=s.value+P,m=C.value-P,p=l.value-U),m<R&&(E!==s.value&&(E-=R-m),m=R),p<X&&(S!==u.value&&(S-=X-p),p=X),m>Y&&(E!==s.value&&(E+=m-Y),m=Y),p>$&&(S!==u.value&&(S+=p-$),p=$),g.value=m,w.value=p,h.value=E,x.value=S},M=()=>{H.value=!1,b.value=null,document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",M),document.removeEventListener("touchmove",L),document.removeEventListener("touchend",M)};return e.onMounted(()=>{n.isPlaying&&i.value&&i.value.play().catch(r=>console.error("Video play failed:",r)),n.screenClientId&&n.wsUrl&&k()}),e.onUnmounted(()=>{a.value&&a.value.close()}),(r,t)=>(e.openBlock(),e.createBlock(e.Transition,{name:"fade"},{default:e.withCtx(()=>[d.visible?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["virtual-human-container",{"is-dark":d.isDark}]),style:e.normalizeStyle({width:g.value+"px",height:w.value+"px",left:h.value+"px",bottom:x.value+"px"})},[e.createElementVNode("div",{class:"video-wrapper",ref_key:"wrapperRef",ref:W},[e.createElementVNode("video",{ref_key:"videoRef",ref:i,src:d.videoSrc,class:"persona-video",muted:d.muted,playsinline:"",loop:"",autoPlay:"",disablePictureInPicture:"false",onPlay:N,onPause:T,onEnded:I},null,40,F),d.visible?(e.openBlock(),e.createElementBlock("div",{key:0,class:"resize-handle top-left",onMousedown:t[0]||(t[0]=o=>f("top-left",o)),onTouchstart:t[1]||(t[1]=o=>f("top-left",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:1,class:"resize-handle top-right",onMousedown:t[2]||(t[2]=o=>f("top-right",o)),onTouchstart:t[3]||(t[3]=o=>f("top-right",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:2,class:"resize-handle bottom-left",onMousedown:t[4]||(t[4]=o=>f("bottom-left",o)),onTouchstart:t[5]||(t[5]=o=>f("bottom-left",o))},null,32)):e.createCommentVNode("",!0),d.visible?(e.openBlock(),e.createElementBlock("div",{key:3,class:"resize-handle bottom-right",onMousedown:t[6]||(t[6]=o=>f("bottom-right",o)),onTouchstart:t[7]||(t[7]=o=>f("bottom-right",o))},null,32)):e.createCommentVNode("",!0),e.createElementVNode("div",O,[d.isPlaying?(e.openBlock(),e.createElementBlock("div",J,[...t[9]||(t[9]=[e.createElementVNode("span",{class:"dot animate-pulse"},null,-1),e.createTextVNode(" 播放中 ",-1)])])):(e.openBlock(),e.createElementBlock("div",j,[...t[8]||(t[8]=[e.createElementVNode("span",{class:"dot"},null,-1),e.createTextVNode(" 暂停中 ",-1)])]))])],512)],6)):e.createCommentVNode("",!0)]),_:1}))}}),[["__scopeId","data-v-6c9e435e"]]),D=e.defineComponent({__name:"VirtualHumanEventAdapter",props:{screenClientId:{type:String,required:!0},wsUrl:{type:String,required:!0}},emits:["eventNotifaction","end","pause","connected","error","playComplete"],setup(d,{emit:A}){const n=d,c=A,i=e.ref(null),W=e.ref(!1);let a=null,y=0,g=!1,w=0,h=!1;const x=()=>{a||(a=new(window.AudioContext||window.webkitAudioContext)({sampleRate:24e3})),a.state==="suspended"&&!h&&a.resume()},H=()=>{g&&w===0&&(c("playComplete",n.screenClientId),g=!1)},b=l=>{if(x(),!!a)try{const s=window.atob(l),u=s.length,k=new Uint8Array(u);for(let f=0;f<u;f++)k[f]=s.charCodeAt(f);const V=new Int16Array(k.buffer),N=new Float32Array(V.length);for(let f=0;f<V.length;f++)N[f]=V[f]/32768;const T=a.createBuffer(1,N.length,24e3);T.getChannelData(0).set(N);const I=a.createBufferSource();I.buffer=T,I.connect(a.destination),y<a.currentTime&&(y=a.currentTime),I.start(y),y+=T.duration,w++,I.onended=()=>{w--,H()}}catch(s){console.error("[VirtualHumanEventAdapter] Failed to decode and play audio:",s)}},z=l=>{switch(l){case"play":g=!1,w=0,y=0,h=!1,a&&a.state==="suspended"&&a.resume();break;case"resume":h=!1,a&&a.state==="suspended"&&a.resume();break;case"pause":h=!0,a&&a.state==="running"&&a.suspend();break;case"stop":h=!1,a&&(a.close(),a=null),y=0,g=!1,w=0;break;case"tts_complete":g=!0,H();break;default:console.warn(`[VirtualHumanEventAdapter] Unknown control action: ${l}`)}},B=()=>{i.value&&i.value.close();try{const l=new URL(n.wsUrl);l.searchParams.append("sessionId",n.screenClientId+"-event"),i.value=new WebSocket(l.toString()),i.value.onopen=()=>{W.value=!0,c("connected"),console.log(`[VirtualHumanEventAdapter] Connected to ${n.wsUrl} for session ${n.screenClientId}-event`)},i.value.onmessage=s=>{try{const u=JSON.parse(s.data);C(u)}catch(u){console.error("[VirtualHumanEventAdapter] Failed to parse message:",s.data,u)}},i.value.onerror=s=>{console.error("[VirtualHumanEventAdapter] WebSocket error:",s),c("error",s)},i.value.onclose=()=>{W.value=!1,console.log("[VirtualHumanEventAdapter] WebSocket disconnected")}}catch(l){console.error("[VirtualHumanEventAdapter] Failed to initialize WebSocket:",l),c("error",l)}},C=l=>{const{type:s,payload:u,action:k}=l;switch(console.log("msgmsg-002",l),s){case"audio":const V=(u==null?void 0:u.data)||l.data;V&&b(V);break;case"send_event":l.event&&c("eventNotifaction",l);break;case"control":k&&z(k);break;case"end":c("end",u);break;case"pause":c("pause",u);break;default:console.warn(`[VirtualHumanEventAdapter] Unknown message type: ${s}`)}};return e.watch(()=>n.screenClientId,()=>{n.screenClientId&&n.wsUrl&&B()}),e.watch(()=>n.wsUrl,()=>{n.screenClientId&&n.wsUrl&&B()}),e.onMounted(()=>{n.screenClientId&&n.wsUrl&&B()}),e.onUnmounted(()=>{i.value&&i.value.close(),a&&a.close()}),(l,s)=>e.renderSlot(l.$slots,"default")}}),G={install:d=>{d.component("VirtualHumanPersona",q),d.component("VirtualHumanEventAdapter",D)}};v.VirtualHumanEventAdapter=D,v.VirtualHumanPersona=q,v.default=G,Object.defineProperties(v,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "virtual-human-cf",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Vue3 Digital Human Component Package by cf ",
   "main": "dist/virtual-human-cf.umd.js",
   "module": "dist/virtual-human-cf.es.js",

package/src/components/VirtualHumanEventAdapter.vue

@@ -18,7 +18,7 @@ const props = defineProps({
   }
 });
 
-const emit = defineEmits(['highlight', 'showDialog', 'end', 'pause', 'connected', 'error', 'play_complete']);
+const emit = defineEmits(['eventNotifaction', 'end', 'pause', 'connected', 'error', 'playComplete']);
 
 const ws = ref<WebSocket | null>(null);
 const isConnected = ref(false);
@@ -28,6 +28,7 @@ let audioContext: AudioContext | null = null;
 let nextStartTime = 0;
 let isTtsComplete = false;
 let activeSources = 0;
+let isIntentionallyPaused = false;
 
 const initAudioContext = () => {
   if (!audioContext) {
@@ -35,14 +36,14 @@ const initAudioContext = () => {
       sampleRate: 24000
     });
   }
-  if (audioContext.state === 'suspended') {
+  if (audioContext.state === 'suspended' && !isIntentionallyPaused) {
     audioContext.resume();
   }
 };
 
 const checkPlayComplete = () => {
   if (isTtsComplete && activeSources === 0) {
-    emit('play_complete', props.screenClientId);
+    emit('playComplete', props.screenClientId);
     isTtsComplete = false;
   }
 };
@@ -91,27 +92,30 @@ const handleAudioMessage = (base64Data: string) => {
 };
 
 const handleControlMessage = (action: string) => {
-  if (!audioContext && action !== 'stop') return;
   switch (action) {
     case 'play':
       isTtsComplete = false;
       activeSources = 0;
       nextStartTime = 0;
+      isIntentionallyPaused = false;
       if (audioContext && audioContext.state === 'suspended') {
         audioContext.resume();
       }
       break;
     case 'resume':
+      isIntentionallyPaused = false;
       if (audioContext && audioContext.state === 'suspended') {
         audioContext.resume();
       }
       break;
     case 'pause':
+      isIntentionallyPaused = true;
       if (audioContext && audioContext.state === 'running') {
         audioContext.suspend();
       }
       break;
     case 'stop':
+      isIntentionallyPaused = false;
       if (audioContext) {
         audioContext.close();
         audioContext = null;
@@ -171,32 +175,27 @@ const connectWebSocket = () => {
 
 const handleMessage = (msg: any) => {
   const { type, payload, action } = msg;
-  console.log("msgmsg",msg)
+  console.log("msgmsg-002",msg)
   switch (type) {
+    // 接收音频
     case 'audio':
       const base64Data = payload?.data || msg.data;
       if (base64Data) {
         handleAudioMessage(base64Data);
       }
       break;
-    case 'dialog_event':
+    // 接收事件通知
+    case 'send_event':
       if (msg.event) {
-        emit(msg.event as any, msg.params);
+        emit('eventNotifaction', msg);
       }
       break;
+    // 控制指令接口
     case 'control':
       if (action) {
         handleControlMessage(action);
       }
       break;
-    case 'highlight':
-      // 触发高亮大屏某区域事件
-      emit('highlight', payload);
-      break;
-    case 'showDialog':
-      // 触发弹窗显示事件
-      emit('showDialog', payload);
-      break;
     case 'end':
       // 触发数字人对话结束事件
       emit('end', payload);

package/src/components/VirtualHumanPersona.vue

@@ -19,6 +19,8 @@
           :muted="muted"
           playsinline
           loop
+          autoPlay
+          disablePictureInPicture="false"
           @play="handlePlay"
           @pause="handlePause"
           @ended="handleEnded"