kalkih / forked-daapd-card

forked daapd card for Home Assistant Lovelace UI
MIT License
79 stars 12 forks source link

Outputs not showing #3

Open jptrsn opened 4 years ago

jptrsn commented 4 years ago

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.

jptrsn commented 4 years ago

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/lit-element@0.6.2/lib/updating-element.js?module:387:14)
    at HTMLElement._invalidate (https://unpkg.com/@polymer/lit-element@0.6.2/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
claudiosala80 commented 4 years ago

Same problem too

kalkih commented 4 years ago

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.

claudiosala80 commented 4 years ago

Thank you for the clarification. Do you think that proxy the web socket via ngix can work?

kalkih commented 4 years ago

I've never really played around with websockets that way so I honestly don't know, sorry.

escoand commented 4 years ago

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.

escoand commented 4 years ago

Found https://github.com/home-assistant/core/pull/31953 right now. Sounds interesting...

uchagani commented 3 years ago

@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:

  1. I can't get album art to display although it displays in forked-daapd Artwork works fine.
  2. The progress bar seems to be all over the place.
uchagani commented 3 years ago

Here's what it looks like with https. Also, i misspoke, artwork works fine.

image