> ## Documentation Index
> Fetch the complete documentation index at: https://docs.visualradioassist.live/llms.txt
> Use this file to discover all available pages before exploring further.

# Bitfocus Companion Control over Visual Radio

> This doc described how to use Companion to utilize a StreamDeck to control the Visual Radio Assist Core application.

This doc described how to use Companion to utilize a StreamDeck to control the Visual Radio Assist Core application. Check the other [Core Control API](/develop-with-vra/core-control-api) pages as well for detailed endpoint and connectivity descriptions.

## Generic: HTTP Requests

To communicate with the VRA [Core Control API](/develop-with-vra/core-control-api) you have to setup a Generic HTTP Request in Companion with the connectivity details of your Core API ([Connectivity and Access management](/develop-with-vra/core-control-api/connectivity-and-access-management)):

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/1.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=b705edf3d3799fa6bdc85bf2ef6ba9a5" alt="" width="1358" height="804" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/1.png" />

## Create re-usable variables

To reference to current states and authorization required for the communication with the VRA Core API you have to setup the following variables:

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/2.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=965410ffbf473e3e6387a9725b6164fe" alt="" width="1326" height="694" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/2.png" />

* `vra_state_state` latest state from the Core
* `vra_auth` authorization string packed in the JSON headers for Companion's HTTP Request Connection, see [Connectivity and Access management](/develop-with-vra/core-control-api/connectivity-and-access-management)

## Startup & state sync Trigger

To keep the current state of VRA in sync with the StreamDeck at all times, create a refreshing State Sync **Trigger**:

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/3.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=0959a4dce5f2f414e0feb29eda2f77b4" alt="" width="1391" height="1126" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/3.png" />

For every request with the "VRA" (general request) Connection, make sure to use the `$(internal:custom_vra_auth)` variable to reference the current authorization header JSON from the variables.
The response of the "sync trigger" should be saved in the `vra_state_state` variable for later use.

# Create a "Toggle VRA" button

To toggle the Active state of VRA you can make use of the control endpoints in the Core API.

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/4.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=e0cb4d1c259ce8744139f0646004732b" alt="" width="2241" height="997" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/4.png" />

The current VRA State should be visible in the button via the `vra_state_state`  variable and the value of the variable is updated after the Press Action.

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/5.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=90137ba7f4c2184fa55d3d2b138a7182" alt="" width="1376" height="1144" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/5.png" />

### Sync color

You can update the button color with each state update via an extra trigger comparing the current `vra_state_state`  value. Make sure to use the correct button location in the **Set background color** Action. You need to create two Triggers for the **`ACTIVE`** and **`DEACTIVATED`** state.

<img src="https://mintcdn.com/visualradioassist/1LQdAqmw3LInyH_s/images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/6.png?fit=max&auto=format&n=1LQdAqmw3LInyH_s&q=85&s=81eb0f61ef0adef9c1813a90214d276a" alt="" width="1318" height="1121" data-path="images/develop-with-vra/core-control-api/bitfocus-companion-control-over-visual-radio/6.png" />
