Giter Site home page Giter Site logo

ciotlosm / lovelace-thermostat-dark-card Goto Github PK

View Code? Open in Web Editor NEW
712.0 712.0 189.0 915 KB

🌡 Thermostat card with a round and black feel to it

License: MIT License

JavaScript 4.74% TypeScript 95.26%
custom-cards hacs home-assistant lovelace thermostat

lovelace-thermostat-dark-card's People

Contributors

alexcalderon02 avatar aronsky avatar boesing avatar c727 avatar ciotlosm avatar dependabot[bot] avatar fezvrasta avatar ggets avatar iantrich avatar jackjohnsonuk avatar kra77 avatar kylerw avatar ludeeus avatar minchik avatar misa1515 avatar ofekashery avatar rocka84 avatar sdelliot avatar soberstadt avatar swingerman avatar thomasloven avatar xiidoz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

lovelace-thermostat-dark-card's Issues

Entity filter with special condition

Create a custom card that uses condition instead of filter to determine if the card should display itself or not.

The card should use entities list like rest of cards

Allow config for showing letters under keypad numbers

@davec proposed:

See image of an example security alarm keypad here - https://goo.gl/images/8fKdwb 24

I was trying to suggest that like a PIN number for your credit card you may use a word that translates to numbers on a keypad, such as you would find on some alarm panels and most phones.
Your access card is still a sequence of numbers, the letters on the buttons are simply a reminder of what key is what letter.

Custom color severity on bignumber

Maybe you could add a custom color into severity. For example:

        - type: "custom:bignumber-card"
          title: Bedroom Temperature
          entity: sensor.temperature_bedroom
          severity:
            level1: 0
              - color: #FFF000
            level2: 15
              - color: #F0F0F0   
            level3: 25
              - color: #000000

Just an idea. This is good for setting colors on temperatures sensors (blue for cold levels, red in high temp.)

Lock Card

Thank You for you work!

I would like to ask a new Lock Card!
Something like this

lock-card

Attributes card - allow custom attribute name and entity source

Attributes card allow more custom approach:

- type: custom:entity-attributes-card
  title: Attributes Card
  attributes:
    - key: media_player.bedroom.attributes.app_name
      name: Application
    - key: media_player.bedroom.attributes.media_title
      name: Media center
    - key: climate.bedroom.attributes.current_temperature
      name: Bedroom TV

Card that lists all attributes for a sensor (without specifying them)

A Plex sensor in home assistant produces individual attributes for each user watching. For example:

{
  "jamesk - James Phone": "Hustle (2004) - S8 · E1 - Gold Finger",
  "James_k_wife - BedroomTV": "The Greatest Showman (2017)",
  "unit_of_measurement": "Watching",
  "friendly_name": "My Plex Server",
  "icon": "mdi:plex",
  "name": "Plex"
}

There are other similar sensors where the attribute names aren't fixed, and there are a potentially unknown (large) number of them, so you can't specify them in yaml. Thus I'd like a card that is able to list all attributes for a given entity (with the ability to filter out some specified exclusions, such as friendly name), but without having to list it the attribute names in yaml, since this isn't possible under the circumstances. (In the above example, the could be a third, fourth, fifth person also using the Plex server, theoretically).

Build a card for toggle entities

Build a card for toggle entities to allow just the icon in big format and a custom title underneath.

  • use entity icon by default
  • allow custom icon
  • action should be on/off

Difference from entity-picture with image states is for lights that show color and respect themes

bugs with iOS?

Loving these new cards, and have set up a nice panel for my rooftop solar using the guage and big number cards. Looks awesome, except on my iPhone using both the HA app and Safari.

On loading up the Lovelace UI, I get a big red box with the following message:

