Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Javascript in vis einfügen

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    Javascript in vis einfügen

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

      @jumbo125 sagte in Javascript in vis einfügen:

      kennt das problem jemand

      ja
      das html wird nicht fertig generiert vom server geladen sondern dynamisch generiert.
      document.ready signalisiert nur, das das was vom server geladen wurde nun vollständig gerendert wurde.
      das da dann programme loslaufen und nachträglich das noch verändert weiß der browser nicht.
      leider besitzt vis ebenfalls keine events die ein irgendwelches fertig signalisiert (widget fertig, view fertig, etc.)

      siehe dieser thread
      https://forum.iobroker.net/topic/48663/howto-skripte-im-vis-editor-mit-jquery?_=1682065519805
      suche nach function waitForElement

      J 1 Reply Last reply Reply Quote 0
      • J
        jumbo125 @OliverIO last edited by

        @oliverio
        Danke dir!

        J 1 Reply Last reply Reply Quote 0
        • J
          jumbo125 @jumbo125 last edited by

          Danke euch vielmals!!!!!!

          alles funktioniert. mit dem bockls und debugg habe ich mich schon auseinadergesetzt. Das ist ja wirklich einfach 🙂

          was mich noch interessieren würde:
          wie kann man den ins blockly js code einfügen

          bspw wird hier eine debug infos ausgegeben, wenn der Datenpunkt verändert wird.
          Super wäre es, wenn ich einen jquery code statt nur einen Text eintragen kann.

          Sinn dahinter:
          ich habe ein html element (Bild), welches je nach Datenpunkt das bild wechseln soll. Das würde ich nun gerne mit jquery angeben. hier mal das bljavascript_in_blockly.JPG ockly

          danke euch!

          J 1 Reply Last reply Reply Quote 0
          • J
            jumbo125 @jumbo125 last edited by

            wenn ich statt Blockly JS wähle und meinen code selbst schreibe, werden befehle wie alert() oder jquery ode nicht interpretiert, sondern als fehler angezeigt. weiß jemand wie man javascript in diesen bereich schreibt?
            danke

            1 Reply Last reply Reply Quote 0
            • J
              jumbo125 last edited by

              geht das nicht?
              ich müsste eine funcktion ausführen, immer wenn ein datenpunkt geändert wird. also mehrere datenpunkte müccten immer bei einer änderung eine funktion ausgeführt werden

              bahnuhr 1 Reply Last reply Reply Quote 0
              • bahnuhr
                bahnuhr Forum Testing Most Active @jumbo125 last edited by

                @jumbo125 sagte in Javascript in vis einfügen:

                geht das nicht?

                Nur mal so zum Interesse für mich.
                Du bist neu in JS und VIS (siehe #1).
                Und willst so ein Projekt umsetzen.

                Jeder andere nimmt ein blockly oder ein JS und steuert/reagiert auf die DP.

                Und du willst ein JS in VIS?!
                Warum ?

                Fazit:
                Ich habe mittlerweile 100... Scripte. Und alles funktioniert. Würde gar nicht auf die Idee kommen dies so machen zu wollen.
                Edit: Stimmt nicht. Habe 1 oder 2 Scripte in einem HTML; wurde von mir so übernommen aus dem Forum.

                J 1 Reply Last reply Reply Quote 0
                • OliverIO
                  OliverIO last edited by

                  @jumbo125
                  Das JavaScript im JavaScript Adapter wird auf dem Server ausgeführt. Eigentlich heißt es da auch node. Da gibt es auch kein Dokumenten Baum
                  Jquery und alert gehen da nucht

                  1 Reply Last reply Reply Quote 0
                  • J
                    jumbo125 @bahnuhr last edited by

                    @bahnuhr
                    Hallo danke dir

                    JS ist nicht neu für mich und ich habe etwa 10 Funktionen schon im html stehen

                    Vielleicht könnt ihr mir ja einen Tipp geben:
                    Ich habe in meiner html ein Fenster abgebildet. Über diesem Bild liegt ein Bild vom Fenster Rollo.
                    Dieses ändert je nach datenpunkt seine Position mit einer Animation.
                    Das funktioniert alles, wenn ich mittels JS den datenpunkt ändere, bspw beim Klick auf einen Button.
                    ABER: wenn ich mit der Fernbedienung beim Fenster das Rollo rauf oder runter steuere ändert sich zwar der datenpjnkt, aber die Animation wird nicht ausgelöst.
                    Daher die frage: Wie kann ich die Position des Bildes im html automatisch ändern bzw die Animation starten, sobald der datenpunkt geändert wird?

                    Danke

                    bahnuhr 2 Replies Last reply Reply Quote 0
                    • bahnuhr
                      bahnuhr Forum Testing Most Active @jumbo125 last edited by

                      @jumbo125

                      Dann poste doch mal was du hast.
                      widget
                      Script
                      etc.

                      bahnuhr 1 Reply Last reply Reply Quote 0
                      • bahnuhr
                        bahnuhr Forum Testing Most Active @jumbo125 last edited by

                        @jumbo125
                        Warum nimmst du nicht das hqwidget.
                        Das macht doch alles automatisch, ohne Script.

                        J 1 Reply Last reply Reply Quote 0
                        • J
                          jumbo125 @bahnuhr last edited by

                          @bahnuhr klingt gut, schaue ich mir an!

                          1 Reply Last reply Reply Quote 0
                          • bahnuhr
                            bahnuhr Forum Testing Most Active @bahnuhr last edited by

                            @bahnuhr sagte in Javascript in vis einfügen:

                            Dann poste doch mal was du hast.
                            widget
                            Script
                            etc.

                            würde mich trotzdem interessieren.

                            J 2 Replies Last reply Reply Quote 0
                            • J
                              jumbo125 @bahnuhr last edited by jumbo125

                              @bahnuhr
                              vorweg, werde ich natürlich das hq widget verwenden, da es die datenpunkte problemlos anspricht. ich kannte dieses nicht.

                              bisher nutze ich ein einfaches html widget:

                              hier mein html code

                              <div id="wohnzimmer_rollo" class="zimmer_fenster"><h3>Wohnzimmer</h3>
                              <table>
                                <tr>
                                  <td class="rollo_img wohnzimmer1"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                  <td class="rollo_img wohnzimmer2"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                  <td class="rollo_img wohnzimmer3"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                  <td class="rollo_img wohnzimmer4"><div class="fenster"><img src="http://10.0.0.142/terminal/images/rollo.png"></div></td>
                                </tr>
                                <tr>
                                  <td class="rollo_img" data-room="wohnzimmer1">
                              		<ul>
                              			<li><button id="wohnzimmer1_open" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                              			<li><button id="wohnzimmer1_zu" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                              			<li><button id="wohnzimmer1_75" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                              			<li><button id="wohnzimmer1_50" data-fenster-class="wohnzimmer1" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                              		</ul>
                              	</td>
                                  <td class="rollo_img" data-room="wohnzimmer2">
                              		<ul>
                              			<li><button id="wohnzimmer2_open" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                              			<li><button id="wohnzimmer2_zu" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                              			<li><button id="wohnzimmer2_75" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                              			<li><button id="wohnzimmer2_50" data-fenster-class="wohnzimmer2" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                              		</ul>
                              	</td>
                                  <td class="rollo_img" data-room="wohnzimmer3">
                              		<ul>
                              			<li><button id="wohnzimmer3_open" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                              			<li><button id="wohnzimmer3_zu" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                              			<li><button id="wohnzimmer3_75" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                              			<li><button id="wohnzimmer3_50" data-fenster-class="wohnzimmer3" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                              		</ul>
                              	</td>
                                  <td class="rollo_img" data-room="wohnzimmer4">
                              		<ul>
                              			<li><button id="wohnzimmer4_open" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">AUF</button></li>
                              			<li><button id="wohnzimmer4_zu" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">ZU</button></li>
                              			<li><button id="wohnzimmer4_75" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">75%</button></li>
                              			<li><button id="wohnzimmer4_50" data-fenster-class="wohnzimmer4" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only rollo-btn">50%</button></li>
                              		</ul>
                              	</td>
                                </tr>
                              
                              </table>
                              </div>
                              

                              der simple jquery test_code(nur ein ausschnit):

                              //move rollo
                              $(document).on("click", ".rollo-btn", function(){
                                 var fenster_id = $(this).attr("data-fenster-class");
                                 $(document).find("." + fenster_id).each(function(){
                                 $(this).find("img").css("marginTop", "0px");    
                                 });
                              });
                              

                              hier fährt das rollo einfach nur hinauf. es ist ein snippet welches ausgeführt wird, wenn ddas rollo ganz geöffnet wird

                              1 Reply Last reply Reply Quote 0
                              • J
                                jumbo125 @bahnuhr last edited by

                                @bahnuhr
                                weißt du zufällig wofür "Timeout für" steht????
                                vis.JPG

                                bahnuhr 1 Reply Last reply Reply Quote 0
                                • bahnuhr
                                  bahnuhr Forum Testing Most Active @jumbo125 last edited by

                                  @jumbo125

                                  Nein,
                                  Ich weiß auch gar nicht, was du da für ein widget hast.
                                  Die Angabe fehlt.

                                  J 1 Reply Last reply Reply Quote 0
                                  • J
                                    jumbo125 @bahnuhr last edited by

                                    @bahnuhr hqwidget, window and shutter.

                                    bahnuhr 1 Reply Last reply Reply Quote 0
                                    • bahnuhr
                                      bahnuhr Forum Testing Most Active @jumbo125 last edited by

                                      @jumbo125 sagte in Javascript in vis einfügen:

                                      @bahnuhr hqwidget, window and shutter.

                                      Hab ich noch nicht probiert.
                                      Steht bei mir auch so drin.

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

                                      Support us

                                      ioBroker
                                      Community Adapters
                                      Donate

                                      651
                                      Online

                                      31.9k
                                      Users

                                      80.1k
                                      Topics

                                      1.3m
                                      Posts

                                      4
                                      34
                                      1520
                                      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