Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test lovelace 5.x

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.1k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.8k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.1k

Test lovelace 5.x

Scheduled Pinned Locked Moved Tester
968 Posts 91 Posters 418.5k Views 74 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • David G.D Online
    David G.D Online
    David G.
    wrote on last edited by David G.
    #306

    Nochmal zu meinen veränderten Farben in der neuen Version.

    Habe ja auf einmal einiges Orange. Finde aber in meinem ganzen Theme kein Orange.....

    Haben sich die Bezeichnungen verändert?

    Auch hier sehe ich Orange anstatt Weiß:

          - type: state-icon
            entity: input_boolean.roborock_0_alive
            tap_action:
              action: none
            state_color: true
            style:
              top: 4%
              left: 95%
              '--paper-item-icon-active-color': white
              '--paper-item-icon-color': red
    

    EDIT
    Selbst im Standard Theme sind die Teile Orange.
    Ob mein YAML das irgendwie überschreibt.....

    Selbst da hab ich Orange
    Screenshot_20230709_115718_Chrome.jpg :

    Zeigt eure Lovelace-Visualisierung klick
    (Auch ideal um sich Anregungen zu holen)

    Meine Tabellen für eure Visualisierung klick

    XBiTX 1 Reply Last reply
    0
    • David G.D David G.

      Nochmal zu meinen veränderten Farben in der neuen Version.

      Habe ja auf einmal einiges Orange. Finde aber in meinem ganzen Theme kein Orange.....

      Haben sich die Bezeichnungen verändert?

      Auch hier sehe ich Orange anstatt Weiß:

            - type: state-icon
              entity: input_boolean.roborock_0_alive
              tap_action:
                action: none
              state_color: true
              style:
                top: 4%
                left: 95%
                '--paper-item-icon-active-color': white
                '--paper-item-icon-color': red
      

      EDIT
      Selbst im Standard Theme sind die Teile Orange.
      Ob mein YAML das irgendwie überschreibt.....

      Selbst da hab ich Orange
      Screenshot_20230709_115718_Chrome.jpg :

      XBiTX Offline
      XBiTX Offline
      XBiT
      wrote on last edited by
      #307

      @david-g

      ja da hat sich was geändert habe ich auch schon festgestellt..

      bei einem binary sensor ist es 'state-binary_sensor-on-color'
      bei einen switch ist es 'state-switch-on-color'
      denke bei input_boolean wird es 'state-input_boolean-on-color' sein... habe ich jetzt aber nicht getestet

      David G.D 2 Replies Last reply
      1
      • XBiTX XBiT

        @david-g

        ja da hat sich was geändert habe ich auch schon festgestellt..

        bei einem binary sensor ist es 'state-binary_sensor-on-color'
        bei einen switch ist es 'state-switch-on-color'
        denke bei input_boolean wird es 'state-input_boolean-on-color' sein... habe ich jetzt aber nicht getestet

        David G.D Online
        David G.D Online
        David G.
        wrote on last edited by
        #308

        @xbit

        Danke, werde ich morgen mal am Rechner testen.

        Die machen da ganz schön oft was....
        Hatte jetzt schon ein paar mal, dass ich nach einem Update das Theme anpassen musste. Was übereifrig die Jungs bei HA 🤣

        Zeigt eure Lovelace-Visualisierung klick
        (Auch ideal um sich Anregungen zu holen)

        Meine Tabellen für eure Visualisierung klick

        1 Reply Last reply
        0
        • XBiTX XBiT

          @david-g

          ja da hat sich was geändert habe ich auch schon festgestellt..

          bei einem binary sensor ist es 'state-binary_sensor-on-color'
          bei einen switch ist es 'state-switch-on-color'
          denke bei input_boolean wird es 'state-input_boolean-on-color' sein... habe ich jetzt aber nicht getestet

          David G.D Online
          David G.D Online
          David G.
          wrote on last edited by
          #309

          @xbit

          Bekomme das Orange einfach nicht überall weg.
          Hab mir jetzt mal eine neue Instanz angelegt, ob nicht irgend eine custom card oder ein cardmod irgendetwas erschießt.

          Auch da habe ich das Orange. War das schon immer so? Habt ihr das auch?

          Screenshot_20230714_215157_Chrome.jpg

          Zeigt eure Lovelace-Visualisierung klick
          (Auch ideal um sich Anregungen zu holen)

          Meine Tabellen für eure Visualisierung klick

          XBiTX 1 Reply Last reply
          0
          • David G.D David G.

            @xbit

            Bekomme das Orange einfach nicht überall weg.
            Hab mir jetzt mal eine neue Instanz angelegt, ob nicht irgend eine custom card oder ein cardmod irgendetwas erschießt.

            Auch da habe ich das Orange. War das schon immer so? Habt ihr das auch?

            Screenshot_20230714_215157_Chrome.jpg

            XBiTX Offline
            XBiTX Offline
            XBiT
            wrote on last edited by XBiT
            #310

            @david-g

            ich habe das Orange auch und es war noch nicht immer so ....
            kommt vom ha-icon css wo auch immer das ist.
            Ich ändere die Farbe im Themen wieder so wie ich es haben will.

            Screenshot 2023-07-14 222453.png

            mit den Einträgen in deinen Themen sollten die Icons weiß sein (Im Zustand True)

              state-binary_sensor-on-color: rgba(255, 255, 255, 1)
              state-binary_sensor-active-color: rgba(255, 255, 255, 1)
            
            David G.D 1 Reply Last reply
            1
            • David G.D Online
              David G.D Online
              David G.
              wrote on last edited by David G.
              #311

              @xbit

              Bin noch nicht zu gekommen as Theme anzupassen.....

              Jedoch hab ich grad ein weiteres Problem entdeckt.
              Die Popups klappen nicht mehr überall. Scheint aber vereinzelt zu sein.....

              Hier Zb geht ein Popup ohne Inhalt auf, obwohl es eigentlich (wie ich finde) korrekt ist:

                - type: state-label
                  entity: sensor.Geraete_Mobbie_Zustand_seitenbuerste
                  tap_action:
                    action: fire-dom-event
                    browser_mod:
                      service: browser_mod.popup
                      data:
                        content:
                          show_name: true
                          show_icon: true
                          icon: mdi:autorenew
                          type: button
                          tap_action:
                            action: toggle
                          entity: input_boolean.Roborock_Reset_seitenbuerste
                          name: Reset Seitenbürste
              

              Bei anderen öffnet sich garnichts.

              EDIT
              Bin jetzt mal auf die letzte offizielle Version.
              Da klappen alle Popups.
              @Garfonso
              Kann das an der neuen Version und den Anpassungen liegen oder denkst du eher, dass die bei HA was angepasst haben?

              Zeigt eure Lovelace-Visualisierung klick
              (Auch ideal um sich Anregungen zu holen)

              Meine Tabellen für eure Visualisierung klick

              FoggF 1 Reply Last reply
              0
              • David G.D David G.

                @xbit

                Bin noch nicht zu gekommen as Theme anzupassen.....

                Jedoch hab ich grad ein weiteres Problem entdeckt.
                Die Popups klappen nicht mehr überall. Scheint aber vereinzelt zu sein.....

                Hier Zb geht ein Popup ohne Inhalt auf, obwohl es eigentlich (wie ich finde) korrekt ist:

                  - type: state-label
                    entity: sensor.Geraete_Mobbie_Zustand_seitenbuerste
                    tap_action:
                      action: fire-dom-event
                      browser_mod:
                        service: browser_mod.popup
                        data:
                          content:
                            show_name: true
                            show_icon: true
                            icon: mdi:autorenew
                            type: button
                            tap_action:
                              action: toggle
                            entity: input_boolean.Roborock_Reset_seitenbuerste
                            name: Reset Seitenbürste
                

                Bei anderen öffnet sich garnichts.

                EDIT
                Bin jetzt mal auf die letzte offizielle Version.
                Da klappen alle Popups.
                @Garfonso
                Kann das an der neuen Version und den Anpassungen liegen oder denkst du eher, dass die bei HA was angepasst haben?

                FoggF Offline
                FoggF Offline
                Fogg
                wrote on last edited by
                #312

                Bin mir nicht ganz sicher ob ich hier richtig bin ...

                Ich bastle gerade eine Visualisierung mit Lovelace, soweit klappt das gut. Nun habe ich gesehen ich kann Unteransichten machen welche nicht direkt als Tab auftauchen. Das wäre super, aber wie komme ich dann da hin? Gibt es eine Navigations-Komponente oder sowas? Noch habe ich leider nichts gefunden.

                David G.D 1 Reply Last reply
                0
                • FoggF Fogg

                  Bin mir nicht ganz sicher ob ich hier richtig bin ...

                  Ich bastle gerade eine Visualisierung mit Lovelace, soweit klappt das gut. Nun habe ich gesehen ich kann Unteransichten machen welche nicht direkt als Tab auftauchen. Das wäre super, aber wie komme ich dann da hin? Gibt es eine Navigations-Komponente oder sowas? Noch habe ich leider nichts gefunden.

                  David G.D Online
                  David G.D Online
                  David G.
                  wrote on last edited by David G.
                  #313

                  @fogg

                  Du musst den Namen der Seite wissen den du vergeben hast.

                  Dann http://192.168.99.33:8091/lovelace/name

                  IP und Port ggf anpassen.

                  EDIT
                  Über diesen Weg kann man auch gut hin navigieren.
                  Die verfügbaren Seiten werden einem unter Navigationspfad vorgeschlagen.

                  Screenshot_20230719_012211_Fully Kiosk Browser.jpg

                  Zeigt eure Lovelace-Visualisierung klick
                  (Auch ideal um sich Anregungen zu holen)

                  Meine Tabellen für eure Visualisierung klick

                  FoggF 1 Reply Last reply
                  0
                  • David G.D David G.

                    @fogg

                    Du musst den Namen der Seite wissen den du vergeben hast.

                    Dann http://192.168.99.33:8091/lovelace/name

                    IP und Port ggf anpassen.

                    EDIT
                    Über diesen Weg kann man auch gut hin navigieren.
                    Die verfügbaren Seiten werden einem unter Navigationspfad vorgeschlagen.

                    Screenshot_20230719_012211_Fully Kiosk Browser.jpg

                    FoggF Offline
                    FoggF Offline
                    Fogg
                    wrote on last edited by
                    #314

                    @david-g Super, danke! Das war des Rätsels Trick 😄

                    M 1 Reply Last reply
                    0
                    • FoggF Fogg

                      @david-g Super, danke! Das war des Rätsels Trick 😄

                      M Offline
                      M Offline
                      marian.t
                      wrote on last edited by
                      #315

                      Scheduler/Timer für Lovelace

                      Re: Test lovelace 3.x

                      Aktuelle Test Version 3.0.1
                      Veröffentlichungsdatum 02.08.2023
                      Github Link https://github.com/xxx

                      Re: Test lovelace 3.x
                      Hallo,
                      ich möchte wegen Umstieg in iObroker von VIS auf lovelace einen (Wochen-)Scheduler/Timer integrieren. Verwende bisher den Timer Script von https://github.com/Pittini/iobroker-Timer v.2.1.7 mit VIS-Widget.
                      Ich habe folgende Alternativen zur Auswahl einbezogen:

                      1. o.g. Timer Script v.2.1.7 mit Übersicht in einer custom:html-template-card. Problem: die VIS-Steuerbuttons, für die eine proprietäre custom dropdown card noch fehlt (bzw. habe ich die nicht vollumfänglich geschafft). Ansonsten sieht das ganze nicht rund:
                        ca8d43b7-738b-418d-9c90-c70bcfb19176-image.png

                      2. iObroker Scheduler https://github.com/ioBroker/ioBroker.scheduler. Dessen VIS2-Widget müsste auf eine lovelace custom:card portiert werden - kann das jemand?

                      3. Home assistant Scheduler https://github.com/nielsfaber/scheduler-card, deren custom:card in iObroker-lovelace eingebunden werden kann, die Einbindung der "scheduler-component" python scripts mir aber Probleme bereitet. Ohne die ist die card nicht funktionsfähig.

                      Hat jemand einen Scheduler in iObroker-lovelace v.3.x im Einsatz?

                      Bzw. kann jemand zu der Einbindung der scheduler-component Pkt.3 ein paar Tips geben?
                      Konkret wie man den Pfad dazu, der in Home assistant in der configuration.yaml bekanntgegeben wird in iObroker-lovelace umsetzen könnte?

                      In home assistant liegt der "scheduler-component" unter /config/custom_components/scheduler und die scheduler-card unter
                      /config/www/community/scheduler-card. Mit HACS Installation und folgendem Eintrag in configuration.yaml funktioniert der scheduler dort

                      # Frontend
                      frontend:
                        extra_module_url:
                          - /local/community/scheduler-card/scheduler-card.js?v=0
                      

                      Meine Idee wäre solch ein Eintrag "frontend: extra_module_url:..." in der lovelace raw konfiguration yaml - die in der UI über die drei punkte editierbar ist - zu implementieren (s.o.), nur erlaubt es die lovelace-Syntaxprüfung nicht. Folgender Eintrag wirkt nicht (Pfad ist relativ, voll: /opt/iobroker/node_modules/iobroker.lovelace/custom_components/scheduler-card):

                      title: Home
                      scheduler:
                        - platform: scheduler
                          path: /custom_components/scheduler-card/services.yaml
                      

                      @Garfonso: Könnte man in der configuration.yaml der iObroker-lovelace ein iObroker-Verzeichnis verlinken (wie z.B. per !include_dir_merge_list custom_components, oder auch resources: - url: /local/custom_config.js o.ä.) hätte man vielleicht eine Möglichkeit die configuration.yaml zu erweitern? Nur wenn ich mir es richtig erinnere ist die configuration.yaml der iObroker-lovelace dynamisch zur Laufzeit generiert, sodass es eine Modifikation in der iObroker-lovelace erfordern würde.

                      Alternativ könnte ich mir vorstellen die python scripts aus scheduler-component direkt in der scheduler-card.js per

                      <src=python.py>...</src>
                      

                      in dem html-Part einzubinden.

                      Vielleicht hat jemand einen anderen Vorschlag?

                      David G.D GarfonsoG 3 Replies Last reply
                      0
                      • M marian.t

                        Scheduler/Timer für Lovelace

                        Re: Test lovelace 3.x

                        Aktuelle Test Version 3.0.1
                        Veröffentlichungsdatum 02.08.2023
                        Github Link https://github.com/xxx

                        Re: Test lovelace 3.x
                        Hallo,
                        ich möchte wegen Umstieg in iObroker von VIS auf lovelace einen (Wochen-)Scheduler/Timer integrieren. Verwende bisher den Timer Script von https://github.com/Pittini/iobroker-Timer v.2.1.7 mit VIS-Widget.
                        Ich habe folgende Alternativen zur Auswahl einbezogen:

                        1. o.g. Timer Script v.2.1.7 mit Übersicht in einer custom:html-template-card. Problem: die VIS-Steuerbuttons, für die eine proprietäre custom dropdown card noch fehlt (bzw. habe ich die nicht vollumfänglich geschafft). Ansonsten sieht das ganze nicht rund:
                          ca8d43b7-738b-418d-9c90-c70bcfb19176-image.png

                        2. iObroker Scheduler https://github.com/ioBroker/ioBroker.scheduler. Dessen VIS2-Widget müsste auf eine lovelace custom:card portiert werden - kann das jemand?

                        3. Home assistant Scheduler https://github.com/nielsfaber/scheduler-card, deren custom:card in iObroker-lovelace eingebunden werden kann, die Einbindung der "scheduler-component" python scripts mir aber Probleme bereitet. Ohne die ist die card nicht funktionsfähig.

                        Hat jemand einen Scheduler in iObroker-lovelace v.3.x im Einsatz?

                        Bzw. kann jemand zu der Einbindung der scheduler-component Pkt.3 ein paar Tips geben?
                        Konkret wie man den Pfad dazu, der in Home assistant in der configuration.yaml bekanntgegeben wird in iObroker-lovelace umsetzen könnte?

                        In home assistant liegt der "scheduler-component" unter /config/custom_components/scheduler und die scheduler-card unter
                        /config/www/community/scheduler-card. Mit HACS Installation und folgendem Eintrag in configuration.yaml funktioniert der scheduler dort

                        # Frontend
                        frontend:
                          extra_module_url:
                            - /local/community/scheduler-card/scheduler-card.js?v=0
                        

                        Meine Idee wäre solch ein Eintrag "frontend: extra_module_url:..." in der lovelace raw konfiguration yaml - die in der UI über die drei punkte editierbar ist - zu implementieren (s.o.), nur erlaubt es die lovelace-Syntaxprüfung nicht. Folgender Eintrag wirkt nicht (Pfad ist relativ, voll: /opt/iobroker/node_modules/iobroker.lovelace/custom_components/scheduler-card):

                        title: Home
                        scheduler:
                          - platform: scheduler
                            path: /custom_components/scheduler-card/services.yaml
                        

                        @Garfonso: Könnte man in der configuration.yaml der iObroker-lovelace ein iObroker-Verzeichnis verlinken (wie z.B. per !include_dir_merge_list custom_components, oder auch resources: - url: /local/custom_config.js o.ä.) hätte man vielleicht eine Möglichkeit die configuration.yaml zu erweitern? Nur wenn ich mir es richtig erinnere ist die configuration.yaml der iObroker-lovelace dynamisch zur Laufzeit generiert, sodass es eine Modifikation in der iObroker-lovelace erfordern würde.

                        Alternativ könnte ich mir vorstellen die python scripts aus scheduler-component direkt in der scheduler-card.js per

                        <src=python.py>...</src>
                        

                        in dem html-Part einzubinden.

                        Vielleicht hat jemand einen anderen Vorschlag?

                        David G.D Online
                        David G.D Online
                        David G.
                        wrote on last edited by David G.
                        #316

                        @marian-t

                        Ich stelle mir alles was schwieriger vor.
                        Hätte wohl auch 1 versucht.

                        2 Das wird wohl so leicht nicht gehen. Erst recht weil lovelace hier nicht sooo verbreitet ist

                        3 Glaube nicht, dass man den ans laufen bekommt ohne weitere Anpassungen am Adapter. Da gibt's denke sehr viele Abhängigkeiten.

                        Jenachdem wie der Umfang ist was du alles machen können willst, würde ich mir wohl ein Blockly schreiben was sich gut von den DPs einbinden lässt.
                        Müsste man eben für jeden Timer seperat erstellen und in Lovelace einpflegen.

                        EDIT
                        Das habe ich auf die schnelle mit der picture elements gemacht.
                        Kein Bild hinterlegt und grob was plaziert.

                        Bei 1 bis 7 kann man die Wochentage aktivieren, wenn man auf die Uhrzeit geht erscheint ein Dialog um diese zu ändern. Vorne auf der Uhr ein und ausschalten.
                        Vermutlich geht das so aber nur mit einem eigenem Skript.

                        Zeilen gehen beliebig viele untereinander.

                        Screenshot_20230803_191818_Fully Kiosk Browser.jpg

                        Zeigt eure Lovelace-Visualisierung klick
                        (Auch ideal um sich Anregungen zu holen)

                        Meine Tabellen für eure Visualisierung klick

                        1 Reply Last reply
                        1
                        • M marian.t

                          Scheduler/Timer für Lovelace

                          Re: Test lovelace 3.x

                          Aktuelle Test Version 3.0.1
                          Veröffentlichungsdatum 02.08.2023
                          Github Link https://github.com/xxx

                          Re: Test lovelace 3.x
                          Hallo,
                          ich möchte wegen Umstieg in iObroker von VIS auf lovelace einen (Wochen-)Scheduler/Timer integrieren. Verwende bisher den Timer Script von https://github.com/Pittini/iobroker-Timer v.2.1.7 mit VIS-Widget.
                          Ich habe folgende Alternativen zur Auswahl einbezogen:

                          1. o.g. Timer Script v.2.1.7 mit Übersicht in einer custom:html-template-card. Problem: die VIS-Steuerbuttons, für die eine proprietäre custom dropdown card noch fehlt (bzw. habe ich die nicht vollumfänglich geschafft). Ansonsten sieht das ganze nicht rund:
                            ca8d43b7-738b-418d-9c90-c70bcfb19176-image.png

                          2. iObroker Scheduler https://github.com/ioBroker/ioBroker.scheduler. Dessen VIS2-Widget müsste auf eine lovelace custom:card portiert werden - kann das jemand?

                          3. Home assistant Scheduler https://github.com/nielsfaber/scheduler-card, deren custom:card in iObroker-lovelace eingebunden werden kann, die Einbindung der "scheduler-component" python scripts mir aber Probleme bereitet. Ohne die ist die card nicht funktionsfähig.

                          Hat jemand einen Scheduler in iObroker-lovelace v.3.x im Einsatz?

                          Bzw. kann jemand zu der Einbindung der scheduler-component Pkt.3 ein paar Tips geben?
                          Konkret wie man den Pfad dazu, der in Home assistant in der configuration.yaml bekanntgegeben wird in iObroker-lovelace umsetzen könnte?

                          In home assistant liegt der "scheduler-component" unter /config/custom_components/scheduler und die scheduler-card unter
                          /config/www/community/scheduler-card. Mit HACS Installation und folgendem Eintrag in configuration.yaml funktioniert der scheduler dort

                          # Frontend
                          frontend:
                            extra_module_url:
                              - /local/community/scheduler-card/scheduler-card.js?v=0
                          

                          Meine Idee wäre solch ein Eintrag "frontend: extra_module_url:..." in der lovelace raw konfiguration yaml - die in der UI über die drei punkte editierbar ist - zu implementieren (s.o.), nur erlaubt es die lovelace-Syntaxprüfung nicht. Folgender Eintrag wirkt nicht (Pfad ist relativ, voll: /opt/iobroker/node_modules/iobroker.lovelace/custom_components/scheduler-card):

                          title: Home
                          scheduler:
                            - platform: scheduler
                              path: /custom_components/scheduler-card/services.yaml
                          

                          @Garfonso: Könnte man in der configuration.yaml der iObroker-lovelace ein iObroker-Verzeichnis verlinken (wie z.B. per !include_dir_merge_list custom_components, oder auch resources: - url: /local/custom_config.js o.ä.) hätte man vielleicht eine Möglichkeit die configuration.yaml zu erweitern? Nur wenn ich mir es richtig erinnere ist die configuration.yaml der iObroker-lovelace dynamisch zur Laufzeit generiert, sodass es eine Modifikation in der iObroker-lovelace erfordern würde.

                          Alternativ könnte ich mir vorstellen die python scripts aus scheduler-component direkt in der scheduler-card.js per

                          <src=python.py>...</src>
                          

                          in dem html-Part einzubinden.

                          Vielleicht hat jemand einen anderen Vorschlag?

                          GarfonsoG Offline
                          GarfonsoG Offline
                          Garfonso
                          Developer
                          wrote on last edited by
                          #317

                          @marian-t

                          zu 3.:
                          Also die Karte wirst du wie andere custom cards auch einfügen können.

                          Das python Modul nicht, weil wir halt Javascript sind und kein python und auch dann wären wir ioBroker und nicht Homeassitant. 😕 Will sagen: für die python module muss support im lovelace-adapter eingebaut werden.

                          Mittlerweile habe ich ein wenig sowas wie eine modul struktur implementiert, allerdings noch nicht dynamisch. Die API des scheduler scheint relativ simpel... hm... aber eigentlich mag ich so einen komplizierten Scheduler nicht in den lovelace-adapter integrieren... muss man das wirklich in der visualisierung haben? grübel

                          Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                          Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                          1 Reply Last reply
                          0
                          • W Offline
                            W Offline
                            winnypuh
                            wrote on last edited by winnypuh
                            #318

                            Eine Kurze Frage in die Runde: Ich kann überhaupt nicht eingrenzen wieso (habe bereits eine komplette Neueinrichtung des Lovelaceadapters durchgeführt) aber ich kann aktuell keine Mushroom Light Cards mehr laden, in der JS-Konsole erhalte ich folgende Fehlermeldung, ist da vielleicht schon jemand anderes drübergestolpert?

                            Uncaught (in promise) TypeError: n is null
                                ne mushroom.js:59
                                render mushroom.js:2527
                                update mushroom.js:23
                                performUpdate mushroom.js:11
                                scheduleUpdate mushroom.js:11
                                _$Ej mushroom.js:11
                                requestUpdate mushroom.js:11
                                set mushroom.js:11
                                updated layout-card.js:64
                                updated layout-card.js:64
                                _$AE layout-card.js:1
                                performUpdate layout-card.js:1
                                scheduleUpdate layout-card.js:1
                                _$E_ layout-card.js:1
                                requestUpdate layout-card.js:1
                                set layout-card.js:1
                                value hui-masonry-view.ts:44
                                value hui-masonry-view.ts:44
                                performUpdate app.a64eef8d.js:1251
                                scheduleUpdate app.a64eef8d.js:1251
                                _$EC app.a64eef8d.js:1251
                                requestUpdate app.a64eef8d.js:1251
                                set app.a64eef8d.js:1251
                                value 77b7199a.js:377
                                _$AE app.a64eef8d.js:1251
                                performUpdate app.a64eef8d.js:1251
                                scheduleUpdate app.a64eef8d.js:1251
                                _$EC app.a64eef8d.js:1251
                                requestUpdate app.a64eef8d.js:1251
                                set app.a64eef8d.js:1251
                                k app.a64eef8d.js:1251
                                _$AI app.a64eef8d.js:1251
                                m app.a64eef8d.js:1251
                                T app.a64eef8d.js:1251
                                _$AI app.a64eef8d.js:1251
                                S app.a64eef8d.js:1251
                                update app.a64eef8d.js:1251
                                performUpdate app.a64eef8d.js:1251
                                scheduleUpdate app.a64eef8d.js:1251
                                _$EC app.a64eef8d.js:1251
                                requestUpdate app.a64eef8d.js:1251
                                set app.a64eef8d.js:1251
                                value app-drawer-layout.js:189
                                value hass-loading-screen.ts:11
                                performUpdate app.a64eef8d.js:1251
                                scheduleUpdate app.a64eef8d.js:1251
                                _$EC app.a64eef8d.js:1251
                                requestUpdate app.a64eef8d.js:1251
                            mushroom.js:59:7391
                            

                            Danke!

                            XBiTX 1 Reply Last reply
                            1
                            • M marian.t

                              Scheduler/Timer für Lovelace

                              Re: Test lovelace 3.x

                              Aktuelle Test Version 3.0.1
                              Veröffentlichungsdatum 02.08.2023
                              Github Link https://github.com/xxx

                              Re: Test lovelace 3.x
                              Hallo,
                              ich möchte wegen Umstieg in iObroker von VIS auf lovelace einen (Wochen-)Scheduler/Timer integrieren. Verwende bisher den Timer Script von https://github.com/Pittini/iobroker-Timer v.2.1.7 mit VIS-Widget.
                              Ich habe folgende Alternativen zur Auswahl einbezogen:

                              1. o.g. Timer Script v.2.1.7 mit Übersicht in einer custom:html-template-card. Problem: die VIS-Steuerbuttons, für die eine proprietäre custom dropdown card noch fehlt (bzw. habe ich die nicht vollumfänglich geschafft). Ansonsten sieht das ganze nicht rund:
                                ca8d43b7-738b-418d-9c90-c70bcfb19176-image.png

                              2. iObroker Scheduler https://github.com/ioBroker/ioBroker.scheduler. Dessen VIS2-Widget müsste auf eine lovelace custom:card portiert werden - kann das jemand?

                              3. Home assistant Scheduler https://github.com/nielsfaber/scheduler-card, deren custom:card in iObroker-lovelace eingebunden werden kann, die Einbindung der "scheduler-component" python scripts mir aber Probleme bereitet. Ohne die ist die card nicht funktionsfähig.

                              Hat jemand einen Scheduler in iObroker-lovelace v.3.x im Einsatz?

                              Bzw. kann jemand zu der Einbindung der scheduler-component Pkt.3 ein paar Tips geben?
                              Konkret wie man den Pfad dazu, der in Home assistant in der configuration.yaml bekanntgegeben wird in iObroker-lovelace umsetzen könnte?

                              In home assistant liegt der "scheduler-component" unter /config/custom_components/scheduler und die scheduler-card unter
                              /config/www/community/scheduler-card. Mit HACS Installation und folgendem Eintrag in configuration.yaml funktioniert der scheduler dort

                              # Frontend
                              frontend:
                                extra_module_url:
                                  - /local/community/scheduler-card/scheduler-card.js?v=0
                              

                              Meine Idee wäre solch ein Eintrag "frontend: extra_module_url:..." in der lovelace raw konfiguration yaml - die in der UI über die drei punkte editierbar ist - zu implementieren (s.o.), nur erlaubt es die lovelace-Syntaxprüfung nicht. Folgender Eintrag wirkt nicht (Pfad ist relativ, voll: /opt/iobroker/node_modules/iobroker.lovelace/custom_components/scheduler-card):

                              title: Home
                              scheduler:
                                - platform: scheduler
                                  path: /custom_components/scheduler-card/services.yaml
                              

                              @Garfonso: Könnte man in der configuration.yaml der iObroker-lovelace ein iObroker-Verzeichnis verlinken (wie z.B. per !include_dir_merge_list custom_components, oder auch resources: - url: /local/custom_config.js o.ä.) hätte man vielleicht eine Möglichkeit die configuration.yaml zu erweitern? Nur wenn ich mir es richtig erinnere ist die configuration.yaml der iObroker-lovelace dynamisch zur Laufzeit generiert, sodass es eine Modifikation in der iObroker-lovelace erfordern würde.

                              Alternativ könnte ich mir vorstellen die python scripts aus scheduler-component direkt in der scheduler-card.js per

                              <src=python.py>...</src>
                              

                              in dem html-Part einzubinden.

                              Vielleicht hat jemand einen anderen Vorschlag?

                              David G.D Online
                              David G.D Online
                              David G.
                              wrote on last edited by
                              #319

                              @marian-t

                              Habe grad nochmal was gespielt.
                              So sieht es ganz gut aus (würde es aber vermutlich zur Verwendung noch was schöner machen).

                              Man kann sich einfach mehrere Zeilen untereinander machen.
                              Oder auch die Anordnung was ändern, wenn man Start und Ende einstellen möchte.

                              Screenshot_20230808_184129_Fully Kiosk Browser.jpg

                              Zeigt eure Lovelace-Visualisierung klick
                              (Auch ideal um sich Anregungen zu holen)

                              Meine Tabellen für eure Visualisierung klick

                              M 1 Reply Last reply
                              0
                              • W winnypuh

                                Eine Kurze Frage in die Runde: Ich kann überhaupt nicht eingrenzen wieso (habe bereits eine komplette Neueinrichtung des Lovelaceadapters durchgeführt) aber ich kann aktuell keine Mushroom Light Cards mehr laden, in der JS-Konsole erhalte ich folgende Fehlermeldung, ist da vielleicht schon jemand anderes drübergestolpert?

                                Uncaught (in promise) TypeError: n is null
                                    ne mushroom.js:59
                                    render mushroom.js:2527
                                    update mushroom.js:23
                                    performUpdate mushroom.js:11
                                    scheduleUpdate mushroom.js:11
                                    _$Ej mushroom.js:11
                                    requestUpdate mushroom.js:11
                                    set mushroom.js:11
                                    updated layout-card.js:64
                                    updated layout-card.js:64
                                    _$AE layout-card.js:1
                                    performUpdate layout-card.js:1
                                    scheduleUpdate layout-card.js:1
                                    _$E_ layout-card.js:1
                                    requestUpdate layout-card.js:1
                                    set layout-card.js:1
                                    value hui-masonry-view.ts:44
                                    value hui-masonry-view.ts:44
                                    performUpdate app.a64eef8d.js:1251
                                    scheduleUpdate app.a64eef8d.js:1251
                                    _$EC app.a64eef8d.js:1251
                                    requestUpdate app.a64eef8d.js:1251
                                    set app.a64eef8d.js:1251
                                    value 77b7199a.js:377
                                    _$AE app.a64eef8d.js:1251
                                    performUpdate app.a64eef8d.js:1251
                                    scheduleUpdate app.a64eef8d.js:1251
                                    _$EC app.a64eef8d.js:1251
                                    requestUpdate app.a64eef8d.js:1251
                                    set app.a64eef8d.js:1251
                                    k app.a64eef8d.js:1251
                                    _$AI app.a64eef8d.js:1251
                                    m app.a64eef8d.js:1251
                                    T app.a64eef8d.js:1251
                                    _$AI app.a64eef8d.js:1251
                                    S app.a64eef8d.js:1251
                                    update app.a64eef8d.js:1251
                                    performUpdate app.a64eef8d.js:1251
                                    scheduleUpdate app.a64eef8d.js:1251
                                    _$EC app.a64eef8d.js:1251
                                    requestUpdate app.a64eef8d.js:1251
                                    set app.a64eef8d.js:1251
                                    value app-drawer-layout.js:189
                                    value hass-loading-screen.ts:11
                                    performUpdate app.a64eef8d.js:1251
                                    scheduleUpdate app.a64eef8d.js:1251
                                    _$EC app.a64eef8d.js:1251
                                    requestUpdate app.a64eef8d.js:1251
                                mushroom.js:59:7391
                                

                                Danke!

                                XBiTX Offline
                                XBiTX Offline
                                XBiT
                                wrote on last edited by
                                #320

                                @winnypuh

                                habe gerade mal getestet bei mir gehen die Mushroom Light Cards

                                hie mal die Version der Cards die bei mir gehen:

                                mushroom.js

                                habe jetzt aber nicht geschaut ob die aktuell ist ... aber sie geht

                                C W L 3 Replies Last reply
                                0
                                • David G.D Online
                                  David G.D Online
                                  David G.
                                  wrote on last edited by
                                  #321

                                  @Garfonso

                                  Bekomme das mit den Popups nicht behoben.

                                  In der Version aus dem Stable:
                                  dd434f47a52a833e016cc45a2d05fba2c230c359.gif
                                  Die aktuelle git:
                                  8dc6ea56758b369947bbced8d419185339b0cff9.gif

                                  Gibt's evtl eine neuere Version vom Browser-Mod die eingebaut werden kann?

                                  Zeigt eure Lovelace-Visualisierung klick
                                  (Auch ideal um sich Anregungen zu holen)

                                  Meine Tabellen für eure Visualisierung klick

                                  GarfonsoG 1 Reply Last reply
                                  0
                                  • David G.D David G.

                                    @marian-t

                                    Habe grad nochmal was gespielt.
                                    So sieht es ganz gut aus (würde es aber vermutlich zur Verwendung noch was schöner machen).

                                    Man kann sich einfach mehrere Zeilen untereinander machen.
                                    Oder auch die Anordnung was ändern, wenn man Start und Ende einstellen möchte.

                                    Screenshot_20230808_184129_Fully Kiosk Browser.jpg

                                    M Offline
                                    M Offline
                                    marian.t
                                    wrote on last edited by marian.t
                                    #322

                                    @david-g

                                    Hallo,

                                    vielen Dank - auch @Garfonso - für die Interesse an Scheduler. Inzwischen habe ich die dropdown-cards am laufen, auch die Wochentage sind mit custom:button-entity-row kein Hexenwerk mehr:
                                    0f088419-6154-4f09-b4a2-0a188e7c99d7-image.png
                                    Letztes offenes Problem ist die card mit text_input entity für die Sendewerte. Die custom:text-input-row verweigert den Input (den Text löschen geht), die entities card will sich per car-mod nicht richtig gestalten - kriege den margin/padding links nicht weg (auch mit Tipps hier 😞 ) :
                                    dc3bf860-b967-4e5f-aab8-57ee0a881a9a-image.png
                                    Leider sind ich die cards nicht zum gebrauchen am Smartphone (zu breit). Vllt. nehme ich irgendwann doch die 2. Alternative ohne Visualisierung in lovelace (oder knackt jemand den VIS2).
                                    Und auf die Frage ob es sinnvoll ist ist meine Antwort JA: ich habe ca. 27 Scheduler im Einsatz.

                                    David G.D 1 Reply Last reply
                                    0
                                    • M marian.t

                                      @david-g

                                      Hallo,

                                      vielen Dank - auch @Garfonso - für die Interesse an Scheduler. Inzwischen habe ich die dropdown-cards am laufen, auch die Wochentage sind mit custom:button-entity-row kein Hexenwerk mehr:
                                      0f088419-6154-4f09-b4a2-0a188e7c99d7-image.png
                                      Letztes offenes Problem ist die card mit text_input entity für die Sendewerte. Die custom:text-input-row verweigert den Input (den Text löschen geht), die entities card will sich per car-mod nicht richtig gestalten - kriege den margin/padding links nicht weg (auch mit Tipps hier 😞 ) :
                                      dc3bf860-b967-4e5f-aab8-57ee0a881a9a-image.png
                                      Leider sind ich die cards nicht zum gebrauchen am Smartphone (zu breit). Vllt. nehme ich irgendwann doch die 2. Alternative ohne Visualisierung in lovelace (oder knackt jemand den VIS2).
                                      Und auf die Frage ob es sinnvoll ist ist meine Antwort JA: ich habe ca. 27 Scheduler im Einsatz.

                                      David G.D Online
                                      David G.D Online
                                      David G.
                                      wrote on last edited by
                                      #323

                                      @marian-t

                                      Ich habe bei meinen Dropdown ja fast alles um die Karte entfernt.
                                      Kannst da bestimmt was rausnehmen:

                                      type: picture-elements
                                      elements:
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:garage
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 69.5%
                                           left: 10%
                                           '--mdc-icon-size': 35px
                                       - type: custom:hui-element
                                         card_type: entities
                                         card_mod:
                                           style: |
                                             ha-card { box-shadow: none !important }
                                         entities:
                                           - entity: input_select.aber
                                             card_mod:
                                               style:
                                                 hui-generic-entity-row $: |
                                                   state-badge {
                                                     display: none;
                                                   }
                                                 ha-select $: |
                                                   .mdc-select__anchor {
                                                     height: 40px !important;
                                                   }
                                                   .mdc-select__selected-text-container {
                                                     align-self: center;
                                                   }
                                                   span#label {
                                                     display: none;
                                                   }
                                                 .: |
                                                   ha-select {
                                                     height: 40px;
                                                     width: 75px;
                                                   }
                                         style:
                                           top: 70%
                                           left: 40%
                                           width: 200px
                                       - type: custom:hui-element
                                         card_type: entities
                                         card_mod:
                                           style: |
                                             ha-card { box-shadow: none !important }
                                         entities:
                                           - entity: input_select.aber
                                             card_mod:
                                               style:
                                                 hui-generic-entity-row $: |
                                                   state-badge {
                                                     display: none;
                                                   }
                                                 ha-select $: |
                                                   .mdc-select__anchor {
                                                     height: 40px !important;
                                                   }
                                                   .mdc-select__selected-text-container {
                                                     align-self: center;
                                                   }
                                                   span#label {
                                                     display: none;
                                                   }
                                                 .: |
                                                   ha-select {
                                                     height: 40px;
                                                     width: 75px;
                                                   }
                                         style:
                                           top: 70%
                                           left: 60%
                                           width: 200px
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-1
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 60%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-2
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 65%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-3
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 70%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-4
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 75%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-5
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 80%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-6
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 85%
                                       - type: state-icon
                                         tap_action:
                                           action: toggle
                                         icon: mdi:numeric-7
                                         entity: switch.Toggle_Ansage_Telefon
                                         style:
                                           top: 70%
                                           left: 90%
                                      image: /cards/roborock.png
                                      
                                      

                                      P. S.
                                      Meine Variante klappt mobil wunderbar (hab irgend ein Bild in den Hintergrund getan, was ich grad hatte.

                                      Screenshot_20230809_173037_Fully Kiosk Browser.jpg

                                      Mit der picture-elements bist du eben wesentlich flexibler was die Position und Größe angeht.

                                      Zeigt eure Lovelace-Visualisierung klick
                                      (Auch ideal um sich Anregungen zu holen)

                                      Meine Tabellen für eure Visualisierung klick

                                      1 Reply Last reply
                                      0
                                      • David G.D David G.

                                        @Garfonso

                                        Bekomme das mit den Popups nicht behoben.

                                        In der Version aus dem Stable:
                                        dd434f47a52a833e016cc45a2d05fba2c230c359.gif
                                        Die aktuelle git:
                                        8dc6ea56758b369947bbced8d419185339b0cff9.gif

                                        Gibt's evtl eine neuere Version vom Browser-Mod die eingebaut werden kann?

                                        GarfonsoG Offline
                                        GarfonsoG Offline
                                        Garfonso
                                        Developer
                                        wrote on last edited by
                                        #324

                                        @david-g

                                        prüfe ich mal.

                                        Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                                        Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                                        1 Reply Last reply
                                        1
                                        • XBiTX XBiT

                                          @winnypuh

                                          habe gerade mal getestet bei mir gehen die Mushroom Light Cards

                                          hie mal die Version der Cards die bei mir gehen:

                                          mushroom.js

                                          habe jetzt aber nicht geschaut ob die aktuell ist ... aber sie geht

                                          C Offline
                                          C Offline
                                          conslinger
                                          wrote on last edited by
                                          #325

                                          @xbit Ich hatte auch Probleme, mit der Version klappts, danke!

                                          1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          354

                                          Online

                                          32.4k

                                          Users

                                          81.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe