Get_dashboard error

Im getting an error about get_dashboard and I cant seem to figure it out. I can load the dashboards with no skin but as soon as I try a skin I get the server error 500. and in the log I see the below. I seen a mention of container style not found in varaiables, so I added that and that error went away but Im getting this. any help would be greatly appreciated!!!

AD3

2018-03-17 23:24:51.650506 WARNING ------------------------------------------------------------
2018-03-17 23:24:51.650743 INFO function [get_dashboard] finished in 439 ms
Error handling request
Traceback (most recent call last):
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_protocol.py", line 416, in start
    resp = yield from self._request_handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web.py", line 325, in _handle
    resp = yield from handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_middlewares.py", line 93, in impl
    return (yield from handler(request))
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 50, in wrapper
    return await myfunc(*args)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 253, in load_dash
    return web.Response(text=response, content_type="text/html")
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_response.py", line 471, in __init__
    type(text))
TypeError: text argument must be str (<class 'dict'>)

make sure all the variables in the variables.yaml are given correctly.
here you can find all the variables that are needed and how they should look:

it could be that you forgot some quotes

Ahh thank you sir that shed some light. Sorry 2 I caught on easy, i think im just missing some of the broken changes. It looks like some of the sweet custom widgets you put together got renamed and causing issues now. After adjusting that variables file I see some widgets that look like “base” was removed and some other minor changes Ill have to clean up. thanks again bud

2018-03-18 17:21:51.820111 INFO hello_world: Hello from AppDaemon
2018-03-18 17:21:51.821345 INFO hello_world: You are now ready to run Apps!
2018-03-18 17:21:51.821850 INFO AppDaemon: App initialization complete
2018-03-18 17:25:10.856950 INFO Compiling dashboard 'base_lr'
2018-03-18 17:25:15.852587 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.853026 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.853404 WARNING Variable definition not found in CSS Skin variables: $3d_red
2018-03-18 17:25:15.853757 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.854110 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.854493 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.854844 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.855204 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.855577 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.855925 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.856271 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.856612 WARNING Variable definition not found in CSS Skin variables: $3d_red
2018-03-18 17:25:15.856955 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.857303 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.857663 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.858009 WARNING Variable definition not found in CSS Skin variables: $3d_black
2018-03-18 17:25:15.937536 WARNING Variable definition not found in CSS Skin variables: $wunderground_sub_style
2018-03-18 17:25:15.937895 WARNING Variable definition not found in CSS Skin variables: $wunderground_unit_style
2018-03-18 17:25:15.938335 WARNING Variable definition not found in CSS Skin variables: $wunderground_main_style
2018-03-18 17:25:15.938662 WARNING Variable definition not found in CSS Skin variables: $wunderground_sub_style
2018-03-18 17:25:15.939007 WARNING Variable definition not found in CSS Skin variables: $wunderground_widget_style
2018-03-18 17:25:15.950230 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_title_style
2018-03-18 17:25:15.950548 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_title2_style
2018-03-18 17:25:15.950885 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_minvalue_style
2018-03-18 17:25:15.951219 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_maxvalue_style
2018-03-18 17:25:15.951569 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_value_style
2018-03-18 17:25:15.951911 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_slider_style
2018-03-18 17:25:15.952262 WARNING Variable definition not found in CSS Skin variables: $new_input_slider_widget_style
2018-03-18 17:25:16.179286 INFO Loading custom widget 'baseselect'
2018-03-18 17:25:16.180018 INFO Loading custom widget 'media_with_volume.yaml'
2018-03-18 17:25:16.180367 INFO Loading custom widget 'climate_select.yaml'
2018-03-18 17:25:16.180732 INFO Loading custom widget 'basemediaselect'
2018-03-18 17:25:16.181417 INFO Loading custom widget 'baseclimateselect.html'
2018-03-18 17:25:16.181771 INFO Loading custom widget 'new_input_slider.yaml'
2018-03-18 17:25:16.182111 INFO Loading custom widget 'baseclimateselect.js'
2018-03-18 17:25:16.182497 INFO Loading custom widget 'baseclimateselect'
2018-03-18 17:25:16.183187 INFO Loading custom widget 'wunderground.yaml'
2018-03-18 17:25:16.183513 INFO Loading custom widget '._vertical_input_slider.yaml'
2018-03-18 17:25:16.183872 INFO Loading custom widget 'baseclimateselect.css'
2018-03-18 17:25:16.184240 INFO Loading custom widget '._new_input_slider.yaml'
2018-03-18 17:25:16.184593 INFO Loading custom widget 'baseslider_vertical'
2018-03-18 17:25:16.185296 INFO Loading custom widget 'light_with_colorpicker.yaml'
2018-03-18 17:25:16.185639 INFO Loading custom widget 'input_select.yaml'
2018-03-18 17:25:16.186013 INFO Loading custom widget 'basewunderground'
2018-03-18 17:25:16.186729 INFO Loading custom widget 'basemediaselect.yaml'
2018-03-18 17:25:16.187052 INFO Loading custom widget 'base_light_with_colorpicker'
2018-03-18 17:25:16.187741 INFO Loading custom widget 'base_media_with_volume'
2018-03-18 17:25:16.188386 INFO Loading custom widget 'baseslider_new'
2018-03-18 17:25:16.189030 INFO Loading custom widget 'vertical_input_slider.yaml'
2018-03-18 17:25:16.435258 INFO function [get_dashboard] finished in 5584 ms
2018-03-18 17:25:16.799025 INFO HADashboard: New dashboard connected: HADashboard
2018-03-18 17:25:27.215080 INFO Loading custom skin 'skyline'
2018-03-18 17:25:27.222672 INFO Compiling dashboard 'base_lr'
2018-03-18 17:25:27.614296 WARNING ------------------------------------------------------------
2018-03-18 17:25:27.614675 WARNING Unexpected error during DASH creation
2018-03-18 17:25:27.614935 WARNING ------------------------------------------------------------
2018-03-18 17:25:27.616005 WARNING Traceback (most recent call last):
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 807, in get_dashboard
    dash = self._conditional_compile(name, skin, recompile)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 759, in _conditional_compile
    dash = self._get_dash(name, skin, skindir)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 562, in _get_dash
    dash = self._create_dash(name, css_vars)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 444, in _create_dash
    dash, layout, occupied, includes = self._create_sub_dash(name, "dash", 0, {}, [], 1, css_vars, None)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 534, in _create_sub_dash
    self._add_layout(lay, layout, occupied, dash, page, includes, css_vars, global_parameters)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 418, in _add_layout
    widget["parameters"] = self._load_widget(dash, includes, name, css_vars, global_parameters)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 364, in _load_widget
    final_widget = self._merge_styles(final_widget, name)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 193, in _merge_styles
    result[key] = self._merge_styles(widget[key], name)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 198, in _merge_styles
    styles = self._get_styles(widget[key], name, key)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 185, in _get_styles
    result[pieces[0].strip()] = pieces[1]
IndexError: list index out of range

2018-03-18 17:25:27.618942 WARNING ------------------------------------------------------------
2018-03-18 17:25:27.619409 INFO function [get_dashboard] finished in 404 ms
Error handling request
Traceback (most recent call last):
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_protocol.py", line 416, in start
    resp = yield from self._request_handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web.py", line 325, in _handle
    resp = yield from handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_middlewares.py", line 93, in impl
    return (yield from handler(request))
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 50, in wrapper
    return await myfunc(*args)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 253, in load_dash
    return web.Response(text=response, content_type="text/html")
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_response.py", line 471, in __init__
    type(text))
TypeError: text argument must be str (<class 'dict'>)
2018-03-18 17:25:27.630343 INFO HADashboard: Dashboard disconnected

Appdaemon version 3 has some of my custom widgets included. (radial, temperature, vertical_slider (called input_slider) and input_select)
so those can be deleted from the custom widgets.

but you have to rename the slider widget type in your dashboards

alright cool. it looks like its complaining about a coulple variables not being defined when infact they are. I basically copies the variables from my version 2 variables.

I will change out those widgets first, thank you for pointing that out

# Core styles. Reference these wherever possible rather than making custom
# versions of red, green, etc. This will make it easier to quickly change the
# overall pallette of the dashboard just by overriding these variables.

# This file contains the application "defaults".
# IF YOU WANT TO CUSTOMIZE styleS FOR YOUR OWN INSTANCE, DO NOT EDIT THIS FILE.

# ----------------------------------------------------------------------------
# Custom styles instructions
#    1. Create a new directory under custom_css
#    2. copy these files over
#    3. EDIT
#    4. Select the new dir as the "skin" argument of any 
#       dashboards you want to use it
# ----------------------------------------------------------------------------

#
# Custom head includes - should be a YAML List, e.g.:
#
#head_includes:
#  - some include
#  - some other include
#
# Text will be included verbatim in the head section of the doc, use for styles,
# javascript or 3rd party css etc. etc.
#
# It is your responsibility to ensure the HTML is correct
#

head_includes:
 - <! head tags go here ->

