Remove section on media players

- move Bluetooth tutorial to tutorials section
- Add link to tutorial from Bluetooth integrations page
- Add link to Bluetooth proxies introduction video
This commit is contained in:
c0ffeeca7 2023-05-16 15:21:34 +02:00
parent e1ad7d676c
commit 5e48c0864e
17 changed files with 32 additions and 263 deletions

View File

@ -184,16 +184,6 @@
<li>{% active_link /integrations/mqtt/#logging Logging %}</li>
</ul>
</li>
<li>
<b>{% active_link /integrations/esphome ESPHome %}</b>
<ul>
<li>
{% active_link /docs/esphome/increasing_bluetooth_reach Increasing Bluetooth reach %}
</li>
<li>
{% active_link /docs/esphome/adding_esphome_media_players Adding media players %}
</ul>
</li>
<li>
<b>Hardware</b>
<ul>

View File

@ -16,6 +16,7 @@
{% elsif root == 'docs' %}
{% include asides/docs_navigation.html %}
{% elsif root == 'projects' %}
{% elsif root == 'tutorials' %}
{% include asides/docs_navigation.html %}
{% elsif root == 'faq' %}
{% include asides/faq_navigation.html %}

View File

@ -249,6 +249,13 @@ The following remote adapters are supported:
- Single active connection: not supported
- Multiple active connections: not supported
### Improving the range of Bluetooth devices
![Using Bluetooth proxies to increase the range](/images/esphome/header.png)
For instructions on how to set up an ESPHome Bluetooth proxy to increase the range of your Bluetooth devices, refer to this [tutorial](/tutorials/increasing_bluetooth_reach/).
## Troubleshooting
### Integrations that require exclusive use of the Bluetooth Adapter

View File

@ -0,0 +1,7 @@
---
title: "Assist - FAQ"
---
## How can I use a wake word?
Wake words are not yet supported.

View File

@ -1,245 +0,0 @@
---
title: "Adding ESPHome media players"
---
Ready-made firmware to turn devices into ESPHome media players
<head>
<style>
body {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
Roboto, Ubuntu, sans-serif;
padding: 0;
margin: 0;
line-height: 1.4;
}
.content {
max-width: 600px;
margin: 0 auto;
padding: 12px;
}
.hidden {
display: none;
}
esp-web-install-button[install-unsupported] {
visibility: inherit;
}
.content pre {
max-width: 100%;
overflow-y: scroll;
}
li {
padding: 4px 0;
}
.footer {
margin-top: 24px;
border-top: 1px solid #ccc;
padding-top: 24px;
text-align: center;
}
.footer .initiative {
font-style: italic;
margin-top: 16px;
}
table {
border-spacing: 0;
}
td {
padding: 8px;
border-bottom: 1px solid #ccc;
}
.radios {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
}
.radios label {
padding: 4px;
cursor: pointer;
width: calc(50% - 16px);
max-width: 184px;
display: block;
position: relative;
}
.radios input {
position: absolute;
top: 12px;
left: 12px;
}
.radios img {
display: block;
width: calc(100% - 8px);
border: 4px solid rgba(0, 0, 0, 0);
aspect-ratio: 1;
}
input:checked + img {
border-color: #58a6ff;
}
/* Remove this once we add a fifth media player */
@media only screen and (min-height: 1000px) {
.radios label {
max-width: initial;
}
}
</style>
<script
type="module"
src="https://unpkg.com/esp-web-tools@9/dist/web/install-button.js?module"
></script>
</head>
## Adding an ESPHome Media Player to Home Assistant
Pick your product and install [ESPHome](https://esphome.io) on it to use it directly as a media player inside Home Assistant. No programming required.
If you're an **advanced user** who wants to install the configuration via ESPHome add-on: You can find the `configuration.yaml` on [github](https://github.com/esphome/media-players/blob/main).
To install the ESPHome software on the device, follow these steps:
1. Open this page in a Chromium-based browser (for example Google Chrome or MS Edge) on a desktop. It does not work on a tablet or phone.
2. Pick your product.
<div class="content">
<div class="radios">
<label>
<input type="radio" name="type" value="raspiaudio-muse-luxe" checked />
<img src="/images/docs/esphome/esp_muse_luxe.png" alt="Raspiaudio ESP Muse Luxe" />
</label>
<label>
<input type="radio" name="type" value="raspiaudio-muse-proto" />
<img src="/images/docs/esphome/esp_muse_proto.png" alt="Raspiaudio ESP Muse Proto" />
</label>
<label>
<input type="radio" name="type" value="m5stack-atom-speaker-kit" />
<img src="/images/docs/esphome/atom_speaker_kit.png" alt="M5Stack Atom Speaker Kit" />
</label>
<label>
<input type="radio" name="type" value="m5stack-atom-echo" />
<img src="/images/docs/esphome/atom_echo.png" alt="M5Stack Atom Echo Development Kit" />
</label>
</div>
<br />
<p class="button-row" align="center">
<esp-web-install-button></esp-web-install-button>
</p>
<div class="hidden info raspiaudio-muse-luxe">
<h3>Raspiaudio ESP Muse Luxe</h3>
<p>
Portable speaker with two 5 Watt speakers built-in. Can run 4 hours
off the built-in battery or be powered by a cable.
</p>
<p>
This is a powerful device. If you want to use it solely as a media
player, we recommend to use the
<a href="https://raspiaudio.github.io/">Squeezelite-ESP32 firmware</a
>.
</p>
<p>Buy</p>
<ul>
<li>
<a href="https://raspiaudio.com/produit/esp-muse-luxe"
>Raspiaudio</a
>
</li>
<li>
<a
href="https://www.amazon.com/gp/product/B09N3S9S29/?&_encoding=UTF8&tag=homeassista0e-20&linkCode=ur2&linkId=71c80756dcd782eba9f1a80dc576c7d3&camp=1789&creative=9325"
>Amazon</a
>
</li>
</ul>
</div>
<div class="hidden info raspiaudio-muse-proto">
<h3>Raspiaudio ESP Muse Proto</h3>
<p>
Powerful audio prototyping board to create your own smart speakers.
</p>
<p>
This is a powerful device. If you want to use it solely as a media
player, we recommend to use the
<a href="https://raspiaudio.github.io/">Squeezelite-ESP32 firmware</a
>.
</p>
<p>Buy</p>
<ul>
<li>
<a href="https://raspiaudio.com/produit/muse-proto">Raspiaudio</a>
</li>
<li>
<a
href="https://www.amazon.com/gp/product/B097F884WL/?&_encoding=UTF8&tag=homeassista0e-20&linkCode=ur2&linkId=71c80756dcd782eba9f1a80dc576c7d3&camp=1789&creative=9325"
>Amazon</a
>
</li>
</ul>
</div>
<div class="hidden info m5stack-atom-speaker-kit">
<h3>M5Stack Atom Speaker Kit</h3>
<p>Small ESP32 board with a built-in speaker and a headphone jack.</p>
<p>Buy</p>
<ul>
<li>
<a
href="https://shop.m5stack.com/products/atom-speaker-kit-ns4168?ref=NabuCasa"
>M5Stack Shop</a
>
</li>
<li>
<a
href="https://www.aliexpress.com/item/1005003297368240.html?aff_platform=portals-tool&sk=_A8G2YF&aff_trace_key=90326d2a90444b4887632f62dd533ce4-1654058373639-07963-_A8G2YF&terminal_id=c5517a8c9bb44b4fb32147398fbc2576&aff_fcid=90326d2a90444b4887632f62dd533ce4-1654058373639-07963-_A8G2YF&tt=CPS_NORMAL&aff_fsk=_A8G2YF"
>AliExpress</a
>
</li>
</ul>
</div>
<div class="hidden info m5stack-atom-echo">
<h3>M5Stack Atom Echo Development Kit</h3>
<p>Tiny ESP32 board with a built-in speaker.</p>
<p>Buy</p>
<ul>
<li>
<a
href="https://shop.m5stack.com/collections/m5-controllers/products/atom-echo-smart-speaker-dev-kit?ref=NabuCasa"
>M5Stack Shop</a
>
</li>
<li>
<a
href="https://www.aliexpress.com/item/1005003299332198.html?aff_platform=portals-tool&sk=_A8G2YF&aff_trace_key=90326d2a90444b4887632f62dd533ce4-1654058373639-07963-_A8G2YF&terminal_id=c5517a8c9bb44b4fb32147398fbc2576&aff_fcid=90326d2a90444b4887632f62dd533ce4-1654058373639-07963-_A8G2YF&tt=CPS_NORMAL&aff_fsk=_A8G2YF"
>AliExpress</a
>
</li>
</ul>
</div>
</div>
{% include /esphome/flash_firmware_steps.markdown %}
### Advanced Users
* The device is adoptable in [the ESPHome dashboard](https://my.home-assistant.io/redirect/supervisor_addon/?addon=5c53de3b_esphome&amp;repository_url=https%3A%2F%2Fgithub.com%2Fesphome%2Fhome-assistant-addon).
* The YAML configuration is on [GitHub](https://github.com/esphome/media-players/)
{% include /esphome/affiliated_links.markdown %}
<script>
document.querySelectorAll('input[name="type"]').forEach((radio) =>
radio.addEventListener("change", () => {
const button = document.querySelector("esp-web-install-button");
button.manifest = `https://esphome.github.io/media-players/${radio.value}-manifest.json`;
document.querySelectorAll(".info").forEach((info) => {
info.classList.add("hidden");
});
document
.querySelector(`.info.${radio.value}`)
.classList.remove("hidden");
})
);
document
.querySelector('input[name="type"]:checked')
.dispatchEvent(new Event("change"));
</script>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 134 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

View File

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

View File

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

View File

Before

Width:  |  Height:  |  Size: 117 KiB

After

Width:  |  Height:  |  Size: 117 KiB

View File

Before

Width:  |  Height:  |  Size: 57 KiB

After

Width:  |  Height:  |  Size: 57 KiB

View File

Before

Width:  |  Height:  |  Size: 266 KiB

After

Width:  |  Height:  |  Size: 266 KiB

View File

Before

Width:  |  Height:  |  Size: 108 KiB

After

Width:  |  Height:  |  Size: 108 KiB

View File

@ -89,6 +89,15 @@ title: "Increasing the reach of Bluetooth devices"
Bluetooth technology has a limited range. Home Assistant can expand the reach of its Bluetooth devices by communicating via Bluetooth proxy devices powered by [ESPHome](https://esphome.io/).
## Introduction
The video below provides an overview on Bluetooth proxies and how to set them up. The video was created some time ago. In the meantime, Home Assistant also supports active connections.
<lite-youtube videoid="CjpPdwK_ttg" videotitle="Increase the range of your Bluetooth devices!"></lite-youtube>
## Installing the ESPHome software on the device
Pick your product to turn it into a Bluetooth proxy for Home Assistant. No programming or other software required.
If you're an **advanced user** who wants to install the configuration via ESPHome add-on: You can find the `configuration.yaml` on [github](https://github.com/esphome/bluetooth-proxies).
@ -100,32 +109,32 @@ To install the ESPHome software on the device, follow these steps:
<div class="content">
<div class="radios">
<label>
<label>r
<input type="radio" name="type" value="esp32-generic" checked />
<img src="/images/docs/esphome/esp32_generic.png" alt="ESP32 Generic" />
<img src="/images/esphome/esp32_generic.png" alt="ESP32 Generic" />
</label>
<label>
<input type="radio" name="type" value="m5stack-atom-lite" />
<img src="/images/docs/esphome/m5stack_atom_lite.png" alt="M5Stack Atom Lite" />
<img src="/images/esphome/m5stack_atom_lite.png" alt="M5Stack Atom Lite" />
</label>
<label>
<input type="radio" name="type" value="olimex-esp32-poe-iso" />
<img
src="/images/docs/esphome/olimex_esp32_poe_iso.png"
src="/images/esphome/olimex_esp32_poe_iso.png"
alt="Olimex ESP32 Power-over-Ethernet ISO"
/>
</label>
<label class="diy">
<input type="radio" name="type" value="lilygo-t-eth-poe" />
<img src="/images/docs/esphome/lilygo-eth-poe.png" alt="LilyGO T-ETH-POE" />
<img src="/images/esphome/lilygo-eth-poe.png" alt="LilyGO T-ETH-POE" />
</label>
<label class="diy">
<input type="radio" name="type" value="gl-s10" />
<img src="/images/docs/esphome/gl-s10.png" alt="GL.iNet GL-S10" />
<img src="/images/esphome/gl-s10.png" alt="GL.iNet GL-S10" />
</label>
<label class="diy">
<input type="radio" name="type" value="wt32-eth01" />
<img src="/images/docs/esphome/wt32-eth01.png" alt="Wireless-Tag WT32-ETH01" />
<img src="/images/esphome/wt32-eth01.png" alt="Wireless-Tag WT32-ETH01" />
</label>
</div>
<br />
@ -297,7 +306,7 @@ To install the ESPHome software on the device, follow these steps:
{% include /esphome/flash_firmware_steps.markdown %}
### Advanced Users
### Advanced users
DIY Expert? [Show advanced boards](?diy)