#frontend-archived
1 messages · Page 59 of 1
geez pasting links over and over doesnt really help
I know how it's supposed to look, what is not working for you?
no
ok
lol
@mortal cape like the new transmission card ?
remade the layout so it doesnt break that much on various resolutions
looking good. actually made me wonder if you had some thing going where the background image changed depending on some other state
that would be fun to try 😛
that what would requier some js i guess
would be pretty cool to do a .apng weather card
in lovelace - are imports of yaml file possible?
so I can divide main config to smaller ones?
No, there are no includes supported @sinful haven
thank you
anyone sees any problem here ?? https://www.hastebin.com/olexuhogol.coffeescript
You need to tell us what the problem is @clear vale
Posting your config and asking if we can see a problem, without knowing what the error/issue is, isn't going to get you much response
@clear vale make sure you add the file as a resource
err
version is off it seems
but also what @split granite said 😃
looking in the logs ... its not showing up
Im still making this harder than I think it is.... https://hastebin.com/mitegalowa.bash
Icon is there and happily turns fan off/on, but image remains default
@clear vale what is not working?
Do you not see the card?
Is it there, but not containing anythin?
nothing showing up
I had entity: alarm_control_panel.home but I see my alarm name entity: alarm_control_panel.home_alarm am rebooting to see if that was the problem
what what happen when U copy and paste
That was not it
I don't see nothing in the home-assistant.log logs for lovelace
Look at dev-console in your browser
Guys! First of all, I searched the docs and it states I can do custom card for lovelace in the framework of my choosing 😃 . I wanna start make some custom cards and I wanna know what you recommend. I am thinking about learning Polymer as base of my cards. Should I go the LitElement route? It seems like the recommended aproach or another way that more in line with lovelace architecture? Would be greatful if you gave som advice. Thanks!
@wheat current nothing is there
Does it matter if my fan is running off a Sonoff, and that state 'on' or 'off' isn't being recognised in my card
toggle is working fine though
@clear vale Couple of things. Could be this: https://github.com/ciotlosm/custom-lovelace/issues/82. Could be something else. Check your Javascript console
@clear vale using /lovelace and not /states ?
Could try my version of the card here: https://github.com/gwww/custom-lovelace/tree/master/alarm_control_panel-card
Good one @wheat current!!!
@wheat current what do you mean?
It seems pretty obvious @clear vale - you are using the new Lovelace UI, not the old UI?
After all, you don't need to restart anything with Lovelace
Nevertheless one should not use custom/experimental stuff without some basic troubleshooting experience, using that kind of stuff usualy require some form of thinking
@rocky merlin I would go the lit element route or just extend HTMLElement like marius does with his cards. There are some other frameworks out there for building web components, but you may have issue integrating them into lovelace (Angular Elements doesn't work so steer clear of that for now)
Use lit for compatibility or just plain custom for no need of external libraries
@tender wasp @north spear thanks guys, thats what I thought. Was just making sure I dont take a route that I will regret later on.
@buoyant skiff Where do you get the weather icon for your greeting card?
And I think edge users should not use custom cards
noticed that i got a small css mishap on the greeting card where the calander goes off screen on smaller res
will fix that
If they chose the browser, maybe they should stick to defaults and core only
Toast is away! sleeeep :wave:
Can you share your updated template sensors for the greeting card?
so happy just created simple temperature gauges using the useful info here https://github.com/ciotlosm/custom-lovelace
next step to mount them all onto a background if possible, and then have several colour gradients depending on season (e.g 25 in summer is in orange zone as too hot in the house, in the winter more nearer the green zone if that makes sense)
yeah, the lovelace change a lot
@sinful haven have you made anything good with it so far?
no, just had few minutes to try it today
and now migrating my panels to it
deleting groups etc. 😃
i only started last night
but also found gauges etc... so nice
i used dale3h wonderful script
me too, but soon after it i started improving everything 😃
and delete groups as they are not needed anymore
got my content in so i can see everything, now i am adding new ones to customise
i was try to get one of the images to change when i turn the fan on/off, just cant seem to grasp what im doing wrong with it
so the gauges and battery bar saved me from throwing me keyboard at the screen
battery bar you mean the 0-100% one?
i didn't try on/off yet with images tho
only floorplan
yes, custom:bignumber-card
using it to display all my sensor battery values, all the code I had in my configuration.yaml to change icon state based on % is no longer needed with that
only done 1 so far as a test
You could use monster and get all batteries with 1 setup
Maybe I should allow monster to load bignumber and gauge cards
oh really, let me look at that
sorry, first 24 hrs with Lovelace, so Evernote'ing everything i pickup as I go along
I’ll have a look tomorrow to allow custom cards with monster filtering
@north spear wow, that Monster card looks the dogs danglies
so i can filter all battery sensors into the card in one go, im giving it a go now
@north spear Would it be possible to use a resource to monkey patch monster filters into all other cards?
@empty heath You can already use monster with any builtin card that takes an entities list
But i think it needs a bit of change to allow custom cards
Or single entity cards
But doable
Maybe a combination with the custom vertical card from @frank garnet
Hmm, i'm not sure i'm doing this right, trying to get a batteyr status card working for my sensors, it should be an entity with secondary_information set?
- entity: sensor.bedroomenv_temperature
secondary_info: battery
is what i have
but its just showing the actual temperature :/
@wheat current im having errors when trying to update custom cards tracker-card.js?v=0:96:58 Uncaught TypeError: Cannot read property 'replace' of undefined
if i have 2 gauges in horizontal-stack
how can I give them together a title?
defining 'title' before cards: dont work
@white ibex here is one i just did using monster-card and bignumber-card https://www.hastebin.com/hoyujoniti.cs
it might not be what you are looking for, more info on the custom cards here https://github.com/ciotlosm/custom-lovelace
you also need to add the js files into the lovelace yaml file as a resource
@sinful haven i have 4 together, no title... interested to hear any replies on that one
I would love to just 'group' them together to be honest 😃
Oh, hmm, your battery is an actual value, mine is an attribute of the temperature
you can do that too
@serene sierra make sure you have the latest card and component
take a look at the examples in the monster-card info
@wheat current thank you find what was wrong!
Ace, now i have to figure out how to install monster card 😄
you running hassio?
do you have a config folder etc
yeah
so in Hassio you create a www folder within config
then place the monster-card.js file in there
im guessing its very similar for Docker?
get the file from Github and create a new file in the www folder called monster-card.js, paste js from github into it
then just add the following lines in the lovelace yaml file...
resources:
- url: /local/monster-card.js?v=1
type: js
job done 😃
/local is the same as www
im no expert, 24 hrs ago i knew nothing about using Lovelace, but happy to share my experience thanks to help from many people here today
Thanks @mossy gale
Doesn't look like the www thing is working - might look at moving to hassio's docker container directly
oh, i think if you ever change the js file for a newer version you have to change the ?v1 to ?v2 etc etc
yes, not sure how that works in your environment
as long as it can be accessed I guess its not the end of the world where it is??
i think I've found solution: panel:true and use markdown... will test
can i use - type: horizontal-stack inside - type: custom:vertical-stack-in-card cards:
Aha, needed to restart the container
im asking because im facing that error /local/vertical-stack-in-card.js?v=0.0.1:39:67 Uncaught TypeError: Cannot read property 'style' of null
DrZzs or BurnsHA need to make a YouTube video for Lovelace
Not yet
- type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:bignumber-card
title: ' '
entity: sensor.time_12h_format
scale: 18px
from: left```
Lovelace is changes a lot from versjon to versjon, would be out og datert fast
@wheat current fair point
hm... if I declare panel:true, I cant use multiple types as cards
two horizonstal-stacks - only first shown
oh: "This renders the first card on full width, other cards in this view will not be rendered. Good for cards like map, stack or picture-elements."
well
i tried that and had same issue
lol I just wanna group some stacks.. 😃
Use horizontal stack in vertical stack with panel true
hmmmm?
@white ibex how u getting on??
two stacks in each other?
Should work
I've managed to load the custom card, trying to ifgure out how to force it to display an attribute instead of the value
it does!
: 👌
lol, thank you @wheat current , now gonna just configure it
@sinful haven be interested in the output
yes im too cant stack it how it was before with custom_card tiles
@white ibex I need to do the same with my BMW sensors, as the lock one has attributes for all the windows/boot/lid etc
that looks great @serene sierra
I'll probably just end up adding a new sensor for the battery if i can't figure out any other way
when im trying to stack more then 5 bignumber-card or something like that i have problems with positioning cards
@mossy gale as @vapid field wrote: define whole as 'panel: true', first card is 'type: vertical-stack' and in 'cards' u define what you want. I used 'type: markdown' for header
@sinful haven would u be happy to hastebin your efforts?
@vapid field https://hastebin.com/unotahewel.css
its 'electricity' and 'heating' group
trying to embed image here lol
ah ha... cheers 🍺
dunno how
me neither, think you have to use something like hastebin for images
thats better than a massive one in the middle 😃
you are on iOS i assume
android, chrome
ah ok, i hope the android app arrives one day
dont use app, only web interface
me too, there isnt an official app is there, only on Apple
i don't really like apps, especially that I use sophisticated authorization on entry 😉
i dont allow remote access, VPN in to access it
@wheat current thanks! Didn't know that existed
Ludeeus is away for 44s with a message :point_right: ```
When Life Gives You Questions, Google has Answers
<https://www.google.com/>
installed, does the job
@mossy gale Please remember that the Android app is not official, and has the potential to introduce unknown issues that will not be supported by the Home Assistant organization.
@empty heath yes I understand that. Theres one on the Play Store, but its not that good.
in my opinion webapp doesn't miss a thing
I’m with @sinful haven , with the exception of location tracking.
yeah, I don't use tracking thats why I didn't notice that :_)
The two features I like about the iOS app over the web app are 1) location tracking, and 2) push notifications.
its an iphone vs Android thing, mate at work wont let it drop he has an app and i dont, as we are always doing the "mine is better than yours" routine
agree for notifications
On Android you can use HTML5 notifications, I think.
i switched to pushover today, from pushbullet. Not received a single message since 😃
have you tried html5?
no
it's native in android, requires to have SSL-ed hass outside available tho
they are nice as you can embed image or actions to the notifications
nice!
I use Pushover and Telegram.
liek "Light X is turned for 4 hours already" and embed "Turn off" action to it
sweet!!!
do u need to define a device on pushover to push to within HA ?
i need to install SSL again, last attempt saw the end of my access to HA
- alias: Monitor Front Door Open
trigger:
platform: state
entity_id: sensor.front_door
to: 'open'
from: 'closed'
action:
service: notify.pushover
data:
message: "Front door is open"
title: "Front Door Open"
That's my setup @empty heath
dale3h is away for 1m 19s with a message :point_right: two weddings today...I was only able to make it to one. The other is in Mexico... @wheat current said he’ll answer any questions you might have, Home Assistant related or not!
api / user key all correct in secret.yaml file
not a single message
right i am off for some 😴
thanks everyone for help given
night m8
how can i change Media Control Card visibility in UI?
for changing active media player with source button
i mean i cant use templates here anymore and monster card works well but break card arragments
- type: horizontal-stack
cards:
- type: custom:monster-card
card:
type: media-control
entity: media_player.samsung_tv
filter:
include:
- entity: media_player.samsung_tv
when:
entity: input_boolean.samsung_tv_livingroom
state: 'on'
is there a way to reverse an icon? i have the 'mdi:video' but it's pointing the wrong way.
@long cosmos on a picture-elements card?
I may not be doing what I'm doing the correct way, but I'm tinkering. https://hastebin.com/gaduwevuha.css
It's not hugely important, just didn't know if there was some styling method to reverse/flip horizontally the icon. I don't speak the CSSs, JSs, or HTMLs
add transform: scaleX(-1) to your styles
Worked like a champ. Thanks much.
Anyone noticed a red box with some error message (think it says custom element dont exist) a blink of a second before the custom element shows?
@rocky merlin yup
morning
@buoyant skiff love it.
@buoyant skiff the messages are dynamic?
yes
How do you get it to stay with left allignment?
🤔
they are not left alignment
its centered
45%,50%
but they are long enough so they look left aligned
okei...
Setting allignment would be a good option, anyone know how I can achieve that?
could go with setting it px instead of %
interesting
cause text-align: left wont do much
could try padding
padding: 35px
like that
havent tried it yet might work
that will move it out from the edge
incase you dont know css that well 😃
is there somewhere with a lot of examples and associated screenshots of what lovelace can do? not having much luck finding anything on the community site.. usually if there is a screenshot it's of a problem
@buoyant skiff padding and padding-left did not work
its coming
balloob is working on a demo site
im gonna take some time when my vacation comes to put up a repo
with examples
else there is the docs
awesome.. I've still got to work out mqtt discovery before I start rebuilding my system anew with all the ideas I've been having the last year..
to tide you over in the meanwhile
i didnt need much more then the docs to get started
lovelace doesn't need restarts for iterating on the configs does it? just save it and reload the browser?
and this doesn't work like groups/customization/etc where it stops working if you use packages? 😛
and by that I mean reloading doesn't work
You need 1 big ass file
oh god.. that might end up being a problem.. how big is big? 😛
1000+ lines at least 😛
shit.. not so keen on that.. would be nice if it could be split
meh its ok
i have files like that for sensors.. and it's a nightmare
rather have lovelace then the old ui
that's why I've tried not to touch them in a year now
rather have no ui than the old ui 😉
lol.. it got better with custom_ui but still very inflexible and awful to configure
@buoyant skiff what version are you running of HA?
as far as I can see the whole point here is to decouple the ui from the backend config right?
Yes
mine doesn't look like yours
And that's a work in progress @viral sorrel - it'll be a while before it's fully decoupled, after the current UI is removed
@nimble folio He's done a lot of custom card work 😉
my sensors just show up underneath the image as separate lines
i copied y our gist and put in some of my own sensors
which browser are you using ?
hm, good point. let me try another
Chrome is the one that everything is developed against AFAIK
goodthing im using ff 😛
firefox renders it the same as that image
which version of FF btw ?
61.0.1 64bit
done this ?
the part about ff
in the readme
for me it fixed some other lovelace issues that was present
awesome
i was in edge the first time (yell at me later). which explains alot. 😃
it's great for debugging windows apps/pwa. if it works in edge, it works everywhere
lol
hehe
guess I should learn javascript
@nimble folio
Try adding:
'position': absolute
as a style to them
@buoyant skiff setting this give me left allignment :)
style:
top: 60%
left: 30%
transform: none
With the state_filter: if the state isn't listed doest that mean the entity wont show if it is not in that state?
That is how it's supposed to work
good work Ludeeus 😃
Was driving me crazy... On a state update, if the lenght of the state changes all alignments was messed up 😛
hehe
this will make my work even better so thx for investating 😛
- type: state-label
entity: sensor.stash_syslog
style:
top: 20%
left: 5%
text-overflow: ellipsis
transform: none
font-size: 90%
font-weight: 550
font-family: Trebuchet MS
letter-spacing: 0.38px
text-shadow: 2px 2px black
perfect 😄
so static to me
like my cards with more dynamic flow to em
have it feed me more info about the system card im looking at
do you have a screenshot?
see chat above
or wait for my system to reload
posted several cards in this chat
today or earlier?
both
thats my nas card
has feed from syslog on the nas
with uptime and firmware displayed
and processes
yeah I came across 2 cards and noticed you do background images... this gives me ideas 😛
and power toggle and its tracking downstate to via binary sensor
that is a useful card
lovelace is really quite flexible.. it's basically anything you can do in a web browser
having just one value is kinda wasteful to me atleast
then im working on my greeter card also
man... I feel like I want to study ui design.. it's always interested me
human machine interfaces in general
with current time and weather along with personal greeter based on the time of day and accuweather minute forcast and location and calander
dynamic icon on weather
animated also 😛
I'd probably go a bit larger and more spartan.. but I like the ideas you've got
config for that greeter card @buoyant skiff ?
will do a repo in a week when i go on vacation
working on getting it perfect for all resolutions at the moment
posted some wip yamls
I wish we could buy voices for our voice assistant devices.. HAL.. Majel Barrett.. or at least great approximations
and the repo will have all the sensors in a package for that card
will servce as an example repo
do you have a repo you can share?
oh shit.. missed that.. sorry 😛
yeah u kinda did 😛
hey.. sometimes I need to look in the fridge 20 times before I find what I'm looking for
hahah
or that time I looked for an rpi for 2 weeks before discovering it was centimetres away from me :/
almost ordered another one
would finally have an excuse for some of the plex sensor stuff
list of most recent downloads
i made a transmission card
oh yeah.. and I'd do nzbget.. I'm sure that has an api
if your using sickbeard of radarr or sonarr forget which of em are for tv then its plausable to get that info
sonarr and radarr..
yeah they're in dockers.. I don't have to see it
got all of my streaming services for free at work
all legal since we need it for raising issues etc if there are any
so i got basically any channel i want
what? how does that work?
for purposes of what? blocking?
Pushing water uphill?
no shit Tinkerer
the worst part isnt tech support
its the management
bunch of knuckleheads
I've been to Stockholm, Malmo, Gothenburg and Lund
glorified calculators basically
kewl i dont live far from Gothenburg
its called Borås
I liked Sweden.. not cheap... but when I went to Burger King the burgers were a million times better than in Australia
you have no idea.. it's like gourmet food in Sweden comparted to Australia
Haha.. Hungry Jacks is shit thats why.
yep.. totally
When in Sweeden you need to go to IKEA and get the meatballs 😃
Back to Lovelace guys 😜
Burger King (even though it is the same thing) is so much better than Hungry Jacks. Slight changes in menu etc
oh shit.. I didn't even realise I was in the Lovelace channel 😛
man.., too much choice nowdays
We need more choises 😄
back in my day on irc you had a channel and it would always cover everything
@buoyant skiff I like your idea of using picture element cards
with only a tenuous link to the topic
Is it possible to use a media card in entity-filter?
TehRobot many looked at it as a floor plan only
the page should add an additional example showing something else
cause people are too hungup on their floorplans and thats all they see¨
Then add it 😉
is there some sort of documented roadmap for lovelace?
I am finding https://home-assistant-lovelace-gallery.netlify.com/# helpful
think there is in the docs
@raven nacelle thats some of your work right ?
in the gallery
Some of it
Check the ui-schema repo @viral sorrel
that gallery is EXACTLY the sort of thing I've been itching for!
copy pasting ? 😛 @viral sorrel
Plus it has the config to get started
yeah.. great start for iterative discovery (my term for copy and paste and reverse engineer results.. with help of documentation naturally)
u can use dale3hs migration script to convert your old stuff into lovelace
thing is you don't know what you want from documentation until you want to change something..
me i like to be brave i just do stuff if it breaks it breaks
read the docs then do stuff
Lovelace is nice as its just a page refresh to test.
same.. but it helps to start from something that works
I've got it linked.. it's on the "cards"
then it generates ui-lovelace.yaml
ooh.. I love the markdown support!
Me too
I have SOOO many things that I've wanted to represent in a way that markdown would be suitable for
It can still be useful @buoyant skiff 😉
not for me 😛
think of markdown as a rapid prototyping tool then
you get an approximation of what you want then you css it
@buoyant skiff sure about that?
this gallery has made me super hyped on lovelace
@buoyant skiff I wil give you one, hold on
you could import a readme from github and have it displayed faithfully 😛
or a changlog
where is the changelog for 0.74 regarding lovelace?
im not getting anywhere with my lovelace cards 😛
it should be here https://www.home-assistant.io/lovelace/changelog/ but it's not
home-assistant-lovelace-gallery.netlify.com is an absurly specific and long FQDN
and I win! this would be perfect for the markdown support 😛
Front page shows 0.74 for me, along with the blog post
Was there at least 12 hours ago
I'm pretty sure i saw that yesterday, but when i check now its 0.73.2
You've got a browser cache issue 😉
ok guys.. thanks for the lovelace love.. gotta get some sleep
Ok just started lovelace.... and it seems i only have one weather componet that is weather.thermostat but this produces a card with no icons
welcome to a more prettier UI @undone egret 😉
good question
more prettier?? isn't it either more pretty or prettier?
isn't it though rather than thou?
He's a Yank, they butchered English, more than we did 😛
is the mdi icon defined ?
amazing the english teachers in the coding world
he's Swedish isn't he?
@buoyant skiff you are right, I need to create a custom markdown card for it to be useful
Swedes have better English than Americans in my experience 😛
so if you dont want me to revert to talking swedish then dont comment on my misspellings 😛
should it not be in the config of lovelace
not misspellings. grammatical errors
- type: weather-forecast
title: Weather
show_header_toggle: true
entity: weather.thermostat
is all i added
but under dev info
wow.. and that creates this sort of card? amazing
hmm :/
and no icons when clicked on
@empty heath dang it .... first one i try is a fail.... i am blaming you 😹
dale3h is away for 12h 38m 15s with a message :point_right: two weddings today...I was only able to make it to one. The other is in Mexico... @wheat current said he’ll answer any questions you might have, Home Assistant related or not!
🤣
damn thats nice Ludeeus is google basically 😄
@wheat current my coffee is cold ....why
Ludeeus is away for 49s with a message :point_right: ```
When Life Gives You Questions, Google has Answers
<https://www.google.com/>
no doubt bad bad support
@undone egret is that nest thermostats ?
Given how many questions here could be answered by RTFM or Google, I dunno...
@buoyant skiff ecobee
does it display correctly under the old ui ?
I dunno .... didnt even kow i had it... i use darksky and weatherunderground ... but neither of those two have just a weather.blah entity
cant add anthor weather right now... wife is asleep and cant restart ha service (lights will turn on in bedroom when she rolls around)
try addin it under the old ui to see if there is an issue with it there
cause it should have issues under lovelace
@undone egret The icons down work for all the weather entities
Ecobee weather also does not work with it
LOL i found that out.... does y weather work?
ok when wife wakes up i will try
but darksky doesnt have a weather entity just sensors
or least mine doesnt
There's a weather component version
you need to add it separtely
~weather.darksky
oh... i been having it for years LOL
i do have it kinda like that
- platform: darksky
api_key: !secret darksky_api
monitored_conditions:
- summary
- nearest_storm_distance
but more monitored conditions
That's the sensor version
yea 🦐 🔫
@undone egret You forgot to drink it while it was hot, try heating it
ok thanks will try and report back @wheat current
ok darksy works with icons but gives hourly forecast LOL
not daily ...
But how is the coffee?
yeah....that is so stupid
much better
Perfect 👌 ☕
hey guys
im having a weird issue with LL
some of my scripts have a toggle button on the frontend, instead of the "Execute" button
how do i convert them to execute
That means they've got a delay or wait_template in them
It may possibly be a well known behaviour 😉
can i show them with the execute them regardless of the delay?
Workaround: create a new script that only execute the script that has the toggle
i need that delay function in that script 😦
thanks @wheat current and @split granite
what causes the overlapping like this in lovelace
Not strict "padding" in the elements
ok i dont know greek
There are not enough space between the elements
well i saw that ... is there a fix ?
just a enititys card
Looks correct
You need different kind of card to show that. How did it look on old interface?
did the glance hide state changes also get done in entity-filter card?
yes yes it did.
picture entity on my botvac
haha
using camera entity for image
now its just a question of doing something more custom 😃
nice, how you updating the 'camera' photo?
image: /api/camera_proxy/camera.jeaves_cleaning_map
😄
haha
so now im doing a picture element card for it instead
it generates a random token on each update
so exporting that will work
should for for any camera image 😃
thats hooked up to ha
Don't have cameras yet, was just curious how you were 'faking it out'
faking it out ?
@undone egret Why you go blamin' me for all your problems?!
@empty heath easier that way
with the jeaves_cleaning_map. but it appears as that's part of the component?
Is it possible to split lovelace config ?
@forest star Yes. Someone wrote a tool to do it.
is it possible to add custom attribute for media.player component? something like lovelace_active: true and change it with script? I'm looking a way for show active media_player in media player card and send commands with buttons for active entity. Now it impossible to use entity filter for do that. And how to do something similar with lovelace for buttons area show/hide i mean.
I just wish I would have pinned it 😦
OMG @empty heath really ?
@serene sierra Would monster-card work?
I think support for splitting the lovelace config will be removed soon - so said the devs anyway 😦
@split granite why ?
@split granite That is exactly why the tool was written, yo.
Which, given their eventual goal of making things configured by the UI makes sense
@forest star Because Home Assistant will be managing the ui-lovelace.yaml file for you.
or how to port media controller card to lovelace? maybe someone could make custom card from it?
So that you never have to edit it manually.
But, some components of this platform seem to sit in feature freeze for a year or more, so I'm not holding my breath unless @north spear is driving it 😛
@serene sierra A custom card is definitely possible -- do you know JavaScript?
@serene sierra its easy to make your own
@empty heath Oh that is awesome like a WYSWYG thing ?
use verital and horizontal stacking
@forest star Yeah, with drag & drop, paste, etc.
@serene sierra posted a message that is more than 15 lines. It is now available at: https://hastebin.com/megawobuzu
Please don't rely on the bot @serene sierra 😉
Even potential to use the cloud component to send Lovelace configs to your own Home Assistant server.
Find something on the gallery that you like, right click > send to Home Assistant 😉
(feature is not available yet, but is just an idea of what's possible in the future)
@empty heath wow this thing is going out of hands so quickly bro
or using picture elements
@forest star If you want to separate it and manage it on your own, then use the tool.
@empty heath https://hastebin.com/ovihabikil.bash monstercard work but it have problem with minimum/maximum card size and card show in wrong place in ui. maybe because it inside another vertical-stack card
Merge tool for Lovelace config https://github.com/thomasloven/homeassistant-lovelace-gen
@buoyant skiff it so fast to position all elements with picture elements i was tried
AGAIN
Oh, haha, I was typing out a description, and was going to include usage. That's why you beat me 😛
@empty heath no im dont know JavaScript well. How to start? im know you are veteran
You could at least have wrapped the URL 😉
@split granite Didn't on purpose 😉
😮
(Because I was going to pin it)
🤣
But, have it y'alls way.
Just as I was about to pin that...
🤔
🤔
Entity attributes will get monster type filters soon 😃
And alarm card got an update
Can now be scaled to use better with panel: true
is it possible to change the color of the icon here using some style command? https://hastebin.com/gaduwevuha.css
@long cosmos color: ...
I need to get me a robot vacuum
border was fun can add an extra nice element to the card
- type: state-label
entity: sensor.jeaves_area
style:
top: 90%
left: 0%
color: rgb(115, 122, 130)
transform: none
pointer-events: none
text-shadow: 1px 1px black
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
border-left-style: solid
border-color: orange
background-color: rgb(54, 65, 78)
@buoyant skiff the start to my server monitor: https://imgur.com/a/Lwkkh8r
sweet
@tender wasp Thanks for the help. Does this work for the view Icons?
No only picture-elements
okay. i was hoping I could change the color of the view icons as well. Thanks.
@long cosmos you can change all items with a frontend theme
yeah that has to be done with theme
okay, i have the mdi:hotel for bedrooms and was trying to make each one a different color. Not sure where to look in the frontend code but I'll go look and see what I can find.
its nice now that things sticks @wheat current
Hi guys, is there a way to hide a Lovelace filter card if there are no entries? Looking to find a way to tidy a simple dashboard by just showing cards if the filter criteria is met.
its in the docs
Agreed :D
But how did you get it to show Status: and Area Cleaned ?
template sensor?
Aha, thanks @buoyant skiff , I missed that completely.
@buoyant skiff was there anything you had to do to get your picture-elements cards to display well across different screen sizes?
yes and @wheat current solved that today
transform: none
use that
will make stuff stick
I have this on mobile: https://imgur.com/a/2dPkaJh and this on desktop: https://imgur.com/a/B8QEnrb
okay, thanks
I'm actually using transform: scaleX(-1) on some of my icons to flip them. maybe it's related
that is ok 😃
gonna be nice when you can do css tooltips later on when you can import css
so when you hover on a value it will show a tooltip
@buoyant skiff love that server card, looks the bomb
I've managed to completely miss the "show_empty" option for an hour. Feeling a bit of a dufus.
think that was Ians unless you meant my nas card
your not alone to fail on easy stuff 😄
@buoyant skiff can't you do tooltips using title already?
Ian i want on hovering over values 😛
@buoyant skiff the server monitor one
@buoyant skiff maybe I'm not understanding your question, but using title I am able to get the following tooltip when hover over the bottom temp: https://imgur.com/a/aYdO7Ok
I'm helping!
🎉
@buoyant skiff sorry my bad, your name tagged at start of message. it was from @mild veldt
looked very similar to your style
hence my error
@mossy gale https://hastebin.com/vosanenoxu.bash
@buoyant skiff your nas one is awesome, got it in Evernote for use as learning
I want to add my pi-hole sensors next, but currently my pi-hole is borked
@mild veldt Many thanks, another one to digest and learn from
Updated my server to Ubuntu 18 and there is now some conflict between DNS ports
@mossy gale I got all my inspiration from @buoyant skiff, hence it looking like one of his.
@mild veldt the sensors you have in it, are they calling scripts or anything? or a component for testing speeds etc
there is a component for it
yes i have a bunch of those for the Pi
will check out the speedtest one
@mild veldt @buoyant skiff thanks
have an older dlink nas that doesnt support optware or entware and only has a shell and no python so i made a script that piggybacks on the httpd module for serving the webui, the script creates a json file exactly the same as glances 😛
that way i can have system stats from my nas
i dont really have much experience with JSON, my work has access to a massive library of Skillsoft training courses, there was one for JSON I enrolled onto, now jsut need 2 hrs peace and quiet at work to go through it. Watched the intro and it seems the basics are simple enough, its putting it into HA and manipulating values that I will need to get better at
There's nothing really to JSON itself. Using it within HA/Python would be where to spend a bit of time, but again, very straight forward after you see an example or two
just added that speedtest sensor and restarting...
That looks really nice @buoyant skiff
@buoyant skiff Nice!
been messing around with so much css just trying out see what works and what breaks
@buoyant skiff got mobile and desktop looking the same. Thanks.
@buoyant skiff posted a message that is more than 15 lines. It is now available at: https://hastebin.com/omulopewef
i had never gone through with doing floorplan previous, but using picture elements was a breeze for it
whoops 😛
more then 15 thought i was safe
got box shadow
so the border that i use has a shadow
and then text inside of it has a shadow
there's no way to put just text on a picture elements card, right? need to throw it into a sensor?
there is
or use a markdown, i guess, ballob did just add that if I remember correctly
ludeeus will fill ya in
@mild veldt I made this today for that purpose https://github.com/custom-cards/text-element
shoot, i must have missed that while reviewing the posts from last night. awesome! thanks!
Ian
if you dont want a value to be clickable
pointer-events: none
add that
when doing cards all the values when using a tablet or phone can get quite messy
i'm finding that to be the case
that is the greeter card
i just wanted a simple '/' between my current and target indoor temps, lol
hehe
one more thing, I don't think I missed it, but state-labels are just that, for states, correct? I can't get an entities attribute in a state-label without doing a custom template sensor for it
correct
@wheat current you create a div but instead you should just leave the text in the custom element ? THat would make styling easier for your users
wew, that styling! looking good! my css skills are little to none. the are nearly 99% reliant stackoverflow
this.innerHTML = this.config.test 👍
@mild veldt that will never go away, however using the chrome / firefox dev tools helps! You can live adjust CSS and see how it will look. When you're happy, copy it to your Lovelace config
thanks for the css add balloob
@half osprey Thanks for the tip, will try that 😃
that is my exact method of playing at the moment. my knowledge of what can be done and how it can be done are what are lacking, however 😉
Is there or will there be a way to apply common CSS to numerous items? e.g. Changing the font
Did you guys see https://www.youtube.com/watch?v=HBXIOj5ndo4 ?
www.DrZzs.com IMPORTANT LINKS: Amazon Link: https://amzn.to/2rCQPcw Patreon: https://www.patreon.com/DrZzs Twitter: https://twitter.com/Dr_Zzs Instagram: htt...
So cool
hold up...can I use ::before on a state-label?
but filters might be nice
I am thinking about adding that video to our picture-elements docs, would that make sense ? It seems very useful
@raven nacelle you there ?
@half osprey the floating head is creeping me out, lol
@mild veldt just got the start of my card going
can you add labels to the icons?
so u know what they are
Is the usage of pseudo-classes like ::before and ::after done differently in picture-elements? Not having any luck with them or even within Chrome dev tools for that matter
If you add title you can define what tooltip will be displayed on hover
is that what you're getting at, @mossy gale ?
yes, something to distinguish 3 very similar values as to what they are
at the mo i have 3 values, 3 icons the same not sure which is which without opening it
give them different icons
need to move them about on the card (which isnt as good as yours)
use type: icon or change the icon in your customization
i would go the customization route so that the change sticks globally and not on just that one element
ah crikey, i havent added the speedtest sensor to customization yet! only added it a while ago! School boy error!!!
cheers
did u see my pic? is there a way to trim that massively long time value to just finish with whole second, not 1000000th of a second
pro-tip, get plan-coordinates on that page for easier placement
template sensor with a filter, most likely
just need to split the string on the '.' it looks like and take the first element
.away time to go to sleep work torrow
Toast is away! time to go to sleep work torrow :wave:
9:30 bedtime. this guy isn't messing around!
.split('.')[0] works for python, not sure what you where talking about xD
trying to remove the end of this `1 day, 12:04:09.515951z
the .515.... bit
from sensor value on my nice lovelace card i am putting together for my Pi Home Assistant Server
What type of sensor?
this worked in 
{% set test = '1 day, 12:04:09.515951z' %}
{{test.split('.')[0]}}
@mild veldt @wheat current thanks both of you, this side of Home assistant is where i am really weak, i learn bits and pieces to cobble together to try and do what I need. All kept in Evernote for future ref
@mossy gale https://hastebin.com/jajihekeva.bash
hello, how can i disable a switch after my group-name?
@mild veldt thanks, dumb q. where should i be adding that? in the lovelace file or with the sensor
that was gut feel
and then update your lovelace to reference that new sensor
@vapid field can you be more specific? what card are you talking about?
hello, how can i hide a switch after my group-name? (correction)
@vapid field you can edit messages
take a screenshot and put it up on imgur and link it here
ok, thx
Anyone else have issues with custom cards not working on mobile, specifically iOS?
n.setConfig is undefined is the error I always get
✋ 😑 👌
@mild veldt still at it here.... https://hastebin.com/ocepehojop.bash prob something i've done. error is in the hastebin too
I would love to have a card -- call it my vacation mode card -- that I would use to set a departure date and ETA of return. That would give me the inputs I need to run an automation that does a whole bunch of things . Any thoughts or ideas on what sort of widgets would be in place to facilitate it?
maybe just the input_datetime entities?
I added the custom element I used as an example in the PR to github. @raven nacelle tried it out first since he asked me to make it, but if anyone else is interested it's here: https://github.com/jeradM/custom-lovelace/tree/master/circle-sensor-element
TY @north spear - I will give it a go.
Nice @tender wasp
Thanks 🙂 arsaboo wanted something like this that he could put on a picture-elements card so this is what I came up with
Is that just reading your releases?
@tender wasp I sendt you a PM with some info 😉
@mild veldt thanks, trying it now
how can i hide this? https://imgur.com/a/yh7x2OE
That looks like the entities card, if it is set show_header_toggle: false
Read docs 😃
Or use greek
thx
@mild veldt worked a treat
icons not changing still, i added them all to the customization file and restarted ages ago.
very handy the coords thing
move my sensor data about to line it up
@raven nacelle you there
@forest star outside now... Will ping you when I'm back
@raven nacelle sure ....
@raven nacelle just in case I forget https://community.home-assistant.io/t/custom-animated-weather-card-for-lovelace/58338/82
is there a way to display cameras on lovelace ?
@mossy gale have you cleared your cache?
you on hassio?
I am
from the Configuration -> General -> Reload Core
Ok
Be sure to check the browser dev console and the dev info logs in HA for any errors
can you display sensors on top of lovelace the way they are display on regular homepage
No errors about it in ha
badges
@forest star yeah, you'll want to use a glance card and panel set to true in a vertical stack so that you can add more cards to it
@mild veldt Oh man.. what is that !!!! 😛
Not easy to view browser console as I am on phone
@forest star I haven't actually tried it, let me see if I can whip up a demo
Might have to have another crack tomorrow
4hrs 50 till I need to get up, better get some zzzz
Thanks so much @mild veldt
@forest star i think badges are back in 0.74. Check docs
Check https://www.home-assistant.io/lovelace/views/ for badges
As I said. Check badges
Ok
hi
any way to place picture element on top of picture glance?
is there a way to check lovelace config setup ?
Refresh
Is it currently possible to have a side scrolling list of picture elements? Imagine Netflix on your phone side scrolling movies
@north spear can't get the badges to work , do you have an example
@forest star - icon: mdi:home-assistant title: Home id: home badges: - binary_sensor.fd_motion
Thanks @drowsy summit
np
@dense roost I think the closest you could get right now would be with a monster-card. You can place multiple picture-glance cards inside it, I believe. Haven't played around with it much myself, but doubt it will be a side scrolling list, unfortunately
anyone get a working climate/thermostat card?
this is my setup .... any ideas https://hastebin.com/ejigupayuv.bash
@drowsy summit there should be one released next week in the custom_lovelace repo: https://github.com/ciotlosm/custom-lovelace/issues/4
@mild veldt sweet!! Thanks!
it is normal to get Service System_Log/write called down everytime you load lovelace ?
anyone knows how to add the state on a badge? , just like it was on the States UI .
@forest star Wassup
Weird...did you make any changes to the files?
I re-download the files
yes, redownload the files
share me you screen please
I kept the regular setup , is this independent from it ?
What do you mean?
the original source I am using it too
@raven nacelle what is this in your config "garage_door_tilt_sensor_alarm_level: Weather"
okay, I can't figure out how to make each icon on the view row a different color. I'm not a developer. Any tips to point me in the right direction?
@long cosmos don't believe you can apply CSS style to icons of the view row
yeah, I've been searching but I'm not finding anything. Trying to find a way to differentiate between the different bedrooms since I was using mdi:hotel for each of the views.
I used to have similar tabs in the old ui. But with how clean you can make things I forgo splitting into rooms and use picture glance for each room on one main with unique backgrounds for each.
Much cleaner/functional imo
Unless you have a tablet for a specific room is the only reason I can think of to split them out now
Is there a way to reduce the vertical size of the title bar at the top of the view?
Ian, I wanted to do that but I can't figure out how to create the main view with picture glances like in the sample video where tapping one card takes you to that room.