#
# Custom body includes - should be a YAML List, e.g.:
#
#body_includes:
#  - some include
#  - some other include
#
# Text will be included verbatim in the body section of the doc, use it for JavaScript
#
# It is your responsibility to ensure the HTML is correct
#

body_includes:
 - <! body tags go here ->

white: "#fff"
red: "#ffffff"
green: "#aaff00"
blue: "#00aaff"
purple: "#aa00ff"
yellow: "#ffff00"
orange: "#ffaa00"

gray_very_dark: "#333"
gray_dark: "#444"
gray_medium: "#666"
gray_light: "#888"
dim_gray: "#696969"
black: "#000000"
sky_blue: "#87CEFA"
dim_gray: "#696969"
white_smoke: "#F5F5F5"
baby_blue: "#1E90FF"

3d_white: "font-weight: bold; color: #ffffff; text-shadow: 0 1px 0 #454545, 0 2px 0 #454545,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.4);"
3d_baby_blue: "font-weight: bold; color: #1E90FF; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #777777, 0 4px 0 #666666,
               0 5px 0 #5555555, 0 6px 0 #444444,
               0 7px 0 #333333, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_sky_blue: "font-weight: bold; color: #87CEFA; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #777777, 0 4px 0 #666666,
               0 5px 0 #5555555, 0 6px 0 #444444,
               0 7px 0 #333333, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_red: "font-weight: bold; color: #ffffff; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_black: "font-weight: bold; color: #000000; text-shadow: 0 1px 0 #454545, 0 2px 0 #454545,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.4);"

#transparent_red: "background-color: rgba(255,0,0,0.4)"
#transparent_black1: "background-color: rgba(0,0,0,0.25)"
#transparent_black2: "background-color: rgba(0,0,0,0.5)"

#Page and widget defaults

# Background style changes the ONLY the texture on the widgets.  There are four styles
# in total; carbon1.jpg, carbon2.jpg, carbon3.jpg and carbon4.jpg
background_style: "333333"
text_style: ""

#These are used for icons and indicators
style_inactive: "color: $gray_light; font-weight: bold; text-shadow: 0px 0px 1px $white, 0 0 1px $white, 0 0 1px $white; letter-spacing: 0.1em"
style_active: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em"
style_active_warn: "line-height: 100%; color: $red"
style_info: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 110%"
style_title: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 120%"
style_title2: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 120%"
new_input_slider_title_style: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 120%"


# Widget Default Definitions

scene_icon_on: fa-square
scene_icon_off: fa-square

does this look correct? my remaining custom widgets.

da@appd:/home/homeassistant/conf/custom_widgets$ ls
baseclimateselect       baseclimateselect.js  base_media_with_volume  media_with_volume.yaml
baseclimateselect.css   basemediaselect       basewunderground        wunderground.yaml
baseclimateselect.html  basemediaselect.yaml  climate_select.yaml

So I cleaned up the widgets and the variable error went away. I also restarted appdaemon though Im getting the get_dashboard error. but I dont see anything stick out now like couldnt create file or anythint

2018-03-18 17:49:31.058559 INFO Loading custom skin 'skyline'
2018-03-18 17:49:31.065694 INFO Compiling dashboard 'base_lr'
2018-03-18 17:49:31.463461 WARNING ------------------------------------------------------------
2018-03-18 17:49:31.463804 WARNING Unexpected error during DASH creation
2018-03-18 17:49:31.464087 WARNING ------------------------------------------------------------
2018-03-18 17:49:31.464653 WARNING Traceback (most recent call last):
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 807, in get_dashboard
    dash = self._conditional_compile(name, skin, recompile)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 759, in _conditional_compile
    dash = self._get_dash(name, skin, skindir)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 562, in _get_dash
    dash = self._create_dash(name, css_vars)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 444, in _create_dash
    dash, layout, occupied, includes = self._create_sub_dash(name, "dash", 0, {}, [], 1, css_vars, None)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 534, in _create_sub_dash
    self._add_layout(lay, layout, occupied, dash, page, includes, css_vars, global_parameters)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 418, in _add_layout
    widget["parameters"] = self._load_widget(dash, includes, name, css_vars, global_parameters)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 364, in _load_widget
    final_widget = self._merge_styles(final_widget, name)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 193, in _merge_styles
    result[key] = self._merge_styles(widget[key], name)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 198, in _merge_styles
    styles = self._get_styles(widget[key], name, key)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/dashboard.py", line 185, in _get_styles
    result[pieces[0].strip()] = pieces[1]
IndexError: list index out of range

