Home Assistant - Het Swiss Army Knife Beta FEEDBACK topic

[d-vine]

Mars Warrior schreef op donderdag 23 juni 2022 @ 12:14:
[...]

Dat is gek dat je een verschil ziet op browser en mobiel, want beiden zijn een webview.

Het kan zijn dat je de cache van je Companion App moet legen, want die onthoud op de een of andere manier vaak oude views is mijn eigen ervaring.

De sliders hebben een kleine touch area, om te voorkomen dat je per ongeluk de slider wijzigt: dus enkel de thumb kun je aanraken. Op mijn iPhone gaat dat zonder problemen.

De voorbeelden die je nu gebruikt hebben een 3D look: de schaduwen zorgen voor een performance hit. Die is erger op een iPhone dan op een Android toestel.

Een gewoon plat design (zit in andere voorbeelden) zal betere performance laten zien.

Ik heb een Pixel 6 Pro trouwens zou goed moeten werken.
Heb de hele chache / opslag gewist maar mocht niet baten...

volgens mij gaat er bij mij ook wat fout met de vertical-stack card.
de 3 buttons boven zie ik niet en ook laatste gedeelte niet wat daar gebruik van maakt...

ik heb nu 3 versies geprobeerd in de resources.yaml maar elke keer na herstart veranderd er niets...

code:

# VV
#- url: /community_plugin/vertical-stack-in-card/vertical-stack-in-card.js
#  type: js
- url: /hacsfiles/vertical-stack-in-card/vertical-stack-in-card.js
  type: js  
#- url: /hacsfiles/vertical-stack-in-card/vertical-stack-in-card.js
#  type: module

met redownload krijg ik deze melding




EDIT:

als ik

code:

    - type: horizontal-stack
      cards:
        ##- !include card-blank-card.yaml
        # Example 44T::

als ik de horizontal aanpas naar vertical dan komen de buttons onder elkaar en wat groter.
En op mijn mobiel komt ook alles goed in beeld met de juiste sliders etc..

dus de plugin werkt wel maar ergens anders gaat wat fout maar misschien kun jij dat beter beoordelen in de code dat is mij nog een beetje te ver van bed

[Voor 11% gewijzigd door d-vine op 23-06-2022 13:00]

[Mars Warrior]

d-vine schreef op donderdag 23 juni 2022 @ 12:42:
[...]


Ik heb een Pixel 6 Pro trouwens zou goed moeten werken.
Heb de hele chache / opslag gewist maar mocht niet baten...

volgens mij gaat er bij mij ook wat fout met de vertical-stack card.
de 3 buttons boven zie ik niet en ook laatste gedeelte niet wat daar gebruik van maakt...

ik heb nu 3 versies geprobeerd in de resources.yaml maar elke keer na herstart veranderd er niets...

code:

# VV
#- url: /community_plugin/vertical-stack-in-card/vertical-stack-in-card.js
#  type: js
- url: /hacsfiles/vertical-stack-in-card/vertical-stack-in-card.js
  type: js  
#- url: /hacsfiles/vertical-stack-in-card/vertical-stack-in-card.js
#  type: module

met redownload krijg ik deze melding

[Afbeelding]

Pixel 6 Pro moet inderdaad icm companion app geen enkel probleem geven.

De vertical-stack-in card heb ik nog nooit gebruikt. Ik gebruik altijd de normale vertical en horizontal-stack kaarten. Het zou wel vreemd zijn als dat de oorzaak is, want een kaart is een kaart. Ook mijn kaart volgt de standaard opzet van een custom-card.

@d-vine , mooi dat het nu werkt. HA kent zoveel kaarten dat het bijna onmogelijk is om alle combinaties te proberen, en er dus ook vrremde dingen kunnen gebeuren.

Wie weet valt er wat te achterhalen ja voor mij…

[Voor 7% gewijzigd door Mars Warrior op 23-06-2022 13:25]

[d-vine]

Mars Warrior schreef op donderdag 23 juni 2022 @ 13:00:
[...]

Pixel 6 Pro moet inderdaad icm companion app geen enkel probleem geven.

De vertical-stack-in card heb ik nog nooit gebruikt. Ik gebruik altijd de normale vertical en horizontal-stack kaarten. Het zou wel vreemd zijn als dat de oorzaak is, want een kaart is een kaart. Ook mijn kaart volgt de standaard opzet van een custom-card.

@d-vine , mooi dat het nu werkt. HA kent zoveel kaarten dat het bijna onmogelijk is om alle combinaties te proberen, en er dus ook vrremde dingen kunnen gebeuren.

Wie weet valt er wat te achterhalen ja voor mij…

vertical-stack-in card ik heb deze even uitgezet en wil clean testen maar dat gaat nog niet goed.
Ik ga later nog keer induiken wil het liefst zo clean mogelijk jou examples werkend hebben voor ik verder ga.

Later deze week ga ik wel even verder en als ik tips heb voor beter voorbeelden / uitleg zal ik je er mee helpen als andere dat ook doen komt er vast en zeker een mooi compleet pakket uit

[Mars Warrior]

d-vine schreef op donderdag 23 juni 2022 @ 14:03:
[...]


vertical-stack-in card ik heb deze even uitgezet en wil clean testen maar dat gaat nog niet goed.
Ik ga later nog keer induiken wil het liefst zo clean mogelijk jou examples werkend hebben voor ik verder ga.

Later deze week ga ik wel even verder en als ik tips heb voor beter voorbeelden / uitleg zal ik je er mee helpen als andere dat ook doen komt er vast en zeker een mooi compleet pakket uit

Mooi!

Ik heb ondertussen wat zitten experimentern in de handleiding met HTML en CSS om een grid (kolommen) te krijgen en dat lukt op deze manier. Ik gebruik niet de betaalde insiders versie, dus moet dat zelf voor elkaar zien te krijgen, maar dat kan dus.

Daarmee kan ik dus bijv. in de linker kolom een stuk YAML zetten, en in de rechter kolom het resulterende plaatje als kaart. Daarmee kan ik dus in een paar stappen laten zien hoe je een kaart met een cirkel, icon en state erin krijgt...

[Mars Warrior]

Ik heb ff wat online gezet als eerste aanzet voor "10 step tutorials".

https://swiss-army-knife-...basic-10-step-tutorial-1/



Ik denk wel dat dit gaat helpen.

Naast de basic kunnen er ook advanced 10 step tutorials worden toegevoegd die wat complexere dingen laten zien. Maar altijd in 10 stappen dus!

[Voor 36% gewijzigd door Mars Warrior op 23-06-2022 19:21]

[d-vine]

Ik ga ook een voorstel doen om naast de button tutorials hem anders in te vliegen voor een beter copy, paste, edit gehalte.

Ik probeer even je hele project voor je uit te zoomen en hopelijk met mijn uitleg hieronder toegankelijker maken voor iedereen.
Misschien kunnen andere gebruikers ook reageren op dit idee of tips geven.
En het is maar een persoonlijk idee als zaken technisch niet kunnen is het mijn onwetendheid.

Ik zelf kom over van fibaro na 10 jaar en heb HA paar maanden draaien gewoon standaard via het dashboard en al mijn automations zitten nu in node-red.
Eigenlijk is het lovalace yaml nog redelijk nieuw maar al doende leert men en redelijk snel ga ik dit ook begrijpen.
Maar dit is wel een mooie test case om het voor jou te laten zien het op aantal punten nog lastig is om deze mooie dashboard voor iedereen toegankelijk te maken.
Probleem van mij is natuurlijk ook dat ik een aantal basis zaken onder de knie moet krijgen maar dat gaat wel de goede kant op.
Misschien kan er een verwijzing gemaakt worden naar een aantal basis zaken. maar het kan ook te veel zijn dat snap ik

Met fibaro was ik niets anders gewend dat de pure hardcore programmeurs mooie LUA scripts geschreven en een user die met een aantal id’s (hier entity’s) konden aanpassen waarna iets werkte. Dit deed ik dus 9 jaar geleden al (dat is sinds relatief korte tijd op HA ook met blueprints)
Maar deze gedachte van een blueprint is wel een mooie basis om een eerste standaard voor iedereen neer te zetten.

Ik loop nog steeds tegen het probleem aan dat de buttons op mijn mobiel er anders uit ziet en niet lekker werken
Heb nu een SAKE2 omgebouwd naar een extra test sectie voor mijzelf en deze helemaal uitgekleed met alleen 2 buttons om te testen helaas nog zonder effect.

Ergens krijg ik ook niet alle buttons nog te zien van de voorbeelden.
Bijvoorbeeld bij SAKE10 zie ik maar 3 buttons (rechts links boeken kast) en de rest niet terwijl de code wat anders zegt. Dus al die sensors cards zie ik niet net als de rest van SAKE2 ,4 en 8 ook niet
ik weet niet of andere hier ook last van hebben en zelf snap ik niet waarom niet misschien weet jij het.

Als ik weet waarom ik sensoren buttons niet zie of hoe te zoeken naar het probleem kan ik je wel helpen voor de uitleg beter te maken...


Ik ben van mening dat je zelf al een heleboel mooie buttons hebt gemaakt die gebruikers zo willen inzetten door middel van copy paste.
Mijn voorstel zou ook zijn om naast je tutorials een sectie te maken met al je buttons die je al hebt gemaakt en in je voorbeelden de daarbij behorende code bij te zetten om te kopiëren.
(In het begin heb ik ook gespeeld met de Homekit panel card en daar staan ook veel voorbeelden zodat het toegankelijker wordt. https://github.com/DBuit/Homekit-panel-card)
Enige is dat dit bijna standaard buttons zijn en jij alles custom hebt.

Dus bv.
Button 1 > complete code (copy this)
Button 2 > complete code (copy this)

Hierdoor maak je het voor iedereen toegankelijk en kunnen ze zo kiezen welke button ze daarvoor willen gebruiken.
Power users kunnen de buttons aanpassen, nieuw maken en deze aan jou leveren die jij weer in je button sectie op de webpagina zet zodat de minder ervaren gebruikers deze toch kunnen inzetten en zo kan na verloop van tijd dit hele scale worden uitgebreid.
Met de Airvisual en weather ging het perfect met een paar zetten had je de kaart en die snelheid zou ook met buttons moeten kunnen ook al is het een code copy/ pasten.

Misschien is een eerste opzet zoals hieronder een idee. Deze opzet met extreme uitleg heb ik altijd bij Fibaro gezien met de LUA code dus het is niet mijn idee maar wel heel werkbaar voor bijna iedereen
waar in bepaalde gedeelten mensen zo een aantal buttons in kunnen plakken aanpassen en gebruiken.
Ik heb dit voor mezelf ook gedaan om alles goed te begrijpen en onder de knie te krijgen maar het helpt wel voor het overzicht waar wat moet komen ook voor een beginnende user.

code:

#
# View          : view-sake2
# Project   : Home Assistant / Swiss Army Knife custom card.
# Repository: https://github.com/AmoebeLabs/swiss-army-knife-card
#
# Author    : Mars @ AmoebeLabs.com
# 
# License   : CC BY-SA, https://creativecommons.org/licenses/by/4.0/
#
# -----
# Description:
#
#
# Refs:
#   
# Theme colors are replaced with hardcoded colors:
# - theme-gradient-color-01: '#FFF6E3'
# - theme-gradient-color-02: '#FFE9B9'
# - theme-gradient-color-03: '#FFDA8A'
# - theme-gradient-color-04: '#FFCB5B' 
# - theme-gradient-color-05: '#FFBF37' 
# - theme-gradient-color-06: '#ffb414' 
# - theme-gradient-color-07: '#FFAD12' 
# - theme-gradient-color-08: '#FFA40E' 
# - theme-gradient-color-09: '#FF9C0B' 
# - theme-gradient-color-10: '#FF8C06' 
# - theme-gradient-color-11: '#FF8305' 
#
###############################################################################

##############################################################################################################################################################
##                              TEST / BLUEPRINT SAKE CARD LIGHTS
##                              COPY YOUR LIGHT, SENSOR BUTTONS IN SECTION COPY HERE BUTTONS
##############################################################################################################################################################


title: sake43-test
path: sake43-test
panel: false
theme: 'NM - Gonsboro'
cards:
##############################################################################################################################################################
##############################################################################################################################################################
##                               BEGIN TO COPY YOUR BUTTONS HERE BELOW
##############################################################################################################################################################
##############################################################################################################################################################



##############################################################################################################################################################
##                               BEGIN SECOND BUTTON TEST    >>>>  BEGIN COPY BUTTON
##############################################################################################################################################################
    - type: horizontal-stack
      cards:
        - type: 'custom:swiss-army-knife-card'

          entities: 
            ## CHANGE ENTITY BELOW FOR LIGHT, CHANGE NAME AND AREA FOR YOUR NEEDS
            - entity: light.light_achter_bank      
              name: Light Bank
              area: Woonkamer
              ## CHANGE mdi ICON TO YOUR NEEDS
              icon: mdi:floor-lamp-dual
            ## CHANGE ENTITY BELOW FOR LIGHT, CHANGE NAME AND AREA FOR YOUR NEEDS
            - entity: light.light_achter_bank
              name: Light Bank
              area: Woonkamer
              ## CHANGE mdi ICON TO YOUR NEEDS
              icon: mdi:floor-lamp-dual
              attribute: brightness
              unit_of_measurement: "%"

          aspectratio: 1/1
          dev:
            debug: false
          
          layout:
            styles:
              card:
              toolsets:
                filter: url(#nm-1)
            toolsets:
              # ==============================================================================
              # Menu for more-info. Use third entity for this now...
              - toolset: menu
                position:
                  cx: 50
                  cy: 50
                tools:
                  - type: icon
                    position:
                      cx: 10
                      cy: 10
                      align: center
                      icon_size: 15
                    entity_index: 0
                    icon: mdi:dots-vertical
                    user_actions:
                      tap_action:
                        haptic: success
                        actions:
                          - action: more-info
                    styles:
                      icon:
                        fill: var(--primary-text-color)
              
              # Using Neumorphic ligth button design
              - toolset: light-button
                template:
                  name: toolset_light_button_slider3_nm
                position:
                  cx: 50
                  cy: 50

              - toolset: slidertest3
                position:
                  cx: 50
                  cy: 50
                tools:
                  - type: slider
                    descr: '#3 test slider'
                    position:
                      cx: 50
                      cy: 81
                      capture:
                        width: 90
                        height: 15
                      track:
                        width: 90
                        height: 4
                        radius: 1
                      thumb:
                        width: 5
                        height: 5
                        radius: 2.5
                      label:
                        # placement can be none, thumb, position (cx,cy)
                        placement: position
                        cx: 83
                        cy: 17
                    entity_index: 1
                    derived_entity:
                      input : '[[[ return state ]]]'
                      state: >
                        [[[
                          if (typeof(entity) === 'undefined') return;
                          if (typeof(state) === 'undefined') return;
                          
                          var bri = Math.round(state / 2.55);
                          return (bri ? bri : '0');
                        ]]]
                      unit: >
                        [[[
                          if (typeof(state) === 'undefined') return undefined;
                          return '%';
                        ]]]
                    user_actions:
                      drag_action:
                        update_interval: 200          # Update every 200msec
                        haptic: selection
                        actions:
                          - action: call-service
                            service: light.turn_on
                            parameter: brightness_pct
                      tap_action:
                        haptic: light
                        actions:
                          - action: call-service
                            service: light.turn_on
                            parameter: brightness_pct
                    scale:
                      min: 1
                      max: 100
                      step: 1
                      steps: '[1,2,5,6,7,8,9,20]'
                      stepsnew:
                        - stop: 0
                          step: 1
                        - stop: 10
                          step: 5
                    styles:
                      label:
                        text-anchor: middle
                        font-size: 10em
                        font-weight: 600
                      track:
                        fill: url(#sak-light-color-temperature-gradient)
                        fill-opacity: 1
                        stroke-width: 0.1em
                        stroke: white
                      thumb:
                        stroke-width: 1.2em
                        stroke: var(--primary-background-color)
                        stroke-opacity: 1
                        fill: var(--primary-text-color)
                        fill-opacity: 0.8
                        
##############################################################################################################################################################
##                            END SECOND BUTTON TEST >>>>  END COPY BUTTON
##############################################################################################################################################################




##############################################################################################################################################################
##                            BEGIN THIRD BUTTON TEST >>>>  BEGIN COPY BUTTON
##############################################################################################################################################################
        - type: 'custom:swiss-army-knife-card'
           
          entities:
            ## CHANGE ENTITY BELOW FOR LIGHT, CHANGE NAME AND AREA FOR YOUR NEEDS          
            - entity: light.light_tv_woonkamer
              name: Light TV
              #area: Woonkamer
              icon: mdi:wall-sconce
            ## CHANGE ENTITY BELOW FOR LIGHT, CHANGE NAME AND AREA FOR YOUR NEEDS
            - entity: light.light_tv_woonkamer
              name: Light TV
              #area: Woonkamer
              icon: mdi:floor-lamp-dual
              attribute: brightness
              unit_of_measurement: "%"

          aspectratio: 1/1
          dev:
            debug: false
          
          layout:
            styles:
              card:
              toolsets:
                filter: url(#nm-1)
            toolsets:
              # ==============================================================================
              # Menu for more-info. Use third entity for this now...
              - toolset: menu
                position:
                  cx: 50
                  cy: 50
                tools:
                  - type: icon
                    position:
                      cx: 10
                      cy: 10
                      align: center
                      icon_size: 15
                    entity_index: 0
                    icon: mdi:dots-vertical
                    user_actions:
                      tap_action:
                        haptic: success
                        actions:
                          - action: more-info
                    styles:
                      capture:
                        opacity: 0
                      icon:
                        fill: var(--primary-text-color)
              
              # Using Neumorphic ligth button design
              - toolset: light-button
                template:
                  name: toolset_light_button_slider_nm
                position:
                  cx: 50
                  cy: 50

              - toolset: slidertest3
                position:
                  cx: 50
                  cy: 50
                tools:
                  - type: slider
                    descr: '#3 test slider'
                    position:
                      cx: 50
                      cy: 81
                      capture:
                        width: 90
                        height: 15
                      track:
                        width: 90
                        height: 2
                        radius: 1
                      active:
                        width: 90
                        height: 2
                        radius: 1
                      thumb:
                        width: 7
                        height: 7
                        radius: 3.5
                      label:
                        # placement can be none, thumb, position (cx,cy)
                        placement: position
                        cx: 83
                        cy: 17
                    entity_index: 1
                    show:
                      active: true
                    derived_entity:
                      input : '[[[ return state ]]]'
                      state: >
                        [[[
                          if (typeof(entity) === 'undefined') return;
                          if (typeof(state) === 'undefined') return;
                          
                          var bri = Math.round(state / 2.55);
                          return (bri ? bri : '0');
                        ]]]
                      unit: >
                        [[[
                          if (typeof(state) === 'undefined') return undefined;
                          return '%';
                        ]]]
                    user_actions:
                      drag_action:
                        update_interval: 200          # Update every 200msec
                        haptic: selection
                        actions:
                          - action: call-service
                            service: light.turn_on
                            parameter: brightness_pct
                      tap_action:
                        haptic: light
                        actions:
                          - action: call-service
                            service: light.turn_on
                            parameter: brightness_pct
                    scale:
                      min: 1
                      max: 100
                      step: 1
                      # Note: Experimental. Not used yet... (steps and stepsnew...)
                      steps: '[1,2,5,6,7,8,9,20]'
                      stepsnew:
                        - stop: 0
                          step: 1
                        - stop: 10
                          step: 5
                    styles:
                      toolset:
                        overflow: visible
                      tool:
                        overflow: visible
                      label:
                        text-anchor: middle
                        font-size: 10em
                        font-weight: 600
                      active:
                        fill: orange
                      track:
                        fill-opacity: 1
                        filter: url(#is-1)
                        fill: var(--primary-background-color)
                      thumb:
                        stroke-width: 3em
                        stroke: var(--primary-background-color)
                        fill: var(--primary-text-color)
                        filter: url(#filter)
##############################################################################################################################################################
##                            END  THIRD BUTTON TEST  >>>>  END COPY BUTTON
##############################################################################################################################################################

met deze uitgeklede code heb ik 2 buttons die in de webbrowsers goed werken.
maar niet goed werken in de android app.
zie wel 2 grote buttons maar niet 2 verschillende iconen. en kan alleen de onderste goed bedienen en sliders werken niet.

[Koepert]

Ik volg je uitleg wel, dat schurkt heel erg aan hoe de pagina’s van UI Minimalist zijn opgebouwd trouwens.

Zie hier : https://ui-lovelace-minim...usage/cards/card_battery/

Voorbeeld snippet en uitleg over de variables. Daarnaast alle pages met hoe je installeert etcetera. Wellicht niet en 1 op 1 kopie wenselijk maar wellicht een hulplijn.

[Mars Warrior]

Het gebruik van kaarten met een vaste functie is altijd een stuk eenvoudiger te beschrijven dan als je enkel een set van tools hebt zoals een timmerman, die met dat materiaal en zijn tools allerhande dingen kan bouwen.

Ik heb nu een viertal 10 steps or less tutorials online staan: die laten zien hoe je een simpele kaart maakt, toolsets kan dupliceren, hoe je een template maakt van zo'n toolset, en hoe je deze dan kunt gebruiken.

Die laatste tutorial is slechts 5 stappen, dat moet toch wel voor iedereen te doen zijn zou je zeggen... Sowieso zijn alle tutorials maximaal 10 stappen

De afname in YAML is enorm, en het ziet er lekker simpel en overzichtelijk uit.

De bestaande voorbeelden zijn eigenlijk behoorlijk "advanced" tov de tutorials.

Denk dus dat dit wel gaat helpen om mensen stap-voor-stap vertrouwd te maken met deze kaart.

Het is alleen nogal wat werk

---

Input wordt natuurlijk gewaardeerd. Ben wel gewend natuurlijk dat ik net wat ander denk dan anderen.

In vergaderingen waar problemen worden besproken ben ik vaak klaar na de 1ste vergadering waar anderen dan nog 5 vergaderingen nodig hebben om op dezelfde oplossing te komen

Ook moet ik in presentaties vaak tussenstappen "verzinnen" die ik dus nooit heb uitgevoerd, maar die nodig zijn voor anderen om er een geloofwaardig verhaal van te maken.

Een presentatie bestaande uit 2 sheets met op sheet 1: "Ik begon", en sheet 2 "Tada, zie hier de oplossing" gaat er gewoon niet in bij de meeste mensen

[Voor 18% gewijzigd door Mars Warrior op 24-06-2022 13:56]

[Mars Warrior]

d-vine schreef op vrijdag 24 juni 2022 @ 11:07:
met deze uitgeklede code heb ik 2 buttons die in de webbrowsers goed werken.
maar niet goed werken in de android app.
zie wel 2 grote buttons maar niet 2 verschillende iconen. en kan alleen de onderste goed bedienen en sliders werken niet.

Welke browser gebruik je da op de mobiel? Ik weet dat Chrome onder Android gewoon werkt, net als op de desktop. Andere browsers op Android willen nog wel eens totaal niet aan standaarden voldoen.

Van mensen met een Samsung heb ik voorheen geen probleempunten gehoord.

[Voor 6% gewijzigd door Mars Warrior op 24-06-2022 14:00]

[Mars Warrior]

Koepert schreef op vrijdag 24 juni 2022 @ 13:13:
Ik volg je uitleg wel, dat schurkt heel erg aan hoe de pagina’s van UI Minimalist zijn opgebouwd trouwens.

Zie hier : https://ui-lovelace-minim...usage/cards/card_battery/

Voorbeeld snippet en uitleg over de variables. Daarnaast alle pages met hoe je installeert etcetera. Wellicht niet en 1 op 1 kopie wenselijk maar wellicht een hulplijn.

het gebruik van vaste layouts/kaarten zijn in SAK termen feitelijk een verzameling van toolset templates, of zelfs van (per kaart type) één grote toolset template.

De verschillende voorbeelde zijn zo natuurlijk niet gebouwd, maar de voorbeeld kaarten op voorbeeld 8. Homekit alike en 9. Hight Contrast zou je als een kaart kunnen zien, en deze in een tutorial ook zodanig toelichten.

Ik snap dit wel, maar mijn doel was natuurlijk - de basis van SAK - om af te zijn van die min of meer standaard kaarten en hun layout, en (bijna) te kunnen maken waar ik zin in had

Maar om dingen begrijpbaar te maken voor gebruikers, moet je dus eigenlijk wel die stap terug (vanuit mijn perspectief dan hè) doen.

[d-vine]

Mars Warrior schreef op vrijdag 24 juni 2022 @ 13:59:
[...]

Welke browser gebruik je da op de mobiel? Ik weet dat Chrome onder Android gewoon werkt, net als op de desktop. Andere browsers op Android willen nog wel eens totaal niet aan standaarden voldoen.

Van mensen met een Samsung heb ik voorheen geen probleempunten gehoord.

Ik gebruik de homeassistant app en daar is het anders. (cache legen etc. geen effect)
Als ik Chrome of brave pak ziet het er bijna hetzelfde uit als op mijn webbrowser
Maar bij SAKE10 weer niet en dat maakt het heel verwarrend.
Dit zie ik in de HA App







Maar in de browser op m'n mobiel dit




En sensoren zie ik niet





Dus dat maakt het voor mij vervelend om simpele dingen te testen als ik het niet zichtbaar kan maken om zo alles te leren button voor button

Moet eerst al jou voorbeelden te zien krijgen hoe jij het erin hebt zitten maar dat lukt even niet.
Als dat is gelukt kan ik sneller groter stappen maken denk ik.

Maar weet dus niet waar dat aan ligt


Zelf ben ik gewend om stap voor stap dingen uit te leggen voor andere mensen met werk.. dus weet wel wat er soms voor nodig is.
en nu ben ik zelf hierin nog in de learning curve en dan wil ik zelf eerst ook de stap voor stap goed onder de knie krijgen voor ik het snap. en misschien zie ik wel wat simpels over het hoofd

[Voor 4% gewijzigd door d-vine op 24-06-2022 14:43]

[Mars Warrior]

@d-vine Heb jij toevallig een cache draaien voor Home Assistant? Dus iets als NGINX die dat doet?

Daar heb ik bij ontwikkelen heeeeeeeeeeeeeeeeeeeel veel last van gehad, omdat die pagina wijzigingen dus gewoon niet doorgeeft. Pas toen ik de NGINX cache uitzette gingen dingen die ik wijzigde ook werken!

[d-vine]

@Mars Warrior
ja ik heb een eigen NGINX proxy draaien.
De Cache Asset uitgezet maar geen effect. Ook na reboot HA en na chache legen van de app zelfde situatie.

Heb de proxy uitgezet in NGINX. in de app lokaal adres ingevuld. lokaal restart HA maar ook dat mocht niet baten. heel vreemd.

Heb jij wel een idee waarom die sensoren niet te zien zijn? want dat lijkt een ander probleem

[d-vine]

Dit soort raar gedrag heb ik nu.
Net de eerste button copy erbij gezet als 3e
Horizontal stack erbij
Werkt nu goed in de app behalve het middelste icoon die klopt niet en werkt niet.
Maar bij aanzetten lamp bank zet deze hem aan in de app maar op website en in het echt niet.

[Voor 117% gewijzigd door d-vine op 24-06-2022 16:13]

[Mars Warrior]

d-vine schreef op vrijdag 24 juni 2022 @ 15:59:
@Mars Warrior
ja ik heb een eigen NGINX proxy draaien.
De Cache Asset uitgezet maar geen effect. Ook na reboot HA en na chache legen van de app zelfde situatie.

Heb de proxy uitgezet in NGINX. in de app lokaal adres ingevuld. lokaal restart HA maar ook dat mocht niet baten. heel vreemd.

Heb jij wel een idee waarom die sensoren niet te zien zijn? want dat lijkt een ander probleem

Ok. Dan kun je dat in ieder geval uitsluiten. Ik ontwikkel tegenwoordig louter direct op mijn HA machine qua URL, en dat bevalt goed.

Heb bij andere mensen me wel eens suf gezocht naar de oorzaak van problemen na een update van HACS: alle dashboards waren een beetje kapot. Niet helemaal natuurlijk, want dan was het duidelijk. Bleek dus ook de NPM Addon te zijn...

Het niet zien van sensoren lijkt toch op een foutieve naam van de sensor. Kan er niks anders van maken. Zie je die sensor wel in HA zelf?

[Mars Warrior]

d-vine schreef op vrijdag 24 juni 2022 @ 16:12:
Dit soort raar gedrag heb ik nu.
Net de eerste button copy erbij gezet als 3e
Horizontal stack erbij
Werkt nu goed in de app behalve het middelste icoon die klopt niet en werkt niet.
Maar bij aanzetten lamp bank zet deze hem aan in de app maar op website en in het echt niet.

[Afbeelding]

De tweede lamp is grijs. Dat duidt op een verkeerde entity qua naam of status!

[Koepert]

Mars Warrior schreef op vrijdag 24 juni 2022 @ 14:26:
[...]

het gebruik van vaste layouts/kaarten zijn in SAK termen feitelijk een verzameling van toolset templates, of zelfs van (per kaart type) één grote toolset template.

De verschillende voorbeelde zijn zo natuurlijk niet gebouwd, maar de voorbeeld kaarten op voorbeeld 8. Homekit alike en 9. Hight Contrast zou je als een kaart kunnen zien, en deze in een tutorial ook zodanig toelichten.

Ik snap dit wel, maar mijn doel was natuurlijk - de basis van SAK - om af te zijn van die min of meer standaard kaarten en hun layout, en (bijna) te kunnen maken waar ik zin in had

Maar om dingen begrijpbaar te maken voor gebruikers, moet je dus eigenlijk wel die stap terug (vanuit mijn perspectief dan hè) doen.

Ik zie dat iets anders..

Je gebruikt de handleiding om de gedachtegang achter je 'theme' uit te leggen en de ' standaard kaarten' zijn daar voorbeelden van die iedereen kan gebruiken (kopiëren). Het helpt echter ook bij het begrijpen van de logica waardoor je zelf 1, 2 of 10 stappen verder kunt gaan. Dus de baby-step (voor jou idd stappen terug) is hetgeen je gebruikt voor de uitleg (evt met een 'expert-voorbeeld' ernaast).

[Mars Warrior]

Koepert schreef op vrijdag 24 juni 2022 @ 22:17:
[...]


Ik zie dat iets anders..

Je gebruikt de handleiding om de gedachtegang achter je 'theme' uit te leggen en de ' standaard kaarten' zijn daar voorbeelden van die iedereen kan gebruiken (kopiëren). Het helpt echter ook bij het begrijpen van de logica waardoor je zelf 1, 2 of 10 stappen verder kunt gaan. Dus de baby-step (voor jou idd stappen terug) is hetgeen je gebruikt voor de uitleg (evt met een 'expert-voorbeeld' ernaast).

Ik denk dat ik dan wat heb uitgewerkt wat je bedoelt: https://swiss-army-knife-...rial-advanced-01-part-01/

Ik heb één van de kaarten van voorbeeld 12 uitgewerkt in stappen. Wel in de advanced modes, dus in wat grotere stappen. Maar ik laat wel zien hoe zo'n kaart in stapjes is opgebouwd, en dat je daarna een template kan gebruiken als je hergebruik wilt doen (de 4 segarcs).

Laat maar weten!

[d-vine]

Mars Warrior schreef op vrijdag 24 juni 2022 @ 21:46:
[...]

De tweede lamp is grijs. Dat duidt op een verkeerde entity qua naam of status!

@Mars Warrior

Dit is wat ik op mijn mobiel zie daar zit wat fout. op de computer en browser gaat het goed.
Ik dacht dat de sensoren al met een voorbeeld kwamen ondanks dat het lege entity had.
Dit is namelijk wel zo met de SAKE2 kaart waar je al 3 lichten ziet ondanks dat je dit niet kunt bedienen.

maar ik heb het licht wel een beetje gezien hoe alles werkt

Dit is op mijn webbrowers en alles functioneerd zoals het hoort.



blijft alleen de homeassistant app een probleem geven waar de iconen niet goed functioneren.
kan wel juist schakelen maar als ik het rechter licht bedien gaat de rest mee.
en de middelste blijft status donker grijs weergeven wat in jou ogen dan verkeerde entity moet zijn maar in werkenlijkheid gewoon goed is ingesteld.

op de webbrowser van de mobiel komt alles juist overeen zoals ook op de computer


Daarnaast is nu een uitdaging om deze light iconen een beetje te tweaken dat de slider groter en dikker is want het is heel lastig te bedienen met dat kleine puntje.
edit: dat is nu ook gelukt waardoor het beter te bedienen is op de mobiel


HomeAssistant App (android)




Edit:

Ik heb met bovenstaande light buttons van alles geprobeerd.
Alles nieuw weer gekopieerd en alleen entity aanpassing
Weg halen 1 button 3 en elke keer met 3.buttons komt hetzelfde gedrag of dit nu boven of onder de sensoren komt.
Als je 4 rijen hebt komt er een hele rare button over een ander button fade.

Ik heb nu onderstaand erin gezet van de SAKE10 voorbeelden en wat denk je bam in een keer werken.

Dit past beter bij de sensoren die ik mooi vind dus ga hiermee door maar het is wel opvallend probleem wat ik ondervonden heb.

[Voor 78% gewijzigd door d-vine op 25-06-2022 14:39]

[Mars Warrior]

d-vine schreef op zaterdag 25 juni 2022 @ 09:50:
[...]
Ik heb nu onderstaand erin gezet van de SAKE10 voorbeelden en wat denk je bam in een keer werken.

Bofkont

Maar wel vreemd. Ben benieuwd of meer mensen problemen gaan ondervinden dan...

Ik heb nu 3 tutorials online staan. Beetje heel veel werk met al die stappen en screenshots.

Maar goed. Ze staan er. Ben ff klaar nu. Mijn rechterarm moppert wat van al die muisbewegingen

[d-vine]

@Mars Warrior

Even een update van mijn vorderingen en waar ik tegen aanloop. Hoop het jou ook wat inzicht te geven hoe een user ( niveau tussen gemiddeld/ advanced) er tegen aan kijkt.

Ik beb de tutorials bekeken en zijn mooi uitgebreid. Het is echter wel zo dat dit een kale van scratch af tutorial is en het blijft toch meer advanced voor users die minder programeer bedeeld zijn.

Zelf heb ik nu een sensor card omgebouwd tot een switch/ sensor card. Dit had ik nodig omdat ik een Wall Plug of inbouw WCD wil kunnen schakelen en dan gelijk het wattage en kleine graphics zichtbaar wilde hebben.
Ik moet hier bij vermelden dat dit wel de nodige moeite koste. (dat is ook omdat ik jou code moet begrijpen ) Moet alleen die kleuren ring volgens mij nog goed krijgen.

edit: zie wel een beetje het idee maar ik denk dat er een officiele colorstop-power-template bij moet komen

Wat denk ik eerder wenselijk is dat je ook de bestaande kaarten uit elkaar trekt en dit uitlegt. Ik denk dat dit voor mensen die er clean in gaan beter gaan begrijpen wat waar zit en hoe het werkt.

Zou graag zien dat er een paar cards worden toegevoegd in je basis pakket die redelijk standaard zijn in een domotica systeem.
Denk dat dit ook andere mensen veel kan helpen om het instappen van deze mooie omgeving eenvoudiger te maken

- Switch/ sensor card
- Switch card
- Door sensor card
- RGBW switch card
- Roller Shutter / Awings (uitval scherm) card
- Door Lock Card (open / close)
- Smoke Sensor Card
- CO Sensor Card

Ben bang dat mensen toch minder snel zullen instappen als de uitleg van bestaande cards en de uitbreiding er niet in zit.

Ik had nog een vraag over de cards als je alleen 1 of 2 hebt in een regel horizontale stack dan zijn dit grotere cards en bij meerdere schaalt HA zelf volgens mij deze cards kleiner.
Ik denk dat dit iets van standaard HA ding is maar vroeg me af hoe als je maar 1 card in een nieuwe horizontale stack hebt staan deze net zo groot is als een andere rij met 3 kaarten.

Volgende vraag is de kleuren van de kaarten.
Ik heb nu oranje iconen, sliders en de balk erboven is oranje.

Mijn theme is TealBlue
Dan wil ik het liefst dat oranje ook die kleur gaat geven

Ik weet alleen niet hoe ik dit als standaard met de theme moet laten meekomen en is me ook niet duidelijk geworden op de website.

Heb boven aan de SAKE kaart met en zonder gedaan maar dat werkt dus niet.
theme: 'M3 - tealblue'

Laatste vraag is bij de ventilator heb ik de light card omgebouwd naar switch.. wil alleen die cirkel dan weg hebben maar lukt me even niet.. misschien heb jij kun jij aangeven waar in de programmering ik dit weg kan halen of duidelijk noteren bij de voorbeelden welke dat is

[maartend]

Net terug van vakantie, dus 4 weken niks gelezen. Maar ik begrijp dat hij in HACS zit? Hoewel nog onvindbaar voor mij. Of custom repositorie?

[d-vine]

maartend schreef op zondag 26 juni 2022 @ 10:59:
Net terug van vakantie, dus 4 weken niks gelezen. Maar ik begrijp dat hij in HACS zit? Hoewel nog onvindbaar voor mij. Of custom repositorie?

wachtend nog in HACS inderdaad....
custom repositorie dan gaat het goed

[maartend]

d-vine schreef op zondag 26 juni 2022 @ 11:24:
[...]


wachtend nog in HACS inderdaad....
custom repositorie dan gaat het goed

Thnx. Dan even goed topic doorspitten.

edit ; jammer dan ; Repository structure for v1.0.0-rc.1b is not compliant
Zal wel beta nodig hebben en dat wil ik niet.
Ik wacht wel

[Voor 22% gewijzigd door maartend op 26-06-2022 11:48]

[Mars Warrior]

maartend schreef op zondag 26 juni 2022 @ 11:28:
[...]

Thnx. Dan even goed topic doorspitten.

edit ; jammer dan ; Repository structure for v1.0.0-rc.1b is not compliant
Zal wel beta nodig hebben en dat wil ik niet.
Ik wacht wel

Dat is vreemd, want hij komt bij mij wel door HACS heen. Ik zal eens ff kijken hiernaar. Volgens validatie is release compliant namelijk...

Ik kan gewoon bijwerken zie ik:


Repository valideerd ook gewoon volgens HACS:

[Voor 42% gewijzigd door Mars Warrior op 26-06-2022 12:11]

[Mars Warrior]

@d-vine , Ik denk dat jij eigenlijk naar dit soort kaarten op zoek bent om te maken.

Voorbeelden zijn nu van 12 overgenomen:
- Een AirVisual kaart
- Een sensor kaart
- Een server kaart
- Een (half lange) Fan kaart
- Een (half lange) switch kaart...

[d-vine]

Mars Warrior schreef op zondag 26 juni 2022 @ 12:04:
@d-vine , Ik denk dat jij eigenlijk naar dit soort kaarten op zoek bent om te maken.

Voorbeelden zijn nu van 12 overgenomen:
- Een AirVisual kaart
- Een sensor kaart
- Een server kaart
- Een (half lange) Fan kaart
- Een (half lange) switch kaart...

[Afbeelding]

@Mars Warrior
dat draaiende Fan icoon wel maar niet naar de kaart.
Dan ga ik vierkante kaarten combineren met langwerpige en wordt het er niet mooier op.

Daarom zou het mooi zijn dat bij de verschillende "vierkante" kaarten Lights, high contrast, colorfull mix etc. kaarten komen voor switches, wall plugs fans , smoke detectos etc. zoals je nu laat zien met de langwerpige.

[Mars Warrior]

d-vine schreef op zondag 26 juni 2022 @ 12:24:
[...]
@Mars Warrior
dat draaiende Fan icoon wel maar niet naar de kaart.
Dan ga ik vierkante kaarten combineren met langwerpige en wordt het er niet mooier op.

Daarom zou het mooi zijn dat bij de verschillende "vierkante" kaarten Lights, high contrast, colorfull mix etc. kaarten komen voor switches, wall plugs fans , smoke detectos etc. zoals je nu laat zien met de langwerpige.

Het ging me meer om het idee: als dit in een tutorial ofzo komt, dan kun je dus heel eenvoudig zien hoe ik dat gedaan heb, en kun je dat in een ander design natuurlijk heel eenvoudig zelf overnemen!



Alleen beetje jammer dat Safari 15 crashed hierop, en 14 (iPad) niet. Dus er is weer iets veranderd met Icon animaties lijkt het op. Dat wordt weer erg lastig uitzoekwerk helaas...

[Voor 32% gewijzigd door Mars Warrior op 26-06-2022 15:49]

[d-vine]

@Mars Warrior

Ik ben even gaan verdiepen in die colorstops. Wilde toch die switch/ sensor button card compleet maken.
ben weer tegen wat aan gelopen maar misschien is het wel iets simpels.

heb de template van colorstops-temperature-inside-heating-template gebruikt.
Dit helemaal gekopieerd en een nieuwe naam gegeven colorstops-power-template
Daarbij in eerste instantie alleen het kleurenpallet veranderd

code:

colorstops_power:
  template:
    type: colorstops
    defaults:
      - thegap: 1
      - theFill: true
      - theStroke: false
  colorstops:
    gap: '[[thegap]]'
    fill: '[[theFill]]'
    stroke: '[[theStroke]]'
    colors:
      10: '#0064ff'
      11: '#0074ff' 
      12: '#0084ff' 
      13: '#0094ff' 
      14: '#00a4ff' 
      15: '#00b4ff' 
      16: '#00c4ff' 
      17: '#00d4ff' 
      18: '#00e4ff' 
      19: '#00fff4' 
      20: '#00ffd0'
      21: '#00ffa8'
      22: '#00ff83'
      23: '#00ff5c'
      24: '#00ff36'
      25: '#00ff10'
      26: '#17ff00'
      27: '#3eff00'
      28: '#d7ff00'
      29: '#fdff00'
      30: '#FFdc00'
      31: '#FFbe00'
      32: '#FFa000'
      33: '#FF8200'
      34: '#FF6e00'
      35: '#FF5a00'
      36: '#FF0010'
      37: '#FF0080'
      38: '#FF00F0'
      39: '#FF06F0'
      40: '#FF0DF0'

deze weer verwezen in de code

code:

                    colorstops:
                      template:
                        name: colorstops_power
                        variables:
                          - thegap: 0.5

Dat gaat goed



Krijg andere kleuren en alles springt naar roze / paars omdat mijn wattages hoog zijn.

Dus dacht ik simpel de waardes te veranderen en klaar is kees.
maar als ik dit doe veranderd de ring kleur naar vaste blauwe kleur.
terwijl de verticale bars wel goed werken met juiste kleuren pallet.

dus met deze kleine test en aanpassing van alleen de kleuren en waardes

code:

      10: '#0064ff'
      25: '#0074ff'
      50: '#0084ff'
      75: '#0094ff'
      100: '#00a4ff'
      125: '#00b4ff'
      150: '#00c4ff'
      175: '#00d4ff'
      200: '#00e4ff'
      225: '#00fff4'
      250: '#00ffd0'

krijg je dit te zien waar je de lichtblauwe waardes ziet als verandering dat de aanpassing werkt maar de ring uitstraling wordt om zeep geholpen.
elke keer als de waardes 10 tm 40 terug gezet worden dan wordt de 'segarc' weer in ere hersteld
schiet mij maar lek



als ik alleen de segarc verwijz naar colorstops-temperature-inside-heating-template en de bars verwijs naar mijn colorstops-power-template
dan werkt de segarc en krijg ik ook de juiste waardes en kleuren in de bars.
maar de segarc slaat dan altijd vol uit wat je niet wilt.

[Voor 8% gewijzigd door d-vine op 26-06-2022 19:54]

[Mars Warrior]

@d-vine als het goed is, moet je de scale van de segarc ook aanpassen. Daar staat - los van de colorstop - een min/max waarde aangegeven…

[d-vine]

Mars Warrior schreef op zondag 26 juni 2022 @ 20:43:
@d-vine als het goed is, moet je de scale van de segarc ook aanpassen. Daar staat - los van de colorstop - een min/max waarde aangegeven…

@Mars Warrior
YES dat was het
weer wat geleerd en ook door het vele proberen je code beter begrepen

[Mars Warrior]

Zo, het is maandag, en ik had gisteren geen 10, geen 100, maar zo'n 500 gebruikers op de handleiding. Er is blijkbaar weer ergens iets op Social Media gepost

Er zitten nu zo'n 70-80 gebruikers de handleiding te lezen

Ik ben nog verder wezen zoeken naar de Safari 15.x en dus ook de Companion App crashes, en dat is dus een vervelende bug in de afhandeling van KeyFrames in Safari.

De andere bug: dat een spinner het niet meer doet, is dus ook een bug die in de aankomende 15.6 versie zou moeten zijn opgelost. Of die KeyFrames bug dat ook is weet ik niet.

[Mars Warrior]

Ik zie dat een "Alert" weergeven ook hip is, dus ik heb er als voorbeeld 2 vormen bijgedaan



De config voor de bovenste Alert:

YAML:

- type: icon
  position:
    cx: 50
    cy: 50
    align: center
    icon_size: 25
  entity_index: 0
  icon: mdi:alert-circle
  animations:
    - state: 'on'
      styles:
        icon:
          fill: red
    - state: 'off'
      styles:
        icon:
          display: none
  styles:
    icon:
      fill: red

De onderste heeft als extra een cirkel er omheen...

Ik zie nu dat er over 1 seconde brand is, en dat ik ook over 1 seconde ga rennen

[d-vine]

@Mars Warrior

Ik ben weer wat verder gekomen de cards te snappen en vormgeving, kleuren pallet aan te passen.
Waar ik een beetje tegen aan was gelopen is het zoeken waar stonden de standaard colors bij alarm, rust van de buttons om aan te passen. Je hebt zoveel documentatie dat het best zoeken is.

er is een verwijzing gemaakt naar een sak-css-definitions.yaml
https://swiss-army-knife-...m/basics/styling/classes/

maar die heb ik niet.
staat alleen nog in jou beta versie staat op github.

Misschien tip om een kleine note in de view exempels erbij te zetten.
Want als er ergens style en een kleur code, verwijzing in staat zie je dat meteen. kleine moeite scheelt veel zoek werk

bv.

code:

                  # Background used for active / inactive card
                  # default settings in user-css-definitions.yaml see https://swiss-army-knife-card-manual.amoebelabs.com/basics/styling/classes/
                  # ------------------------------------------------------------
                  - type: rectex
                    position:
                      cx: 50
                      cy: 50
                      width: 100
                      height: 100
                      radius:
                        top: 0
                        bottom: 0
                    entity_index: 0
                    animations:
                      - state: 'on'
                        classes:
                          rectex:
                            sak-card--on: true
                      - state: 'off'
                        classes:
                          rectex:
                            sak-card--off: true

Waar ik zelf nu nog tegen aan loop is de slider kleuren aan te passen met gradient, kan het niet zo snel vinden hoe die verwijzing werkt en hoe ik het aan kan passen..

code:

                      active:
                        fill: url(#sak-light-brightness-gradient--orange) #white
                        #fill: var(--theme-ref-palette-primary80)

Dus ik heb in de sak templates eigen gradient gemaakt (leuke tool https://cssgradient.io/)

en dit verwerkt net als de orange maar het werkt niet dus ik doe wat fout en begrijp het niet

sak_templates.yaml

code:

color_palette_default_gradient_white_orange:
  template:
    type: colorswatch
  colorswatch:
    colorswatch: color_palette_default_gradient_white_orange
    colors:
      light:
      - --sak-cs-default-01: '#FFF6E3'
      - --sak-cs-default-02: '#FFE9B9'
      - --sak-cs-default-03: '#FFDA8A'
      - --sak-cs-default-04: '#FFCB5B'
      - --sak-cs-default-05: '#FFBF37'
      - --sak-cs-default-06: '#ffb414'
      - --sak-cs-default-07: '#FFAD12'
      - --sak-cs-default-08: '#FFA40E'
      - --sak-cs-default-09: '#FF9C0B'
      - --sak-cs-default-10: '#FF8C06'
      
color_palette_default_gradient_white_blue:
  template:
    type: colorswatch
  colorswatch:
    colorswatch: color_palette_default_gradient_white_blue
    colors:
      light:
      - --sak-cs-default-01: '#FFF6E3'
      - --sak-cs-default-02: '#05044b'
      - --sak-cs-default-03: '#090979'
      - --sak-cs-default-04: '#08248b'
      - --sak-cs-default-05: '#06419e'
      - --sak-cs-default-06: '#0469b9'
      - --sak-cs-default-07: '#0386cc'
      - --sak-cs-default-08: '#02a1de'
      - --sak-cs-default-09: '#01bcef'
      - --sak-cs-default-10: '#00d4ff'
    

color_palette_gradient_white_orange:
  template:
    type: colorswatch
  colorswatch:
    colorswatch: color_palette_gradient_white_orange
    colors:
      - --sak-cs-gradient-white-orange-01: '#FFF6E3'
      - --sak-cs-gradient-white-orange-02: '#FFE9B9'
      - --sak-cs-gradient-white-orange-03: '#FFDA8A'
      - --sak-cs-gradient-white-orange-04: '#FFCB5B'
      - --sak-cs-gradient-white-orange-05: '#FFBF37'
      - --sak-cs-gradient-white-orange-06: '#ffb414'
      - --sak-cs-gradient-white-orange-07: '#FFAD12'
      - --sak-cs-gradient-white-orange-08: '#FFA40E'
      - --sak-cs-gradient-white-orange-09: '#FF9C0B'
      - --sak-cs-gradient-white-orange-10: '#FF8C06'

color_palette_gradient_white_blue:
  template:
    type: colorswatch
  colorswatch:
    colorswatch: color_palette_gradient_white_blue
    colors:
      - --sak-cs-gradient-white-blue-01: '#FFF6E3'
      - --sak-cs-gradient-white-blue-02: '#05044b'
      - --sak-cs-gradient-white-blue-03: '#090979'
      - --sak-cs-gradient-white-blue-04: '#08248b'
      - --sak-cs-gradient-white-blue-05: '#06419e'
      - --sak-cs-gradient-white-blue-06: '#0469b9'
      - --sak-cs-gradient-white-blue-07: '#0386cc'
      - --sak-cs-gradient-white-blue-08: '#02a1de'
      - --sak-cs-gradient-white-blue-09: '#01bcef'
      - --sak-cs-gradient-white-blue-10: '#00d4ff'

en dan zou ik hier het moeten verwijzen maar ik denk dat ik nog ergens anders wat moet doen maar weet niet wat

code:

                      active:
                        fill: url(#sak-light-brightness-gradient--blue) #white

vaste ingesteld kleur werkt prima maar wil graag het verloop hebben zoals orange werkt en het begrijpen hoe. Dan snap ik de volledige card en kan ik straks lekker bouwen met de rest.


verder heb ik de cards al leuk aangepast en uitgebreid en werkt het met light en dark mode
Edit meer uitbreiding

[Voor 24% gewijzigd door d-vine op 28-06-2022 20:52]

[Obelixxx]

Ik zie hem nog niet in HACS staan.
Moet ik hier zelf wat voor doen?

[d-vine]

Obelixxx schreef op maandag 27 juni 2022 @ 16:31:
Ik zie hem nog niet in HACS staan.
Moet ik hier zelf wat voor doen?

moet nog met een custom repositorie dan gaat het goed

[Mars Warrior]

@d-vine . Ik ben onderweg, maar jij bent lekker bezig!

Kan morgen weer het nodige lezen.

[d-vine]

@Mars Warrior

Kleine tip met indeling van de kaarten

gebruik de grid card.
Op deze manier maak je automatisch een overzicht van 3 of 4, .... columns
Worden de cards automatisch geschaald, dit voorkomt als je 1 kaart op een rij hebt deze niet heel groot wordt of bij 4 of 5 allemaal heel klein.
Het scheelt ook na elke rij van bv. 3 cards een horizontal-stack in te voeren.

code:

  - type: grid
    columns: 3
    #square: false
    cards:

Je hoeft dit alleen in te voeren na een vertical stack
of als je (bij columns 3) minder dan 3 cards hebt je naar de volgende regel gaat.
de rest wordt automatisch gedaan.
Anders krijg je het niet voor elkaar met de horizontal stack

Zie voorbeeld


had je nog gekeken naar mijn slider color settings?

[Voor 23% gewijzigd door d-vine op 30-06-2022 08:51]

[Mars Warrior]

Koepert schreef op vrijdag 24 juni 2022 @ 13:13:
Ik volg je uitleg wel, dat schurkt heel erg aan hoe de pagina’s van UI Minimalist zijn opgebouwd trouwens.

Zie hier : https://ui-lovelace-minim...usage/cards/card_battery/

Voorbeeld snippet en uitleg over de variables. Daarnaast alle pages met hoe je installeert etcetera. Wellicht niet en 1 op 1 kopie wenselijk maar wellicht een hulplijn.

Ik heb ff wat zitten neuzen waarom zij zoveel verschilende kaarten maken, maar door de hele andere opbouw van de button-card moeten ze heel veel Javascript toevoegen, dus dat snap ik nu.

Aan de andere kant maken ze verschillen tussen kaarten, waar ik geen enkel verschil zie, op wat details na.

Neem de battery card van jou voorbeeld: hierin worden afhankelijk van toestanden iconen gemaakt. Het vreemde is dat ik hiervoor niks hoef te doen. Het lijkt erop dat Home Assistant dit al allemaal voor je doet (charging enzo).

Dus ik bouw een sensor card met aan aangepaste colorstop en klaar. In een ideale wereld kun je bij de template een colorstop oid meegeven, en dan heb je maar één kaart (sensor card) nodig...




Maar aan de andere kant hebben gebruikers dit blijbkaar nodig om dingen te zien, dus niks mis mee

Dus ik heb nu 17 voorbeeld functionele kaarten gemaakt gebaseerd op de look&feel van example 12
Dit is wel met wat varianten meegeteld, maar van elk voorbeeld kun je leren in ieder geval!

[Mars Warrior]

d-vine schreef op donderdag 30 juni 2022 @ 08:47:
@Mars Warrior
had je nog gekeken naar mijn slider color settings?

Als je de gradient bedoelt: dat is geen colorstop ofzo, maar een SVG Gradient die dacht ik in user-css-definitions.yaml is gedefinieerd...

[Mars Warrior]

Ik heb inmiddels 28 kaarten gemaakt. Deels varianten van elkaar om te laten zien hoe je dingen anders kunt weergeven, maar daar ging het ook om: dat je iets ziet, en kunt nakijken hoe je dat maakt met SAK!

Alles dus redelijk minimalistisch gehouden:

1. Kaartjes met alarm notificatie, en ook een batterij die rood gaat knipperen als deze bijna leeg is
2. Een schakelaar voor een Fan waarvan het icon gaat draaien
3. Knop om naar een andere view te gaan
4. Knop om een scene te activeren
5. Lamp met slider
6. Gewone lamp
7. Persoon kaart. Ben ik thuis of niet
8. Sensor met een meekleurende cirkel
9. Sensor met een meekleurend icon
10. etc.

Dit allemaal zonder CSS classes en templates. Dus zo ff te copy/pasten in een view als je wilt om te proberen. Natuurlijk wel elke keer je eigen sensoren kiezen...

Ook wat bugs moeten pletten bij het maken van deze functionele kaarten. Dus het heeft nog wat opgeleverd aan die kant ook

https://swiss-army-knife-...ple-set-functional-cards/

[Koepert]

Heb nog wel n vraagje. Want ik had wel een mening maar heb je dash nog niet actief geprobeerd..tijd voor verandering, ook omdat ik zat was van de breaking changes van UI Minimalist en je stijl me erg aanspreekt.

Maar wellicht moet ik hiervoor ook in t algemene HA topic zijn.

Ik heb HA ' standaard' geconfigureerd. Dus al mijn dashes zijn op basis storage mode.. Behalve de UI MInimalist integratie, die heeft een yaml dash.

In mijn configuration.yaml staat geen lovelace (expliciet) benoemd en is geen default config aanwezig (wel handmatig dat wat ik gebruik). UI Minimalist heeft een eigen folder op hetzelfde niveau als www folder. Daarin zit een ui.lovelace.yaml file. die verwijst naar een folder (views) in de UIMinimalist dashboard-folder.

Dus zo



Kan ik die structuur handmatig nabouwen om SAK toe te voegen? Of moet ik dit elders/op een andere manier doen? Ik heb weinig trek om mijn hele config onderuit te trekken, mijn testomgeving heb ik recent de nek om gedraaid vanwege onbruik.

[Mars Warrior]

Koepert schreef op woensdag 6 juli 2022 @ 14:55:
Heb nog wel n vraagje. Want ik had wel een mening maar heb je dash nog niet actief geprobeerd..tijd voor verandering, ook omdat ik zat was van de breaking changes van UI Minimalist en je stijl me erg aanspreekt.

Maar wellicht moet ik hiervoor ook in t algemene HA topic zijn.

Ik heb HA ' standaard' geconfigureerd. Dus al mijn dashes zijn op basis storage mode.. Behalve de UI MInimalist integratie, die heeft een yaml dash.

Ok. Dus als UI Minimalist dat al heeft, dan is dat volgens mij niet anders dan met SAK. Die heeft ook een YAML dashboard nodig.

In mijn configuration.yaml staat geen lovelace (expliciet) benoemd en is geen default config aanwezig (wel handmatig dat wat ik gebruik).

Maar je zegt dat je dus zoiets als hieronder NIET hebt in je configuration.yaml?

YAML:

lovelace:
  mode: yaml
  resources: !include lovelace/resources/resources.yaml

  dashboards:
    sak-examples:
      mode: yaml
      filename: sak-examples-dashboard.yaml
      title: Swiss Army Knife Examples
      icon: mdi:hospital-box
      show_in_sidebar: true
    sak-tutorials:
      mode: yaml
      filename: sak-tutorials-dashboard.yaml
      title: Swiss Army Knife Tutorials
      icon: mdi:hospital-box
      show_in_sidebar: true

Hmmmm. Dat is vreemd voor mij...

UI Minimalist heeft een eigen folder op hetzelfde niveau als www folder. Daarin zit een ui.lovelace.yaml file. die verwijst naar een folder (views) in de UIMinimalist dashboard-folder.

Dus zo

[Afbeelding]

Kan ik die structuur handmatig nabouwen om SAK toe te voegen? Of moet ik dit elders/op een andere manier doen? Ik heb weinig trek om mijn hele config onderuit te trekken, mijn testomgeving heb ik recent de nek om gedraaid vanwege onbruik.

Op zich is de indeling die ik gebruik - en oorspronkelik heb van de decluttering-card - ook maar een mappenindeling. Als jij de bestanden op een andere plek wilt zetten, maar wel zorgt voor de correcte includes dan moet het gewoon werken.

De enige bestanden met een vaste plaats zijn die door HACS in de www map worden gezet: daar staan dus een aantal yaml bestanden die je moet includen. Hoe dat moet zie je in de voorbeeld yaml files, zoals dus sak-examples-dahsboard.yaml.

Dus als jij de voorbeelden en views bijv. onder een sak map wilt zetten, dan kan dat volgens mij gewoon.

NOOT:
De sak_templates map MOET op de plek komen waar hij nu staat: die is hard geconfigureerd!!
Die wordt namelijk door Lovelace in de frontend geladen zodat SAK bij die bestanden kan!

[Voor 3% gewijzigd door Mars Warrior op 06-07-2022 15:25]

[Mars Warrior]

@Koepert , nog een kleine correctie op mijn verhaal:

Dit staat in de dashboard.yaml file:

YAML:

# Swiss Army Knife Templates
#
# The system templates come with the HACS install and can be updated
# with a new release. That part is automatic!
sak_sys_templates:
  !include www/community/swiss-army-knife-card/sak_templates.yaml

# The user templates are created by the user, and won't be updated 
# with a new release. If changes are required, then the user has to
# update the template configuration files.
sak_user_templates:
  !include lovelace/sak_templates/sak_templates.yaml

Dit wordt geinlcude vanuit de lovelace sectie uit configuration.yaml.

Dat betekent dat de JavaScript structuur `lovelace.sak_sys_templates` en `lovelace.sak_user_templates` wordt. Zolang die tweede ook blijft bestaan maakt het niet uit waar de templates staan in jou omgeving, want ze worden dan wel goed geladen.

[Koepert]

Mars Warrior schreef op woensdag 6 juli 2022 @ 15:22:
[...]



[...]

Ok. Dus als UI Minimalist dat al heeft, dan is dat volgens mij niet anders dan met SAK. Die heeft ook een YAML dashboard nodig.

[...]

Maar je zegt dat je dus zoiets als hieronder NIET hebt in je configuration.yaml?

YAML:

lovelace:
  mode: yaml
  resources: !include lovelace/resources/resources.yaml

  dashboards:
    sak-examples:
      mode: yaml
      filename: sak-examples-dashboard.yaml
      title: Swiss Army Knife Examples
      icon: mdi:hospital-box
      show_in_sidebar: true
    sak-tutorials:
      mode: yaml
      filename: sak-tutorials-dashboard.yaml
      title: Swiss Army Knife Tutorials
      icon: mdi:hospital-box
      show_in_sidebar: true

Hmmmm. Dat is vreemd voor mij...


[...]

Op zich is de indeling die ik gebruik - en oorspronkelik heb van de decluttering-card - ook maar een mappenindeling. Als jij de bestanden op een andere plek wilt zetten, maar wel zorgt voor de correcte includes dan moet het gewoon werken.

De enige bestanden met een vaste plaats zijn die door HACS in de www map worden gezet: daar staan dus een aantal yaml bestanden die je moet includen. Hoe dat moet zie je in de voorbeeld yaml files, zoals dus sak-examples-dahsboard.yaml.

Dus als jij de voorbeelden en views bijv. onder een sak map wilt zetten, dan kan dat volgens mij gewoon.

NOOT:
De sak_templates map MOET op de plek komen waar hij nu staat: die is hard geconfigureerd!!
Die wordt namelijk door Lovelace in de frontend geladen zodat SAK bij die bestanden kan!

Het woord lovelace staat NIET in mijn Configuration.yaml idd. (Dat lieg ik, dit staat er alleen in:

code:

frontend:
  themes: !include_dir_merge_named themes/
  extra_module_url:
    - /hacsfiles/lovelace-card-mod/card-mod.js

)

Maar Minimalist is ook een integratie die je 'in' HA installeert, dus ook via developer tools kunt herladen, net als templates, zones, etc. Dus wellicht dat dat daardoor kan.

Even ingedoken.

UIM is een custom component die een load_Dashboard.py gebruikt, die vervolgens de yaml-dash inlaadt.

Dus

Python:

"""Load Dashboards for UI Lovelace Minimalist Integration."""

from __future__ import annotations

import logging

from homeassistant.components.frontend import async_remove_panel
from homeassistant.components.lovelace import _register_panel
from homeassistant.components.lovelace.dashboard import LovelaceYAML
from homeassistant.core import HomeAssistant

from .base import UlmBase

_LOGGER: logging.Logger = logging.getLogger(__name__)


def load_dashboard(hass: HomeAssistant, ulm: UlmBase):
    """Load Dashboards."""

    dashboard_url = "ui-lovelace-minimalist"
    dashboard_config = {
        "mode": "yaml",
        "icon": ulm.configuration.sidepanel_icon,
        "title": ulm.configuration.sidepanel_title,
        "filename": "ui_lovelace_minimalist/dashboard/ui-lovelace.yaml",
        "show_in_sidebar": False,
        "require_admin": True,
    }

    adv_dashboard_url = "adaptive-dash"
    adv_dashboard_config = {
        "mode": "yaml",
        "icon": ulm.configuration.adaptive_ui_icon,
        "title": ulm.configuration.adaptive_ui_title,
        "filename": "ui_lovelace_minimalist/dashboard/adaptive-dash/adaptive-ui.yaml",
        "show_in_sidebar": True,
        "require_admin": False,
    }
    # Optoinal override can be done with config_flow?
    # if not dashboard_url in hass.data["lovelace"]["dashboards"]:
    if ulm.configuration.sidepanel_enabled:
        hass.data["lovelace"]["dashboards"][dashboard_url] = LovelaceYAML(
            hass, dashboard_url, dashboard_config
        )

        _register_panel(hass, dashboard_url, "yaml", dashboard_config, True)
    else:
        if dashboard_url in hass.data["lovelace"]["dashboards"]:
            async_remove_panel(hass, "ui-lovelace-minimalist")

    if ulm.configuration.adaptive_ui_enabled:
        hass.data["lovelace"]["dashboards"][adv_dashboard_url] = LovelaceYAML(
            hass, adv_dashboard_url, adv_dashboard_config
        )

        _register_panel(hass, adv_dashboard_url, "yaml", adv_dashboard_config, True)
    else:
        if adv_dashboard_url in hass.data["lovelace"]["dashboards"]:
            async_remove_panel(hass, "adaptive-dash")

[Voor 36% gewijzigd door Koepert op 06-07-2022 15:51]

[Mars Warrior]

Hmmmm. Ik had met het maken van die functionele kaarten al aangegeven dat in de "toekomst" SAK ook card templates oid zou gaan ondersteunen. Dat maakt het gebruik van voorbeeldkaarten namelijk wel erg makkelijk en dus daarmee ook toegankelijk voor meer mensen.

Tsja. Na een paar regels code wijzigen blijkt het toch minder complex te zijn dan ik dacht en laat de volgende YAML nu de tweede AirVisual functional card zien:

YAML:

    - type: 'custom:swiss-army-knife-card'
      entities:
        - entity: sensor.u_s_air_quality_index
          name: 'Tha Moon'
      # Define aspect ratio
      # TODO: If aspectratio is defined in layout template, (should be if
      # using templates) that value overrides this value...
      aspectratio: 3/1                          # Card is 300x100 grid
      layout:
        template:
          name: layout_airvisual2

En door nog variables toe te voegen kun je een template nog een beetje "configureren", zoals "laat het icon spinnen als state on is"... Hoef je dus geen twee templates te maken: 1 voor wel spinnen, en 1 voor niet...

Moet nog wel ff heel goed testen natuurlijk

En als ik dit uitbreid en een `layouts` sectie erbij doe die een lijst van `layout` secties aankan die je binnen een kaart kunt positioneren en schalen, dan kun je dus een kaart opbouwen met een aantal voor gedefinieerde layouts. Net als je nu met toolsets kunt (hergebruik en schalen).

Een layout template is eigenlijk niks anders dan een verzameling toolsets. Toolsets zijn al een verzameling tools, dus het is gewoon hetzelfde principe, maar dan anders...

Maar dat is voor later

[Koepert]

Inmiddels ook de tijd gevonden/genomen om deze in te voeren. Inmiddels ook een beetje door hoe je met stukjes en beetjes (toevoegen/verwijderen toolsets) de cards kunt aanpassen, maar weet iemand wellicht het volgende?

Deze card: https://swiss-army-knife-...tional-card-sensor3-card/

die gebruik ik ook voor occupancy en aantal lampen aan. (sensor met waarde 0, 1 of 2 en 0, 1 etc voor de lampen)..evenals stroom en gasverbruik. Daar heb ik de bars uit gehaald en de last changed, maar verder geen wijzigingen.

Maar op dit moment staan "lampen aan" en "gasverbruik" op 0. Maar die tonen als -0. dus met een "-" er voor..

Iemand enig idee waar dit van komt? OF beter: hoe het te fixen?

[d-vine]

[b]Koepert in "Home Assistant - Het Swiss Army Knife Beta FEEDBACK topic"Koepert schreef op zondag 10 juli 2022 @

Maar op dit moment staan "lampen aan" en "gasverbruik" op 0. Maar die tonen als -0. dus met een "-" er voor..

Heb ik ook nog last van. Nog vergeten te vermelden, lijkt op kleine bug.

[Mars Warrior]

Koepert schreef op zondag 10 juli 2022 @ 09:07:
Maar op dit moment staan "lampen aan" en "gasverbruik" op 0. Maar die tonen als -0. dus met een "-" er voor..

Iemand enig idee waar dit van komt? OF beter: hoe het te fixen?

d-vine schreef op zondag 10 juli 2022 @ 09:19:
[...]
Heb ik ook nog last van. Nog vergeten te vermelden, lijkt op kleine bug.

[Afbeelding]

Yep, dat is een bug in de conversie van een entity state.

Zal ik fixen in de volgende release, samen met de layout templates...

Zie hieronder. Zoals al eerder aangegeven: een battery card is niks anders dan een sensor card met een andere colorstop. En die kan ik nu meegeven met de template...

YAML:

        - type: 'custom:swiss-army-knife-card'
          entities:
            - entity: sensor.iphone_van_marco_battery_level
              name: 'Battery #1a'
            - entity: sensor.iphone_van_marco_battery_level
              secondary_info: last_changed
              format: relative
          layout:
            template:
              name: sak_layout_fce_sensor3
              variables:
                - sak_layout_sensor_segarc_scale_max: 100
                - sak_layout_sensor_colorstops_template: colorstops_battery_level

Heb al bijna alle 30 functional card examples omgezet naar layout templates

Ga zo Formule 1 kijken en mijn arm rust geven, die is wat verkrampt door teveel met de muis te werken en te weinig afwisseling

[d-vine]

Mars Warrior schreef op zondag 10 juli 2022 @ 13:26:
[...]


[...]

Yep, dat is een bug in de conversie van een entity state.

Zal ik fixen in de volgende release, samen met de layout templates...

Zie hieronder. Zoals al eerder aangegeven: een battery card is niks anders dan een sensor card met een andere colorstop. En die kan ik nu meegeven met de template...

YAML:

        - type: 'custom:swiss-army-knife-card'
          entities:
            - entity: sensor.iphone_van_marco_battery_level
              name: 'Battery #1a'
            - entity: sensor.iphone_van_marco_battery_level
              secondary_info: last_changed
              format: relative
          layout:
            template:
              name: sak_layout_fce_sensor3
              variables:
                - sak_layout_sensor_segarc_scale_max: 100
                - sak_layout_sensor_colorstops_template: colorstops_battery_level

Heb al bijna alle 30 functional card examples omgezet naar layout templates

Ga zo Formule 1 kijken en mijn arm rust geven, die is wat verkrampt door teveel met de muis te werken en te weinig afwisseling

Ik zit ook al klaar voor de F1. Have fun 😀

[Ben.Hahlen]

Tof project dit!
Wilde er ook "even" mee aan de slag, maar... dat "even" moet je "even" de tijd voor nemen

Vooralsnog dus op een zijspoor gezet, bij een latere versie weer eens kijken hoe het precies gaat (of als ik ergens binnenkort wat tijd over heb).

Afgezien van dat: zoals ik zei: tof project! Heeft echt coole cards er in zitten die mooi overzicht geven!

Thanks @Mars Warrior

[Koepert]

Ok. Ik weet niet waar t aan ligt… maar out of nowhere werkt geen enkele SAK card meer op m’n dash. “Custom element not found” voor elke card.

Nu viel t mij op dat in browser (Brave op n Linux laptop) er erg lang gewacht moet worden (althans, staat langer in beeld) unpkg.com. Ik weet niet of dat gerelateerd is aan de werking van SAK of iets anders… maar vond t opvallend.


Oh en opnieuw downloaden werkt niet en t is elk dash. Zowel examples als zelfgebouwd met de function cards.


Maak je toevallig gebruik van een tool voor het offloaden van code?

Als ik (in Firefox op Windows laptop) firefox open laat staan op mijn SAK Dash (met meerdere tabs, waaronder examples maar ook zelfgemaakte) dan blijft bovenin het tabblad in Firefox laden (dus voor de naam het 'pingpongend icoontje') en zie ik linksonder:


" Gegevens overbrengen van unpkg.com"

In mijn Pihole installatie zie ik alleen playerserver.walkme.com geblockt worden.en die whitelisten helpt niet. Maar zit daar wellicht een probleem? Hebben anderen het ook, of zit het in mijn netwerk?

[Voor 48% gewijzigd door Koepert op 11-07-2022 13:37]

[Koepert]

En om duistere reden... werkt het nu weer prima..

[d-vine]

Koepert schreef op maandag 11 juli 2022 @ 12:51:
Ok. Ik weet niet waar t aan ligt… maar out of nowhere werkt geen enkele SAK card meer op m’n dash. “Custom element not found” voor elke card.

Nu viel t mij op dat in browser (Brave op n Linux laptop) er erg lang gewacht moet worden (althans, staat langer in beeld) unpkg.com. Ik weet niet of dat gerelateerd is aan de werking van SAK of iets anders… maar vond t opvallend.


Oh en opnieuw downloaden werkt niet en t is elk dash. Zowel examples als zelfgebouwd met de function cards.


Maak je toevallig gebruik van een tool voor het offloaden van code?

Als ik (in Firefox op Windows laptop) firefox open laat staan op mijn SAK Dash (met meerdere tabs, waaronder examples maar ook zelfgemaakte) dan blijft bovenin het tabblad in Firefox laden (dus voor de naam het 'pingpongend icoontje') en zie ik linksonder:


" Gegevens overbrengen van unpkg.com"

In mijn Pihole installatie zie ik alleen playerserver.walkme.com geblockt worden.en die whitelisten helpt niet. Maar zit daar wellicht een probleem? Hebben anderen het ook, of zit het in mijn netwerk?

toevallig ook net druk mee bezig geweest. Ik had alleen van het weekend handmatig wat bestanden geupdate (ben met icon change en nog wat zaken aan het testen, zit prive chat ook alles door te geven)
dacht ligt daaraan.

hele VM van vrijdag terug gezet weer problemen.
updates gedaan van HA en ineens werken schiet mij maar lek

[Koepert]

Dan heeft @Mars Warrior het nog druk.. Ik was m ook wel aan t spammen met vragen/opmerkingen/verbeterpunten


Maar ja.. it fixed itself.. En ik ben idd ook bezig om mijn dashes te finetunen op basis bestaande functional cards en dan zonder de history erin, of zonder state changed, of wat ook.. maar ben nogal een noob op dat vlak.. dus wilde niet volledig dit topic spammen.. maar wellicht dat dit topic + DM + Github wat te veel van t goede is voor Mars om bij te houden.. dus wellicht dat ik t hier maar centreer en in Github als t echt n issue is.

Wat punten die ik benoemd had:

- Naamgeving van state --> Tomorrow.io pollen zijn very_Low ipv Laag, translation haperde, gaat gefixt worden;
- Te kijken naar het systeem van UI Minimalist waarbij users templates kunnen aandragen die dan na een keuring in de repo toegevoegd worden --> scheelt Mars wellicht werk maar zal toch spoedig uitbreiden: Moet hij dat wel zien zitten qua 'blow up' in werk mogelijkerwijs.

[d-vine]

Koepert schreef op maandag 11 juli 2022 @ 14:06:
Dan heeft @Mars Warrior het nog druk.. Ik was m ook wel aan t spammen met vragen/opmerkingen/verbeterpunten


Maar ja.. it fixed itself.. En ik ben idd ook bezig om mijn dashes te finetunen op basis bestaande functional cards en dan zonder de history erin, of zonder state changed, of wat ook.. maar ben nogal een noob op dat vlak.. dus wilde niet volledig dit topic spammen.. maar wellicht dat dit topic + DM + Github wat te veel van t goede is voor Mars om bij te houden.. dus wellicht dat ik t hier maar centreer en in Github als t echt n issue is.

Wat punten die ik benoemd had:

- Naamgeving van state --> Tomorrow.io pollen zijn very_Low ipv Laag, translation haperde, gaat gefixt worden;
- Te kijken naar het systeem van UI Minimalist waarbij users templates kunnen aandragen die dan na een keuring in de repo toegevoegd worden --> scheelt Mars wellicht werk maar zal toch spoedig uitbreiden: Moet hij dat wel zien zitten qua 'blow up' in werk mogelijkerwijs.

Het is niets voor niets een RC en dan is het mooi dat er veel getest wordt en verbeter punten uit komen.

Had zelf mijn eerste opzet ook op github gezet met voorbeelden zodat cards meer copy paste ingezet kunnen worden. [ https://github.com/dvine2000/Home-Assistant ]
Er is nu op de website al een aardige cards overview aan het komen.
Kun je later alles nog in categorie zetten en jou voorstel voor aandragen, goedkeuring zal ook helpen.

Het zal nu even druk zijn maar daar profiteert hij later wel van denk ik

[Mars Warrior]

Koepert schreef op maandag 11 juli 2022 @ 12:51:
Ok. Ik weet niet waar t aan ligt… maar out of nowhere werkt geen enkele SAK card meer op m’n dash. “Custom element not found” voor elke card.

Nu viel t mij op dat in browser (Brave op n Linux laptop) er erg lang gewacht moet worden (althans, staat langer in beeld) unpkg.com. Ik weet niet of dat gerelateerd is aan de werking van SAK of iets anders… maar vond t opvallend.


Oh en opnieuw downloaden werkt niet en t is elk dash. Zowel examples als zelfgebouwd met de function cards.


Maak je toevallig gebruik van een tool voor het offloaden van code?

Als ik (in Firefox op Windows laptop) firefox open laat staan op mijn SAK Dash (met meerdere tabs, waaronder examples maar ook zelfgemaakte) dan blijft bovenin het tabblad in Firefox laden (dus voor de naam het 'pingpongend icoontje') en zie ik linksonder:


" Gegevens overbrengen van unpkg.com"

In mijn Pihole installatie zie ik alleen playerserver.walkme.com geblockt worden.en die whitelisten helpt niet. Maar zit daar wellicht een probleem? Hebben anderen het ook, of zit het in mijn netwerk?

De CDN die ik gebruik, unpkg.com, had vannacht / vanochtend een storing

Eén van de dingen die ik in de toekomst nog wil doen is onafhankelijk worden van zo'n CDN en alle libraries in SAK includen. Maar dat is werk wat ik nog nooit gedaan heb...

[Mars Warrior]

Vanwege het gekloot met unpkg.com kon ik zelf ook niks testen, dus ik ben maar wat aan de handleiding gaan doen. Arm doet het ook nog niet helemaal, dus het is wat behelpen zo...

Een nieuwe kaart, de Tomorrow Pollen kaart die een enkele index kan tonen, met een leuke SVG op de achtergrond die natuurlijk meekleurt afhankelijk van de status...



Deze met een layout template:

YAML:

    - type: 'custom:swiss-army-knife-card'
      entities:
        - entity: sensor.tomorrow_io_tree_pollen_index
          name: 'Tree Pollen Index'
      layout:
        template:
          name: sak_layout_fce_tomorrow_pollen
          variables:
            - sak_layout_tomorrow_pollen_image_path: tomorrow/
            - sak_layout_tomorrow_pollen_file_prefix: pollen_tree_

Werkt pas voor jullie in de aankomende rc.3 versie overigens!

[Koepert]

Mars Warrior schreef op maandag 11 juli 2022 @ 15:36:
Vanwege het gekloot met unpkg.com kon ik zelf ook niks testen, dus ik ben maar wat aan de handleiding gaan doen. Arm doet het ook nog niet helemaal, dus het is wat behelpen zo...

Een nieuwe kaart, de Tomorrow Pollen kaart die een enkele index kan tonen, met een leuke SVG op de achtergrond die natuurlijk meekleurt afhankelijk van de status...

[Afbeelding]

Deze met een layout template:

YAML:

    - type: 'custom:swiss-army-knife-card'
      entities:
        - entity: sensor.tomorrow_io_tree_pollen_index
          name: 'Tree Pollen Index'
      layout:
        template:
          name: sak_layout_fce_tomorrow_pollen
          variables:
            - sak_layout_tomorrow_pollen_image_path: tomorrow/
            - sak_layout_tomorrow_pollen_file_prefix: pollen_tree_

Werkt pas voor jullie in de aankomende rc.3 versie overigens!

Nice. Pas wel op met je arm.. eenmaal last, te weinig rust, duurt lang voor herstel:


Ikzelf werk ook 8u p/dag met een muis, daarom deze: https://www.logitech.com/...all-mouse.910-005179.html

Is even hard wennen, maar mn arm en pols verneem ik nauwelijks meer aan t einde vd dag..

[Mars Warrior]

Koepert schreef op maandag 11 juli 2022 @ 17:12:
[...]
Nice. Pas wel op met je arm.. eenmaal last, te weinig rust, duurt lang voor herstel:

Ikzelf werk ook 8u p/dag met een muis, daarom deze: https://www.logitech.com/...all-mouse.910-005179.html

Is even hard wennen, maar mn arm en pols verneem ik nauwelijks meer aan t einde vd dag..

Ah. Zo'n ding ja. Moet ik toch eens proberen. Het is overigens niet mijn pols of onderarm, maar meer mijn bovenarm/schouder. Dus kan ook zijn door deels verkeerde houding oid.

Dus ik doe rustig aan, en wissel nu meer af. Volgens fysio gaat het weer over

Een extra Pollen Kaart die alle 3 laat zien:





De layout templates blijven het goed doen, dus dat gaat goedkomen

Door bovenstaande kaart ook de UserSvg tool uitgebreid in de zin van dat een `image` nu ook een stukje JavaScript aankan, dus kan ik de verschillende plaatjes met kleuren nu in 1 regel doen, ipv aparte states met plaatjes te moeten maken.

Ik zit nu op 30 kaarten, inclusief varianten van een aantal kaarten. Lijkt me voorlopig ff genoeg om van te leren hoe je dingen doet of kunt doen...

Het blijven immers voorbeelden

[Koepert]

Mars Warrior schreef op maandag 11 juli 2022 @ 18:12:
[...]

Ah. Zo'n ding ja. Moet ik toch eens proberen. Het is overigens niet mijn pols of onderarm, maar meer mijn bovenarm/schouder. Dus kan ook zijn door deels verkeerde houding oid.

Dus ik doe rustig aan, en wissel nu meer af. Volgens fysio gaat het weer over

Een extra Pollen Kaart die alle 3 laat zien:

[Afbeelding]

[Afbeelding]

De layout templates blijven het goed doen, dus dat gaat goedkomen

Door bovenstaande kaart ook de UserSvg tool uitgebreid in de zin van dat een `image` nu ook een stukje JavaScript aankan, dus kan ik de verschillende plaatjes met kleuren nu in 1 regel doen, ipv aparte states met plaatjes te moeten maken.

Ik zit nu op 30 kaarten, inclusief varianten van een aantal kaarten. Lijkt me voorlopig ff genoeg om van te leren hoe je dingen doet of kunt doen...

Het blijven immers voorbeelden

Nice! Mooie voorbeelden.

Bovenarm en schouder is meestal idd door ‘leunen’ op je elleboog of ‘hangen’ in je schouder (dus ja je houding).. maar door deze muis heb ik dat ook beter in controle.

[Koepert]

Ik doe trouwens vast iets fout, maar eigenlijk zou ik van een aantal cards de half-circle van een kleurtje willen voorzien... de colorstops werken bij mij (sowieso?) niet.. maar als ik de halve circle een kleur wil geven (zeg: Rood) WAAR zet ik dat dan neer?

YAML:

              - toolset: half-circle
                position:
                  cx: 0                             # Center on cards border 
                  cy: 50
                tools:
                  # ------------------------------------------------------------
                  - type: circle
                    position:
                      cx: 50
                      cy: 50
                      radius: 50
                    show:
                      style: 'colorstops'
                    entity_index: 0
                    colorstops:
                      fill: true
                      colors:
                        0: var(--brand-google-green)
                        60: var(--brand-google-yellow)
                        120: var(--brand-google-red)
                    styles:
                      circle:
                        stroke: none
                        opacity: 0.25
                        fill: var(--theme-sys-elevation-surface-neutral4)

[Mars Warrior]

Koepert schreef op dinsdag 12 juli 2022 @ 12:47:
Ik doe trouwens vast iets fout, maar eigenlijk zou ik van een aantal cards de half-circle van een kleurtje willen voorzien... de colorstops werken bij mij (sowieso?) niet.. maar als ik de halve circle een kleur wil geven (zeg: Rood) WAAR zet ik dat dan neer?

YAML:

              - toolset: half-circle
                position:
                  cx: 0                             # Center on cards border 
                  cy: 50
                tools:
                  # ------------------------------------------------------------
                  - type: circle
                    position:
                      cx: 50
                      cy: 50
                      radius: 50
                    show:
                      style: 'colorstops'
                    entity_index: 0
                    colorstops:
                      fill: true
                      colors:
                        0: var(--brand-google-green)
                        60: var(--brand-google-yellow)
                        120: var(--brand-google-red)
                    styles:
                      circle:
                        stroke: none
                        opacity: 0.25
                        fill: var(--theme-sys-elevation-surface-neutral4)

Het kan zijn dat jou versie van het thema nog achterloopt die de brand colors niet kent...

Als je als test gewoon de kleuren 'red', 'yellow' en 'green' gebruikt zou je wat moeten zien.

Verder als je geen colorstop gebruikt, is de laatste fill diegene waarmee je de cirkel een vaste kleur geeft.

[Koepert]

Die red/yellow green werkt dus wel als je ze alle3 wijzigt

Dom. Logisch ook vooral

[Voor 21% gewijzigd door Koepert op 12-07-2022 14:22]

[Ben.Hahlen]

Woei! Het is mij ondertussen gelukt om het werkend te krijgen

Mars Warrior schreef op maandag 11 juli 2022 @ 18:12:
[...]
Een extra Pollen Kaart die alle 3 laat zien:

[Afbeelding]

[Afbeelding]

De layout templates blijven het goed doen, dus dat gaat goedkomen

Door bovenstaande kaart ook de UserSvg tool uitgebreid in de zin van dat een `image` nu ook een stukje JavaScript aankan, dus kan ik de verschillende plaatjes met kleuren nu in 1 regel doen, ipv aparte states met plaatjes te moeten maken.

Ik zit nu op 30 kaarten, inclusief varianten van een aantal kaarten. Lijkt me voorlopig ff genoeg om van te leren hoe je dingen doet of kunt doen...

Het blijven immers voorbeelden

Deze kaart is héél nuttig voor mij, maar die verwijst naar de 1.0.0.rc.3 tag, die nog niet bestaat
Ook de images kan ik nog niet los vinden, dus ik vermoed dat je die "verstopt" hebt nog ergens?

Andere vraag mijnerzijds:
Nee, ik zie nu dat de environment card met 1.0.0.rc.3 gebruik gaat maken van een template, dus dat zal heel veel dubbele code schelen

Looking forward to it!

[Mars Warrior]

Ben.Hahlen schreef op woensdag 13 juli 2022 @ 14:25:
Woei! Het is mij ondertussen gelukt om het werkend te krijgen

Mooi!

Deze kaart is héél nuttig voor mij, maar die verwijst naar de 1.0.0.rc.3 tag, die nog niet bestaat
Ook de images kan ik nog niet los vinden, dus ik vermoed dat je die "verstopt" hebt nog ergens?

Andere vraag mijnerzijds:
Nee, ik zie nu dat de environment card met 1.0.0.rc.3 gebruik gaat maken van een template, dus dat zal heel veel dubbele code schelen

Looking forward to it!

Ik ben al beetje aan het vooruit werken in de documentatie, terwijl ik zaken aan het testen ben, dus vandaar het label, zodat mensen erachter komen dat die versie nog niet uit is

De lijst waaraan ik werk voor de rc.3 versie kun je hier zien

31 kaarten 'omkatten' naar een layout template + documentatie + testen is ff wat werk, maar het gaat lukken hoor als ik voldoende tijd kan vinden de komende week...

Het kunnen gebruiken van layout templates maakt het integreren in je eigen installatie een stuk eenvoudiger omdat je enkel wat entities en variabelen/instellingen moet opgeven vanuit een view.

Ook leuk:



De tekst met pollen index was ook maar vulmiddel, en dan is dit toch leuker

[Koepert]

NIce

Vraagje omtrent actions uit een card. Dit moet toch in theorie op elke card werken?

YAML:

                  - type: icon
                    position:
                      cx: 50
                      cy: 50
                      align: center
                      icon_size: 45
                    entity_index: 0
                    styles:
                      icon:
                        fill: var(--theme-sys-color-secondary)
                        opacity: 0.9
                    user_actions:
                      tap_action:
                        actions:
                          - action: call-service
                            service: script.1633261370087
                            service_data:
                              entity_id: input_number.arcadizax
                              step: 100

Specifiek het stuk vanaf User_actions

[Mars Warrior]

Koepert schreef op woensdag 13 juli 2022 @ 17:39:
NIce

Vraagje omtrent actions uit een card. Dit moet toch in theorie op elke card werken?

YAML:

                  - type: icon
                    position:
                      cx: 50
                      cy: 50
                      align: center
                      icon_size: 45
                    entity_index: 0
                    styles:
                      icon:
                        fill: var(--theme-sys-color-secondary)
                        opacity: 0.9
                    user_actions:
                      tap_action:
                        actions:
                          - action: call-service
                            service: script.1633261370087
                            service_data:
                              entity_id: input_number.arcadizax
                              step: 100

Specifiek het stuk vanaf User_actions

Yep, elke tool kan eigen actions hebben. Doet deze het wel handmatig vanuit HA?

Ik zie zo even geen fouten namelijk in de config.

[Koepert]

In UI minimalist gebruik ik dezelfde card/actie. Daar is die als volgt geformuleerd (en werkt)

YAML:

               tap_action:
                  action: call-service
                  service: script.1633261370087
                  service_data:
                    entity_id: input_number.grazax
                    step: 120

Dus zonder het user_actions ervoor


De foutmeldingen die na de actie naar boven komen zijn:

Logger: frontend.js.latest.202207070
Source: components/system_log/__init__.py:190
First occurred: 17:27:51 (6 occurrences)
Last logged: 17:37:02

IPADRES:8123/hacsfiles/swiss-army-knife-card/swiss-army-knife-card.js?hacstag=2147861121002:27:14763 TypeError: undefined is not an object (evaluating 'i.actions.length')
IPADRES:8123/local/community/swiss-army-knife-card/SVGInjector.min.js?module:155:41 Uncaught TypeError: t.cloneNode is not a function
IPADRES:8123/hacsfiles/swiss-army-knife-card/swiss-army-knife-card.js?hacstag=2147861121002:27:5571 Uncaught TypeError: Cannot read properties of undefined (reading 'length')

[Mars Warrior]

Die foutmelding geeft aan dat actions geen lijst is, maar die heb je wel gedefinieerd zie ik, tenzij er toch iets met spaties mis zit in de yaml code.

De software loopt simpelweg de lijst met actions af, en doet dan de action uitvoeren.

En als je er een andere action van maakt, om bijv een lamp te togglen?

[Koepert]

YAML:

                    user_actions:
                      tap_action:
                        action: call-service
                        service: light.toggle
                        service_data:
                          entity_id: light.hue_tv_1

Dit werkt ook niet.. dus t ligt ergens in de formatting

[Koepert]

Deze doet t wel

YAML:

                    user_actions:
                      tap_action:
                        actions:
                        - action: call-service
                          service: script.1633261370087
                          service_data:
                            entity_id: input_number.dymista
                            step: 90

Ik zie t verschil niet met de originele...

[Mars Warrior]

Koepert schreef op woensdag 13 juli 2022 @ 19:40:
Deze doet t wel

YAML:

                    user_actions:
                      tap_action:
                        actions:
                        - action: call-service
                          service: script.1633261370087
                          service_data:
                            entity_id: input_number.dymista
                            step: 90

Ik zie t verschil niet met de originele...

Dat probleem heb ik dus ook. Zoek de 10 verschillen. Maar mijn ervaring met YAML is zodanig dat het 99 van de 100 keer dus aan MIJ ligt omdat ik ergens iets in de uitlijning ofzo fout heb gedaan.

Het opnieuw invoeren helpt dan vaak

[Koepert]

K heb weer n ander probeersel...

De Person card. Die maakt gebruik van n icon (mannetje/vrouwtje).. Zou je die ook kunnen vervangen voor de entity picture?

Kun je dat IN de tool icon doen, of moet je daar een geheel nieuwe tool voor maken/gebruiken?

Ik dacht er met dit wel te zijn.. dat is echter niet zo

YAML:

                    show_entity_picture: true
                    entity_picture:
                      "[[[states(person.XXX.attributes.entity_picture)]]]"

[d-vine]

Koepert schreef op donderdag 14 juli 2022 @ 09:23:


De Person card. Die maakt gebruik van n icon (mannetje/vrouwtje).. Zou je die ook kunnen vervangen voor de entity picture?

Kun je dat IN de tool icon doen, of moet je daar een geheel nieuwe tool voor maken/gebruiken?

[/quote]


Daar had ik ook nog kort na gekeken maar was wat lastig, had de focus eerst gelegd op wat ik echt nodig had
Zou leuk zijn als de foto's meegenomen konden worden.

Heb nu de afvalbeheer in een wide card gezet.
Links flashing met 2 icoontjes als afval vandaag of morgen is en de datums van alles in een overzicht.
Misschien nog wat vormgeving fine tuning maar dat komt later.



Grotendeels zit bij mij alles erin, moet nog wat leuks verzinnen met evohome verwarming.
eerst even een break en vakantie straks

@Mars Warrior
Goed bezig met alle voorbeelden.
kleine note:
Zie nu vooral veel wide cards denk dat ook mooi is als er een aantal vierkante cards bij komen en misschien in categorieën plaatsen.
Denk dat die SAK2 voorbeelden ook de aandacht trekken om te gebruiken alleen die werkten nog niet lekker bij mij en zag op HA forum bij andere ook niet. Misschien heb je dit al verholpen.
En ik heb natuurlijk al een batterij met van de colorful mix kaarten gebruikt
Maar als er al aantal voorbeelden in RC3 zitten heb ik niets gezegd;)

Verder top werk met die voorbeelden zal veel mensen op weg helpen.

[Voor 4% gewijzigd door d-vine op 14-07-2022 15:36]

[Koepert]

d-vine schreef op donderdag 14 juli 2022 @ 09:37:
[quote]Koepert schreef op donderdag 14 juli 2022 @ 09:23:
K heb weer n ander probeersel...

De Person card. Die maakt gebruik van n icon (mannetje/vrouwtje).. Zou je die ook kunnen vervangen voor de entity picture?

Daar had ik ook nog kort na gekeken maar was wat lastig, had de focus eerst gelegd op wat ik echt nodig had
Zou leuk zijn als de foto's meegenomen konden worden.

Heb nu de afvalbeheer in een wide card gezet.
Links flashing met 2 icoontjes als afval vandaag of morgen is en de datums van alles in een overzicht.
Misschien nog wat vormgeving fine tuning maar dat komt later.

[Afbeelding]

Grotendeels zit bij mij alles erin, moet nog wat leuks verzinnen met evohome verwarming.
eerst even een break en vakantie straks

@Mars Warrior
Goed bezig met alle voorbeelden.
kleine note:
Zie nu vooral veel wide cards denk dat ook mooi is als er een aantal vierkante cards bij komen en misschien in categorieën plaatsen.
Denk dat die SAK2 voorbeelden ook de aandacht trekken om te gebruiken alleen die werkten nog niet lekker bij mij en zag op HA forum bij andere ook niet. Misschien heb je dit al verholpen.
En ik heb natuurlijk al een batterij met van de colorful mix kaarten gebruikt
Maar als er al aantal voorbeelden in RC3 zitten heb ik niets gezegd;)

Verder top werk met die voorbeelden zal veel mensen op weg helpen.

Heb je die kaart al ergens beschikbaar?

K doe t nu zo, visueel wel prima, maar niet helemaal in stijl, zeker als ik die onderste glance kan vervangen

[d-vine]

Koepert schreef op donderdag 14 juli 2022 @ 09:49:
[...]


Heb je die kaart al ergens beschikbaar?

K doe t nu zo, visueel wel prima, maar niet helemaal in stijl, zeker als ik die onderste glance kan vervangen

[Afbeelding]

Mijn hele config even geüpdatet in github.

https://github.com/dvine2000/Home-Assistant

Config die nu draait zit hier
swiss-army-knife-card-custom settings-dvine/config/lovelace/views/


Alle eigen gemaakte kaarten ook apart vermeld hier
swiss-army-knife-card-custom settings-dvine/config/custom SAKE cards/


Die afvalbeheer kaart is nog erg lang met code maar dat komt omdat de icon change nog niet werkt met de nieuwe voorwaarden. getest tot ik ons woog maar helaas dus dan maar even zo.
Moest alle iconen wel steeds erin zetten en filteren anders kwamen ze steeds in beeld terwijl de dag van ophalen dan niet wat. geode was het...

Als het goed is met RC3 kan alles ingekort worden maar dat komt later wel keer.
beetje als If it works it aint stupid

[Voor 6% gewijzigd door d-vine op 14-07-2022 11:27]

[Koepert]

Thx

Wat doet het input_select TOM deel in de yaml? Zo te zien is dat knip/plak foutje?

[d-vine]

Koepert schreef op donderdag 14 juli 2022 @ 10:15:
Thx

Wat doet het input_select TOM deel in de yaml? Zo te zien is dat knip/plak foutje?

ja foutje even te snel copy paste selection
gelijk aangepast.

[Koepert]

Ik kon al niet helemaal plaatsen wat die met de kaart deed

[Koepert]

Ander dingetje @Mars Warrior .. Ik kon het gisteren niet terug vinden, maar in de (versie die ik nog heb) van de overzichtkaarten


Staat in de YAML heel vaak (bewust?) foutgespelde

toolset: colomn-xxxx

Is dat bewust? column..

Ik kwam er op omdat ik deze wilde ombouwen naar 1 voor de printer. maar dan mis ik 1 kolom (eigenlijk wil ik dat de batterij OOK n inktniveau is.. Nu ben ik die qua looks aan t omkatten

[Voor 44% gewijzigd door Koepert op 14-07-2022 14:20]

[Koepert]

Als je dan klaar bent krijg je dit

[Koepert]

Heb nog een vraag, die wellicht tegen RC3 al obsolete is..

Je gebruikt in een card diverse toolsets, met een naam. Kun je die naam gewoon straffeloos editten?

Dus ik heb van SAKE7 mijn serverpanel gemaakt, incl NAS en Speedtest en nog wat zaken. en hou dat nu zo uit elkaar:

YAML:

              - toolset: disc #Download

Dit betreft dus de config van de speedtest.download sensor, maar qua layout gebruik ik de DISC toolset. Kan ik die voor mn eigen gemak "download" noemen? Dus ik gebruik de toolset 5 x, maar hernoem deze 4x vanaf t origineel.

[Voor 6% gewijzigd door Koepert op 14-07-2022 15:01]

[Mars Warrior]

Ah, leuk. Een functional printer card



Je had de server statistics card nog kunnen gebruiken als beginpunt. Die ziet er bijna hetzelfde uit. Als die layout oid verbouwd zou worden, dan zou je beide kunnen tonen, dus eigenlijk gewoon 4x een sensor...

Je moet bij de 1ste entity nog ff decimals: 0 invoeren, dan ben je die .0 kwijt...

Verder ff kort:

• column is toch goed gespeld, of licht het aan mij
• de naam van een toolset is maar een naam. Heeft niks te betekenen. Is enkel voor mij als lezer zodat ik bepaalde delen kan zoeken...
• pictures worden nog niet ondersteund. Is nog geee tool voor, dus zoiets moet nog komen. Ga ervan uit dat de SVG tool dat niet kan, want die verwacht een SVG te laden.
  En vergeet ook niet dat een image dan 1:1 wordt weergegeven, dus vierkant is vierkant en rond is rond. Er is namelijk ook nog geen ondersteuning voor clip paths en masks...

[Koepert]

Column klopt ook wel, dus dat ligt niet aan jou

https://github.com/Amoebe...nife-card/search?q=colomn

T zat in 12 , daar heb ik uit view-sake12-m3.yml je wide-card gepakt om verder toe te passen.


Mbt de Naam: Ok, dus als ik in mijn yaml een toolset hernoem voor die specifieke card, heeft dat geen impact op andere cards (in dezelfde yaml?) met dezelfde toolset.Zoals gezegd: ik heb voorbeeld-view 7 voorzien van mijn PFsense, PiHole en Synology als extra 'servers' en een speedtest met een uitgekleed overzicht (3 cirkels) en die gebruiken allemaal de toolsets van jouw voorbeeldserver, en dus is bij de speedtest toolset cpu, de download sensor, etc..

Maar als ik dat dus idd straffeloos kan aanpassen, mooi

Pictures: Prima, is ook een antwoord vond het wel fancy, maar geen vereiste.

[Mars Warrior]

Haha! Een plaatje van een wasmachine voor de AQI...



Ik had gelukkig nog oude code, van voor de SVG Injector, en die kon inderdaad zowel SVG, JPG als PNG laden. Dus ik doe nu een check op extensie, en doe dan of het ene renderpad of het andere...

Alles dus in de usersvg tool. Scheelt weer een tool, en dan kan deze evt. nog meer dingen gaan ondersteunen straks zoals een clip en mask ofzo. Maar dat is weer werk...

Dat betekent niet natuurlijk dat een Person Card nu ff een entity picture kan laden. Zo flexibel is dat ook niet, maar ik moet ff kijken hoe ik daar nu een usersvg oid in krijg...

Man, man, man. Denk dat iets met display: none dan nodig is, die wordt gezet afhankelijk van een variabele of zo. Wordt wel weer extra javascript

[Voor 8% gewijzigd door Mars Warrior op 14-07-2022 16:47]

[Koepert]

Hey @Mars Warrior tof. Maar als je nou eerst focust op RC3 release-ready te maken
- Documentatie op orde
- Bestaande kaarten omkatten

Dan krijg je door de templates ook een eenvoudiger omkat-proces. En kunnen wij wat eenvoudiger wellicht voorbeelden aandragen.

(ik bedoel dit goed, en opbouwend hoor!)

Dat je nu direct duikt op het picture als vervanging van n icon is tof en staat je ook te prijzen, maar is denk ik in dit stadium nog eerder contraproductief.

[Mars Warrior]

Van al dat omkatten en documentatie maken sterven teveel hersencellen

En dit was 5 minuten werk en 3 regels code: dat levert weer wat op aan blije hersencellen

Afwisseling levert bij mij meer op dan je denkt

[Koepert]

Ik vroeg me nog wat andere af. Zit er eigenlijk verschil tussen de M3 C- en D thema’s? Even los van kleur uiteraard.

[Koepert]

Ben ik met nog 1..

Ik heb een aantal reistijd sensoren. die geven een tijd in minuten aan. alleen de standaard 'state' template heeft bij uom (aanname: Unit of Measurement) none staan. Kun je daar eender wat in vullen? Want tot op heden pakt hij nog niets op

[code=yaml]
- type: state
position:
cx: 50
cy: 37
entity_index: 0
show:
uom: 'minutes'
styles:
state:
text-anchor: start
font-size: 30em
font-weight: 700
opacity: 0.7
[/]

Lost op als je

YAML:

                    show:
                      uom: 'minutes'

er uit gooit.

[Voor 7% gewijzigd door Koepert op 15-07-2022 12:16]

[Mars Warrior]

Koepert schreef op donderdag 14 juli 2022 @ 22:59:
Ik vroeg me nog wat andere af. Zit er eigenlijk verschil tussen de M3 C- en D thema’s? Even los van kleur uiteraard.

Nee, geen verschillen anders dan kleur.

Het is de manier waarmee ze in de Figma builder zijn gemaakt:

• C gaat over het gebruik van een Custom color als input om een schema op te zetten
• D gaat over het gebruik van een Dynamic color (plaatje) als input om een schema op te zetten

[Mars Warrior]

En na nog een tiental regels code en wat blije hersencellen om die oplossing te bedenken heeft de usersvg tool nu weer ondersteuning voor png en jpg bestanden

De wasmachine weer, maar nu met een clip path (rondje) en een mask (opacity neemt toe naar de randen):



En natuurlijk leuk voor de Person Card. Kun je ook je eigen kop erin plakken, al kreeg bij mij de wasmachine weer voorrang natuurlijk:



Na zoveel creativiteit is er weer ruimte om wat documentatie af te maken voor rc.3

[Koepert]

Probeersel van deze kant weer. Ik heb onze tv (en KPN box) gecombineerd tot 1 remote, bestaande uit allerlei custom:button-cards (op basis van 2 templates eigenlijk). Die remote is daardoor een combinatie van input-button_press acties en media-player acties. Ik ben nu aan het proberen dat om te katten naar de stijl van deze cards. Dus 2 switch cards voor aan/uit en 2 light-slider cards voor volume. (Die laatste doen nog niet wat ze moeten doen hoor)

[Koepert]

Of toch maar zo met Switch1 card.. iets eenvoudiger (hoewel correct gespiegeld uitlijnen een bitch is)

[Mars Warrior]

Je bent lekker bezig. Uitlijnen en dat soort dingen is bij mij vaak ook trial-and-error, maar uiteindelijk leer je ook dat je eea kunt uitrekenen... Tenslotte is een kaart niets anders dan een grid. 4/1 aspectratio is 400x100, dus dan is goed uit te rekenen / te schatten waar iets moet komen voor een toolset.

Ik heb nog wat gedaan om een stuk documentatie te kunnen schrappen door een kleine uitbreiding op de sensor layout template te doen. Je kunt een tool nu op disabled zetten. In de software is het een `if (!disabled) then {}', dus dat was schokkend

Het resultaat is dat ik nu met 1 template 6 varianten kan laten zien:

• met/zonder historie
• default thema kleuren
• segmented arc met colorstop
• icon met colorstop
• halve cirkel met colorstop

Er zit zo blijkt nog wel een bug in de afhandeling van een colorstop, afhankelijk van de tool, want ik zie bij de grensovergangen soms andere kleuren. De ene tool geeft groen, de andere doet geel.

Zal wel iets met > vs >= enzo te maken hebben.

De battery card is dus nu ook slechts een sensor card

Ik hou dan nog wel wat verschillende sensor layouts over, zoals andere aspectratio's, maar dat is dan ook alles. Voor de rest zijn de mogelijkheden instelbaar, en daarvoor zijn geen verschillende layouts (en dus documentatie) meer nodig.

Scheelt weer een berg onnodig onderhoud

[Mars Warrior]

Voor de sensor kaart waren er nog twee varianten:

• één met de volgorde Name, State (#1a en #1ca)
• en één met de volgorde State, Name (#1b en #1cb)

Dus ik dacht, die maak ik ook nog instelbaar, dan heb je weer 1 kaart minder.
Doordat ik nu tools kan disablen, is het UITzetten van een tool geen probleem. Maar als je maar 1 variabele gebruikt om dit in te stellen, dan moet je dus voor de andere disabled vlag een NOT ervoor zetten. Tsja, dat kan niet in YAML, die kent geen operators... Alles is immers gewoon text.

Dat werd dus 1 regel JavaScript toevoegen dacht ik. Maar de JavaScript parser gaat uit van een levende tool, dus een tool die al is aangemaakt. Maar dat is in dit geval niet zo. Dus een simpele tweede parser gemaakt van een paar regels die enkel de tool_config kent (en niet de state, states, etc.).

Toen was het nog ff zoeken waar ik die parser ertussen moet plakken bij het inlezen van de YAML configuratie.

En het resultaat is mooi. De bovenste rij zijn aparte kaarten, de onderste rij is 1 kaart met een extra variabele als parameter sak_layout_sensor_name_above_state die op true of false gezet kan worden



Nu ben ik er wel denk ik

Het kunnen uitzetten van een tool in de YAML configuratie scheelt een hele hoop layouts. Want die kaarten die nu een battery icoontje laten zien rechtsbovenin gaan natuurlijk fout als je geen battery entity meegeeft.

En nu kun je dat gewoon uitzetten. Dus die layouts zijn zowel bruikbaar voor een entity met als een entity zonder batterij! Oftewel voor zowel draadloze als bedrade sensoren!

De introductie van layout templates had dus nog even wat meer leuke gevolgen dan ik eerst dacht. Je moet alleen al die gevolgen ff wat aandacht geven

[Mars Warrior]

Ik heb een PRE-release gemaakt op Github. Deze ga ik nu nog testen.

Via HACS kun je hem ook gebruiken door beta oid aan te vinken, dan zie je de pre-releases ook.



De documentatie vwb de functionele kaart voorbeelden is bijgewerkt. De tools zelf nog niet die wat veranderd en/of uitgebreid zijn. Dat moet nog gebeuren.

Als ik geen gekke dingen meer vind met deze versie dan maak ik een echte release in één van de komende dagen als het niet te warm is om achter de computer te zitten tenminste

Vanochtend om 6u was het nog lekker, dus heb er al weer 5 uurtjes opzitten om alles te mergen

[Voor 5% gewijzigd door Mars Warrior op 17-07-2022 11:15]

[Ben.Hahlen]

Ik probeer de pollen card werkend te krijgen, maar loop tegen de volgende error aan:

YAML:

Cannot read properties of undefined (reading 'templates')
type: custom:swiss-army-knife-card
entities:
  - entity: sensor.tomorrow_io_tree_pollen_index
    name: Trees
  - entity: sensor.tomorrow_io_grass_pollen_index
    name: Grass
  - entity: sensor.tomorrow_io_weed_pollen_index
    name: Weed
layout:
  template:
    name: sak_layout_fce_tomorrow_pollen_all
    variables:
      - sak_layout_tomorrow_pollen_image_path: tomorrow/

Ik heb volgens mij alles up-to-date- met de pre-release, zou het daarmee moeten werken?

[Mars Warrior]

Ben.Hahlen schreef op maandag 18 juli 2022 @ 12:37:
Ik probeer de pollen card werkend te krijgen, maar loop tegen de volgende error aan:

YAML:

Cannot read properties of undefined (reading 'templates')
type: custom:swiss-army-knife-card
entities:
  - entity: sensor.tomorrow_io_tree_pollen_index
    name: Trees
  - entity: sensor.tomorrow_io_grass_pollen_index
    name: Grass
  - entity: sensor.tomorrow_io_weed_pollen_index
    name: Weed
layout:
  template:
    name: sak_layout_fce_tomorrow_pollen_all
    variables:
      - sak_layout_tomorrow_pollen_image_path: tomorrow/

Ik heb volgens mij alles up-to-date- met de pre-release, zou het daarmee moeten werken?

Je moet wel het template uit de ha-config map halen op github, en de plaatjes, en je moet de integratie installeren, en daarna nog je entiteiten aanpassen aan jou systeem.

Maar daarna moet het werken

[Ben.Hahlen]

Mars Warrior schreef op maandag 18 juli 2022 @ 19:19:
[...]

Je moet wel het template uit de ha-config map halen op github, en de plaatjes, en je moet de integratie installeren, en daarna nog je entiteiten aanpassen aan jou systeem.

Maar daarna moet het werken

Ja... Dat heb ik volgens mij gedaan... Dat is nu juist waarom ik het zo gek vind dat het niet werkt

code:

[ha-config] $ pwd
/home/download/CONF/homeassistant/tmp/swiss-army-knife-card-p1.0.0-rc.3/ha-config
[ha-config] $ diff -r lovelace/ ../../../lovelace/
[ha-config] $ diff -r themes/ ../../../themes/
Only in ../../../themes/: google_theme
[ha-config] $ diff -r www/ ../../../www/
Only in ../../../www/: afvalwijzer
Only in ../../../www/: community
Only in ../../../www/: pictures
[ha-config] $

code:

[homeassistant] $ diff www/community/swiss-army-knife-card/ tmp/swiss-army-knife-card-p1.0.0-rc.3/dist/
Only in www/community/swiss-army-knife-card/: SVGInjector.min.js.gz
Only in www/community/swiss-army-knife-card/: swiss-army-knife-card.js.gz

Ik heb via HACS geüpdate, dus dat zou ook goed moeten zijn, denk ik.

EDIT:
De entiteiten zijn ook goed, hij klaagt over dat hij de template niet kan laden, op de één of andere manier...

[Voor 4% gewijzigd door Ben.Hahlen op 19-07-2022 10:09. Reden: Addendum]