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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • 15. 05. Wartungsarbeiten am ioBroker Forum

    • Monatsrückblick - April 2025

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

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

      @jogibear9988
      Hi muss hier offizell um entschuldigung bitten.

      Hab grad eben eine neuinstall gemacht gehabt und mich schon etwas gewundert das ich die gleichen seiten wie auf der Test maschiene hatte.
      Hab dann gedacht das er das mitgenommen hatte und die screens gelöscht. Allerdings hat mein browser warum auch immer nicht meine version aufgemacht gehabt sonder die testmaschiene.
      Es tut mir leid wird nicht wieder vorkommen. Hat da irgendwer noch exports von den vorlagen ?

      Und nochmal Entschuldigung
      Gruß Thomas

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

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

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

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

        @blockmove

        wie sieht der import im script oben aus?? so:

        import { iobrokerHandler } from "/webui/dist/frontend/common/IobrokerHandler.js";
        import { Runtime } from "/webui/dist/frontend/common/Runtime.js";
        

        Ja

        import { iobrokerHandler } from "/webui/dist/frontend/common/IobrokerHandler.js";
        import { Runtime } from "/webui/dist/frontend/common/Runtime.js";
        
        /**
        * buttonclick - 'click' event of <button>
        * @param {PointerEvent} event
        * @param {Element} eventRaisingElement
        * @param {ShadowRoot} shadowRoot
        * @param {HTMLElement} instance
        */
        export function buttonclick(event, eventRaisingElement, shadowRoot, instance) {
            alert("Test");
        }
        

        Mach im Monent aus der relativen URL (im Import) einfach mal ne absolute, also "http://ip:port/" davor, ich schau wie ich den import später als standard einfüge.

        Odr wenn du ihn nicht brauchst, schmeiß Ihn raus.

        So ich hab jetzt mal nen Raspi 4 als Testsystem aufgesetzt und webui installiert.
        Das einfache Script mit dem Button und alert funktioniert nur, wenn ich beide import Zeilen auskommentiere.
        Das Einsetzen der IP-Adresse bringt nichts 😒
        Da hast du wohl nen Bug🪲 drin.

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

          @blockmove

          wie sieht dein import mit der IP aus?

          (kann gerade nur sporadisch antworten, bin skifahren)

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

            vlt. bau ich das mit den javascripts nochmal um. Ich hab die eig. anderst geladen, weil ich wollte das imports gehen, da ich es aber über eine object url lade, gehen relative imports nicht. Und wenn ich dann was baue das er sich dynamisch die richtige IP zusammenbaut, dann kann ich nur "import()" als async funktion verwenden, und die würde auch gehn wenn ich das script anderst lade.... muss mal schauen was ich da mache...

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

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

              (kann gerade nur sporadisch antworten, bin skifahren)

              Dann schalt einfach mal ab und geniese den Urlaub!
              Das alles soll ja noch ein Hobby sein und nicht in Stress ausarten.

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

                Hallo an alle
                Hoffe das alle Silvester gut verbracht haben.
                Wünsche euch allen ein Gesundes Frohes Erfolgreiches 2024 😉
                Mfg Thomas

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

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

                  Hallo an alle
                  Hoffe das alle Silvester gut verbracht haben.
                  Wünsche euch allen ein Gesundes Frohes Erfolgreiches 2024 😉
                  Mfg Thomas

                  Vielen Dank und den Wünschen schließe ich mich gerne an 🙂
                  Viele Grüße
                  Dieter

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

                    Hi @Blockmove
                    Brauche mal wieder einen denkanstoß 😉
                    <select @change='{"commands":[{"type":"SetSignalValue","signal":{"name":"intervall","source":"property"},"value":null}]}' style="position:absolute;left:323px;top:31px;width:113px;height:30px;">
                    <option value="0">Keine</option>
                    <option value="1">1 sec</option>
                    <option value="10">10 sec</option>
                    <option value="60">60 sec</option>
                    <option value="300">300 sec</option>
                    </select>
                    wenn ich zb das mache wie bekomme ich den value in das change rein ?
                    Weist du das zufällig ?

                    Danke im voraus

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

                      @smilie108

                      gar nicht...

                      die simple scripts können nicht auf werte aus events verweisen. Das kann ich noch bauen, gibt es aber im Moment nicht. Wenn dann musst blockly oder javascript verwenden.

                      Warum bindest du aber nicht die value property des selects direkt an ein Objekt? Ah du willst eine property eines custom controls setzen?

                      Mach mir mal bitte einen issue für das feature, sonst vergesse ich das.

                      Ich kann mir das nach meinem Urlaub anschauen, bin am 3ten wieder zuhause,

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

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

                        <select bind-prop:value='{"signal":"?valSelect","twoWay":true}' style="position:absolute;left:323px;top:31px;width:113px;height:30px;">
                        <option value="0">Keine</option>
                        <option value="1">1 sec</option>
                        <option value="10">10 sec</option>
                        <option value="60">60 sec</option>
                        <option value="300">300 sec</option>
                        </select>

                        Probier es mal so. Wie Jochen schon schrieb, nimm einfach ein twoWay-Binding.
                        Die option value werden wahrscheinlich als String übertragen

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

                          @blockmove Das ist alles nicht so ganz eindeutig mit den Bindings. Bei mir funktionierte das immer am einfachsten, wenn man es im grafischen Editor auf die value-Property zieht. Also einfach das Objekt aus dem ioBroker Objektbaum. Er fügt dann ein Binding-Shortcut mit = am Anfang ein und dann funktioniert es einfach. Manuell habe ich das noch nicht hinbekommen (außer ich tippe den generierten Code ab).

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

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

                            @blockmove Das ist alles nicht so ganz eindeutig mit den Bindings. Bei mir funktionierte das immer am einfachsten, wenn man es im grafischen Editor auf die value-Property zieht. Also einfach das Objekt aus dem ioBroker Objektbaum. Er fügt dann ein Binding-Shortcut mit = am Anfang ein und dann funktioniert es einfach. Manuell habe ich das noch nicht hinbekommen (außer ich tippe den generierten Code ab).

                            In dem Fall geht es um ein Custom Control.
                            Ich mach es eigentlich immer mit Rechtsclick auf das Quadrat beim Value und dann eben Edit Binding.
                            Bei webui gibt es eben mehrere Wege.

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

                              @Blockmove
                              Wenn ich das von dir genannte übernehme wie kann ich dann den wert in eine control.prop varible schreiben da es ja als costom control öfter aufgerufen wird. Kann ich keine fixen zuweisungen machen.
                              Gruß tom

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

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

                                @Blockmove
                                Wenn ich das von dir genannte übernehme wie kann ich dann den wert in eine control.prop varible schreiben da es ja als costom control öfter aufgerufen wird. Kann ich keine fixen zuweisungen machen.
                                Gruß tom

                                ???
                                Irgendwie weiß ich nicht genaue, was du meinst.
                                Die Binding funktioniert doch genauso im Custom Control wie im Screen. Nur der Syntax ist halt anders.

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

                                  @blockmove Ich glaube dann steh ich auf dem schlauch Sorry

                                  Beim Boutton geht das ja so
                                  <button @click='{"commands":[{"type":"SetSignalValue","signal":{"name":"timerangeselector","source":"property"},"value":"month"}]}' style="width:80px;height:30px;position:absolute;left:163px;top:31px;">Monat</button>

                                  Die controll.prop variabel lautet intervall.
                                  wenn ich nun das select auf die variable intervall legen weis ich aber nicht wie ich das value des select dorthin bekomme.

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

                                    alles erledigt manchesmal sieht man den wald nicht vor lauter bäumen und in diesem fall viel zu kompliziert gedacht 😉

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

                                      Sorry, hab gerade festegestellt, das ich in CustomControls 2-way bindings nicht auf die CustomControl Properties unterstütze. D.h. wenn ihr z.b. den value eines selct auf eine customProperty des CustomControls bindet, geht das nur in eine richtung von customcontrol-Property -> zum select. Andersrum nicht... Hab ich vergessen...

                                      Kommt ende die woche...

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

                                        Hab auch noch gesehen, das einige auf dem Testserver rumspielen und dort views etc anlegen. Das ist auch schön und gut, nur schlecht ist es, wenn alle Beispiele die ich gemacht habe gelöscht werden....
                                        (wie z.B. das Beispiel mit den Chart Controls)

                                        Muss mal schauen wie ich das ändern kann, hätte schon gerne das man dort ein paar Sachen auch stehen lassen kann. Wir brauchen wohl doch noch ne Userverwaltung und Berechtigungen innerhalb von webUi

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

                                          @jogibear9988
                                          komisch also der select geht mit dem binding ?intervall und mit two way event:change durch zumindest bei mir
                                          wenn ich die variabel in den objekten ändere andert sich auch der select auf der visu
                                          also geht es in beide richtungen
                                          Mfg

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

                                            @smilie108

                                            ?interval bindet an ein ioBroker Objekt welches du an die Property interval hängst, das geht.
                                            ??interval bindet den Wert direkt an die Property, das geht im Moment noch nicht. Brauchst du vlt. gerade nicht, aber geht halt auch nicht.
                                            Das braucht man dann eher wenn man das Custom Control wieder in ein anderes CustomControl einbettet

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            1.0k
                                            Online

                                            31.6k
                                            Users

                                            79.5k
                                            Topics

                                            1.3m
                                            Posts

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