2018-03-18 17:49:31.467307 WARNING ------------------------------------------------------------
2018-03-18 17:49:31.467694 INFO function [get_dashboard] finished in 409 ms
Error handling request
Traceback (most recent call last):
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_protocol.py", line 416, in start
    resp = yield from self._request_handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web.py", line 325, in _handle
    resp = yield from handler(request)
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_middlewares.py", line 93, in impl
    return (yield from handler(request))
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 50, in wrapper
    return await myfunc(*args)
  File "/usr/local/lib/python3.6/site-packages/appdaemon/rundash.py", line 253, in load_dash
    return web.Response(text=response, content_type="text/html")
  File "/usr/local/lib/python3.6/site-packages/aiohttp/web_response.py", line 471, in __init__
    type(text))
TypeError: text argument must be str (<class 'dict'>)

mostly if it says the var isnt there, it means that the css is wrong or the var is used to early or on the wrong place, or you try to use a different skin (think about capital use)

if i look at your custom_widgets dir, then i hope that the js,html and css are in the subdirs?
i cant see that from the list :wink:

i dont see any widgets from me anymore so then you use the included ones.

seems like you still have an error in your skin or in your dashboardfile.
to make sure that you have AD working allright, just try this:

  1. create or use a simple dashboard like the hello.dash
  2. load that dashboard in your browser
  3. check for errors, if no errors then your setup is correct
  4. load the simple dashboard with your skin
  5. check for errors, if you have errors its a problem in your skin
  6. load your own dashboard without the skin
  7. if you have errors its your dashboardfile

Of coarse:slight_smile:

Its defintly the skin. I can load the dash fine with no skin. I just tried copying everything from

widget default definitions

and above and it is still complaining. Do you know if there were any breaking changes in the variables? Because I copied that directly from the variable file that is in use now. Working on version2. Ive pasted my whole gigaantic file if you can spot something at a glance. Or I cant see where are you spot the var info in that log to determine the error. I found a few others pretty easy. if theres a line or something i need to look out for it would help me troubleshoot some more:)

da@appd:/home/homeassistant/conf/custom_widgets$ cd baseclimateselect/
da@appd:/home/homeassistant/conf/custom_widgets/baseclimateselect$ ls
baseclimateselect.css  baseclimateselect.html  baseclimateselect.js
da@appd:/home/homeassistant/conf/custom_widgets/baseclimateselect$ cd ..
da@appd:/home/homeassistant/conf/custom_widgets$ 
da@appd:/home/homeassistant/conf/custom_widgets$ cd basemediaselect/
da@appd:/home/homeassistant/conf/custom_widgets/basemediaselect$ ls
basemediaselect.css  basemediaselect.html  basemediaselect.js
da@appd:/home/homeassistant/conf/custom_widgets/basemediaselect$ 
da@appd:/home/homeassistant/conf/custom_widgets/basemediaselect$ cd ..
da@appd:/home/homeassistant/conf/custom_widgets$ 
da@appd:/home/homeassistant/conf/custom_widgets$ cat base_media_with_volume/
cat: base_media_with_volume/: Is a directory
da@appd:/home/homeassistant/conf/custom_widgets$ cd base_media_with_volume/
da@appd:/home/homeassistant/conf/custom_widgets/base_media_with_volume$ ls
base_media_with_volume.css  base_media_with_volume.html  base_media_with_volume.js
da@appd:/home/homeassistant/conf/custom_widgets/base_media_with_volume$ 
da@appd:/home/homeassistant/conf/custom_widgets/base_media_with_volume$ cd ..
da@appd:/home/homeassistant/conf/custom_widgets$ cd basewunderground/
da@appd:/home/homeassistant/conf/custom_widgets/basewunderground$ ls
basewunderground.css  basewunderground.html  basewunderground.js


# Core styles. Reference these wherever possible rather than making custom
# versions of red, green, etc. This will make it easier to quickly change the
# overall pallette of the dashboard just by overriding these variables.

# This file contains the application "defaults".
# IF YOU WANT TO CUSTOMIZE styleS FOR YOUR OWN INSTANCE, DO NOT EDIT THIS FILE.

# ----------------------------------------------------------------------------
# Custom styles instructions
#    1. Create a new directory under css
#    2. copy these files over
#    3. EDIT
#    4. Select the new dir as the "skin" argument of any
#       dashboards you want to use it
# ----------------------------------------------------------------------------

#
# Custom head includes - should be a YAML List, e.g.:
#
#head_includes:
#  - some include
#  - some other include
#
# Text will be included verbatim in the head section of the doc, use for styles,
# javascript or 3rd party css etc. etc.
#
# It is your responsibility to ensure the HTML is correct
#

