home-assistant audio-recorder-card (Beta)

You can use this card to record your voice and send a wav file via http to a server (e.g. rhasspy).

The card uses recorder.js by addpipe

Installation

Download the repositiory and extract it to your home-assistant config directory. The filestructure should be like this:

<hass-config-folder>
    ├── custom_components                   
        ├──  recorder_service
            ├── __init__.py  
            ├── manifest.json 
    ├── www
        ├── audio-recorder-card
            ├── images
                ├── ...
            ├── audio-recorder-card.js

Add to your configuration.yaml:

recorder_service:

Add the resource to your home-assistant:

url: /local/audio-recorder-card/audio-recorder-card.js?v=0.1
type: module

RESTART HOME-ASSISTANT

How to use the card

Goto your Dashboard and add a new card. At the bottom you will find the audio-recorder-card.

Or you write into the yaml directly type:'custom:audio-recorder-card'.

Card settings:

attribute	description	example
target (required)	the url of the http server you want to send the wav file	http://<your-rhasspi-url>:12101/api/speech-to-intent
header (optional)	add a header to your recorder card	My awesome recorder
color (optional)	change the css color attribute of the recorder	ligthgreen
size (optional)	change the size of the recorder (default=50px)	100px

Simple example:

type: 'custom:audio-recorder-card'
target: 'http://localhost:12101/api/speech-to-intent'

Then the audio recorder card should appear:

to start the recording click once on the record button:

to stop the recording click once again on the recorder button. Now the recording_service will send the wav file to your defined target http server.

Problems

At the moment the card is only available in browsers. This function will be added in the next version.

Thanks to

recorder.js: addpipe/simple-recorderjs-demo

css-styling: u_conor