New widgets: media source select, climate operation mode select and media player with volume slider

do you get anything?
did you add thermostat1 to your layout?

the variables.yaml is a part from the skin that you use.
if you dont use a skin then you use the default skin.

custom skins are normally in a sub_dir custom_css
default skins are a bit harder to find and not wise to manipulate.
in that case it is wise to create a custom skin based on the default skin.

Yes I added it to the layout but nothing appeared. I am using the obsidian skin on my Dashboards. I wanted to try this widget because it appears to give the ability to turn on/off the climate entity. Do I need to add the variable.yaml file somewhere or add the entries to another file? Is the variables.yaml required for the widget to show?

the variables that are inside the variables.yaml are important.
they need to be added to the variables.yaml from the skin that you use.

you probably have errors in your javascript console and your logfiles.
if that is the only widget in your layout, then it can be that nothing appears.

you could copy the obisidian skin to your custom skins and call it my_obsidian.
in that case you need to do the following:

  1. in your configuration dir (where your appdaemon.yaml is) create a dir called custom_css
  2. in that dir create a subdir called my_obsidian
  3. copy the original obsidian file from here https://github.com/home-assistant/appdaemon/tree/master/appdaemon/assets/css/obsidian copy dashboard.css and variables.yaml. and place them in the newly created subdir
  4. edit the variables.yaml you created and paste the needed variables into it.
  5. open your dashboard with skin=my_obsidian

I followed the steps you outlined and everything works correctly except the page that I added the climate_select widget to. It shows as below. Everything prior to the climate_select widget appears correctly but everything after and including the climate_select widget are not showing correctly. I pasted the lines from the variables.yaml into the variables.yaml I created at the end of the file. I also copied the dashboard.css file into the new folder (my_obsidian) I created. Not sure what could have gone wrong.

Edit: I did find this in the console:
Uncaught ReferenceError: baseclimateselect is not defined
at HTMLDocument. (cameras_init.js:69)
at j (jquery-3.1.1.min.js:2)
at k (jquery-3.1.1.min.js:2)

The baseclimateselect is under the custom_widget folder which is under the conf folder. Should the baseclimateselect folder be under a different folder?

I copied the baseclimateselect.css, baseclimateselect.html and baseclimateselect.js files into the custom_widgets folder from the baseclimateselect folder and all of the widgets are showing correctly however the custom climate_select widget unfortunately doesn’t do anything. I click on the dropdown but nothing happens. I was hoping to use this widget for turning on/off the thermostat. It shows that the thermostat is correctly ‘off’ but I am unable to change the mode through this widget. If you have any ideas why this might not be working please let me know.

Thx

climate

different climate components are setup differently, so its possible that your climate component isnt compatible with this widget.

the climate component needs to have an attribute operation_list
and you need to be able to set the operation with the service climate/set_operation_mode

you can check those things out in you HA devs part.

It is operated that way through a service call -> set_operation_mode. Odd that it wouldn’t be working then.

oke, so you get the operations in the dropdownlist, but it doesnt change when you click on it?
check the js console for errors.
and the ha log also.

so at a glance i dont see why it shouldnt work.

I unfortunately I don’t get the dropdown list. When I click on the dropdown arrow nothing happens. I checked the console (F12) in browser and see no errors nor is there anything in the error logs.

Edit: I should mention all the other widgets work fine

what browser do you use?
it could be that your browser doesnt work correctly with that widget.
i always advice to use google chrome to test if it is working.
and does the widget update when you change the operation mode in home assistant?

Interesting, at first trying chrome seemed to be the answer then I noticed I was having an issue getting the dropdown list to appear a second time when clicking on it. It took several clicks before I could get it to work. I then noticed that clicking on the dropdown arrow wouldn’t work but that I had to click it just under the word (in this case ‘off’). There appears to be a very thin strip where it can be clicked that will show the list. Once I discovered that it now works in both chrome and Vivaldi (browser I am using).

Is there any chance of fixing that so it shows the dropdown arrow is clickable?

btw - thanks for all your help, HaDashboard is a tremendous tool for HA

1 Like

you could try to play with the size from the container.

you can change the css from the select by adding this to your dashboard

container_style: "any valid css"

you can try to change the height, width, top, etc.

edit:

and also the select_style

I used your widget, but using the custom widget i loose in the media players the rewind and forward options… how to have them again with your custom widget?

Thank you for making this very nice widget ! I’m using the media_with_volume widget and it works like a charm. I was wondering if it is possible to change the behaviour of the icon. When i now click on it my media player (in my case a yamaha receiver) is powered off. Is it possible to change this so that it mutes the sound instead off turning off the device ? So just put the media_player.volume_mute on the click.

Hello, I have the same problem as Darbot, but I didn’t found a solution until now, what did I not see? Can somebody explain it to me?

I really dont get where to put the files.
Running on hassio on rpi getting this error message in log:

FileNotFoundError: [Errno 2] No such file or directory: ‘/usr/lib/python3.6/site-packages/appdaemon/widgets/base_media_with_volume.yaml’

in the config dir, where appdaemon.yaml is, you need to create a dir called custom_widgets

the custom_widgets need to be placed in that dir.

So both folders (with subfolders and files)
image

should be placed direcly here?
image

yes indeed. everything that belongs to appdaemon should be in the config from appdaemon.

Ok, now looks like:

image

image