head_includes:
  - <! head tags go here ->

#
# Custom body includes - should be a YAML List, e.g.:
#
#body_includes:
#  - some include
#  - some other include
#
# Text will be included verbatim in the body section of the doc, use it for JavaScript
#
# It is your responsibility to ensure the HTML is correct
#

body_includes:
  - <!- body tags go here ->
#
# Styles
#

white: "#fff"
red: "#ffffff"
green: "#aaff00"
blue: "#00aaff"
purple: "#aa00ff"
yellow: "#ffff00"
orange: "#ffaa00"

gray_very_dark: "#333"
gray_dark: "#444"
gray_medium: "#666"
gray_light: "#888"
dim_gray: "#696969"
black: "#000000"
sky_blue: "#87CEFA"
dim_gray: "#696969"
white_smoke: "#F5F5F5"
baby_blue: "#1E90FF"

3d_white: "font-weight: bold; color: #ffffff; text-shadow: 0 1px 0 #454545, 0 2px 0 #454545,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.4);"
3d_baby_blue: "font-weight: bold; color: #1E90FF; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #777777, 0 4px 0 #666666,
               0 5px 0 #5555555, 0 6px 0 #444444,
               0 7px 0 #333333, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_sky_blue: "font-weight: bold; color: #87CEFA; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #777777, 0 4px 0 #666666,
               0 5px 0 #5555555, 0 6px 0 #444444,
               0 7px 0 #333333, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_red: "font-weight: bold; color: #ffffff; text-shadow: 0 1px 0 #999999, 0 2px 0 #888888,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.2);"

3d_black: "font-weight: bold; color: #000000; text-shadow: 0 1px 0 #454545, 0 2px 0 #454545,
               0 3px 0 #454545, 0 4px 0 #454545,
               0 5px 0 #4f4f4f, 0 6px 0 #4f4f4f,
               0 7px 0 #575757, 0 8px 7px rgba(0, 0, 0, 0.4),
               0 9px 10px rgba(0, 0, 0, 0.4);"

#transparent_red: "background-color: rgba(255,0,0,0.4)"
#transparent_black1: "background-color: rgba(0,0,0,0.25)"
#transparent_black2: "background-color: rgba(0,0,0,0.5)"

#Page and widget defaults

# Background style changes the ONLY the texture on the widgets.  There are four styles
# in total; carbon1.jpg, carbon2.jpg, carbon3.jpg and carbon4.jpg
background_style: "333333"
text_style: ""

#These are used for icons and indicators
style_inactive: "color: $gray_light; font-weight: bold; text-shadow: 0px 0px 1px $white, 0 0 1px $white, 0 0 1px $white; letter-spacing: 0.1em"
style_active: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em"
style_active_warn: "line-height: 100%; color: $red"
style_info: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 110%"
style_title: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 120%"
style_title2: "$3d_white; font-weight: bold; text-shadow: 1px 1px 4px $black, 0 0 1px $black, 0 0 1px $black; letter-spacing: 0.1em; font-size: 120%"



# Widget Default Definitions

scene_icon_on: fa-square
scene_icon_off: fa-square
scene_icon_style_active: $style_active
scene_icon_style_inactive: $style_inactive
scene_title_style: $style_title
scene_title2_style: $style_title2
scene_widget_style: $background_style
scene_state_text_style: "color: $white"

mode_icon_on: fa-arrows-alt
mode_icon_off: fa-arrows-alt
mode_icon_style_active: $style_active
mode_icon_style_inactive: $style_inactive
mode_title_style: $style_title
mode_title2_style: $style_title2
mode_widget_style: $background_style
mode_state_text_style: "color: $white"

script_icon_on: fa-th-large
script_icon_off: fa-th-large
script_icon_style_active: $style_active
script_icon_style_inactive: $style_inactive
script_title_style: $style_title
script_title2_style: $style_title2
script_widget_style: $background_style
script_state_text_style: "color: $white"

binary_sensor_icon_on: fa-bullseye
binary_sensor_icon_off: fa-minus
binary_sensor_icon_style_active: $style_active_warn
binary_sensor_icon_style_inactive: $style_inactive
binary_sensor_title_style: $style_title
binary_sensor_title2_style: $style_title2
binary_sensor_widget_style: $background_style
binary_sensor_state_text_style: "color: $white"

icon_title_style: $style_title
icon_title2_style: $style_title2
icon_widget_style: $background_style
icon_state_text_style: "color: $white"

device_tracker_icon_on: fa-user
device_tracker_icon_off: fa-user
device_tracker_icon_style_active: $style_active
device_tracker_icon_style_inactive: $style_inactive
device_tracker_title_style: $style_title
device_tracker_title2_style: $style_title2
device_tracker_widget_style: $background_style
device_tracker_state_text_style: "color: $white"

input_boolean_icon_on: fa-sliders
input_boolean_icon_off: fa-sliders
input_boolean_icon_style_active: $style_active
input_boolean_icon_style_inactive: $style_inactive
input_boolean_title_style: $style_title
input_boolean_title2_style: $style_title2
input_boolean_widget_style: $background_style
input_boolean_state_text_style: "color: $white"

switch_icon_on: fa-circle
switch_icon_off: fa-circle-thin
switch_icon_style_active: $style_active
switch_icon_style_inactive: $style_inactive
switch_title_style: $style_title
switch_title2_style: $style_title2
switch_widget_style: $background_style
switch_state_text_style: "color: $white"

lock_icon_on: fa-unlock-alt
lock_icon_off: fa-lock
lock_icon_style_active: $style_active_warn
lock_icon_style_inactive: $style_inactive
lock_title_style: $style_title
lock_title2_style: $style_title2
lock_widget_style: $background_style
lock_state_text_style: "color: $white"

cover_icon_on: fa-arrows-v
cover_icon_off: fa-arrows-v
cover_icon_style_active: $style_active_warn
cover_icon_style_inactive: $style_inactive
cover_title_style: $style_title
cover_title2_style: $style_title2
cover_widget_style: $background_style
cover_state_text_style: "color: $white"

clock_date_style: "color: $white"
clock_time_style: "color: $purple"
clock_widget_style: $background_style

weather_main_style: "color: $orange"
weather_unit_style: "color: $orange"
weather_sub_style: "color: $blue"
weather_widget_style: $background_style

weather_summary_title_style: $style_title
weather_summary_text_style: "font-family: Climacons-Font; font-size: 100px"
weather_summary_state_text_style: "color: $white"
weather_summary_widget_style: $background_style
weather_summary_container_style: ""

london_underground_title_style: "color: $white"
london_underground_text_style: "color: $white"
london_underground_state_text_style: "color: $white;"
london_underground_widget_style: $background_style
london_underground_container_style: ""

label_title_style: $style_title
label_title2_style: $style_title2
label_text_style: "color: $white"
label_state_text_style: "color: $white"
label_widget_style: $background_style
label_container_style: ""

sensor_title_style: $style_title
sensor_title2_style: $style_title2
sensor_value_style: "color: $blue; font-size: 250%"
sensor_text_style: "color: $white; font-size: 100%"
sensor_state_text_style: "color: $white; font-size: 100%"
sensor_unit_style: "color: $blue; font-size: 100%"
sensor_widget_style: $background_style
sensor_container_style: ""

alarm_title_style: $style_title
alarm_title2_style: $style_title2
alarm_state_style: "color: $white; font-size: 100%"
alarm_widget_style: $background_style

reload_icon_active: fa-spinner fa-spin
reload_icon_inactive: fa-refresh
reload_icon_active_style: "color: $white"
reload_icon_inactive_style: "color: $white"
reload_title_style: $style_title
reload_title2_style: $style_title2
reload_widget_style: $background_style

javascript_icon_active: fa-asterisk
javascript_icon_inactive: fa-asterisk
javascript_icon_active_style: "color: $white"
javascript_icon_inactive_style: "color: $white"
javascript_title_style: $style_title
javascript_title2_style: $style_title2
javascript_widget_style: $background_style

navigate_icon_active: fa-spinner fa-spin
navigate_icon_inactive: fa-gear
navigate_icon_active_style: "color: $white"
navigate_icon_inactive_style: "color: $white"
navigate_title_style: $style_title
navigate_title2_style: $style_title2
navigate_widget_style: $background_style


media_player_icon_play: fa-play
media_player_icon_pause: fa-pause
media_player_icon_up: fa-plus
media_player_icon_down: fa-minus
media_player_title_style: $style_title
media_player_media_title_style: $style_title2
media_player_album_style: $style_title2
media_player_artist_style: $style_title2
media_player_icon_style_active: "color: $green"
media_player_icon_style_inactive: "color: $gray_light"
media_player_state_text_style: "color: $white"
media_player_units_style: "color: $white"
media_player_level_style: "color: $white"
media_player_level_up_style: "color: $gray_light"
media_player_level_down_style: "color: $gray_light"
media_player_widget_style: $background_style
media_player_icon_previous: fa-step-backward
media_player_icon_next: fa-step-forward
media_player_icon_style_previous: "color: $gray_light"
media_player_icon_style_next: "color: $gray_light"


light_icon_on: fa-circle
light_icon_off: fa-circle-thin
light_icon_up: fa-plus
light_icon_down: fa-minus
light_title_style: $style_title
light_title2_style: $style_title2
light_icon_style_active: $style_active
light_icon_style_inactive: $style_inactive
light_state_text_style: "color: $white"
light_level_style: "color: $white"
light_unit_style:  "color: $white"
light_level_up_style: "color: $gray_light"
light_level_down_style: "color: $gray_light"
light_widget_style: $background_style

input_number_title_style: $style_title
input_number_title2_style: $style_title2
input_number_minvalue_style: $style_title
input_number_maxvalue_style: $style_title
input_number_value_style: $style_title
input_number_slider_style: "-webkit-appearance: none"
input_number_container_style: ""
input_number_widget_style: $background_style

climate_icon_up: fa-plus
climate_icon_down: fa-minus
climate_title_style: $style_title
climate_title2_style: $style_title2
climate_level_style: "color: $blue"
climate_unit_style: "color: $blue"
climate_level_up_style: "color: $gray_light"
climate_level_down_style: "color: $gray_light"
climate_widget_style: $background_style
climate_level2_style: "color: $blue"
climate_unit2_style: "color: $blue"

group_icon_on: fa-circle
group_icon_off: fa-circle-thin
group_icon_up: fa-plus
group_icon_down: fa-minus
group_title_style: $style_title
group_title2_style: $style_title2
group_icon_style_active: $style_active
group_icon_style_inactive: $style_inactive
group_state_text_style: "color: $white"
group_level_style: "color: $white"
group_level_up_style: "color: $gray_light"
group_level_down_style: "color: $gray_light"
group_widget_style: $background_style
group_unit_style: "color: $white"

iframe_title_style: "$style_title; background-color: rgba(0, 0, 0, 0.5)"
iframe_widget_style: $background_style

alarm_title_style: "color: $blue"
alarm_widget_style: $background_style
alarm_title2_style: $style_title2
alarm_state_style: "color: $white;font-size: 100%"
alarm_panel_state_style: "color: $white"
alarm_panel_code_style: "color: $white"
alarm_panel_background_style: "background-color: $gray_dark"
alarm_panel_button_style: "background-color: $gray_medium"

camera_widget_style: $background_style
camera_title_style: "$style_title; background-color: rgba(0, 0, 0, 0.5)"

gauge_widget_style: $background_style
gauge_title_style: $style_title
gauge_title2_style: $style_title2
gauge_low_value_color: "$blue"
gauge_med_value_color: "$blue"
gauge_high_value_color: "$blue"
gauge_value_bgcolor: "$gray_medium"
gauge_text_color: "$blue"

rss_title_style: $style_title
rss_title2_style: $style_title2
rss_text_style: "color: $blue"
rss_widget_style: $background_style

input_select_title_style: $style_title
input_select_title2_style: $style_title2
input_select_widget_style: $background_style
input_select_select_style: "background-color: #999;color:black"
input_select_container_style: ""

input_slider_icon_up: fa-plus
input_slider_icon_down: fa-minus
input_slider_title_style: $style_title
input_slider_title2_style: $style_title2
input_slider_level_style: "color: $blue"
input_slider_unit_style: "color: $blue"
input_slider_level_up_style: "color: $gray_light"
input_slider_level_down_style: "color: $gray_light"
input_slider_widget_style: $background_style

new_input_number_title_style: $style_title
new_input_number_title2_style: $style_title2
new_input_number_minvalue_style: $style_title
new_input_number_maxvalue_style: $style_title
new_input_number_value_style: $style_title
new_input_number_slider_style: "-webkit-appearance: none"
new_input_number_container_style: ""
new_input_number_widget_style: $background_style

vertical_input_number_title_style: $style_title
vertical_input_number_title2_style: $style_title2
vertical_input_number_minvalue_style: $style_title
vertical_input_number_maxvalue_style: $style_title
vertical_input_number_value_style: $style_title
vertical_input_number_slider_style: ""
vertical_input_number_container_style: ""
vertical_input_number_widget_style: $background_style

light_with_brightness_icon_on: mdi-lightbulb
light_with_brightness_icon_off: mdi-lightbulb
light_with_brightness_title_style: $style_title
light_with_brightness_title2_style: $style_title2
light_with_brightness_slider_style: ""
light_with_brightness_widget_style: $background_style
light_with_brightness_icon_style_active: $style_active
light_with_brightness_icon_style_inactive: $style_inactive

