deepgeek/gradio-webrtc
2
0
Fork 0
mirror of https://github.com/HumanAIGC-Engineering/gradio-webrtc.git synced 2026-02-05 09:59:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

gs对话接入

Browse Source 
本次代码评审新增并完善了gs视频聊天功能，包括前后端接口定义、状态管理及UI组件实现，并引入了新的依赖库以支持更多互动特性。
Link: https://code.alibaba-inc.com/xr-paas/gradio_webrtc/codereview/21273476
* 更新python 部分

* 合并videochat前端部分

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 替换audiowave

* 导入路径修改

* 合并websocket mode逻辑

* feat: gaussian avatar chat

* 增加其他渲染的入参

* feat: ws连接和使用

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 右边距离超出容器宽度，则向左移动

* 配置传递

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 高斯包异常

* 同步webrtc_utils

* 更新webrtc_utils

* 兼容on_chat_datachannel

* 修复设备名称列表没有正常显示的问题

* copy 传递 webrtc_id

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 保证webrtc 完成后再进行websocket连接

* feat: 音频表情数据接入

* dist 上传

* canvas 隐藏

* feat: 高斯文件下载进度透出

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 修改无法获取权限问题

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 先获取权限再获取设备

* fix: gs资源下载完成前不处理ws数据

* fix: merge

* 话术调整

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 修复设备切换后重新对话，又切换回默认设备的问题

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 更新localvideo 尺寸

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 不能默认default

* 修改音频权限问题

* 更新打包结果

* fix: 对话按钮状态跟gs资源挂钩，删除无用代码

* fix: merge

* feat: gs渲染模块从npm包引入

* fix

* 新增对话记录

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 样式修改

* 更新包

* fix: gs数字人初始化位置和静音

* 对话记录滚到底部

* 至少100%高度

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 略微上移文本框

* 开始连接时清空对话记录

* fix: update gs render npm

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 逻辑保证

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* feat: 音频初始化配置是否静音

* actionsbar在有字幕时调整位置

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 样式优化

* feat: 增加readme

* fix: 资源图片

* fix: docs

* fix: update gs render sdk

* fix: gs模式下画面位置计算

* fix: update readme

* 设备判断，太窄处理

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 是否有权限和是否有设备分开

* feat: gs 下载和加载钩子函数分离

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* fix: update gs render sdk

* 替换

* dist

* 上传文件

* del
This commit is contained in:
neil.xh
2025-04-16 19:09:04 +08:00
parent 06885d06c4
commit f476f9cf29
54 changed files with 4980 additions and 23257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

181
frontend/shared/VideoChat/components/ChatInput.svelte Normal file
View File

@@ -0,0 +1,181 @@
<script lang="ts">
import { IconFont, Send, Stop } from "../icons";
import { insertStringAt } from "../utils";
export let replying;
export let onSend;
export let onStop;
export let onInterrupt;
let inputHeight = 24;
let rowsDivRef: HTMLDivElement;
let chatInputRef: HTMLTextAreaElement;
let inputValue = "";
function on_chat_input_keydown(event: KeyboardEvent) {
if (event.key === "Enter") {
if (event.altKey) {
chatInputRef.value = insertStringAt(
chatInputRef.value,
"\n",
chatInputRef.selectionStart,
);
chatInputRef.dispatchEvent(new InputEvent("input"));
} else {
event.preventDefault();
on_send();
}
}
}
async function on_send() {
await onSend(chatInputRef.value);
chatInputRef.value = "";
}
function on_chat_input(event: InputEvent) {
if (rowsDivRef) {
rowsDivRef.textContent = (event.target as any).value.replace(
/\n$/,
"\n\n",
);
inputHeight = rowsDivRef.offsetHeight;
}
}
</script>
<div class="chat-input-container">
<!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div class="stop-chat-btn" on:click={onStop}></div>
<div class="chat-input-inner">
<div class="chat-input-wrapper">
<textarea
class="chat-input"
bind:this={chatInputRef}
on:keydown={on_chat_input_keydown}
on:input={on_chat_input}
style={`height:${inputHeight}px`}
/>
<div class="rowsDiv" bind:this={rowsDivRef}>{inputValue}</div>
</div>
{#if replying}
<button class="interrupt-btn" on:click={onInterrupt}></button>
{:else}
<button class="send-btn" on:click={on_send}>
<IconFont icon={Send} color={"#fff"} ></IconFont>
</button>
{/if}
<div class="chat-tip">Texts are ignored during responding.</div>
</div>
</div>
<style lang="less">
.chat-input-container {
height: 15%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
min-height: 84px;
// padding: 0 12px;
.chat-input-inner {
position: relative;
padding: 0 12px;
background-color: #fff;
height: 64px;
flex: 1;
display: flex;
align-items: center;
border: 1px solid #e8eaf2;
border-radius: 12px;
border-radius: 20px;
box-shadow:
0 12px 24px -16px rgba(54, 54, 73, 0.04),
0 12px 40px 0 rgba(51, 51, 71, 0.08),
0 0 1px 0 rgba(44, 44, 54, 0.02);
.chat-tip {
position: absolute;
top: 100%;
color: #cecece;
}
.chat-input::placeholder {
font-size: 12px;
}
.chat-input-wrapper {
flex: 1;
position: relative;
display: flex;
align-items: center;
.chat-input {
width: 100%;
border: none;
outline: none;
color: #26244c;
font-size: 16px;
font-weight: 400;
resize: none;
padding: 0;
margin: 8px 0;
line-height: 24px;
max-height: 48px;
min-height: 24px;
}
.rowsDiv {
position: absolute;
left: 0;
right: 0;
z-index: -1;
visibility: hidden;
font-size: 16px;
font-weight: 400;
line-height: 24px;
white-space: pre-wrap;
word-wrap: break-word;
}
}
.send-btn,.interrupt-btn {
flex: 0 0 auto;
background: #615ced;
border-radius: 20px;
height: 28px;
width: 28px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 16px;
cursor: pointer;
}
.interrupt-btn{
&::after {
content: " ";
width: 12px;
height: 12px;
border-radius: 2px;
background: #fafafa;
}
}
}
.stop-chat-btn {
cursor: pointer;
margin-right: 12px;
height: 28px;
width: 28px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 999px;
opacity: 1;
background: linear-gradient(180deg, #7873f6 0%, #524de1 100%);
&::after {
content: " ";
width: 12px;
height: 12px;
border-radius: 2px;
background: #fafafa;
}
}
}
</style>