diff --git a/ai.symfony.com/assets/styles/app.css b/ai.symfony.com/assets/styles/app.css index 6b9717d9f..dfd612c7c 100644 --- a/ai.symfony.com/assets/styles/app.css +++ b/ai.symfony.com/assets/styles/app.css @@ -215,10 +215,10 @@ button#themeToggle { color: white; } -.demo-audio .demo-icon { background: linear-gradient(180deg, #42DEEE, #7069B0); } .demo-blog .demo-icon { background: linear-gradient(180deg, #433F77, #C43BC2); } .demo-crop .demo-icon { background: linear-gradient(180deg, #85A72B, #97BC43); } .demo-recipe .demo-icon { background: linear-gradient(180deg, #83A659, #71BCB8); } +.demo-speech .demo-icon { background: linear-gradient(180deg, #42DEEE, #7069B0); } .demo-turbo .demo-icon { background: linear-gradient(180deg, #E94E77, #D68189); } .demo-video .demo-icon { background: linear-gradient(180deg, #3B9D87, #35A781); } .demo-wikipedia .demo-icon { background: linear-gradient(180deg, #1CA574, #56AB48); } diff --git a/ai.symfony.com/templates/homepage.html.twig b/ai.symfony.com/templates/homepage.html.twig index 16cc8e5ec..1516ab3df 100644 --- a/ai.symfony.com/templates/homepage.html.twig +++ b/ai.symfony.com/templates/homepage.html.twig @@ -256,7 +256,7 @@
-
+
{{ ux_icon('tabler:microphone', {width: 42, height: 42}) }} @@ -264,7 +264,7 @@

- Audio Bot + Subagent + Speech Bot + Subagent

{{ ux_icon('tabler:arrow-right', {width: 24, height: 24, class: 'ms-1'}) }}
diff --git a/demo/assets/app.js b/demo/assets/app.js index f56c2a2df..c43ea810d 100644 --- a/demo/assets/app.js +++ b/demo/assets/app.js @@ -1,10 +1,10 @@ import './bootstrap.js'; import 'bootstrap/dist/css/bootstrap.min.css'; import './styles/app.css'; -import './styles/audio.css'; import './styles/blog.css'; import './styles/crop.css'; import './styles/recipe.css'; +import './styles/speech.css'; import './styles/stream.css'; import './styles/youtube.css'; import './styles/video.css'; diff --git a/demo/assets/controllers/audio_controller.js b/demo/assets/controllers/speech_controller.js similarity index 100% rename from demo/assets/controllers/audio_controller.js rename to demo/assets/controllers/speech_controller.js diff --git a/demo/assets/styles/audio.css b/demo/assets/styles/speech.css similarity index 99% rename from demo/assets/styles/audio.css rename to demo/assets/styles/speech.css index f1584dfab..2bfe79dae 100644 --- a/demo/assets/styles/audio.css +++ b/demo/assets/styles/speech.css @@ -1,4 +1,4 @@ -.audio { +.speech { body&, .card-img-top { background: #df662f; background: linear-gradient(0deg, #df662f 0%, #a80a1d 100%); diff --git a/demo/config/packages/ai.yaml b/demo/config/packages/ai.yaml index b2dfab7aa..c716f7c46 100644 --- a/demo/config/packages/ai.yaml +++ b/demo/config/packages/ai.yaml @@ -42,7 +42,7 @@ ai: tools: - 'Symfony\AI\Agent\Toolbox\Tool\Wikipedia' include_sources: true - audio: + speech: platform: 'ai.platform.openai' model: 'gpt-4o-mini?temperature=1.0' prompt: | @@ -52,6 +52,7 @@ ai: If you don't know the answer, say so. Keep in mind that you are in a spoken conversation, so keep your answers concise and to the point. They will be read out loud to the user. tools: + - 'Symfony\AI\Agent\Toolbox\Tool\Clock' # Agent in agent 🤯 - agent: 'blog' name: 'symfony_blog' @@ -105,7 +106,7 @@ services: autowire: true autoconfigure: true - # Symfony\AI\Agent\Toolbox\Tool\Clock: ~ + Symfony\AI\Agent\Toolbox\Tool\Clock: ~ Symfony\AI\Agent\Toolbox\Tool\Wikipedia: ~ Symfony\AI\Agent\Toolbox\Tool\SimilaritySearch: $vectorizer: '@ai.vectorizer.openai' diff --git a/demo/config/routes.yaml b/demo/config/routes.yaml index c7b431289..e921dc88a 100644 --- a/demo/config/routes.yaml +++ b/demo/config/routes.yaml @@ -4,13 +4,6 @@ index: defaults: template: 'index.html.twig' -audio: - path: '/audio' - controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController' - defaults: - template: 'chat.html.twig' - context: { chat: 'audio' } - blog: path: '/blog' controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController' @@ -31,6 +24,13 @@ recipe: template: 'chat.html.twig' context: { chat: 'recipe' } +speech: + path: '/speech' + controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController' + defaults: + template: 'chat.html.twig' + context: { chat: 'speech' } + stream: path: '/stream' controller: 'Symfony\Bundle\FrameworkBundle\Controller\TemplateController' diff --git a/demo/src/Audio/Chat.php b/demo/src/Speech/Chat.php similarity index 93% rename from demo/src/Audio/Chat.php rename to demo/src/Speech/Chat.php index 34d3ba36a..79525d102 100644 --- a/demo/src/Audio/Chat.php +++ b/demo/src/Speech/Chat.php @@ -9,7 +9,7 @@ * file that was distributed with this source code. */ -namespace App\Audio; +namespace App\Speech; use Symfony\AI\Agent\AgentInterface; use Symfony\AI\Platform\Bridge\OpenAi\TextToSpeech\Voice; @@ -29,7 +29,7 @@ public function __construct( #[Autowire(service: 'ai.platform.openai')] private readonly PlatformInterface $platform, private readonly RequestStack $requestStack, - #[Autowire(service: 'ai.agent.audio')] + #[Autowire(service: 'ai.agent.speech')] private readonly AgentInterface $agent, ) { } @@ -66,7 +66,7 @@ public function submitMessage(string $message): void 'voice' => Voice::CORAL, 'instructions' => 'Speak in a cheerful and positive tone.', ]); - $assistantMessage->getMetadata()->add('audio', $result->asDataUri('audio/mpeg')); + $assistantMessage->getMetadata()->add('speech', $result->asDataUri('audio/mpeg')); $this->saveMessages($messages); } diff --git a/demo/src/Audio/TwigComponent.php b/demo/src/Speech/TwigComponent.php similarity index 95% rename from demo/src/Audio/TwigComponent.php rename to demo/src/Speech/TwigComponent.php index dbb33a1be..1b1cc1877 100644 --- a/demo/src/Audio/TwigComponent.php +++ b/demo/src/Speech/TwigComponent.php @@ -9,7 +9,7 @@ * file that was distributed with this source code. */ -namespace App\Audio; +namespace App\Speech; use Symfony\AI\Platform\Message\MessageInterface; use Symfony\UX\LiveComponent\Attribute\AsLiveComponent; @@ -17,7 +17,7 @@ use Symfony\UX\LiveComponent\Attribute\LiveArg; use Symfony\UX\LiveComponent\DefaultActionTrait; -#[AsLiveComponent('audio')] +#[AsLiveComponent('speech')] final class TwigComponent { use DefaultActionTrait; diff --git a/demo/templates/base.html.twig b/demo/templates/base.html.twig index d465299c2..5e9d294f0 100644 --- a/demo/templates/base.html.twig +++ b/demo/templates/base.html.twig @@ -38,7 +38,7 @@ {{ ux_icon('material-symbols:crop', { height: '20px', width: '20px' }) }} Smart Crop
  • - {{ ux_icon('iconoir:microphone-solid', { height: '20px', width: '20px' }) }} Audio + {{ ux_icon('iconoir:microphone-solid', { height: '20px', width: '20px' }) }} Speech
  • {{ ux_icon('tabler:video-filled', { height: '20px', width: '20px' }) }} Video diff --git a/demo/templates/components/audio.html.twig b/demo/templates/components/speech.html.twig similarity index 91% rename from demo/templates/components/audio.html.twig rename to demo/templates/components/speech.html.twig index 0cbff084a..160804154 100644 --- a/demo/templates/components/audio.html.twig +++ b/demo/templates/components/speech.html.twig @@ -1,9 +1,9 @@ {% import "_message.html.twig" as msg %} -
    +
    {{ ux_icon('iconoir:microphone-solid', { height: '32px', width: '32px' }) }} - Conversational Bot + Speech Bot
    @@ -16,14 +16,14 @@ {{ ux_icon('fluent:bot-24-filled', { height: '45px', width: '45px' }) }}
    - +
    {% endif %} {% else %}
    {{ ux_icon('iconoir:microphone-solid', { height: '200px', width: '200px' }) }} -

    Audio Bot

    +

    Speech Bot

    Please hit the button below to start talking and again to stop
    {% endfor %} diff --git a/demo/templates/index.html.twig b/demo/templates/index.html.twig index b87a8be93..92a331aad 100644 --- a/demo/templates/index.html.twig +++ b/demo/templates/index.html.twig @@ -92,20 +92,20 @@
    -
    +
    {{ ux_icon('iconoir:microphone-solid', { height: '150px', width: '150px' }) }}
    -
    Audio Bot + Subagent
    +
    Speech Bot + Subagent

    Demonstration of speech-to-text & text-to-speech and a subagent, combining 4 models in total.

    - Try Audio Bot + Try Speech Bot
    {# Profiler route only available in dev #} {% if 'dev' == app.environment %}
    {{ ux_icon('solar:code-linear', { height: '20px', width: '20px' }) }} - See Implementation + See Implementation
    {% endif %}