forked-daapd-card
forked-daapd-card copied to clipboard
kalkih
Outputs not showing
Thanks so much for creating this card! I've been using a combination of media player card, switches, rest sensors and automations to control volume of various speakers from Home Assistant front end.
From the readme, I understood that if I do not specify an array of speaker IDs, then it should render all the available speakers in the card. However, I'm not seeing this - when I do not provide a list of speaker IDs, I get no speakers showing in the card. I know the speakers are there and working, as my older integration still exists in lovelace and I can still control speakers using my much-less-reliable method.
This is showing in the javascript console:
forked-daapd-card.js?v=0.0.2:87 Mixed Content: The page at 'https://{{redacted}}.duckdns.org/lovelace/display' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://192.168.1.96:3688/'. This request has been blocked; this endpoint must be available over WSS.
_initSocket @ forked-daapd-card.js?v=0.0.2:87
shouldUpdate @ forked-daapd-card.js?v=0.0.2:81
_validate @ updating-element.js?module:387
_invalidate @ updating-element.js?module:371
async function (async)
_invalidate @ updating-element.js?module:370
_requestPropertyUpdate @ updating-element.js?module:356
set @ updating-element.js?module:101
ForkedDaapdCard @ forked-daapd-card.js?v=0.0.2:6
(anonymous) @ VM127:1
Be @ create-card-element.ts:71
Re @ create-card-element.ts:98
createCardElement @ hui-view.ts:75
_rebuildCard @ hui-view.ts:344
e.addEventListener.once @ hui-view.ts:83
o @ fire_event.ts:76
(anonymous) @ create-card-element.ts:111
Promise.then (async)
Re @ create-card-element.ts:109
createCardElement @ hui-view.ts:75
(anonymous) @ hui-view.ts:296
_createCards @ hui-view.ts:295
updated @ hui-view.ts:219
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
w @ hui-view.ts:68
(anonymous) @ VM127:1
_selectView @ hui-root.ts:645
(anonymous) @ hui-root.ts:485
setTimeout (async)
(anonymous) @ render-status.ts:2
(anonymous) @ web-animations-next-lite.min.js:15
requestAnimationFrame (async)
window.requestAnimationFrame @ web-animations-next-lite.min.js:15
a @ render-status.ts:2
updated @ hui-root.ts:485
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
A @ hui-root.ts:66
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
_updateColumns @ ha-panel-lovelace.ts:179
firstUpdated @ ha-panel-lovelace.ts:143
performUpdate @ updating-element.js:524
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
at @ ha-panel-lovelace.ts:55
(anonymous) @ VM127:1
createElement @ hass-router-page.ts:271
_createPanel @ hass-router-page.ts:291
_currentLoadProm.l.then._currentLoadProm @ hass-router-page.ts:197
Promise.then (async)
update @ hass-router-page.ts:188
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
rebuild @ hass-router-page.ts:259
async function (async)
rebuild @ hass-router-page.ts:256
_updateRoutes @ partial-panel-resolver.ts:115
updated @ partial-panel-resolver.ts:82
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
P @ updating-element.js:98
l @ hass-router-page.ts:49
m @ partial-panel-resolver.ts:65
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
w @ home-assistant-main.ts:36
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
update @ template-instance.js:40
__commitTemplateResult @ parts.js:236
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
_updateHass @ hass-base-mixin.ts:73
(anonymous) @ connection-mixin.ts:137
n @ haws.es.js:1
(anonymous) @ haws.es.js:1
Promise.then (async)
c @ haws.es.js:1
u @ haws.es.js:1
subscribe @ haws.es.js:1
S @ haws.es.js:1
(anonymous) @ core.ts:77
Promise.then (async)
167 @ core.ts:71
o @ bootstrap:63
(anonymous) @ bootstrap:198
(anonymous) @ bootstrap:198
forked-daapd-card.js?v=0.0.2:87 Uncaught (in promise) DOMException: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS.
at HTMLElement._initSocket (https://{{redacted}}.duckdns.org/local/forked-daapd-card.js?v=0.0.2:87:15)
at HTMLElement.shouldUpdate (https://{{redacted}}.duckdns.org/local/forked-daapd-card.js?v=0.0.2:81:26)
at HTMLElement._validate (https://unpkg.com/@polymer/[email protected]/lib/updating-element.js?module:387:14)
at HTMLElement._invalidate (https://unpkg.com/@polymer/[email protected]/lib/updating-element.js?module:371:12)
_initSocket @ forked-daapd-card.js?v=0.0.2:87
shouldUpdate @ forked-daapd-card.js?v=0.0.2:81
_validate @ updating-element.js?module:387
_invalidate @ updating-element.js?module:371
async function (async)
_invalidate @ updating-element.js?module:370
_requestPropertyUpdate @ updating-element.js?module:356
set @ updating-element.js?module:101
ForkedDaapdCard @ forked-daapd-card.js?v=0.0.2:6
(anonymous) @ VM127:1
Be @ create-card-element.ts:71
Re @ create-card-element.ts:98
createCardElement @ hui-view.ts:75
_rebuildCard @ hui-view.ts:344
e.addEventListener.once @ hui-view.ts:83
o @ fire_event.ts:76
(anonymous) @ create-card-element.ts:111
Promise.then (async)
Re @ create-card-element.ts:109
createCardElement @ hui-view.ts:75
(anonymous) @ hui-view.ts:296
_createCards @ hui-view.ts:295
updated @ hui-view.ts:219
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
w @ hui-view.ts:68
(anonymous) @ VM127:1
_selectView @ hui-root.ts:645
(anonymous) @ hui-root.ts:485
setTimeout (async)
(anonymous) @ render-status.ts:2
(anonymous) @ web-animations-next-lite.min.js:15
requestAnimationFrame (async)
window.requestAnimationFrame @ web-animations-next-lite.min.js:15
a @ render-status.ts:2
updated @ hui-root.ts:485
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
A @ hui-root.ts:66
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
_updateColumns @ ha-panel-lovelace.ts:179
firstUpdated @ ha-panel-lovelace.ts:143
performUpdate @ updating-element.js:524
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
at @ ha-panel-lovelace.ts:55
(anonymous) @ VM127:1
createElement @ hass-router-page.ts:271
_createPanel @ hass-router-page.ts:291
_currentLoadProm.l.then._currentLoadProm @ hass-router-page.ts:197
Promise.then (async)
update @ hass-router-page.ts:188
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
rebuild @ hass-router-page.ts:259
async function (async)
rebuild @ hass-router-page.ts:256
_updateRoutes @ partial-panel-resolver.ts:115
updated @ partial-panel-resolver.ts:82
performUpdate @ updating-element.js:526
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
P @ updating-element.js:98
l @ hass-router-page.ts:49
m @ partial-panel-resolver.ts:65
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
initialize @ updating-element.js:268
initialize @ lit-element.js:95
P @ updating-element.js:98
V @ lit-element.js:46
w @ home-assistant-main.ts:36
_clone @ template-instance.js:84
__commitTemplateResult @ parts.js:244
commit @ parts.js:186
update @ template-instance.js:40
__commitTemplateResult @ parts.js:236
commit @ parts.js:186
s @ render.js:44
V.render @ shady-render.js:251
update @ lit-element.js:166
performUpdate @ updating-element.js:508
_enqueueUpdate @ updating-element.js:460
async function (async)
_enqueueUpdate @ updating-element.js:446
_requestUpdate @ updating-element.js:413
set @ updating-element.js:166
_updateHass @ hass-base-mixin.ts:73
(anonymous) @ connection-mixin.ts:137
n @ haws.es.js:1
(anonymous) @ haws.es.js:1
Promise.then (async)
c @ haws.es.js:1
u @ haws.es.js:1
subscribe @ haws.es.js:1
S @ haws.es.js:1
(anonymous) @ core.ts:77
Promise.then (async)
167 @ core.ts:71
o @ bootstrap:63
(anonymous) @ bootstrap:198
(anonymous) @ bootstrap:198
Hello. The reason you're seeing this is because the card communicates with forked-daapd through a nomral websocket connection which isn't allowed when your browser connection to HA is through https. The card should instead open a websocket secure (wss) connection to forked-daapd but this doesn't seem to be supported in forked-daapd (or if it's just not working), so we can't really do much about it.
This has been discussed a bit in the [HA forum thread](https://community.home-assistant.io/t/lovelace-forked-daapd-card/72112.
Ideally the forked-daapd communication should be handled through a component instead of in the card directly, that would solve these issues. Frenck was working on a component but idk how progress is, see https://github.com/hassio-addons/repository/issues/98.
So basically if you want to use the card, you would have to connect to HA through http, which you might be ok with when you access HA on your LAN.
Thank you for the clarification. Do you think that proxy the web socket via ngix can work?
I've never really played around with websockets that way so I honestly don't know, sorry.
Another solution could be to add the output selection to the mpd/media-player integration. Then the whole output selection thing could be handled with a generic media-player card.
If I understand the mentioned hassio-addon issue right the plan is to add forked-daapd as a hassio-addon.
Found https://github.com/home-assistant/core/pull/31953 right now. Sounds interesting...
@jptrsn @claudiosala80 @escoand I would recommend you try the another card from @kalkih: https://github.com/kalkih/mini-media-player
I have confirmed this card works great with forked-daapd and the new forked-daapd integration. I've noticed two issues so far:
- ~~I can't get album art to display although it displays in forked-daapd~~ Artwork works fine.
- The progress bar seems to be all over the place.
Here's what it looks like with https. Also, i misspoke, artwork works fine.
