Compare commits
6 Commits
feat/simpl
...
chore/upda
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8ee7c697b0 | ||
|
|
21f6c6d468 | ||
|
|
d7a7e3174c | ||
|
|
e653fa74c4 | ||
|
|
5dd784d63e | ||
|
|
efb98f612b |
@@ -20,3 +20,34 @@ export const AVATARS = [
|
||||
name: "Joshua Heygen CEO",
|
||||
},
|
||||
];
|
||||
|
||||
export const STT_LANGUAGE_LIST = [
|
||||
{ label: 'Bulgarian', value: 'bg', key: 'bg' },
|
||||
{ label: 'Chinese', value: 'zh', key: 'zh' },
|
||||
{ label: 'Czech', value: 'cs', key: 'cs' },
|
||||
{ label: 'Danish', value: 'da', key: 'da' },
|
||||
{ label: 'Dutch', value: 'nl', key: 'nl' },
|
||||
{ label: 'English', value: 'en', key: 'en' },
|
||||
{ label: 'Finnish', value: 'fi', key: 'fi' },
|
||||
{ label: 'French', value: 'fr', key: 'fr' },
|
||||
{ label: 'German', value: 'de', key: 'de' },
|
||||
{ label: 'Greek', value: 'el', key: 'el' },
|
||||
{ label: 'Hindi', value: 'hi', key: 'hi' },
|
||||
{ label: 'Hungarian', value: 'hu', key: 'hu' },
|
||||
{ label: 'Indonesian', value: 'id', key: 'id' },
|
||||
{ label: 'Italian', value: 'it', key: 'it' },
|
||||
{ label: 'Japanese', value: 'ja', key: 'ja' },
|
||||
{ label: 'Korean', value: 'ko', key: 'ko' },
|
||||
{ label: 'Malay', value: 'ms', key: 'ms' },
|
||||
{ label: 'Norwegian', value: 'no', key: 'no' },
|
||||
{ label: 'Polish', value: 'pl', key: 'pl' },
|
||||
{ label: 'Portuguese', value: 'pt', key: 'pt' },
|
||||
{ label: 'Romanian', value: 'ro', key: 'ro' },
|
||||
{ label: 'Russian', value: 'ru', key: 'ru' },
|
||||
{ label: 'Slovak', value: 'sk', key: 'sk' },
|
||||
{ label: 'Spanish', value: 'es', key: 'es' },
|
||||
{ label: 'Swedish', value: 'sv', key: 'sv' },
|
||||
{ label: 'Turkish', value: 'tr', key: 'tr' },
|
||||
{ label: 'Ukrainian', value: 'uk', key: 'uk' },
|
||||
{ label: 'Vietnamese', value: 'vi', key: 'vi' },
|
||||
];
|
||||
|
||||
@@ -2,7 +2,7 @@ import type { StartAvatarResponse } from "@heygen/streaming-avatar";
|
||||
|
||||
import StreamingAvatar, {
|
||||
AvatarQuality,
|
||||
StreamingEvents,
|
||||
StreamingEvents, TaskType, VoiceEmotion,
|
||||
} from "@heygen/streaming-avatar";
|
||||
import {
|
||||
Button,
|
||||
@@ -23,7 +23,7 @@ import { useMemoizedFn, usePrevious } from "ahooks";
|
||||
|
||||
import InteractiveAvatarTextInput from "./InteractiveAvatarTextInput";
|
||||
|
||||
import { AVATARS } from "@/app/lib/constants";
|
||||
import {AVATARS, STT_LANGUAGE_LIST} from "@/app/lib/constants";
|
||||
|
||||
export default function InteractiveAvatar() {
|
||||
const [isLoadingSession, setIsLoadingSession] = useState(false);
|
||||
@@ -32,6 +32,8 @@ export default function InteractiveAvatar() {
|
||||
const [debug, setDebug] = useState<string>();
|
||||
const [knowledgeId, setKnowledgeId] = useState<string>("");
|
||||
const [avatarId, setAvatarId] = useState<string>("");
|
||||
const [language, setLanguage] = useState<string>('en');
|
||||
|
||||
const [data, setData] = useState<StartAvatarResponse>();
|
||||
const [text, setText] = useState<string>("");
|
||||
const mediaStream = useRef<HTMLVideoElement>(null);
|
||||
@@ -89,7 +91,12 @@ export default function InteractiveAvatar() {
|
||||
const res = await avatar.current.createStartAvatar({
|
||||
quality: AvatarQuality.Low,
|
||||
avatarName: avatarId,
|
||||
knowledgeId: knowledgeId,
|
||||
knowledgeId: knowledgeId, // Or use a custom `knowledgeBase`.
|
||||
voice: {
|
||||
rate: 1.5, // 0.5 ~ 1.5
|
||||
emotion: VoiceEmotion.EXCITED,
|
||||
},
|
||||
language: language,
|
||||
});
|
||||
|
||||
setData(res);
|
||||
@@ -109,11 +116,10 @@ export default function InteractiveAvatar() {
|
||||
|
||||
return;
|
||||
}
|
||||
await avatar.current
|
||||
.speak({ text: text, sessionId: data?.session_id! })
|
||||
.catch((e) => {
|
||||
setDebug(e.message);
|
||||
});
|
||||
// speak({ text: text, task_type: TaskType.REPEAT })
|
||||
await avatar.current.speak({ text: text }).catch((e) => {
|
||||
setDebug(e.message);
|
||||
});
|
||||
setIsLoadingRepeat(false);
|
||||
}
|
||||
async function handleInterrupt() {
|
||||
@@ -123,20 +129,13 @@ export default function InteractiveAvatar() {
|
||||
return;
|
||||
}
|
||||
await avatar.current
|
||||
.interrupt({ sessionId: data?.session_id! })
|
||||
.interrupt()
|
||||
.catch((e) => {
|
||||
setDebug(e.message);
|
||||
});
|
||||
}
|
||||
async function endSession() {
|
||||
if (!avatar.current) {
|
||||
setDebug("Avatar API not initialized");
|
||||
|
||||
return;
|
||||
}
|
||||
await avatar.current.stopAvatar({
|
||||
sessionId: data?.session_id!,
|
||||
});
|
||||
await avatar.current?.stopAvatar();
|
||||
setStream(undefined);
|
||||
}
|
||||
|
||||
@@ -155,9 +154,9 @@ export default function InteractiveAvatar() {
|
||||
const previousText = usePrevious(text);
|
||||
useEffect(() => {
|
||||
if (!previousText && text) {
|
||||
avatar.current?.startListening({ sessionId: data?.session_id! });
|
||||
avatar.current?.startListening();
|
||||
} else if (previousText && !text) {
|
||||
avatar?.current?.stopListening({ sessionId: data?.session_id! });
|
||||
avatar?.current?.stopListening();
|
||||
}
|
||||
}, [text, previousText]);
|
||||
|
||||
@@ -249,6 +248,21 @@ export default function InteractiveAvatar() {
|
||||
</SelectItem>
|
||||
))}
|
||||
</Select>
|
||||
<Select
|
||||
label="Select language"
|
||||
placeholder="Select language"
|
||||
className="max-w-xs"
|
||||
selectedKeys={[language]}
|
||||
onChange={(e) => {
|
||||
setLanguage(e.target.value);
|
||||
}}
|
||||
>
|
||||
{STT_LANGUAGE_LIST.map((lang) => (
|
||||
<SelectItem key={lang.key}>
|
||||
{lang.label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</Select>
|
||||
</div>
|
||||
<Button
|
||||
className="bg-gradient-to-tr from-indigo-500 to-indigo-300 w-full text-white"
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@ai-sdk/openai": "^0.0.34",
|
||||
"@heygen/streaming-avatar": "^2.0.0-beta.1",
|
||||
"@heygen/streaming-avatar": "^2.0.4",
|
||||
"@nextui-org/button": "2.0.34",
|
||||
"@nextui-org/chip": "^2.0.32",
|
||||
"@nextui-org/code": "2.0.29",
|
||||
|
||||
Reference in New Issue
Block a user