diff --git a/packages/components/src/api/ApiConfig.ts b/packages/components/src/api/ApiConfig.ts index 8bcd6f3344..27a566e3a6 100644 --- a/packages/components/src/api/ApiConfig.ts +++ b/packages/components/src/api/ApiConfig.ts @@ -350,6 +350,14 @@ class ApiConfig { return `${this.getScheme()}://${this.getNewApiHost()}/detect_locale`; } + createVoiceCloneRequest() : string { + return `${this.getScheme()}://${this.getNewApiHost()}/voice_clone_requests/create`; + } + + checkVoiceCloneRequest() : string { + return `${this.getScheme()}://${this.getNewApiHost()}/voice_clone_requests/check`; + } + // =============== Storyteller-specific =============== listTwitchEventRules() : string { diff --git a/packages/fakeyou/src/v2/view/NewVocodesContainer.tsx b/packages/fakeyou/src/v2/view/NewVocodesContainer.tsx index b51a7260a6..01eff5a8de 100644 --- a/packages/fakeyou/src/v2/view/NewVocodesContainer.tsx +++ b/packages/fakeyou/src/v2/view/NewVocodesContainer.tsx @@ -51,6 +51,7 @@ import { TtsCategoryType } from '../../AppWrapper'; import { PatronPage } from './patrons/PatronPage'; import ScrollToTop from './_common/ScrollToTop'; import { Language } from '@storyteller/components/src/i18n/Language'; +import { VoiceCloneRequestPage } from './clone_voice_requests/VoiceCloneRequestPage'; interface Props { sessionWrapper: SessionWrapper, @@ -371,6 +372,10 @@ class NewVocodesContainer extends React.Component { /> + + + + (undefined); - //const [ttsLeaderboard, setTtsLeaderboard] = useState|undefined>(undefined); - //const [w2lLeaderboard, setW2lLeaderboard] = useState|undefined>(undefined); - //const [retryCount, setRetryCount] = useState(0); + // Contact + const [emailAddress, setEmailAddress] = useState(""); + const [discord, setDiscord] = useState(""); + + // Visibility //const getLeaderboard = useCallback(async () => { // const leaderboardReponse = await GetLeaderboard(); @@ -113,6 +114,35 @@ function VoiceCloneRequestPage(props: Props) {
+

Who's voice is this?

+ +

If it's your voice, you'll be able to do anything you want with it. If it's another person's voice, you may have + limits on how you can use it (eg. limits on commercialization.) That doesn't mean we can't help you. Even if you + just want your favorite character so you can make Twitter memes, that's fine!

+ +
+ +
+
+ +
+ +
+ +
+
+ +
+

How will you use it?

Click as many as you plan to use!

@@ -170,31 +200,31 @@ function VoiceCloneRequestPage(props: Props) {
-

Who's voice is this?

+

Do you want it to be private?

-

If it's your voice, you'll be able to do anything you want with it. If it's another person's voice, you may have - limits on how you can use it (eg. limits on commercialization.) That doesn't mean we can't help you. Even if you - just want your favorite character so you can make Twitter memes, that's fine!

+

(We'll accept multiple answers here, because maybe you want to use it multiple ways.)


-
- -
- -
- -
+ + +
+ + + +
+ +

@@ -238,87 +268,12 @@ function VoiceCloneRequestPage(props: Props) { - - {/* -

Once you've linked Twitch with Storyteller, you can add the following page as an OBS Browser Source:

-
-
-

- - - - -

-
- -
- - - Open In New Tab  - - -
-
-
- -

Setup Instructions

- -

If you're not familiar with OBS or you need a refresher, here's a quick glance at the setup.

- -
- -

Step 1) Click to add a new Browser Source

- - step 1 - -

The bottom of OBS should have a plus icon () to add new sources. - You'll want to add a new Browser Source.

- -
- -

Step 2) Paste the URL into the configuration window

- - step 2 - -
- -

Remember, the URL is {obsUrl}

- -
- -

Step 3) Activate the Page

- - step 3 - -
-
- -

Right click the layer and select “Interact”. - This will let you click the button and activate the service.

- -
-
- -

Good to go!

- -

You can now hide the layer and make it invisible. The audio levels are also independently adjustable.

- -
- -

Have fun! We'll be back soon with some even more jaw-dropping utilities.

- */} + - - ); }