#frontend-archived
1 messages · Page 60 of 1
hi all
how to create a picture-elements with state_image on/off?
@woven blaze What is your use case? Picture Elements card is meant to be a large group of things, not just to control one entity.
@empty heath i would like to have picture-glance style (with image change by light state) per room. while having the ability to add labels such as room temperature.
@woven blaze So why not use an element to overlay the entire card?
@empty heath i tried.. but it seems that the picture-elements image card is being on top of the image elements if that makes any sense...
ohh i figured it out
i forgot the style settings for the image
Hi, I have a card with all my indoor temperature sensors. The mqtt senors work fine, but I just noticed that for my climate entity (Netatmo Thermostat) it displays the state (currently: idle) and '°C' but neither the set nor the current temperature. Is there a way to set a specific attribute to display? https://imgur.com/a/Gz3m4qA
i have a hisrory graph - in the old UI, clicking on it opens it up but in lovelace it doesn't do anything?
Morning
This is also the case for zwave climate entities (in my case Danfoss thermostats/valves). https://imgur.com/a/k38b14O https://imgur.com/a/FE9iyKR
Template to display attributes
https://github.com/ciotlosm/custom-lovelace/tree/master/entity-attributes-card <-- is awesome for displaying attributes
@buoyant skiff Of course templates would work, but creating a template for every value I'd want to display in the UI seems unnecessary to me. I was thinking about something like seconday_info. e.g. ```yaml
- entity: climate.wohnzimmer
name: Wohnzimmer
attribute: current_temperature```
Haven't looked at secondary info
hehe, same here
@placid geyser For secondary-info it is only entity-id and last-changed that are valid acording to the docs
@wheat current Right, I know. I was just comparing to it. So, to have another attribute like secondary_info to explicitly set an attribute.
That could be quite useful, maybe open a issue at https://github.com/home-assistant/ui-schema/issues?
state-icon element for group appears blue no matter what the state is.
anyway to fix?
@wheat current Yeah, will do. I just wanted to check whether that is already on someones plate and what other think about it. Or if I just missed an easy way.
Hey, when using LitElement, will _render be called everytime a state chage in hass object or do I have to make sure the render get called some how when state updates?
Like in the set hass property
I have the config and hass object in get properties property getter
Like the example
you need to make the extra checking yourself
or move the render in setConfig and do updates only in set(hass)
Ahhh thanks mate!
I ended up making a property "state" that I set if state was different that the current known state... It worked like a charm 😃 Thanks @north spear
no problem
usual approach:
if (entity && entity.state != this._state) {
this._state = entity.state;
this._updateCardContent(entity);
}
this makes sure you don't update dom if state hasn't changed
Yea I check to see if not updated but since I am using the LitElement and it renders in the _render method how can I use _updateCardContent directly?
Like force the update?
I saw there was a _requestRender method
Morning all. I'm sure this is just another thing I've missed in the docs but is there a way to change an icon for a group? My use case is a group of lights and it would be nice to have the single light functionality where the status icon matches the current state. This works ok on a single light but the group reverts to the group icon. I've tried adding an icon statement to the Lovelace configuration as well as to the customize.yaml but both seem to be ignored.
@vapid field https://www.home-assistant.io/components/light.group/ this should give you what you are after
Thanks @wheat current , I knew it would be there somewhere, it's just knowing what to search for. 😁
It's a well hidden gem 😃
@rocky merlin _updateCardContent was a custom example in my code, not an available method. Not sure what LitElement exposes as I haven't used it yet
cool
@wheat current @buoyant skiff https://github.com/home-assistant/ui-schema/issues/126 😉
thinking if i should add more stats to this card
hm, maybe I should have checked the other issues first. This one is probably the even more versatile solution.
Don't think so, it looks like that only applies to a "when did this last changes"
@wheat current value_template: could be anything, not just last_changed, no? ```yaml
- entity: binary_sensor.kitchen_motion
name: Top Floor
# Instead of just clear/detected, show last activation time:
value_template: {{ states.binary_sensor.kitchen_motion.last_changed | timeago }}```
templates will never be a part of lovelace
Well, balloob reopened that issue, so, it might not be about templates but the idea behind it is very similar though.
agreed, but defining an attribute to use for entites make sense
@wheat current balloob seems to disagree.
aiit 👌
aiit?
alright*
oh... hehe, ok
updated to 0.74.0 and sensor.custom_card_tracker disappeared...
maybe there is an update?
There is
found it... so i must restart hass to get again the sensor?
Correct
is ther also an update for custom_cards.py?
Probably
lol
where to find it?
found.. !
ok i updated custom_cards.py, custom_components.py and tracker-card.js but still don't gt anymore that sensor
yes, i have them
Look for errors in you log
I regularly get the red error card showing followed by the correctly rendered cards. The error cards "flash" by, they are on the screen for 1/10 second before being replace by a correctly rendered card. Happens on refresh (Shift+Cmd+R).
How can I start to debug / provide more info / provide PR?
I think that is because of how custom elements are loaded
Where is the code where cards are loaded?
I'm poking around in the lovelace/common directory.
I have the same problem @hardy zealot
hi
one quesiton
whenever I use lovelace a message from HA pops up at the bottom, saying “Service system_log/write called
Yes. That happens.
@hardy zealot only with lovelace ?
@buoyant skiff in all browsers and no erros on config
@buoyant skiff when you use lovelace you dont see that message ?
i only use lovelace
@forest star that message usually appears when you have a config problem. I'd suggest to comment out half of your (lovelace) config and try again.
@forest star I had that a few time but didnt see that recently
@forest star also, did you check the logs? What is written to the logs after that message pops up?
It usually gives a clue of what is broken.
frontend_latest/c5a5df3ec278008029fa.chunk.js:206:11497 TypeError: null is not an object (evaluating 'this.shadowRoot.querySelector("paper-slider").offsetWidth')
kind of this one:
do you use any sliders ?
no sliders
use customui ?
Oh maybe yes for radio
yeah sliders isnt supported yet under lovelace
so anything customui related is broken
Oh thats why
I wish you could add a picture to a picture-glance as a place holder in case the picture is not available from the sensor
thats not what I mean - but nice - I mean you get a picture from a camera.x but the picture for some reason doesnt come through - have that with Ring quite a few times ... so instead of showing nothing I would like a placeholer picture
on the flipside - would actually be better for the component to work
but u can try and add something like this
image: /api/camera_proxy/camera.jeaves_cleaning_map?token=*
if you look under dev info
and sort on cameras you will find entity pictures from cameras
and they look like that
but with a random generated token
that should work for you @hot gyro
just reading up on camera proxy could indeed work
worked for me
it does update the image with the wildcard at the ends doesnt use older cached file
do you know how to change the color of the background page to that gray that the original dashboard has ?
hm, entity filter cards use space even when they are hidden if they are empty, is that expected behaviour? https://imgur.com/a/Ys0f5nW
@buoyant skiff nice try but doesnt seem to work with either of the cameras I have
worked for me can try setting up a picture glance for shit and giggels
post me a snipplet of what your trying to do
the proxies dont work thats what I mean
and ill see what i can do with it
I am building a custom component in lovelace using LitElement. So sick, using the lit-html to render the html output, use the same variable in the <style> section and in <div> and different results. In the <style> it returns another instance value but in the div tag it is correct... How the h...l is that possible???
- platform: yi
name: Yi Nursery
host: !secret yi_nursery
usert: root
password: !secret yi_password
ffmpeg_arguments: '-vf scale=800:450'
- platform: proxy
entity_id: camera.yi_nursery
max_stream_width: 360
max_image_width: 480
image_refresh_rate: 30.0```
this doesnt even populate the proxy
I didnt know you can add a refresh rate to yi
for the glance card to work the core functionality of proxy needs to work - and it doesnt
saying it doesnt work isnt gonna make it work 😉
@wheat current check out this crazy combo
left: 0%
text-align: center
top: 0%
transform: none
font-size: 140%
font-family: Verdana
text-shadow: 2px 2px black
font-weight: 550%
text-transform: uppercase
pointer-events: none
width: 100%
well if the proxy doesnt get a picture and I cant access it via the api either - I guess that is telling enough
then you have to set up you sensor so it works
that uses 100% of the card width
and centers the item
updated nas card 😄
trying to set a wallpaper for my main view with background: center url("/local/background.jpg") fixed but it's not working. What am I missing?
You're nonstop working on Lovelace @buoyant skiff I'm very impressed! 😎
no, just a background behind my main view with picture-glance cards. I was trying to follow https://www.home-assistant.io/lovelace/views/ but I'm missing something.
try without the center stuff and just /local/background.jpg
background: /local/background.jpg
does that work ?
nope
sort of got it, gotta work on sizing url("/local/background.jpg")
background: url("/local/background.jpg")
maybe the fixed at the end was throwing it off
background: center / cover no-repeat url("/local/banners/wooden_panel.jpg") fixed
works
I'll try that
wood paneling...you guys are getting classy, lol
In my main view and I tap a picture glance card, when it navigates to another view, is there a way to put a card in that view that goes back to the "main" view? A back button of sorts?
to the main, sure, but to get a true "back" button you would need to get a little more clever
gradient background
background: content-box radial-gradient(black, DarkSlateGrey)
neat
background: background1, background 2, ..., backgroundN
multiple backgrounds
do they cycle?
oooo
Ohh shit didnt know that ! @buoyant skiff ....
really havent seen much of other peoples cards 😛
I need to play around with Lovelace.. haven't touched it yet!
I need to create some more. I got side tracked by doing a floorplan and cleaning up my configurations in general
@verbal grove https://github.com/dale3h/python-lovelace
It's very nice!
@empty heath .. Except for installing it on Hassio! 😛
@verbal grove What do you mean?
Yeah, Hass.io is by far the easiest to run it on. Lmao
- Download Community SSH & Web Terminal add-on.
- Login to the shell (either through SSH or the web terminal).
- Run these commands:
$ cd /share
$ wget https://raw.githubusercontent.com/dale3h/python-lovelace/master/lovelace_migrate.py
$ pip3 install "requests>=2.14.2" "pyyaml>=3.11,<4"
$ python3 lovelace_migrate.py -o /config/ui-lovelace.yaml
```4. Profit!
made that a sticky
Ok, I feel like I'm a rookie again..
^^
I usually use Putty.. but downloaded terminal.. I get this error when running: Try:
Checking the connection
Checking the proxy and the firewall
ERR_CONNECTION_REFUSED
@verbal grove did you use the one called "SSH & Web Terminal"
@empty heath do you think this works with a regular hass installation ?
@forest star if your wondering about his python script then yes
@mortal cape I clearly didn't, attempting to add the url into my repository so I can download "SSH & Web Terminal", but it's not getting added.
It is.. but SSH & Web Terminal isn't listed.. only "Terminal"
among others..
ugh..
im an IDIOT!!!
give me a minute >.>
I'm not going to say what I did wrong.. 🙄
yeah you can come into #330990055533576204 and figure it out.
this is valuable @buoyant skiff space we are consuming 😛
Haha, ok. Jumping to Hassio
@empty heath Could not connect to API URL: http://localhost:8123/api
@forest star Did you read the docs? 😜
You have to type your Home Assistant API URL at the end of the command.
And if you use a password, add -p before the URL.
Oh
reading docs is for suckers!
its better then 451 😛
no for real https://github.com/dale3h/python-lovelace/tree/refactor 404
wrong link 😛
You are trying a branch that no longer exist...
https://github.com/dale3h/python-lovelace
I merged everything to master branch last night 😊
Could not create backup: /home/homeassistant/.homeassistant/ui-lovelace.yaml: Permission denied
You no has access!
That does not look like hassio 🤔
Maybe that dir is root?
no
thats Homeassistant
hassbian ?
😦 I though he converted 😄
jajajajaajajajajaja
real men does linux 😛
no way conversion is for girls
@forest star run it as the homeassistant user
running as pi right now
"Traceback (most recent call last):
File "lovelace_migrate.py", line 15, in <module>
import yaml
ImportError: No module named 'yaml'"
You gotta make sure you install the pip3 packages for that user.
If you activate your venv, it should already have the necessary modules 😉
@empty heath do I need to run from inside the venv ?
I run hassio on my ubuntu server. Love me some add-ons
@mild veldt I'm rocking it the same way 😱
I've got 4 hassio installs going including one on a linux server. I want some emojiis!
@buoyant skiff stay on topic. This is about lovelace 😂
2 are using lovelace...now I am on topic
dont make me fetch Tinkerer
who is @split granite
Tinkerer is away for 18h 22m 8s with a message :point_right: To sleep! To work! Hopefully not to the far ends of the universe, again 😉
/em watches as #frontend-archived slowly devolves into chaos
neineineineineineinei
@empty heath !!!!!!!!!
on topic
File "lovelace_migrate.py", line 15, in <module>
import yaml
ImportError: No module named 'yaml'```
pip3 install pyaml
on venv ?
1: change to homeassistant user
2: ativate venv
3: run it
OH ok
with full installation rules come full responsibility
@buoyant skiff you going to submit some picture-elements examples to the lovelace gallery ballob put up? Need to open as many eyes as possible to things outside floorplans
probly gonna do my own repo
but who knows if i get some time over then ill might submit something 😄
depends on how bored i got during my vacay
Oh wow @empty heath worked pretty good not excelent buy pretty god save me probably an hour of re doing this shit
@forest star dale is offline
@buoyant skiff here's hoping to you having a boring vacay! 🍻
haha u pinged the wrong user 😛
@buoyant skiff he will read don't worry its no like us that never read old post
Noooooooo
Now getting problems with lovelace frontend... since 10 minutes it tries to load but it stops at "loading data" and nothing more... while old frontend is working as always....
bad config then
also if doesn't says nothing in the log?
check browser's dev console
how?
hmmm... maybe custom_ui?
if yes, how to load lovelace with custom_ui disabled?
begin with a empty lovelave ui file
and add a little bit at the time
until u find the error
with previous release none of all these new problems
...
directly from chrome dev console
you might be using something that has been removed. best to follow @buoyant skiff 's advice
Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode
at Object.<anonymous> (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
at Generator.next (<anonymous>)
at n (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
at self.babelHelpers.asyncToGenerator (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
at new Promise (<anonymous>)
at Object.self.babelHelpers.asyncToGenerator (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
at Object.workbox.core.j.fetch (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
at frontend_latest/workbox-v3.3.0/workbox-strategies.prod.js:1
at Generator.next (<anonymous>)
at n (frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
direct from dev consolo of chrome
**For users of the tracker-card by @north spear **
https://github.com/ciotlosm/custom-lovelace/tree/master/tracker-card
I have now created a new backend component for it, that will replace the old ones.
Now it's just a single file for both component and card tracking, earlier this was up to 4 files.
https://github.com/custom-components/custom_updater 🎉
Hi Guys, could you please help me out to figure out how to get the installed version of Lovalace?!
I have latest version of Hass v0.74 and was trying to update Lovelace config with dividers, but it doesn't work
Oh, got it! Thank you very much. I was mislead by change log on lovelace page
Sorry for my noob javascript question. Is it possible to not have to use unpkg and use import {LitElement, html} from '@polymer/lit-element' cause unpkg keeps lock me out , prolly thinks its a DOS attack or smth haha
still getting problems with lovelace frontend... since 0.74.0 cannot anymore load the lovelace frontend... i did not changed anything inside the config files
@icy kettle which part of the changelog?
❤️ Lovelace card gallery
🔧 Async communication improvements``` There is the link to Lovelace Gallery with a bunch of examples
Ah right. The gallery is for devs mostly and it’s on different release cycle. Better use official docs to see if a card is released
Thanks for make it clear! Now I'm going to wait till Official release 😃
By the way, that is awesome! Thank you! Can't wait to use it
The main thing is that the gallery can currently include changes that are not in lovelace releases yet, but is still a great place to check. Those dividers look nice
I luv the secondary info line
works even with monster card
btw @fathom tree you can always ask more info around cards
I watched your live stream (offline) and it seemed you missed some info on why monster vs other
@raven nacelle your state-icon setup - can it be used with mdi-icons as well or only the supplied one from hass ?
@hot gyro I think state-icon uses built-in icons
there is no icon configuration option there
@hot gyro you can define an icon in you customize: section that will then hit state-icon. Only thing I've ran into so far that I've needed to use a regular icon element is for my cameras where I don't want the preview
was wondering why is always pop up message of:
service system_log/write called
when in frontend lovelace´
is that normal?
@split granite what would this mean:
2018-07-23 19:17:48 ERROR (MainThread) [frontend.js.latest.201807200] https://myurl.duckdns.org:8123/frontend_latest/app-6e4d53ede29a5676d41a2bb0807ecd12c.js:445:3536 Uncaught TypeError: Cannot read property '_stateDisplay' of null
@vapid field you use any old custom_ui stuff?
I get that because I'm still using the custom_ui mini_media_player card
its possible so many changes that is hard to follow up hehe
i have many of those errors
hard to know now where they come from 😃
probly copy pasting
is there another way? 😉
that is very likely @buoyant skiff
@split granite please pin a message about system call/write that the users should check their config
today has been an repeatition day
system write = bad config
I don't think it's 100% config, however. Like I mentioned, old custom_ui stuff can cause it as well
yeah sliders
ya the problem is how to fix it if not knowing how to troubleshoot 😃
What's all this talk about "system write" and "bad config?"
most users that popped into today has had bad configs
only sliders i have is from iframe from grafana for some reason it will make appear sliders bars
trying to use customui
Ahh, interesting.
and or missing stuff in ui-lovelace.yaml
@vapid field strip your ui-lovelace.yaml down to the bare minimum and see if you still get that
We need to patch the frontend to be more specific about why the error is happening, then.
If you are experiencing service system_log/write called popping up please check your ui-lovelace.yaml most likely that the error is in that file and please don't use sliders from customui since it breaks lovelace
perfect pin message
I love that people ignore this warning in the logs:
**```
WARNING (MainThread) [homeassistant.loader] You are using a custom component for media_player.alexa which has not been tested by Home Assistant. This component might cause stability problems, be sure to disable it if you do experience issues with Home Assistant.
hehe
nice pinned tnx Dale
At least use proper grammar @buoyant skiff 😛
@mild veldt at minimum still see that error but no more pop ups
I read that as "If my experiencing system ..." 😛
@vapid field any warnings in your logs as @empty heath pointed towards?
spellchecked and edited 😃
You're* hehe
that also means that you have some issues in your ui-lovelace.yaml that was causing the initial popups
have some of those for my camera
well to be fair i asked for it 😛
@buoyant skiff I am genuinely saying this part to help you better understand English, not to be facetious. Your = possessive, the indirect form of "my." You're = You are, the indirect form of "I am"
@empty heath https://www.youtube.com/watch?v=B7UmUX68KtE
@empty heath how do you change the lovelace background to gray like the original
There = "Put the food over there on the kitchen counter."
They're (They are) = "They're putting the food on the kitchen counter."
Their = "When they come in, ask them to put their food on the kitchen counter."
"They're putting their food over there on the kitchen counter."
@empty heath i love that none of us matters in here to @forest star 😛
@forest star No idea -- I am not the Lovelace expert here. Our resident Lovelace expert is @buoyant skiff
your his personal support 😛
on the note of sliders, anyone know if that is something that is planned to be supported or should we be working on something to put in one of the custom repos like the text-element?
😂 Apparently. He's not the only one that thinks that. Hahaha
I asked the question before he did not answer shit
and that is a must
Hahahaha
answered my question: https://github.com/home-assistant/ui-schema/issues/118
thought @empty heath was the lovelace man with the migration script and others
but seriously this white background is giving me a fucking headache
so change it ?
So change the theme 😉
its easy
It's about zero percent hard
background: content-box radial-gradient(black, DarkSlateGrey)
thats a radial background
- title: Jeaves
icon: mdi:robot-vacuum-variant
background: content-box radial-gradient(black, DarkSlateGrey)
thats what I am talking about
thanks @mild veldt @raven nacelle - I am pointing at a group and I rather have a lightbulb icon ...
background: black
@forest star So I think you can do just background: gray lol
for a total pitch black background
Damn, @buoyant skiff beat me to it.
You need to put all the colours to black, so you can emulate the use of peril sensitive sunglasses 😛
@buoyant skiff what is the original color of HASS
background: center / cover no-repeat url("/local/banners/wooden_panel.jpg") fixed
Whatever your web browser uses @forest star
Oooooo, pretty.
@vapid field posted a message that is more than 15 lines. It is now available at: https://hastebin.com/omubejitow
@vapid field No need to re-post it, the bot re-posted for you!
yeah still reminding him/her/it to use pastebin
@buoyant skiff Definitely. Thank you.
You'd already posted that 😉
@forest star did that help you ?
No need to re-post - as you were told by @empty heath 😉
@vapid field Please refer to my previous message.
@buoyant skiff yes but cant find the ORIGINAL background color of HASS
@forest star If you provide a screenshot we can get the color code from it 😉
@vapid field Have you checked the log?
lol i have no idea what that is
but here is a good list of colors in name values
There is no original background colour for HASS
@split granite I think he is still referring to the error posted earlier:
2018-07-23 19:17:48 ERROR (MainThread) [frontend.js.latest.201807200] https://myurl.duckdns.org:8123/frontend_latest/app-6e4d53ede29a5676d41a2bb0807ecd12c.js:445:3536 Uncaught TypeError: Cannot read property '_stateDisplay' of null
@split granite what is the one that comes by defect
None
🤷
@vapid field Why would you post that again after being asked not to three times?
Resistant to clue
@forest star In chrome hit F11 and you can inspect the page structure
lol sorry @empty heath i posted and then disapear so got confused
new on this noob move
Your second post disappeared because I deleted it after you were told not to re-post it
@vapid field Hence why I reminded you, and then @split granite reminded you, and then I reminded you again.
ok sorry my bad
What we do need @crimson wave is to know the errors in the log that relate to that
@forest star Are you using Chrome?
Safari
Ahh, ok.
the turd of browsers 😄
why
I was going to send you a Chrome extension for checking color. 😃
background: rgb(229, 229, 229)
R229 G229 B229 @buoyant skiff was right
Boom! Toast is 18-0 now.
@buoyant skiff Don't you absolutely love the feature of not having to restart Home Assistant to change the UI now? 😂
I prefer teh derk colorz.
yeah this #frontend-archived is the Bomb
how can you upload pictures @empty heath
Only some people have the ability to upload pictures to the channel
@forest star You have to earn the privilege.
To stop people flooding the channels, again
Actually, no, anyone can do it here in Lovelace!
come on !!! pal you are talking iwth me ....
I was asked to pull it by default
no I tried , not possible
It was apparently getting out of hand
@split granite Ahh, fair enough.
ok guys its time to move up me on the board then
@forest star I am not joking about having to earn it. Toast was the first one to earn it in this channel because of all of the neat and amazing cards he creates with Lovelace. But, once you earn it, you are allowed to post images in any channel.
And, if like others have done, you abuse it, it goes away... 🤷
Tinkerer is harsh but fair
Really harsh
yes just like old old russia 😛
Not harsh enough according to @empty heath 😛
Having a hard time displaying a local image. Uploaded it to the www folder but nothing shows. Have /local/living.JPG as for a url.
Did www/ already exist?
Yes
Ok, that rules out the usual problem of needing to restart HA after you create the directory
@steep seal Also, use the proper case.
please use hastebin
it got out of hand? that didn't last long
see if there is anything thats wrong
@crimson wave Where did you get the custom card from? Has it been tested elsewhere? Is it based on a custom component?
Ahhh, it doesn't support multiple entities?
doubt it
Yep, it doesn't. Solved. Thanks guys!
np
@steep seal I had the same issue the other day. Tinkerer's question was what fixed mine.
But since yours already existed, doesn't seem to be the same problem in your case.
according to css there is a possibiltity though
@buoyant skiff When asking someone to post their config, you can do it like this (look in #botspam)
background: background1, background 2, ..., backgroundN
so there is hope for multiple backgrounds
this is some awesome news 😛
🤤
doing hover effects rotating icons etc
I'd love to be able to style everything separately, just like in a real web page. lol
anything will be possible
Oooooo
geez
@polar kelp New idea for the gen: load all JS/CSS/etc files as resources (and copy them to www/lovelace/ 😃 )
Is it possible to hide the master control in a card in lovelace? I know its possible with control: hidden when using the old UI.
~rtfm @buoyant skiff !!!!!!
@buoyant skiff RTFM is a well known phrase, used when someone hasn't taken time to read the documentation. Please take time to Read The $%#@ Manual - author unknown.
Lol! I thought since lovelace is so new, the only documentation that existed was this page https://www.home-assistant.io/lovelace. Never bothered looking at the sidebar
and blinking
Thanks @empty heath
It's quite easy to miss the sidebar menu if you look at it on mobile, since it's positioning itself underneath it all
hehe
@subtle rune if you dont want an item to be clickable use pointer-events: none
quite useful when doing ui
and using mobile
nothing more annoying then being tossed around in the ui
Oh thanks! Would be quite useful.
@buoyant skiff I think it's time you finally start a "Lovelace Tips & Tricks" repo, or at least a gist.
Actuuuuallly...maybe I can put it on the website! 😃
👍
want me to pr changes ?
I'll get the first page up. Then you can add to it from there.
Hey guys is it possible to stretch an input number slider to be the full width of a card and remove its icon and name?
kewl 😄
~questions @buoyant skiff Btw, have a look at the newest HassBot snippet ~questions 😃
@buoyant skiff Before You Ask
How To Ask Questions The Smart Way: http://www.catb.org/esr/faqs/smart-questions.html
Before asking a technical question in our channels, please do the following:
- Try to find an answer by searching the archives of the forum: https://community.home-assistant.io/
- Try to find an answer by searching the Web: https://www.google.com/
- Try to find an answer by reading the manual: https://www.home-assistant.io/docs/
- Try to find an answer by reading a FAQ: https://www.home-assistant.io/faq/
- Try to find an answer by inspection or experimentation.
- Try to find an answer by asking a skilled friend.
- If you're a programmer, try to find an answer by reading the source code: https://github.com/home-assistant/home-assistant
When you ask your question, display the fact that you have done these things first; this will help establish that you're not being a lazy sponge and wasting people's time. Better yet, display what you have learned from doing these things. We like answering questions for people who have demonstrated they can learn from the answers.
Can wildcards be used to include all entities of a specific pattern in an entity card?
lol we should add "search discord" to the list 😛
Discord search is lousy, unfortunately 😦
i use it often though lol
really dale ? i dont think so
@leaden vapor Not natively, but with a custom card, yes.
Ummm...hmmm....
can search on a specific user and keyword
found many useful things when searching here
@leaden vapor look up the monster card, might be what you want
~monster-card
Monster card is a magical type of card. Because it's dynamic if you're smart about it, you can have one card that adapts and that you don't need to touch when adding new entities & sensors to your setup. Supports both inclusion and exclusion filters with wildcard for entity_id: https://github.com/ciotlosm/custom-lovelace/tree/master/monster-card
There we go.
@leaden vapor Sorry, I would have sent the link sooner, but I wanted to get that snippet added to the bot.
That card is a monstrosity. 😮
havent messed around with it that much but im thinking of doing something cool with it
Looks like what I'm looking for.
Hopefully Lovelace will have an official "release version" before we finish writing the book for Home Assistant. 😃
Can I force the display size of a picture-element card? I have a map of the building I'm in and would like it to take up the entire view...is that also going to be a custom card?
You can make it a panel
Ahhh...
@empty heath are you underestimating @buoyant skiff ??
Damn, beat me to it @split granite! I even had it on my clipboard already, haha.
everyone underestimates me 😛
thats a perfect thing
that way i dont have to perform
@forest star I am not even sure what urged you to ask that question. Lol
So that means a stack could be panelized to take up the entire view.
@leaden vapor Yup. 😃 I have an example somewhere...1 sec.
Using panel: true with nested vertical-stack and horizontal-stack cards to create a "header": https://hastebin.com/omovafarit.css
@empty heath that looks sooo nice
Ooooooh, you can panel a single card that way...
That solves a "problem" I have with map cards, thanks @empty heath
kinda like the greeter card i did
@split granite The easiest way to think of panel: true is this: it uses the first card as the view.
And that first card can be a vertical-stack card 😃
I'd never thought of using a stack as a "first card" 🤦
Hehe
It's obvious now, but damn I feel daft 😛
Just know that it only shows the first view-level card. Any other view-level cards in the view are not shown.
my ui blew up when i did that 😛
@buoyant skiff Think you could use some CSS to make that header shorter (in height), and static position? 😃
(and make it 10 entities on a single line rather than 5 entities on 2 lines)
nice 😃
gonna try later on
atleast i know that there is an option for it
.away sleep and work 4 more days to go
Toast is away! sleep and work 4 more days to go :wave:
@empty heath I seem to have my config screwy. I can get a vertical stack with a horizontal stack to work, but when I add panel: true, the top element of the vertical stack takes over and the horizontal stack below the top item disappears.
@empty heath https://hastebin.com/uhoputepob.bash
@leaden vapor Look at you, already providing it without me having to ask! 👍
@leaden vapor So is "Network Devices" the view?
Yes.
@empty heath If I add panel: true below title: the picture-element takes over the whole screen.
Ok, refer to my previous statements regarding panel: true ;)
https://discordapp.com/channels/330944238910963714/460846676358332417/471044336205824020
https://discordapp.com/channels/330944238910963714/460846676358332417/471044584844296195
Have a closer look at my example config. I only have one card directly under the view. The rest are inside of the vertical-stack 😉
@empty heath Should I wrap both the vertical stack and horizontal stack inside of another vertical stack?
With panel: true you can only have ONE card directly the cards: section of the view. Other cards will not be shown.
Yes.
That's exactly what I did, lol.
@empty heath Oh...there's your config...sorry...I'll look through it.
That's how you have to do it, otherwise it does not work.
@empty heath When did discord add links?!?!?! 😮
The vertical-stack now becomes the view.
@wheat current Lol, I just discovered it today, but apparently if we had been reading the changelogs we would have seen it a while ago 😛
Ha "Reading the changelog" 😂
Interestingly enough, I don't see the changelog pop up any more when I update Discord
yea it used to pop up
WHEEEEEEEE!
Uh...no. That will make everyone's brain explode.
@empty heath I've got enough on my plate designing the lighting layout.
That is a @buoyant skiff question. 🤷
Toast is away for 15m 18s with a message :point_right: sleep and work 4 more days to go
wait, do you get to play with HA for work, @leaden vapor ?
@mild veldt, I'm a realtor, and I'm designing our church's lighting system, as well as implementing HA at the church to solve all sorts of silly inefficiencies. I just connected all of the thermostats to the system so people aren't walking a mile every morning to set the temps... etc.,
then I'm with @empty heath , this needs to be in 3d 😉
Like a cross section?
@leaden vapor https://www.youtube.com/watch?v=HBXIOj5ndo4
@leaden vapor @empty heath does not looks like you can add style to views
@wheat current I am fairly certain that a PR for that is welcomed! 😃 lol
Does anyone have any feedback on how we should lay out the "sections" for the Lovelace Tips and Tricks page?
😂 That's classic.
Oh, I meant to attach an image to that feedback request! Haha, my bad.
hi , there is a problem with the latest version of card tracker
/tracker-card.js?v=0.1.2:101:58 Uncaught TypeError: Cannot read property 'replace' of undefined
how can i go back to previous version?
just , copy and paste the js , file?
@calm rock Make sure you use the latest version.
custom_updater v1.2.0 https://github.com/custom-components/custom_updater
tracker-card v0.3.0 https://github.com/custom-cards/tracker-card
will check again, tks
@wheat current , that made it , tks
Ludeeus is away for 17m 19s with a message :point_right: ```
When Life Gives You Questions, Google has Answers
<https://www.google.com/>
anyone use custom-weather-animated.html with unit_system: metric ? my card showing temperature in fahrenheits
how to make the badges to show the state in lovelace?
is it possible to declare title on "type: entity-filter"?
@sinful haven yes, check the docs https://www.home-assistant.io/lovelace/entity-filter/
@mild veldt thanks, I guess it was late as I tried it without the 'card'...
@calm rock in what card? A glance card or on a view itself?
i have a couple of issues with Lovelace.... wondering if they are 'issues' or by design behaviour before I log an issue
- in customize.yaml if something is set as hidden, that is ignored if the entity is included on a card in lovelace yaml. It used to be ignored in groups yaml
- history graph in old ui if I click on it it opens up but in lovelace it does nothing?
Have you reviewed the logged issues?
um... is there a specific place for lovelace?
thanks... ill look there
Not sure how #1 would be an “issue”. You explicitly describe what is to be on your Lovelace ui
i don't see those there.. but i'm not sure if they are issues or expected behaviour
Maybe if using a filter respecting hidden would make sense, I guess
if you are explicitly calling it thats different though right?
that's true but I did that in groups as well and it was ignored. I only discovered it because I used Dale3h's script to import groups to lovelace and there it was
Sounds like you just need to do some cleanup
i would never have noticed the error otherwise
I wouldn’t consider that an issie
it sounds like what Lovelace was intended for
The port script is a tool to help but will likely not get you 100% to what you meed
well yeah... well what's the point of having a hidden flag in customize?
to separate the backend and front end
because groups have a different purpose other than the UI
Things they are a changing as @frosty pelican just said
Groups were never meant to define the UI but where there is a will...
@frosty pelican i kinda like keeping my FE and BE kinda close ... Kinda born that way 🤣
so why have hidden in customize at all then? will that serve some other purpose?
i think hidden was created for groups and the UI to begin with
so it may do away with at some point
Lovelace has not replaced the current ui...yet
I thought it was an overide.... hence my surprise when lovelace didn't get overidden
yea I think I saw some discussion about allowing icons to be defined in Lovelace so we don't need to define in customize as well
so probably will be replaced little by little?
Can you explain the use case where hidden would be needed though?
hidden is deprecated, customize is not the future
There it is. The official word 😃
ok so it's not a bug but is expected behaviour?
doesn't bother me but if it's a bug i'll file an issue
C727 is pretty much Lovelace, so their word is law
it sounds like things need to be explicit with Lovelace...so if you list the entity then it will show....even with the monster card if you use a wildcard you still need to exclude the items you do not want
so I use custimize for icons and friendly names as well... are they moving to lovelace too?
i think friendly name got replaced with name
it's not my word. it was also mentioned before that it was a failure to allow static stuff in entity-state. the customize stuff for emulted_hue and so on was also removed in the past
@timid burrow I am still using customize to display icons for now
glance and entities support icon: in next release
^^ woohoo!!
what about friendly_name or name?
you can already do name today in Lovelace
glance has the same feature
so in the next release will icon be deprecated from customize.yaml for Lovelace?
ahhhhhhhhhhhhh I hadn't seen that
at the moment lovelace is using friendly names from customize
yea and you can override it using name
gotcha. so when the old ui is depreciated you will have to do that in lovelace..
I had to do that because glance card only shows like 10 characters and it doesnt play nice when you hve a bunch of items named "Living Room ..."
i might as well do that now or maybe next release so I can do icons as well
i'm only using entities and media control
so my lovelace looks identical (pretty much) to standard ui
I like to keep my cameras on a single page so its nice to get that grid view on those views now
I would really recommend starting from scratch. There just so much more you can do and customize now
i just don't see the point TBH
what about the history graph - if I click on it nothing happens. in the old ui it used to blow it up on the screen
Why does a lot of text in the back end use primary color, instead of primary text color or something else. I have the primary color set to Black for the header, but it turns a lot of back end text Black as well.
@timid burrow blows up when I click on the title for me
hmm. not for me.
- type: history-graph
title: Speedtest Graph
hours_to_show: 24
refresh_interval: 1800
entities:
- sensor.speedtest_download
- sensor.speedtest_download_filtered
- sensor.speedtest_upload
- sensor.speedtest_upload_filtered
oh I picked any old graph...my mistake
hmm... ok... do i need to log an issue for that then?
how do I make this do a vertical stack? I just can't get it right
https://codeshare.io/5My9zW
the whole thing?
yeah.. I just need to know the syntax then I can fix other stuff
ok... lemme try that..
looks good....
@mild veldt on the view itself
If the state is not shown , then the badge will not send any relevant information
@drowsy summit yeah looks much better. Finally a reason to prefer lovelace
i do love not having to restart all the time
@timid burrow I had actually made a comment on the config down near your iOS devices... heh >:)
i'm not seeing that
I deleted it lol
hahahahaha!!!!
i didn't copy and paste it back so I never noticed
i just wanted the syntax
looks much nicer now
lol
Track updates for custom components/cards: https://github.com/custom-components/custom_updater NOTE: This is not compatible with storage mode
@mortal cape can we get this pinned?
Morning
Just installed the tracker card. Apart from sensor.tracker_card and sensor.custom_components what do I put in the oat to track the other custom cards I downloaded?
Gauge card, vertical stack and big number
It’s showing the tracker-card and custom-ouster as up to date. But I’m pretty sure that my alarm panel card is not.
No. I did not. Let me try that.
then you did wrong
and thats why it didnt work
again its important to read the docs
how is the script supposed to know which version is installed ? 😛
I didn’t see any versioning instructions on either of the links. Where is it located?
ui-lovelace.yaml
first lines
where you define resources
Link tracker-card inside you ui-lovelace.yaml <----
Yes but in the instructions for the update tracker it didn’t say anything about adding ?v=0 to the .js file.
well if you did it for one card maybe its implied that you should do it for the others aswell
can talk to ludeeus later on in the day
make him include that
so we really have a step by step
Yea sometimes clear instructions help us non expert users.
We are all eager to try Lovelace
well its not really expert level stuff but i see your point
and its good if the instructions are clear for novice or beginners
takes less time from the real stuff
And I’m sure updating docs is never high on your list of priorities.
If I click on update all will it update the card or is it best to download the latest version from the repo?
Good morning.
.away at work
Toast is away! at work :wave:
the note about versioning for the custom cards can be found in the readme as well: https://github.com/ciotlosm/custom-lovelace/
And in the README for every supported card
@buoyant skiff @wheat current Have you guys played with YAML node anchors in Lovelace yet? 😃
Toast is away for 1h 22m 8s with a message :point_right: at work
YAML has a handy feature called anchors, which let you easily duplicate content across your document: https://github.com/dale3h/homeassistant-config/blob/master/examples/learn_yaml.yaml#L105
~yaml_anchor
Nope
It's a neat way to not have to duplicate the same stuff.
@empty heath This is my entire ui-lovelace file ;)
https://hastebin.com/jefutiqihu.bash
Are you allowed to ask that? 😂
😂 I had to.
I have so many ui-lovelace.yaml files right now I don't even know how to keep up with them.
Yup ^ That's correct.
Hahahaha 😂
I typed that into hastebin and hit Ctrl+S 😉
I think I am up to 10 HA installs now. 😢
Not bad :)
I'm only at 6 7 😛
Coming soon: Lovelace Migration add-on 😮 ...maybe tomorrow? 😃
It's allready tomorrow here, where is the addon ? 😄
Assuing it will make sure requisites are in place, un it for you, with an export to /config?
oh that would be an advantage..... but its a one off action
He may have some other idea for it, I'm just guessing here 😛
@timid burrow Since using the script on Hass.io is so difficult, I figured I would appease @quick beacon and make it as simple as possible. With the add-on you can install it, run it, and boom -- it does everything for you.
@timid burrow Which one action might that be?
well exporting to lovelace isn't something you do more than once is it?
(In most cases, it is one-off) 😂
but it was a pain installing pip etc and then using copy/paste from the output to copy to yaml but yeah an addon will be appreciated by some
But, the great news is that it automagically backs up your ui-lovelace.yaml file if it already exists!
💯
that's a win
And not just once...
nice
How about moving them to /backup/lovelace ?
(so I don't have to change my .gitignore) 😅
I don't see that being feasible, unfortunately. I mean, it's possible, sure, but not necessary in most cases.
for a one-off hahahahahaha
(I'm probably an edge case user 😛 )
@wheat current You could always just have it generate to /backup and then copy it over afterward. 😃
Perfect 👌
@wheat current Or if you reeeeeally want, I might be able to add a post_commands or after_commands (couldn't think of a better name) option.
post_commands make sense (at least to me) 😄
Done. Testing.
😍
...still building. Damn rpi3b is way too slow. 😂
That is by design, so you can get a sip of 🍺 while working 😉
Man, if I start drinking now...I won't go to bed!
I'm sure my daughter will be up pretty early in the morning, so I need to be up with her.
And it is already 3:30am here.
[03:31:46-0500] INFO ----> Output file is set to: /config/ui-lovelace.yaml
I am the one before execution.
I am the two before execution.
ERROR:__main__:/config/ui-lovelace.yaml: file exists, backed up to: /config/ui-lovelace.yaml.4
INFO:__main__:Lovelace UI successfully written to: /config/ui-lovelace.yaml
I am the one after execution.
I am the two after execution.
[cmd] /usr/bin/run.sh exited 0
Just perfect 😄
@wheat current Here ya go, this I think does the trick:
{
"log_level": "info",
"output": "/backup/ui-lovelace.yaml",
"init_commands": [
"cp /config/ui-lovelace.yaml /backup/ui-lovelace.yaml"
],
"post_commands": [
"cp /backup/ui-lovelace.yaml /config/ui-lovelace.yaml"
]
}
That should ensure that the backups are only written to /backup/, and that the latest backup is of your actual /config/ui-lovelace.yaml
Hey Anyone using pushover with latest homeassistant? I have problem with the sound is very low even when i have priority: 1 When i switch back to old 0. 62 the sound is high again for priority message any tips?
Looks good 😄 now I just need a repo link to install it
@wraith hill best tip would be to ask in #330944238910963714 😉
oh i didnt noticed i was on wrong window
@wheat current I can send you a ZIP file, but it is not pushed to GitHub yet.
Take your time :D
I have enough to test allready 😛
Good night 😃
@timid burrow A situation where it would not be one-off is if you create a new view in the old UI and want to get just that view from a newly generated ui-lovelace.yaml. In this use-case, you wouldn't want to overwrite your live ui-lovelace.yaml, but instead to a separate folder, and then open the file and copy/paste just that view.
fair call..
~away 😴 -- but @wheat current might be able to help!
dale3h is away! 😴 -- but @wheat current might be able to help! :wave:
icon-state element within picture-elements does not change color based on state. is it? why?
@woven blaze It does that for me
@wheat current may you try with group (like group of lights)
A group of lights or a light group?
sorry i don't understand the difference. i mean like having 2 lights and create a group for them so you can action both togather.
for that you should be using https://www.home-assistant.io/components/light.group/ and that should reflect icon changes like regular lights
ohh thats new for me.. thanks! I'll try that
@wheat current on a different element.
i would like my room temperature to float on the picture, i used state-label. however it's text color being too dark to read, any way turning that into white?
@woven blaze like @buoyant skiff sugested:
add this to the element
style:
color: white
Some one need to put transform: none in the docs, I use that for all my texts now 😛
hi
why is all that simple..?! hehe
list of named color values
if you dont wanna do anything fancy
@woven blaze suggest your read the docs
i have a question
id like to create a button that calls the service "light.turn_off" for "group.all_lights"
not a toggle switch
and what card are you working with ?
any card
k there are various styles my favorite card is picture element
there you can define an entity and do a service call
A script will give you an execute "button"
@buoyant skiff are there a botton element for picture elements?
- type: picture-elements
image: /api/camera_proxy/camera.jeaves_cleaning_map?token=*
elements:
- type: state-icon
tap_action: toggle
entity: vacuum.jeaves
service: vacuum.locate
style:
top: 5%
left: 95%
"--paper-item-icon-color": rgb(115, 122, 130)
So no 😛
was showing @paper finch
lol... can i just get a basic button for now? maybe ill deal with picture elements later
for you @wheat current state-icon
its not advanced 😄
service-button
service-icon
thats what i use
then as entity the script
works like a charm
care less about button
Your service is homeassistant.turn_off if your entity is group.all_lights
ui-lovelace.yaml
@quick beacon if that is true, the docs are wrong https://www.home-assistant.io/lovelace/picture-elements/#example
Lol, this is basic HA service syntax
docs still wrong
Indeed
im new to yaml. never used it before until today
im an openHAB user but i like HA GUI better
~yaml
YAML is the mark up language used by Home Assistant. Consistent indenting (two spaces per level) is key - read more at https://home-assistant.io/docs/configuration/yaml/
i have been
All lovelace config goes in the ui-lovelace.yaml file, if you do not have that, just create it and get started 😃
ive just been using the commented sections to understand lovelace. dont know the statements
statements?
commands?
sry... self learning programming jargon
so at the moment i have
views:
- icon: mdi:home-assistant
title: Home
id: home
cards:
- type: entities
title: Lights
entities:
- entity: group.all_lights
name: All Lights
but i want a single button and not a toggle
then you need to change the type