Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. neue Visualisierung "webui" (alternative zu vis & vis-2)

    NEWS

    • Monatsrückblick - April 2025

    • Minor js-controller 7.0.7 Update in latest repo

    • Save The Date: ioBroker@Smart Living Forum Solingen, 14.06.

    neue Visualisierung "webui" (alternative zu vis & vis-2)

    This topic has been deleted. Only users with topic management privileges can see it.
    • Smilie108
      Smilie108 @jogibear9988 last edited by

      @jogibear9988 DANKE 😉

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

        Hab grad noch .16 freigegeben, nun sollte das drag/drop auf nicht aufgeklappte treenodes funktionieren

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

          selection im split view text, selektiert nun auch im designer

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

            Simlere Binding Syntax mit expressions:

            Wenn Ihr in euerem Binding nun nur Variablen habt, und Expressions ohne ";" und ohne Zeilenumbruch, dann werden die bindings so ins HTML geschrieben:

             <div bind-content:html="a:a.b.cvar1;b:a.b.c.varb;a + ' ' + b">
            

            das heißt, auch die bindings mit expressions sollten in HTML lesbar sein.

            Nun ist noch die Frage, brauchen wir noch bindings im CSS editor? Hatte mit überlegt, z.b.: mit 2 klammern : ”{{bindingexpression}}" ein binding zu erzeugen.
            Wird sowas benötigt?
            Es geht ja auch jetzt schon, wenn ich CSS Variablen nutze, und die außerhalb an einem Control Binde.
            Ich könnte natürlich über die Expression auch einfach dynamisch eine CSS Variable erzeugen (dann könnte man das binding aber nur für einfache css werte nutzen), oder ich ersetze jedes mal wenn sich am binding was ändert immer wieder den ganzen style (ist sicher langsamer, aber merkt man es? aber dadurch wäre auch mehr möglich)

            Bsp:

             {
                width: calc({{a.b.c}} * 1px)
                height: {{a:c.d.e;a + 'px'}}
             }
            

            ginge mit Variante 1 und 2. Bei Variante1 würde ich das entsprechend so transformieren:

             {
                width: calc(var(--tmpVar1) * 1px);
                height: var(--tmpVar2);
             }
            

            das folgende:

             {
                 {{v:a.b.c;'width : ' + v + 'px'}}
             }
            

            ginge nur mit Variante 2, die frage ist bräuchte man das? Also das Ihr dynamisch per binding nicht nur werte, sondern auch css properties hinzufügt.

            Smilie108 1 Reply Last reply Reply Quote 0
            • Smilie108
              Smilie108 @jogibear9988 last edited by

              @jogibear9988 sagte in neue Visualisierung "webui" (alternative zu vis):

              hi jochen
              Habe mich inzwischen mit der mittleren variate angefreundet dann kannst du eh sogut wie alles machen ( mit namen muss mann halt ein wenig erfinderisch sein 😉 )
              mir langt das weis jetzt nicht ob das andere notwendig ist.

              Das was mir noch kopfzerbrechen macht aber ich glaube ich fange da mal wieder falsch an ist das ich zb einen navigationstree erstellen wollte ( eigene seite) und dann in dieser javascript verwenden wollte. ( Standart kopiert) das geht aber garnicht.

              z.b.
              https://github.com/gero1992/side-menu
              oder zb.:
              https://www.w3schools.com/howto/howto_js_treeview.asp

              aber da ich auch sonst noch genug zu tun habe habe ich das nach hinten verschoben 😉

              MFG und DANKE bis jeztt geht das eht inzwischen richtig gut wenn man mal etwas sich reingefuchst hat 😉

              B 1 Reply Last reply Reply Quote 0
              • jogibear9988
                jogibear9988 last edited by jogibear9988

                @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                https://github.com/gero1992/side-menu

                2 Probleme:

                • du musst das als NPM Paket hinzufügen: "@maksu/side-menu", da er aber eine alter version von lit-element nutzt, und aber eine neue version von lit-html installiert sein kann, gibts bei mir z.b. probleme, daher muss ich auch das npm paket "lit-element@latest" hinzufügen.
                • da er im NPM Paket nur auf "side-menu.js" verweist, muss man "side-menu-item.js" selber importieren. Das sollte er im Paket am besten fixen. (issue dazu: https://github.com/gero1992/side-menu/issues/2 (upvoten))

                e4fbccec-e9ad-4ea0-bb39-acfb1404ff1e-image.png

                jogibear9988 created this issue in gero1992/side-menu

                closed Import "side-menu-item.js" from "side-menu" #2

                1 Reply Last reply Reply Quote 0
                • B
                  Blockmove @Smilie108 last edited by

                  @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                  Habe mich inzwischen mit der mittleren variate angefreundet dann kannst du eh sogut wie alles machen ( mit namen muss mann halt ein wenig erfinderisch sein 😉 )
                  mir langt das weis jetzt nicht ob das andere notwendig ist.

                  Ich schließ mich da an.

                  1 Reply Last reply Reply Quote 0
                  • B
                    Blockmove last edited by

                    Hallo Jochen,

                    ich habe gerade etwas "entdeckt".

                    Ich habe bei mir einige Screens in einen Ordner "subscreen" verschoben.
                    Will ich nun in der Splitview den Ordnernamen ändern, so wird die Änderung nicht übernommen.
                    subscreen1.png
                    In der Property wird Namen des Unterordners nicht übernommen.

                    Wenn ich den Screename direkt in der Property ändere, dann funktioniert es.
                    subscreen2.png

                    Version: 1.0.19

                    VG
                    Dieter

                    jogibear9988 1 Reply Last reply Reply Quote 0
                    • H
                      Hansi1234 last edited by

                      Hi, ich konnte jetzt auf die schnelle nichts finden.
                      Gibt es in webui so etwas wie ein circle Menü?
                      Fhem hat sowas zb
                      link

                      jogibear9988 1 Reply Last reply Reply Quote 0
                      • jogibear9988
                        jogibear9988 @Blockmove last edited by

                        @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                        Hallo Jochen,

                        ich habe gerade etwas "entdeckt".

                        Ich habe bei mir einige Screens in einen Ordner "subscreen" verschoben.
                        Will ich nun in der Splitview den Ordnernamen ändern, so wird die Änderung nicht übernommen.
                        subscreen1.png
                        In der Property wird Namen des Unterordners nicht übernommen.

                        Wenn ich den Screename direkt in der Property ändere, dann funktioniert es.
                        subscreen2.png

                        Version: 1.0.19

                        VG
                        Dieter

                        sollte gefixt sein, kamm durch mein umbau das man auch im split view im text elemente selektieren kann

                        1 Reply Last reply Reply Quote 0
                        • jogibear9988
                          jogibear9988 @Hansi1234 last edited by

                          @hansi1234 said in neue Visualisierung "webui" (alternative zu vis):

                          Hi, ich konnte jetzt auf die schnelle nichts finden.
                          Gibt es in webui so etwas wie ein circle Menü?
                          Fhem hat sowas zb
                          link

                          bspw: https://www.fabiovitali.it/radial/

                          hab auch noch das gefunden: https://github.com/mmontoya/radial-menu
                          ist ne webcomponente, geht aber gerade nicht, stencil erzeugt keinen code den man direkt als esm im browser importieren kann

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

                            Screen "radialmenu" im testserver

                            H 1 Reply Last reply Reply Quote 1
                            • H
                              Hansi1234 @jogibear9988 last edited by

                              @jogibear9988 puh, ich muss hier Mal mein Dank für deine erbrachte Arbeit da lassen. Vielen Dank!!! 😊

                              1 Reply Last reply Reply Quote 1
                              • Smilie108
                                Smilie108 last edited by Smilie108

                                @jogibear9988
                                Verständnissfrage
                                wenn ich Screenshot 2024-01-20 062324.png
                                Dann ist alles ok mit wert übertragung

                                Wenn ich aber
                                676039e9-2dcd-4848-bf5d-3fd80c6c13d0-grafik.png
                                mache dann löscht er beim speichern das two way binding
                                ist das ein bug ?
                                nach dem speichern und wieder öffen sieht es dann so aus
                                ec522054-594a-4266-9321-2a2695e59bc2-grafik.png

                                B jogibear9988 2 Replies Last reply Reply Quote 0
                                • B
                                  Blockmove @Smilie108 last edited by

                                  @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                                  @jogibear9988
                                  Verständnissfrage

                                  Wenn ich aber
                                  676039e9-2dcd-4848-bf5d-3fd80c6c13d0-grafik.png
                                  mache dann löscht er beim speichern das two way binding
                                  ist das ein bug ?

                                  Das Verhalten hab ich auch, allerdings nur wenn type ignore gewählt ist.
                                  Wähle ich type number funktioniert das twoway-Binding.
                                  Wenn du type ignore nimmst, dann bekommst du im ioBroker-Protokoll auch die Meldung 'State value to set for "0_userdata.0.Test.stateZahl" has to be type "number" but received type "string" '.

                                  @jogibear9988
                                  Vielleicht wäre es sinnvoll default das twoway-Bindung deaktiviert zu lassen und wenn man es anwählt muss zuätzlich der Typ gewählt werden.

                                  jogibear9988 1 Reply Last reply Reply Quote 0
                                  • jogibear9988
                                    jogibear9988 @Smilie108 last edited by

                                    @smilie108

                                    ist schon ein bug, aber ist es das was du willst? Wenn es gelesen wird fügst du °C hinzu, wenn nu was eingegeben wird, willst du das °C nicht wegschneiden?

                                    Ich fixe es aber

                                    Smilie108 1 Reply Last reply Reply Quote 0
                                    • jogibear9988
                                      jogibear9988 @Blockmove last edited by

                                      @blockmove said in neue Visualisierung "webui" (alternative zu vis):

                                      @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                                      @jogibear9988
                                      Verständnissfrage

                                      Wenn ich aber
                                      676039e9-2dcd-4848-bf5d-3fd80c6c13d0-grafik.png
                                      mache dann löscht er beim speichern das two way binding
                                      ist das ein bug ?

                                      Das Verhalten hab ich auch, allerdings nur wenn type ignore gewählt ist.
                                      Wähle ich type number funktioniert das twoway-Binding.
                                      Wenn du type ignore nimmst, dann bekommst du im ioBroker-Protokoll auch die Meldung 'State value to set for "0_userdata.0.Test.stateZahl" has to be type "number" but received type "string" '.

                                      @jogibear9988
                                      Vielleicht wäre es sinnvoll default das twoway-Bindung deaktiviert zu lassen und wenn man es anwählt muss zuätzlich der Typ gewählt werden.

                                      nö wieso, der typ ist ja oft egal

                                      B 1 Reply Last reply Reply Quote 0
                                      • B
                                        Blockmove @jogibear9988 last edited by

                                        @jogibear9988 said in neue Visualisierung "webui" (alternative zu vis):

                                        Vielleicht wäre es sinnvoll default das twoway-Bindung deaktiviert zu lassen und wenn man es anwählt muss zuätzlich der Typ gewählt werden.

                                        nö wieso, der typ ist ja oft egal

                                        Naja, da schlägt der SPS'ler in mir durch. Ich hab halt einfach gern Typsicherheit. 😊

                                        1 Reply Last reply Reply Quote 0
                                        • Smilie108
                                          Smilie108 @jogibear9988 last edited by

                                          @jogibear9988
                                          eigentlich schon reture als zahl nur wie das wegschneiden wieder geht bi ich noch nicht dahinter gekommen

                                          B Smilie108 2 Replies Last reply Reply Quote 0
                                          • B
                                            Blockmove @Smilie108 last edited by

                                            @smilie108 said in neue Visualisierung "webui" (alternative zu vis):

                                            @jogibear9988
                                            eigentlich schon reture als zahl nur wie das wegschneiden wieder geht bi ich noch nicht dahinter gekommen

                                            Wenn du nen Typ angibst brauchst du nix wegschneiden

                                            1 Reply Last reply Reply Quote 1
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            1.0k
                                            Online

                                            31.6k
                                            Users

                                            79.4k
                                            Topics

                                            1.3m
                                            Posts

                                            20
                                            1074
                                            230938
                                            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