n.setConfig is not a function. (In 'n.setConfig(t)', 'n.setConfig' is undefined

Under that is just the usual settings for the card. This is happening for all 5 cards I have added using guage and big number cards.

In the backend for HA in the error log, I have the following for each card:

2018-07-18 10:21:18 ERROR (MainThread) [frontend.js.es5.201807080] https://ha.smns.me/local/bignumber-card.js?v=1:2:14 TypeError: Cannot call a class constructor without |new|

Sometimes Monster Cards Show Blank

I have noticed this odd issue with my monster cards that show up as blank until I hit "refresh" when coming from another tab. I am using Chrome 67 on Windows 10, have also cleared cache but the issue keeps coming back. This is what it looks like:

monster-blank

This is what my configuration looks like, don't want to crowd the space so linking to my github:

https://github.com/dshokouhi/Home-AssistantConfig/blob/master/ui-lovelace.yaml#L459

associated error:

2:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1 Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode
    at Object.<anonymous> (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at Generator.next (<anonymous>)
    at n (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at self.babelHelpers.asyncToGenerator (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at new Promise (<anonymous>)
    at Object.self.babelHelpers.asyncToGenerator (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at Object.workbox.core.j.fetch (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at :8123/frontend_latest/workbox-v3.3.0/workbox-strategies.prod.js:1
    at Generator.next (<anonymous>)
    at n (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
2:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1 Uncaught (in promise) TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode
    at Object.<anonymous> (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at Generator.next (<anonymous>)
    at n (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at self.babelHelpers.asyncToGenerator (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at new Promise (<anonymous>)
    at Object.self.babelHelpers.asyncToGenerator (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at Object.workbox.core.j.fetch (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)
    at :8123/frontend_latest/workbox-v3.3.0/workbox-strategies.prod.js:1
    at Generator.next (<anonymous>)
    at n (:8123/frontend_latest/workbox-v3.3.0/workbox-core.prod.js:1)

Card tracker does not update ui-lovelace on hassio

Card tracker does not update ui-lovelace on hassio. It shows it's updated but on refresh / check it goes back to old version. Also the sed temporary file is not written, so maybe a permissions problem.

Bignumber to support meter style background

Card that fills with color meter-style horizontally or vertically. Maybe as an option for bignumber? Could be used together with horizontal stacks to create a row of meters or combined with gauges and bignumber.

Greeter card

A Personal greeter card that shows calendar events from calendar sensor and time of day and any additional sensor that the user wants

dynamic backgrounds from unsplash using their api lib already available

https://github.com/unsplash/unsplash-js

got a mock card layout as a suggestion

image

Feature Request: Status panel/card

I was thinking it would be really neat if we could have a card that only shows up when entity-filter cards defined underneath have no entities and have show_empty: false defined. Think of it as a user who wants to place all safety/security items in entity-filters. Let's say I have a few different filters setup to show if the house detected leaks, smoke detectors going off, doors/windows open or unlocked, alarm tripped etc... If none of those entities are shown the panel/card would show a green check mark or whatever the user defined. This would allow for a quick check on the status of items with user friendly feedback that all is well.

Alarm card doesn't show keypad

The alarm card does not show the keypad because it is checking if code_format return type is a Number. Many panels that exist in the current components for homeassistant return code_type as a string regex.

Alarm card: allow "auto enter" after set number of digits

After a configured number of digits are entered, say 4, automatically call the service with the code. Allow the user to press "away", "home", etc before code is submitted and that becomes the arm type that is sent with the code.

Example config:
auto_arm_length: 4
default_auto_arm: arm_away

Example UX:
User presses "Arm home" (this changes from the default arm_away)
User presses 4 digits and after pressing the 4th digit service is called with arm_home and the 4 digits.
Text field clears, arm_away set as default button again. Card updates according to whatever state changes as it does now.

Monster-card exclusion not working with filter.options

Using the config below with some automations sharing the name will result in exclusion not being applied correctly.

      - type: custom:monster-card
        filter:
          include:
            - name: '*bedroom*'
               options:
                 secondary_info: last-changed
            - name: '*bedside*'
          exclude:
            - domain: automation
        card:
          type: entities
          title: Bedroom
          show_header_toggle: false

Probably due to #45

cc: @minchik

Beast card - Unused entities clone

Allow a new card that would:

  • reverse all monster card filters to show everything else that is not matching
  • use current unused entities card to filter down even more
  • allow extra filtering to avoid showing automations or groups for example

_getEntities is not defined for Monster card

receiving

https://my.url.com/local/monster-card.js?v=1:60:33 Uncaught ReferenceError: _getEntities is not defined

using:

      - type: "custom:monster-card"
        show_header_toggle: false
        show_empty: false
        card:
          title: Eating power
        filter:
          include:
            - domain: light
              entity_id: '*lamp'
              state: 'on'
            - domain: light
              state: 'on'
              entity_id: "*_level"
            - domain: switch
              state: 'on'
              entity_id: "*_switch"
            - domain: fan
              state: 'on'
          exclude:
            - domain: switch
              entity_id: "*modem*"
        

if I comment out the exclude, it works fine.

Create entity-attributes-card

Create entity-attributes-card:

  • allow choosing attributes to display
  • allow renaming attributes
  • allow renaming card

Attributes should show on card as a table with alternating color rows

Beer card

A card that displays a multiline text in a nicer format and allows for a custom icon either from sensor or specified in the config or if both missing, shows a mdi:beer.

unknown

Sample input

The Great Deciever West Coast Beersmiths
Flyktsoda IPA Omnipollo
Magic #411  Omnipollo
Hilma Omnipollo
Original Ice Cream Pale Ale Omnipollo
Milkshake IPA (Strawberry) Omnipollo
Half & Half Lemonade Iced Tea IPA Evil Twin Brewing
Habanero Sculpin Ballast Point Brewing Company

update to 3.0 requires a code to alarm/de-arm

Currently have and Arlo base station (hub for security cameras) and it appears that the arm/disarm function will only work if you enter some code (any keystroke)... event tho one it is not required/used at the moment. I have set the "hide_keypad: true" and it still requires something and provides the field to do so. It can be a single entry and can be run from the services section.

FR: Option to filter on attributes.

It would be great to ba able to filter entities based on attributes.
Some usecases for it:
I have a custom_component to interact with ha-dockermon
This component and many others add attributes with info to make them differentiate from the others:
image
with an attribute filter, users could easy filter on icon, component, version :)

For device_trackers there is a source attribute that would be good for filtering.

idea for filtering:

- type: custom:monster-card
  card:
    type: glance
    title: Monster
  filter:
    include:
      - attribute: icon
        state: 'mdi:docker'

Big numbner .. too big

I think the numbers are a bit too big. Definetely there is a bug when in horizontal stack you put 3 cards: in portait mode the third number is cutoff, in landscape is totally absent

Correct alarm docs

Currently mentions only alarm_control_panel.manual, but should say any alarm in domain alarm_control_panel

Probably A Config Issue

Should this config be valid? The state bit from the prior entity-filter wasn't mentioned for monster-card but I assume it supports similiar.

    - type: "custom:monster-card"
      card:
        type: entities
        title: On
      filter:
        include:
          - domain: light
            state: 'on'
          - domain: switch
            state: 'on'
        exclude:
          - entity_id: "*undercounter*"
          - entity_id: switch.outside_front
          - entity_id: switch.outside_lights
          - entity_id: switch.dryer_switch
          - entity_id: switch.washer_switch

This generates an error:
local/monster-card.js:52:46 Uncaught TypeError: Cannot read property 'filter' of undefined

I assume this is just a configuration issue on my part but there wasn't sufficient examples for me to see what I might be doing wrong.

EDIT:
Rereading the docs it sounds like entity_id, state, and domain may be mutually exclusive under filters. I tried the following but got the same error:

        include:
          - state: 'on'

Allow calculation within filter/state

Example:

    - type: "custom:monster-card"
        show_empty: false
        card:
          title: Low Battery
          show_header_toggle: false
        filter:
          include:
            - domain: sensor
              entity_id: '*battery*' 
              state: < 20     

Coordinates for floorplan

Create a custom component that can:

  • display cursor coordinates in % when on top of images
  • can create a floating div with the coordinate on click that users can copy/paste

input_select inside vertical-stack-in-card behaves oddly

If any card inside a vertical-stack-in-card contains an input_select entry, it will keep flashing (there's a short animation as the input_select loads, and it will keep running).

This seems to be because setConfig of all child cards are called frequently (every time the hass property is updated?).

I'm not really up to speed on how things are supposed to work, but the docs tells me that setConfig should be run rarely. I believe the problem can be fixed by moving the line
root.childNodes[index].setConfig(item) from the set hass() statement to the setConfig() function in vertical-stack-in-card.js.
At least that seems to work for me.

I did not make a pull request, because I do not know WHY the setConfig call is where it is currently. Perhaps it needs to be there to update child cards in configurations I have not encountered?

Improve versioning for users

Add versioning to cards. This should permit users to:

  • Find out when new versions are out
  • Get a change-log of updates
  • Allow for easier cache busting than manual ?v=X

plan-coordinates: floating box with values

If I want to have multiple floorplans in one card, it's impossible to read top/left values as they show just under the top panel and floorplan is further below, need of scrolling.

Would be great if box could just float and be visible all the time

Colors/icons for alarm card

As discussed on Discord, we should probably change the colors on the card to make them in line with the standard practice. I am attaching a few examples that I found online that should make the color choices clear:

image
image
image

Looks like Green for disarmed, Amber for Home/Night, and Red for Armed is the way to go.

Padlocks (open/close) with the right colors should be perfect for icons.

Cannot get entity attributes card to work :(

Hello everyone! I've been trying for a couple of days without success get this useful custom card to work.

I want to create a cart just for the vacuum, but I get this:

image

This is my code:

- type: entities
  title: Aspirador
  show_header_toggle: no
  entities:
    - switch.aspirador
    - sensor.xiaomi_status
    - sensor.xiaomi_battery_level
    - input_select.estados_de_succao
    - input_select.zonas_de_aspiracao
    - type: custom:entity-attributes-card
      entity: vacuum.aspirador
      attributes:
        - key: vacuum.aspirador.do_not_disturb
          name: "Não perturbe"
        - key: vacuum.aspirador.cleaning_time
          name: "Tempo limpando"
        - key: vacuum.aspirador.cleaned_area
          name: "Área limpa"
        - key: vacuum.aspirador.main_brush_left
          name: "Escova principal"
        - key: vacuum.aspirador.side_brush_left
          name: "Escova lateral"
        - key: vacuum.aspirador.filter_left
          name: "Filtro"

Here is the list of all attributes:

status: Charging
battery_level: 100
battery_icon: mdi:battery-charging-100
fan_speed: Balanced
fan_speed_list: Quiet,Balanced,Turbo,Max
do_not_disturb: off
do_not_disturb_start: 22:00:00
do_not_disturb_end: 08:00:00
cleaning_time: 2
cleaned_area: 2
cleaning_count: 39
total_cleaned_area: 222
total_cleaning_time: 302
main_brush_left: 294
side_brush_left: 194
filter_left: 144
friendly_name: Aspirador
supported_features: 2047

Did I miss something here?

Thanks a lot!

Entities not showing up in order they are matched

Example:

    - type: custom:monster-card
      card:
        type: entities
      filter:
        include:
          - entity_id: sensor.automations_on
          - entity_id: sensor.automations_all
          - entity_id: automation.*

This will list all automations, followed by sensor.automations_all and sensor.automations_on.

I assume entities are displayed in alphabetical order. In order of matching by include list would be more intuitive and homogenized with how other cards work.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.