Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Tester
    4. Test lovelace 4.x

    NEWS

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Test lovelace 4.x

    This topic has been deleted. Only users with topic management privileges can see it.
    • David G.
      David G. @Fogg last edited by 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

      Fogg 1 Reply Last reply Reply Quote 0
      • Fogg
        Fogg @David G. last edited by

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

        M 1 Reply Last reply Reply Quote 0
        • M
          marian.t @Fogg last edited by

          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. Garfonso 3 Replies Last reply Reply Quote 0
          • David G.
            David G. @marian.t last edited by David G.

            @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

            1 Reply Last reply Reply Quote 1
            • Garfonso
              Garfonso Developer @marian.t last edited by

              @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

              1 Reply Last reply Reply Quote 0
              • W
                winnypuh last edited by 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!

                XBiT 1 Reply Last reply Reply Quote 1
                • David G.
                  David G. @marian.t last edited by

                  @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 1 Reply Last reply Reply Quote 0
                  • XBiT
                    XBiT @winnypuh last edited by

                    @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 Reply Quote 0
                    • David G.
                      David G. last edited by

                      @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?

                      Garfonso 1 Reply Last reply Reply Quote 0
                      • M
                        marian.t @David G. last edited by 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. 1 Reply Last reply Reply Quote 0
                        • David G.
                          David G. @marian.t last edited by

                          @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.

                          1 Reply Last reply Reply Quote 0
                          • Garfonso
                            Garfonso Developer @David G. last edited by

                            @david-g

                            prüfe ich mal.

                            1 Reply Last reply Reply Quote 1
                            • C
                              conslinger @XBiT last edited by

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

                              1 Reply Last reply Reply Quote 0
                              • W
                                winnypuh @XBiT last edited by

                                @xbit super danke dir, liegt wohl wirklich an der neuen Version. Mit deiner klappt es hier auch wieder :).

                                1 Reply Last reply Reply Quote 0
                                • dontobi
                                  dontobi last edited by

                                  Hallo zusammen

                                  Ich bin gerade dabei meine Lovelace Config zu überarbeiten. Dabei möchte ich zukünftig auf ein Menü auf der Startseite/Hauptseite setzen (habe zu viele Unterseiten und muss auf dem Handy scrollen).

                                  Dazu kann ich standardmäßig die Button Card mit Navigation benutzen. Das klappt auch, jedoch würde ich lieber die Custom Button Card nutzen. Diese bietet mehr Möglichkeiten. Leider klappt dort die Navigation Funktion nicht (oder nur bei mir nicht). Könnte dies jemand überprüfen und @Garfonso kann man das ggf. fixen?

                                  Anbei der Link zur Custom Button Card
                                  [https://github.com/custom-cards/button-card](Custom Button Card)

                                  Gruß aus dem Rheinland
                                  Tobi

                                  Garfonso 1 Reply Last reply Reply Quote 0
                                  • Garfonso
                                    Garfonso Developer @dontobi last edited by

                                    @dontobi

                                    Aus dem Changelog von 4.0.0:
                                    hacs: Minimum required HA Version is now 2023.7

                                    Daher zwei Optionen: entweder ein Release der Button Card vor 4.0.0 nehmen oder (und vielleicht vor größeren Umbauarbeiten besser flöt) lovelace aus Github installieren und mit neuestem Frontend (ist eine 2023.7 Version) testen. Da sollte die aktuelle Karte dann gehen. Ich weiß noch nicht genau, wie ich Zeit finde, aber das soll demnächst ins latest und die gröbsten Sachen scheinen jetzt auch raus zu sein.

                                    David G. dontobi 2 Replies Last reply Reply Quote 0
                                    • David G.
                                      David G. @Garfonso last edited by

                                      @garfonso

                                      Hast du auch mal nach dem Browser_mod geschaut?

                                      Garfonso 1 Reply Last reply Reply Quote 0
                                      • dontobi
                                        dontobi @Garfonso last edited by

                                        @garfonso Ich habe bereits die GitHub Version am laufen und da funktioniert es genau wenig wie bei der 3.0.1.

                                        Garfonso 1 Reply Last reply Reply Quote 0
                                        • Garfonso
                                          Garfonso Developer @dontobi last edited by

                                          @dontobi said in Test lovelace 3.x:

                                          @garfonso Ich habe bereits die GitHub Version am laufen und da funktioniert es genau wenig wie bei der 3.0.1.

                                          Ahrg.... das ist ja gar nicht überraschend, weil wir erst bei 2023.6 sind... 😕

                                          Ich mach mal ein neues Frontend.

                                          1 Reply Last reply Reply Quote 0
                                          • Garfonso
                                            Garfonso Developer @David G. last edited by

                                            @david-g und @dontobi und wer sonst noch mag:

                                            Auf github hab ich das frontend ( 202308021) und browser mod (2.3.0) aktualisiert. Wer testen möchte. 🙂

                                            David G. dontobi 2 Replies Last reply Reply Quote 1
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            613
                                            Online

                                            31.7k
                                            Users

                                            79.6k
                                            Topics

                                            1.3m
                                            Posts

                                            85
                                            852
                                            193857
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo