Casting YouTube videos to a media player

[shannonhochkins]

We always play videos through our TV through using Youtube for our Daughter, we have to find the remote, search for the video (which is almost always the exact same one) and then wait for it to load, and then play it.

I thought i'd create a simple button in my react dashboard that can take a media player, and youtube video id, and then immediately start playing it when the button is pressed, thought i'd share the code:

import { useHass, type EntityName, type FilterByDomain } from '@hakit/core';
import { ButtonCard } from '@hakit/components';
// now in your component
const { useStore } = useHass();
const { connection } = useStore();
const playYouTubeVideo = useCallback(async (videoId: string, entity: FilterByDomain<EntityName, 'media_player'>) => {
    return connection?.sendMessagePromise({
      "type":"execute_script",
      "sequence":[
        {
          "service":"media_player.play_media",
          "data":{ 
            "media_content_id": ` { "app_name": "youtube", "media_id": "${videoId}" }`,
            "media_content_type":"cast"
          },
          "target":{
            "entity_id": entity
          }
        }
      ],
    });
  }, [connection]);

return <ButtonCard title="Rick Roll Me" description={'RICKY BABY'} icon="mdi:baby-face-outline" onClick={async () => {
          console.log('Preparing...')
          await playYouTubeVideo('dQw4w9WgXcQ', 'media_player.YOUR_MEDIA_PLAYER');
          console.log('Playing!')
 }} defaultLayout='slim-vertical' />

Have fun!

[Jimbojim28]

Hi I am really new to this and I dont have any idea where to put the code can you help me please

[shannonhochkins]

Really new to what? development? I'm sorry but I can't teach you how to write react, there's plenty of YouTube video's already out there for that!

If you're referring on how to use the packages, there's complete documentation and videos linked in the main readme of the repository

[Jimbojim28]

ok ill check it out its because i dont know where to add the entities i want to show up in the dashboard

[shannonhochkins]

Please follow the docs, it's all documented mate