light_with_colorpicker_icon_on: mdi-lightbulb
light_with_colorpicker_icon_off: mdi-lightbulb
light_with_colorpicker_title_style: $style_title
light_with_colorpicker_title2_style: $style_title2
light_with_colorpicker_button_style: ""
light_with_colorpicker_widget_style: $background_style
light_with_colorpicker_icon_style_active: $style_active
light_with_colorpicker_icon_style_inactive: $style_inactive

radial_widget_style: "background: none"

thermo_widget_style: "background: none"

heater_icon_on: fa-fire
heater_icon_off: fa-fire
heater_title_style: $style_title
heater_title2_style: $style_title2
heater_slider_style: ""
heater_widget_style: $background_style
heater_icon_style_active: $style_active
heater_icon_style_inactive: $style_inactive

there is a lot of new stuff in the new variables.yaml.
the best way to go on is this:

  1. copy the variables.yaml from the default (you can find it in your own setup or here: https://github.com/home-assistant/appdaemon/blob/master/appdaemon/assets/css/default/variables.yaml
  2. add all changes you have made in the past and mark them clearly as things that YOU have added or changed.

for now with the many changes you made without marking it, probably the easiest way is to print your own file and check line by line if its there and or different in the new variables.yaml

ahhhhhh :slightly_frowning_face:

lol, just playin. I can do that, sounds like a plan. thank you!

1 Like

dont forget to check in between if you still are errorless :wink:
and dont forget to mark your changes at the same time as well (at the end you might forget some :wink: )

1 Like

good call though. came right up, i forgot all my dashbord.css is what i was worried about losing but i wouldnt to play with the text anyway so this works out. thanks so much for all your hard work and patiencce!

1 Like

i need notes for my notes lol

1 Like

Hi Rene, I am running AD3.0.1(community addon) on Hassio and have read my way through getting the sytem to accept custom widgets - I love your colorpicker and brightness slider widgets - but I seem to be getting an error somewhere and I cannot figure out how to find out what the error is. Something is happening with the colorpicker widget so that it is preventing all widgets after it from rendering. Also, the widget will let me pick a color but it is not controlling the assigned entity at all.

test.yaml:

your_light2:
   widget_type: base_light_with_colorpicker
   entity: light.theatre
   title: Just a
   title2: Light
    
scenes:
    widget_type: navigate
    widget_style: "background: MediumVioletRed"
    title_style: "font-weight: bold"
    title: Scenes
    dashboard: scenes
    icon_active: mdi-palette-advanced
    icon_inactive: mdi-palette-advanced
    
  
layout:
    - your_light2(2x2)
    -
    -

test.dash:

#
# Main arguments, all optional
#
title: Test
widget_dimensions: [122, 127]
widget_margins: [5, 5]
columns: 10
#
# Layout
#    
layout:
    - include: header
    - include: test
    - include: navbar

Have you got any idea what I may have gotten wrong?
edit: ignore the scenes navigate widget - it doesn’t get rendered when added to the yaml but it was just in there for testing.


Here it is in another dash - it blocks everything after it:

and here it that dash without the colorpicker widget:
edit: I did have a regular light widget in here that referenced the same entity - I thought this was the cause of the error initially, but in my colorpicker screenshot, that entity has been removed (lamp & sconces).

I might be on to something, I noticed that I was naming the widgets with “base_” in front of the name (base_light_with_colorpicker) - otherwise the widget gives an unknown widget error - but in the examples on github, all the custom widgets are referenced without the “base_” appended to them (ie. light_with_colorpicker). When I remove the “base_” from the name, I get an error in my log:

2018-04-30 22:18:01.698400 WARNING Unable to find widget type 'light_with_colorpicker'
2018-04-30 22:18:01.698595 WARNING Traceback (most recent call last):
  File "/usr/lib/python3.6/site-packages/appdaemon/dashboard.py", line 308, in _load_widget
    yaml_file, templates = self._do_subs(yaml_path, instantiated_widget, '""')
  File "/usr/lib/python3.6/site-packages/appdaemon/dashboard.py", line 215, in _do_subs
    with open(file, 'r') as fd:
FileNotFoundError: [Errno 2] No such file or directory: '/usr/lib/python3.6/site-packages/appdaemon/widgets/light_with_colorpicker.yaml'

but with the “base_” attached to the name, it shows up in my dashboard like above pictures, only they do no not control any actual entities and they are missing design elements.
without “base_”:


with “base_”:

did you also copy the light_with_colorpicker.yaml file to your custom widgets dir?

1 Like

Ha, that was it, thanks Rene! :flushed:

1 Like