Video chat temp (#1)

* 视觉更新

---------

Co-authored-by: 杍超 <huangbinchao.hbc@alibaba-inc.com>
Co-authored-by: 款冬 <neil.xh@alibaba-inc.com>

frontend/Index.svelte

@@ -8,7 +8,7 @@
 	import StaticVideo from "./shared/StaticVideo.svelte";
 	import StaticAudio from "./shared/StaticAudio.svelte";
 	import InteractiveAudio from "./shared/InteractiveAudio.svelte";
-
+	import VideoChat from './shared/VideoChat.svelte'
 	export let elem_id = "";
 	export let elem_classes: string[] = [];
 	export let visible = true;
@@ -34,6 +34,7 @@
 	export let modality: "video" | "audio" | "audio-video" = "video";
 	export let mode: "send-receive" | "receive" | "send" = "send-receive";
 	export let show_local_video: string | undefined = undefined;
+	export let video_chat: boolean = false;
 	export let rtp_params: RTCRtpParameters = {} as RTCRtpParameters;
 	export let track_constraints: MediaTrackConstraints = {};
 	export let icon: string | undefined = undefined;
@@ -53,7 +54,41 @@
 	$: console.log("value", value);
 </script>
 
-<Block
+{#if video_chat}
+	<Block
+	{visible}
+	variant={"solid"}
+	border_mode={dragging ? "focus" : "base"}
+	padding={false}
+	{elem_id}
+	{elem_classes}
+	{height}
+	{width}
+	{container}
+	{scale}
+	{min_width}
+	allow_overflow={false}>
+		<VideoChat {server} bind:webrtc_id={value}
+		on:clear={() => gradio.dispatch("clear")}
+		on:play={() => gradio.dispatch("play")}
+		on:pause={() => gradio.dispatch("pause")}
+		on:upload={() => gradio.dispatch("upload")}
+		on:stop={() => gradio.dispatch("stop")}
+		on:end={() => gradio.dispatch("end")}
+		on:start_recording={() => gradio.dispatch("start_recording")}
+		on:stop_recording={() => gradio.dispatch("stop_recording")}
+		on:tick={() => gradio.dispatch("tick")}
+		on:error={({ detail }) => gradio.dispatch("error", detail)}
+		i18n={gradio.i18n}
+		stream_handler={(...args) => gradio.client.stream(...args)}
+		{track_constraints}
+		{height}
+		{on_change_cb} {rtc_configuration}
+		on:tick={() => gradio.dispatch("tick")}
+		on:error={({ detail }) => gradio.dispatch("error", detail)}></VideoChat>
+	</Block>
+
+{:else}<Block
 	{visible}
 	variant={"solid"}
 	border_mode={dragging ? "focus" : "base"}
@@ -158,3 +193,4 @@
 		/>
 	{/if}
 </Block>
+{/if}