Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • 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

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread)

NEWS

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

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

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

Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread)

Geplant Angeheftet Gesperrt Verschoben Tester
appdark-modeiqontrolresponsivevisvisualisierungvisualizationwidget
7.6k Beiträge 296 Kommentatoren 7.0m Aufrufe 201 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • da_WoodyD da_Woody

    @dp20eic gefällt mir auch. Allerdings passt der Abstand von 2 nicht mit deinem Export überein. Da hat du 3x1 drinnen. ;) Das wäre am Handy 2 Leerzeilen...
    Kann man aber leicht ändern... :)

    ? Offline
    ? Offline
    Ein ehemaliger Benutzer
    schrieb am zuletzt editiert von
    #7441

    @da_woody

    Moin,

    ja, ich bin nicht stringent vorgegangen, ich habe ohne zu schauen wie die Kachel eingestellt ist, die Screenshots gemacht.
    Deswegen habe ich auch eine Kachel und ein Link auf diese Kachel.

    Im Nachgang habe ich mit der Größe der Kacheln getestet, aber keinen Screenshot mehr gepostet, man kann mit der Größe der Kacheln spielen und schauen wie es am besten passt, es wird nie so genau, wie wenn man VIS benutzt, wobei VIS 1.x halt auch nicht responsive ist und erst VIS 2.x etwas in die Richtung zu bieten hat, dann ist man aber auch nicht mehr Pixel genau. Somit muss man einen Tod sterben.

    iqontrol ist so weit ich das verstehe horizontal ausgerichtet, durch NZ und die Größeneinstellung kann man die Kacheln etwas organisieren, in VIS 2 wird es vertikale Spalten geben, in dieWidgets/Kacheln eingefügt werden und somit bei Größenänderungen innerhalb der vertikalen Spalten organisiert werden.

    Ich bin leider schlecht, was das Designen von schönen Visualisierungen angeht und bin mit den Möglichkeiten, die mir iqontrol bietet, zu 100 % zufrieden.

    Wenn ich hier sehe, was so mancher aus diesen Möglichkeiten zaubert, bin ich echt baff.

    VG
    Bernd

    1 Antwort Letzte Antwort
    2
    • N Offline
      N Offline
      noidea
      schrieb am zuletzt editiert von
      #7442

      Hallo Zusammen,

      ich hatte hier in diesem Thema im Post-Nr. 4292 die Flip Clock von siedi gefunden. Da steht das man die Dateien hochladen und dann bei Background_URL auswählen soll:
      https://213.136.68.177/topic/22039/test-adapter-iqontrol-2-0-x-vis-entwicklungs-thread/4292?lang=en-GB&page=5

      Hat das mal jemand ausprobiert? Wenn ich das mache bekomme ich nur ein leeres Widget angezeigt:

      0a5afd9a-c1c5-4c46-a68d-a5466d6929cb-grafik.png

      Ich habe ein Widget erstellen lassen und dann das html ausgewählt.

      ed99fe69-1e15-4677-bdd7-0bd6c8cccc8a-grafik.png

      Ich finde die Uhr echt schön und würde die gerne verwenden. Das ist doch bestimmt wieder ne Blödheit von mir, das es nicht klappt :face_with_rolling_eyes: :grimacing:

      da_WoodyD 1 Antwort Letzte Antwort
      0
      • N noidea

        Hallo Zusammen,

        ich hatte hier in diesem Thema im Post-Nr. 4292 die Flip Clock von siedi gefunden. Da steht das man die Dateien hochladen und dann bei Background_URL auswählen soll:
        https://213.136.68.177/topic/22039/test-adapter-iqontrol-2-0-x-vis-entwicklungs-thread/4292?lang=en-GB&page=5

        Hat das mal jemand ausprobiert? Wenn ich das mache bekomme ich nur ein leeres Widget angezeigt:

        0a5afd9a-c1c5-4c46-a68d-a5466d6929cb-grafik.png

        Ich habe ein Widget erstellen lassen und dann das html ausgewählt.

        ed99fe69-1e15-4677-bdd7-0bd6c8cccc8a-grafik.png

        Ich finde die Uhr echt schön und würde die gerne verwenden. Das ist doch bestimmt wieder ne Blödheit von mir, das es nicht klappt :face_with_rolling_eyes: :grimacing:

        da_WoodyD Offline
        da_WoodyD Offline
        da_Woody
        schrieb am zuletzt editiert von
        #7443

        @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

        Ich habe ein Widget erstellen lassen und dann das html ausgewählt.

        ich denk mal, da liegt das problem.
        nicht erstellen lassen, sondern widget als gerät wählen.
        steht in dem beitrag aber auch gut beschrieben.
        die dateien raufladen
        2fb13662-2f31-4f24-8362-8cad43f9a865-grafik.png
        und dann
        clock_iqontrol_0_devices.json
        importieren.
        ergebniss
        24b5b506-8764-4d41-998e-7f023835de94-grafik.png
        entsprechend anpassen für dich.

        gruß vom Woody
        HAPPINESS is not a DESTINATION, it's a WAY of LIFE!

        N 1 Antwort Letzte Antwort
        0
        • da_WoodyD da_Woody

          @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

          Ich habe ein Widget erstellen lassen und dann das html ausgewählt.

          ich denk mal, da liegt das problem.
          nicht erstellen lassen, sondern widget als gerät wählen.
          steht in dem beitrag aber auch gut beschrieben.
          die dateien raufladen
          2fb13662-2f31-4f24-8362-8cad43f9a865-grafik.png
          und dann
          clock_iqontrol_0_devices.json
          importieren.
          ergebniss
          24b5b506-8764-4d41-998e-7f023835de94-grafik.png
          entsprechend anpassen für dich.

          N Offline
          N Offline
          noidea
          schrieb am zuletzt editiert von noidea
          #7444

          @da_woody

          Ich habe auch mal manuell ein Gerät hinzugefügt, aber ich sehe gerade, das bei mir die flip.min.js Datei fehlt. Ich kann diese auch gar nicht hinzufügen. Ich kann nur eine js-Datei erstellen. Da sehe ich mal wieder, wie viel ich immer noch nicht weiß und kapiere :confounded:

          Wie hast du die Datei hochgeladen?

          Deine jason kann ich leider nicht importieren, weil da das mit einem Fehler abbricht:

          e2a35160-f59c-4e03-8d4d-a1f816d98b4f-grafik.png

          da_WoodyD 2 Antworten Letzte Antwort
          0
          • N noidea

            @da_woody

            Ich habe auch mal manuell ein Gerät hinzugefügt, aber ich sehe gerade, das bei mir die flip.min.js Datei fehlt. Ich kann diese auch gar nicht hinzufügen. Ich kann nur eine js-Datei erstellen. Da sehe ich mal wieder, wie viel ich immer noch nicht weiß und kapiere :confounded:

            Wie hast du die Datei hochgeladen?

            Deine jason kann ich leider nicht importieren, weil da das mit einem Fehler abbricht:

            e2a35160-f59c-4e03-8d4d-a1f816d98b4f-grafik.png

            da_WoodyD Offline
            da_WoodyD Offline
            da_Woody
            schrieb am zuletzt editiert von
            #7445

            @noidea gerade nochmal die .zip geholt. da ist die datei drinnen.
            entpacken und in das verzeichniss raufladen.
            62fa1d07-7681-4295-9aed-69fc4857fa9f-grafik.png
            warum der fehler, keine ahnung. eventuell wegen der fehlenden datei?
            schon lange her, lööpt bei mir aber seit damals...

            gruß vom Woody
            HAPPINESS is not a DESTINATION, it's a WAY of LIFE!

            1 Antwort Letzte Antwort
            0
            • N noidea

              @da_woody

              Ich habe auch mal manuell ein Gerät hinzugefügt, aber ich sehe gerade, das bei mir die flip.min.js Datei fehlt. Ich kann diese auch gar nicht hinzufügen. Ich kann nur eine js-Datei erstellen. Da sehe ich mal wieder, wie viel ich immer noch nicht weiß und kapiere :confounded:

              Wie hast du die Datei hochgeladen?

              Deine jason kann ich leider nicht importieren, weil da das mit einem Fehler abbricht:

              e2a35160-f59c-4e03-8d4d-a1f816d98b4f-grafik.png

              da_WoodyD Offline
              da_WoodyD Offline
              da_Woody
              schrieb am zuletzt editiert von
              #7446

              @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

              Wie hast du die Datei hochgeladen?

              wie alles andere auch.
              a123f973-2456-46e9-8fe2-6cd9837eae9d-grafik.png
              alle markieren,
              beb23426-92b1-43c7-b9b3-c7282ea2ca29-grafik.png
              fertig ist der käse...

              gruß vom Woody
              HAPPINESS is not a DESTINATION, it's a WAY of LIFE!

              N 1 Antwort Letzte Antwort
              0
              • da_WoodyD da_Woody

                @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                Wie hast du die Datei hochgeladen?

                wie alles andere auch.
                a123f973-2456-46e9-8fe2-6cd9837eae9d-grafik.png
                alle markieren,
                beb23426-92b1-43c7-b9b3-c7282ea2ca29-grafik.png
                fertig ist der käse...

                N Offline
                N Offline
                noidea
                schrieb am zuletzt editiert von
                #7447

                @da_woody

                Und genau da liegt bei mir dern Hund begraben: Ich finde die Datei in dem Zip auch, aber wenn ich die hochladen will, dann fehlt diese:

                fe5e5829-4adf-435b-a0dc-75999a921e9e-grafik.png

                Erst wenn ich unten rechts auf "Alle Dateien" wechsel, sehe ich die:

                c0614586-02c0-4437-8016-c46d74910cdb-grafik.png

                Und wenn ich die dann auswähle bekomme ich folgende Fehlermeldung:

                c08fc931-4a48-45e1-b3bb-3fa702263fed-grafik.png

                Da scheint mit meiner Installation oder was auch immer nicht zu stimmen.

                da_WoodyD 1 Antwort Letzte Antwort
                0
                • N noidea

                  @da_woody

                  Und genau da liegt bei mir dern Hund begraben: Ich finde die Datei in dem Zip auch, aber wenn ich die hochladen will, dann fehlt diese:

                  fe5e5829-4adf-435b-a0dc-75999a921e9e-grafik.png

                  Erst wenn ich unten rechts auf "Alle Dateien" wechsel, sehe ich die:

                  c0614586-02c0-4437-8016-c46d74910cdb-grafik.png

                  Und wenn ich die dann auswähle bekomme ich folgende Fehlermeldung:

                  c08fc931-4a48-45e1-b3bb-3fa702263fed-grafik.png

                  Da scheint mit meiner Installation oder was auch immer nicht zu stimmen.

                  da_WoodyD Offline
                  da_WoodyD Offline
                  da_Woody
                  schrieb am zuletzt editiert von da_Woody
                  #7448

                  @noidea bist du da im richtigen verzeichniss, bzw hast du das erstellt?
                  e088fb42-d558-47bb-84a4-efd9d02a7f90-grafik.png
                  andererseits ist sie da ja zu sehn...
                  67d06be1-32f1-4090-bbb1-f0c47cd97f57-grafik.png

                  gruß vom Woody
                  HAPPINESS is not a DESTINATION, it's a WAY of LIFE!

                  N 1 Antwort Letzte Antwort
                  0
                  • da_WoodyD da_Woody

                    @noidea bist du da im richtigen verzeichniss, bzw hast du das erstellt?
                    e088fb42-d558-47bb-84a4-efd9d02a7f90-grafik.png
                    andererseits ist sie da ja zu sehn...
                    67d06be1-32f1-4090-bbb1-f0c47cd97f57-grafik.png

                    N Offline
                    N Offline
                    noidea
                    schrieb am zuletzt editiert von
                    #7449

                    @da_woody

                    Ich habe jetzt noch mal alles komplett rausgeschmissen und IOBROKER neugestartet. Jetzt kam zwar wieder der Fehler, dass das Dateiformat nicht passt, aber reingeladen hat er es trotzdem. Jetzt funktioniert es seltsamerweise.

                    Ich bin ein rotes Tuch für jeden IT´ler: Haben Sie IHren Rechner schon mal neu gestartet? :grin:

                    Vielen Dank für Euren Support :+1:

                    da_WoodyD 1 Antwort Letzte Antwort
                    0
                    • N noidea

                      @da_woody

                      Ich habe jetzt noch mal alles komplett rausgeschmissen und IOBROKER neugestartet. Jetzt kam zwar wieder der Fehler, dass das Dateiformat nicht passt, aber reingeladen hat er es trotzdem. Jetzt funktioniert es seltsamerweise.

                      Ich bin ein rotes Tuch für jeden IT´ler: Haben Sie IHren Rechner schon mal neu gestartet? :grin:

                      Vielen Dank für Euren Support :+1:

                      da_WoodyD Offline
                      da_WoodyD Offline
                      da_Woody
                      schrieb am zuletzt editiert von
                      #7450

                      @noidea reboot machts good... fool.gif
                      haupsache es tutet jetzt...

                      gruß vom Woody
                      HAPPINESS is not a DESTINATION, it's a WAY of LIFE!

                      1 Antwort Letzte Antwort
                      0
                      • s.bormannS s.bormann

                        Es gibt eine neue Test-Version auf Github. Hier wurde das Popup auf Anregung von @uwelingstaedt überarbeitet und erweitert:

                        Es gibt jetzt den neuen Datenpunkt iqontrol.x.Popup.PersistentMessage. Wenn man hier eine Nachricht eingibt, wird das Popup zwischengespeichert und dann bei jedem Start von iQontrol angezeigt, bis es bestätigt wird. Bislang wurden Popups ja nur auf den gerade laufenden iQontrol-Instanzen angezeigt.

                        a0fb4d4c-67ef-4b68-9638-21354bddbc76-image.png

                        Man kann persistierende Popups auf verschiedene Weisen bestätigen:

                        • Durch Ablauf der Anzeigedauer (Duration)

                        • Durch Klick auf das Popup
                          Beides kann verhindert werden, wenn man den Datenpunkt PersistentUndismissible auf true setzt.

                        • Dann kann man die Nachricht nur noch aktiv löschen. Dazu vergibt man in PersitentId eine ID (beliebige Bezeichnung der Nachricht). Wenn man diese ID dann in PERSISTENT_MESSAGES_DELETE_ID einfügt, wir die gespeicherte Nachricht gelöscht. Fügt man hier "null" ein, werden alle Nachrichten gelöscht.

                        • Zudem kann man eine Gültigkeitsdauer des Popups im Datenpunkt PersistentExpires angeben. Dies kann entweder ein Timestamp (Datum und Uhrzeit) sein oder eine Zeitdauer in Sekunden.

                        Es gibt noch den Datenpunkt PERSISTENT_MESSAGES_SHOW_ID, in den man eine ID schreiben kann, um dann eine gespeicherte Nachricht noch mal anzeigen zu lassen. Fügt man hier "null" ein, werden alle gespeicherten Nachrichten erneut angezeit.

                        Ferner gibt es noch zwei neue Optionen, die man auch bei normalen Popups nutzen kann: ClickKeepsOpen und ButtonClears. Die Beschreibung hierzu findet man in der Readme auf Github.

                        M Offline
                        M Offline
                        muuulle
                        schrieb am zuletzt editiert von
                        #7451

                        @s-bormann

                        Moin Sebastian,

                        die persistenten Popup sind großartig. Zwei bebilderte Fragen:

                        1. Kann man die Transparenz reduzieren?
                          Bildschirmfoto 2023-03-29 um 20.55.11.png.png

                        2. Was bedeuten die Info- und Warnmeldung vom Web Adapter?
                          logs - pi-broker.png.png

                        Besten Dank

                        M 1 Antwort Letzte Antwort
                        0
                        • N Offline
                          N Offline
                          noidea
                          schrieb am zuletzt editiert von
                          #7452

                          Hallo Zusammen,

                          ich habe mal wieder ein wahrscheinlich schnell zu beantwortende Frage:

                          Ich hab bei dslrase gesehen, das er unterschiedliche Schriftfarben für verschiedene Kacheln hat:

                          e17dbea7-3735-4c75-8dcb-6ea7b2a17837-image.png

                          Ich habe unter Optionen die allgemeine Schriftart und Farbe gefunden und auch scho angepasst, aber ich weiß leider nicht, wie man unterschiedlich Farben zuweisen kann.

                          Vielen Dank und schöne Grüße

                          1 Antwort Letzte Antwort
                          0
                          • dslraserD Offline
                            dslraserD Offline
                            dslraser
                            Forum Testing Most Active
                            schrieb am zuletzt editiert von dslraser
                            #7453

                            @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                            Hallo Zusammen,

                            ich habe mal wieder ein wahrscheinlich schnell zu beantwortende Frage:

                            Ich hab bei dslrase gesehen, das er unterschiedliche Schriftfarben für verschiedene Kacheln hat:

                            e17dbea7-3735-4c75-8dcb-6ea7b2a17837-image.png

                            Ich habe unter Optionen die allgemeine Schriftart und Farbe gefunden und auch scho angepasst, aber ich weiß leider nicht, wie man unterschiedlich Farben zuweisen kann.

                            Vielen Dank und schöne Grüße

                            Ist lange her und ich bin im Moment auch nur am Handy.
                            Hast Du schon unter Optionen bei Beschriftung probiert ?

                            D6B26DE5-4410-46B0-A7A2-51D444BF4B19.jpeg

                            N 1 Antwort Letzte Antwort
                            0
                            • dslraserD dslraser

                              @noidea sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                              Hallo Zusammen,

                              ich habe mal wieder ein wahrscheinlich schnell zu beantwortende Frage:

                              Ich hab bei dslrase gesehen, das er unterschiedliche Schriftfarben für verschiedene Kacheln hat:

                              e17dbea7-3735-4c75-8dcb-6ea7b2a17837-image.png

                              Ich habe unter Optionen die allgemeine Schriftart und Farbe gefunden und auch scho angepasst, aber ich weiß leider nicht, wie man unterschiedlich Farben zuweisen kann.

                              Vielen Dank und schöne Grüße

                              Ist lange her und ich bin im Moment auch nur am Handy.
                              Hast Du schon unter Optionen bei Beschriftung probiert ?

                              D6B26DE5-4410-46B0-A7A2-51D444BF4B19.jpeg

                              N Offline
                              N Offline
                              noidea
                              schrieb am zuletzt editiert von
                              #7454

                              @dslraser
                              Ja da sind die Farbeinstellungen für aktiv und inaktiv zu finden. Ich denke das du das darüber gemacht hast. Soweit ich das sehe gibt es keine Möglichkeit Kachel individuell die Schriftfarbe einzustellen.

                              1 Antwort Letzte Antwort
                              0
                              • R Offline
                                R Offline
                                Rookie50
                                schrieb am zuletzt editiert von
                                #7455

                                Hi, falls es jemanden interessiert. Ich habe es nun geschafft meine Kameras mit RTSPtoWeb in iQontrol darzustellen. Man muss einfach ein neues Geräte als Widget erstellen und unter Background_HTML folgenden Code einfügen:

                                <input type="hidden" name="webrtc-url" id="webrtc-url" value="http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc" /> 
                                <video id="webrtc-video" autoplay muted playsinline controls style="max-width: 100%; max-height: 100%;" />
                                <script>
                                setTimeout(function () {
                                  function startPlay(videoEl, url) {
                                    const webrtc = new RTCPeerConnection({
                                      iceServers: [
                                        {
                                          urls: ["stun:stun.l.google.com:19302"],
                                        },
                                      ],
                                      sdpSemantics: "unified-plan",
                                    });
                                    webrtc.ontrack = function (event) {
                                      console.log(event.streams.length + " track is delivered");
                                      videoEl.srcObject = event.streams[0];
                                      videoEl.play();
                                    };
                                    webrtc.addTransceiver("video", { direction: "sendrecv" });
                                    webrtc.onnegotiationneeded = async function handleNegotiationNeeded() {
                                      const offer = await webrtc.createOffer();
                                 
                                      await webrtc.setLocalDescription(offer);
                                 
                                      fetch(url, {
                                        method: "POST",
                                        body: new URLSearchParams({ data: btoa(webrtc.localDescription.sdp) }),
                                      })
                                        .then((response) => response.text())
                                        .then((data) => {
                                          try {
                                            webrtc.setRemoteDescription(new RTCSessionDescription({ type: "answer", sdp: atob(data) }));
                                          } catch (e) {
                                            console.warn(e);
                                          }
                                        });
                                    };
                                 
                                    const webrtcSendChannel = webrtc.createDataChannel("rtsptowebSendChannel");
                                    webrtcSendChannel.onopen = (event) => {
                                      console.log(`${webrtcSendChannel.label} has opened`);
                                      webrtcSendChannel.send("ping");
                                    };
                                    webrtcSendChannel.onclose = (_event) => {
                                      console.log(`${webrtcSendChannel.label} has closed`);
                                      startPlay(videoEl, url);
                                    };
                                    webrtcSendChannel.onmessage = (event) => console.log(event.data);
                                  }
                                 
                                  const videoEl = document.querySelector("#webrtc-video");
                                  const webrtcUrl = document.querySelector("#webrtc-url").value;
                                 
                                  startPlay(videoEl, webrtcUrl);
                                }, 1000);
                                </script>
                                

                                In der erste Zeile muss nur die IP addresse und die Kamera ID angepasst werden:
                                http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc

                                Sobald die Ansicht geladen wird startet der Player mit Videobild.

                                s.bormannS B 2 Antworten Letzte Antwort
                                0
                                • R Rookie50

                                  Hi, falls es jemanden interessiert. Ich habe es nun geschafft meine Kameras mit RTSPtoWeb in iQontrol darzustellen. Man muss einfach ein neues Geräte als Widget erstellen und unter Background_HTML folgenden Code einfügen:

                                  <input type="hidden" name="webrtc-url" id="webrtc-url" value="http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc" /> 
                                  <video id="webrtc-video" autoplay muted playsinline controls style="max-width: 100%; max-height: 100%;" />
                                  <script>
                                  setTimeout(function () {
                                    function startPlay(videoEl, url) {
                                      const webrtc = new RTCPeerConnection({
                                        iceServers: [
                                          {
                                            urls: ["stun:stun.l.google.com:19302"],
                                          },
                                        ],
                                        sdpSemantics: "unified-plan",
                                      });
                                      webrtc.ontrack = function (event) {
                                        console.log(event.streams.length + " track is delivered");
                                        videoEl.srcObject = event.streams[0];
                                        videoEl.play();
                                      };
                                      webrtc.addTransceiver("video", { direction: "sendrecv" });
                                      webrtc.onnegotiationneeded = async function handleNegotiationNeeded() {
                                        const offer = await webrtc.createOffer();
                                   
                                        await webrtc.setLocalDescription(offer);
                                   
                                        fetch(url, {
                                          method: "POST",
                                          body: new URLSearchParams({ data: btoa(webrtc.localDescription.sdp) }),
                                        })
                                          .then((response) => response.text())
                                          .then((data) => {
                                            try {
                                              webrtc.setRemoteDescription(new RTCSessionDescription({ type: "answer", sdp: atob(data) }));
                                            } catch (e) {
                                              console.warn(e);
                                            }
                                          });
                                      };
                                   
                                      const webrtcSendChannel = webrtc.createDataChannel("rtsptowebSendChannel");
                                      webrtcSendChannel.onopen = (event) => {
                                        console.log(`${webrtcSendChannel.label} has opened`);
                                        webrtcSendChannel.send("ping");
                                      };
                                      webrtcSendChannel.onclose = (_event) => {
                                        console.log(`${webrtcSendChannel.label} has closed`);
                                        startPlay(videoEl, url);
                                      };
                                      webrtcSendChannel.onmessage = (event) => console.log(event.data);
                                    }
                                   
                                    const videoEl = document.querySelector("#webrtc-video");
                                    const webrtcUrl = document.querySelector("#webrtc-url").value;
                                   
                                    startPlay(videoEl, webrtcUrl);
                                  }, 1000);
                                  </script>
                                  

                                  In der erste Zeile muss nur die IP addresse und die Kamera ID angepasst werden:
                                  http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc

                                  Sobald die Ansicht geladen wird startet der Player mit Videobild.

                                  s.bormannS Offline
                                  s.bormannS Offline
                                  s.bormann
                                  Most Active
                                  schrieb am zuletzt editiert von
                                  #7456

                                  @rookie50 sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                  Hi, falls es jemanden interessiert. Ich habe es nun geschafft meine Kameras mit RTSPtoWeb in iQontrol darzustellen. Man muss einfach ein neues Geräte als Widget erstellen und unter Background_HTML folgenden Code einfügen:

                                  <input type="hidden" name="webrtc-url" id="webrtc-url" value="http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc" /> 
                                  <video id="webrtc-video" autoplay muted playsinline controls style="max-width: 100%; max-height: 100%;" />
                                  <script>
                                  setTimeout(function () {
                                    function startPlay(videoEl, url) {
                                      const webrtc = new RTCPeerConnection({
                                        iceServers: [
                                          {
                                            urls: ["stun:stun.l.google.com:19302"],
                                          },
                                        ],
                                        sdpSemantics: "unified-plan",
                                      });
                                      webrtc.ontrack = function (event) {
                                        console.log(event.streams.length + " track is delivered");
                                        videoEl.srcObject = event.streams[0];
                                        videoEl.play();
                                      };
                                      webrtc.addTransceiver("video", { direction: "sendrecv" });
                                      webrtc.onnegotiationneeded = async function handleNegotiationNeeded() {
                                        const offer = await webrtc.createOffer();
                                   
                                        await webrtc.setLocalDescription(offer);
                                   
                                        fetch(url, {
                                          method: "POST",
                                          body: new URLSearchParams({ data: btoa(webrtc.localDescription.sdp) }),
                                        })
                                          .then((response) => response.text())
                                          .then((data) => {
                                            try {
                                              webrtc.setRemoteDescription(new RTCSessionDescription({ type: "answer", sdp: atob(data) }));
                                            } catch (e) {
                                              console.warn(e);
                                            }
                                          });
                                      };
                                   
                                      const webrtcSendChannel = webrtc.createDataChannel("rtsptowebSendChannel");
                                      webrtcSendChannel.onopen = (event) => {
                                        console.log(`${webrtcSendChannel.label} has opened`);
                                        webrtcSendChannel.send("ping");
                                      };
                                      webrtcSendChannel.onclose = (_event) => {
                                        console.log(`${webrtcSendChannel.label} has closed`);
                                        startPlay(videoEl, url);
                                      };
                                      webrtcSendChannel.onmessage = (event) => console.log(event.data);
                                    }
                                   
                                    const videoEl = document.querySelector("#webrtc-video");
                                    const webrtcUrl = document.querySelector("#webrtc-url").value;
                                   
                                    startPlay(videoEl, webrtcUrl);
                                  }, 1000);
                                  </script>
                                  

                                  In der erste Zeile muss nur die IP addresse und die Kamera ID angepasst werden:
                                  http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc

                                  Sobald die Ansicht geladen wird startet der Player mit Videobild.

                                  Klasse!
                                  Könntest Du ggf. einen kurzen Wiki-Artikel erstellen? Also im Prinzip dieser Beitrag + ganz kurz, wie das mit rtsptoweb geht.
                                  Das wäre echt klasse!

                                  R 1 Antwort Letzte Antwort
                                  0
                                  • s.bormannS s.bormann

                                    @rookie50 sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                    Hi, falls es jemanden interessiert. Ich habe es nun geschafft meine Kameras mit RTSPtoWeb in iQontrol darzustellen. Man muss einfach ein neues Geräte als Widget erstellen und unter Background_HTML folgenden Code einfügen:

                                    <input type="hidden" name="webrtc-url" id="webrtc-url" value="http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc" /> 
                                    <video id="webrtc-video" autoplay muted playsinline controls style="max-width: 100%; max-height: 100%;" />
                                    <script>
                                    setTimeout(function () {
                                      function startPlay(videoEl, url) {
                                        const webrtc = new RTCPeerConnection({
                                          iceServers: [
                                            {
                                              urls: ["stun:stun.l.google.com:19302"],
                                            },
                                          ],
                                          sdpSemantics: "unified-plan",
                                        });
                                        webrtc.ontrack = function (event) {
                                          console.log(event.streams.length + " track is delivered");
                                          videoEl.srcObject = event.streams[0];
                                          videoEl.play();
                                        };
                                        webrtc.addTransceiver("video", { direction: "sendrecv" });
                                        webrtc.onnegotiationneeded = async function handleNegotiationNeeded() {
                                          const offer = await webrtc.createOffer();
                                     
                                          await webrtc.setLocalDescription(offer);
                                     
                                          fetch(url, {
                                            method: "POST",
                                            body: new URLSearchParams({ data: btoa(webrtc.localDescription.sdp) }),
                                          })
                                            .then((response) => response.text())
                                            .then((data) => {
                                              try {
                                                webrtc.setRemoteDescription(new RTCSessionDescription({ type: "answer", sdp: atob(data) }));
                                              } catch (e) {
                                                console.warn(e);
                                              }
                                            });
                                        };
                                     
                                        const webrtcSendChannel = webrtc.createDataChannel("rtsptowebSendChannel");
                                        webrtcSendChannel.onopen = (event) => {
                                          console.log(`${webrtcSendChannel.label} has opened`);
                                          webrtcSendChannel.send("ping");
                                        };
                                        webrtcSendChannel.onclose = (_event) => {
                                          console.log(`${webrtcSendChannel.label} has closed`);
                                          startPlay(videoEl, url);
                                        };
                                        webrtcSendChannel.onmessage = (event) => console.log(event.data);
                                      }
                                     
                                      const videoEl = document.querySelector("#webrtc-video");
                                      const webrtcUrl = document.querySelector("#webrtc-url").value;
                                     
                                      startPlay(videoEl, webrtcUrl);
                                    }, 1000);
                                    </script>
                                    

                                    In der erste Zeile muss nur die IP addresse und die Kamera ID angepasst werden:
                                    http://192.168.2.2:8083/stream/a34525d7-6d13-421d-9127-2cd7bc4323dc/channel/0/webrtc

                                    Sobald die Ansicht geladen wird startet der Player mit Videobild.

                                    Klasse!
                                    Könntest Du ggf. einen kurzen Wiki-Artikel erstellen? Also im Prinzip dieser Beitrag + ganz kurz, wie das mit rtsptoweb geht.
                                    Das wäre echt klasse!

                                    R Offline
                                    R Offline
                                    Rookie50
                                    schrieb am zuletzt editiert von
                                    #7457

                                    @s-bormann Hi, ist im Wiki :-D Habe ein bisschen von tombox geklaut ;-) Bitte geht mal durch, ob es so verständlich ist.

                                    s.bormannS 1 Antwort Letzte Antwort
                                    0
                                    • R Rookie50

                                      @s-bormann Hi, ist im Wiki :-D Habe ein bisschen von tombox geklaut ;-) Bitte geht mal durch, ob es so verständlich ist.

                                      s.bormannS Offline
                                      s.bormannS Offline
                                      s.bormann
                                      Most Active
                                      schrieb am zuletzt editiert von
                                      #7458

                                      @rookie50 sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                      @s-bormann Hi, ist im Wiki :-D Habe ein bisschen von tombox geklaut ;-) Bitte geht mal durch, ob es so verständlich ist.

                                      Klasse!! Sieht super aus, vielen Dank!!

                                      1 Antwort Letzte Antwort
                                      0
                                      • M muuulle

                                        @s-bormann

                                        Moin Sebastian,

                                        die persistenten Popup sind großartig. Zwei bebilderte Fragen:

                                        1. Kann man die Transparenz reduzieren?
                                          Bildschirmfoto 2023-03-29 um 20.55.11.png.png

                                        2. Was bedeuten die Info- und Warnmeldung vom Web Adapter?
                                          logs - pi-broker.png.png

                                        Besten Dank

                                        M Offline
                                        M Offline
                                        muuulle
                                        schrieb am zuletzt editiert von muuulle
                                        #7459

                                        @muuulle said in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                        @s-bormann

                                        Moin Sebastian,

                                        die persistenten Popup sind großartig. Zwei bebilderte Fragen:

                                        1. Kann man die Transparenz reduzieren?
                                          Bildschirmfoto 2023-03-29 um 20.55.11.png.png

                                        2. Was bedeuten die Info- und Warnmeldung vom Web Adapter?
                                          logs - pi-broker.png.png

                                        Besten Dank

                                        @s-bormann
                                        Moin,

                                        neben den beiden hier zitierten Punkten, habe ich noch eine weitere Frage/Anregung 😊

                                        Kann man persistente Popup einer bestimmten ID über einen Blockly Befehl löschen?

                                        Schönes Wochenende

                                        s.bormannS 1 Antwort Letzte Antwort
                                        0
                                        • M muuulle

                                          @muuulle said in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                          @s-bormann

                                          Moin Sebastian,

                                          die persistenten Popup sind großartig. Zwei bebilderte Fragen:

                                          1. Kann man die Transparenz reduzieren?
                                            Bildschirmfoto 2023-03-29 um 20.55.11.png.png

                                          2. Was bedeuten die Info- und Warnmeldung vom Web Adapter?
                                            logs - pi-broker.png.png

                                          Besten Dank

                                          @s-bormann
                                          Moin,

                                          neben den beiden hier zitierten Punkten, habe ich noch eine weitere Frage/Anregung 😊

                                          Kann man persistente Popup einer bestimmten ID über einen Blockly Befehl löschen?

                                          Schönes Wochenende

                                          s.bormannS Offline
                                          s.bormannS Offline
                                          s.bormann
                                          Most Active
                                          schrieb am zuletzt editiert von
                                          #7460

                                          @muuulle sagte in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                          @muuulle said in Test Adapter iQontrol 2.0.x Vis (Entwicklungs-Thread):

                                          @s-bormann

                                          Moin Sebastian,

                                          die persistenten Popup sind großartig. Zwei bebilderte Fragen:

                                          1. Kann man die Transparenz reduzieren?
                                            Bildschirmfoto 2023-03-29 um 20.55.11.png.png

                                          2. Was bedeuten die Info- und Warnmeldung vom Web Adapter?
                                            logs - pi-broker.png.png

                                          Besten Dank

                                          @s-bormann
                                          Moin,

                                          neben den beiden hier zitierten Punkten, habe ich noch eine weitere Frage/Anregung 😊

                                          Kann man persistente Popup einer bestimmten ID über einen Blockly Befehl löschen?

                                          Schönes Wochenende

                                          Hi,

                                          Zu 1.: Transprarenz wollte ich noch als Option einbauen - bin aber gerade anderweitig beschäftigt, deshalb wird es noch ein klein wenig dauern. Bis dahin könntest Du im Benutzerdefinierten CSS folgendes eingeben:

                                          #popup{
                                          	opacity: 1 !important;
                                          }
                                          

                                          Damit fadet es zwar nicht mehr so schön ein- und aus, aber es kann als Überbrückung bis alles user-wählbar ist genutzt werden. Ich werde dann auch noch die Hintergrundfarbe anpassbar machen.

                                          Zu 2.: Die Warnungen im Web-Adapter kann man erst mal ignorieren, da muss ich noch das ack-flag korrekt setzen, werde ich demnächst bearbeiten.

                                          Zu 3.: Das geht mit dem "steuere"-Blockly auf den Datenpunkt iqontrol.<x>.Popup.PERSISTENT_MESSAGES_DELETE_ID:
                                          727a49a6-da18-42a6-a0b9-c83d35028d94-image.png

                                          LG!!

                                          1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          813

                                          Online

                                          32.4k

                                          Benutzer

                                          81.6k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe