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.8k

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

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

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.
  • s.bormannS s.bormann

    @s-bormann sagte in Test Adapter iQontrol 1.4.x:

    @muuulle sagte in Test Adapter iQontrol 1.4.x:

    @s-bormann
    Hallo, kriegt man den Abstand kleiner? Ist irgendwo der Abstand zwischen den Kacheln einzusehen?

    Schön wäre ein Abstand wie die „normalen“ Abstände zwischen den Kacheln.
    Danke

    PNG-Bild.png

    Hast Du das mit "Neue Zeile" gemacht? Nur damit ich weiß, wo ich schauen muss.

    Versuch mal die aktuelle Github-Version.
    57b7c36f-8e12-4e24-85b5-38a1d42449a3-image.png

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

    @s-bormann wow, jetzt hab ich auch plötzlich auf dem startschirm gleich einen hintergrund! vorher musst ich einmal auf räume gehn, erst dann wurde auf home der HG angezeigt.
    könntest du die vorinstallierten als .zip zu verfügung stellen? würd da gern meine "persönliche" note eventuell dazu schnitzen...
    einfach zu faul um die jetzt in dem linux gewusel zu suchen... :face_with_rolling_eyes:

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

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

      @zahnheinrich sagte in Test Adapter iQontrol 1.4.x:

      @s-bormann
      Ich möchte durch Klick auf eine Kachel die Vergrößerung toggeln.
      Im README lese ich:

      "ENLARGE_TILE: boolean - when true, the tile will be set as enlarged. You can overwrite that by clicking the enlarge/reduce button. But everytime the state of ENLARGE_TILE changes, it will take over control of the tiles enlargement state again. If the role of ENLARGE_TILE is button, then every state change will toggle the enlargement state"

      Als Variable habe ich einen Button eingetragen. Im Schraubenschlüssel rechts daneben kann ich die Rolle (State/Level/Switch..) auswählen, "Button" wird mir jedoch nicht angeboten.
      Togglen der Größe geht daher nicht.
      Was mache ich falsch?

      Hi,
      stimmt, die Rolle Button fehlt dort, muss ich ergänzen.

      Du kannst jedoch auch im ioBroker selbst das ganze als Button anlegen:
      141b806c-3776-472a-a356-30c7c7b29dd0-image.png

      Versuch es mal so.

      LG

      Z Offline
      Z Offline
      zahnheinrich
      schrieb am zuletzt editiert von
      #3659

      @s-bormann
      Danke, hatte ich probiert.
      Ging nicht.
      Geht das bei dir?

      MfG Ulrich

      s.bormannS 1 Antwort Letzte Antwort
      0
      • da_WoodyD da_Woody

        @s-bormann wow, jetzt hab ich auch plötzlich auf dem startschirm gleich einen hintergrund! vorher musst ich einmal auf räume gehn, erst dann wurde auf home der HG angezeigt.
        könntest du die vorinstallierten als .zip zu verfügung stellen? würd da gern meine "persönliche" note eventuell dazu schnitzen...
        einfach zu faul um die jetzt in dem linux gewusel zu suchen... :face_with_rolling_eyes:

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

        @da_Woody sagte in Test Adapter iQontrol 1.4.x:

        @s-bormann wow, jetzt hab ich auch plötzlich auf dem startschirm gleich einen hintergrund! vorher musst ich einmal auf räume gehn, erst dann wurde auf home der HG angezeigt.
        könntest du die vorinstallierten als .zip zu verfügung stellen? würd da gern meine "persönliche" note eventuell dazu schnitzen...
        einfach zu faul um die jetzt in dem linux gewusel zu suchen... :face_with_rolling_eyes:

        userfiles_demo (1).zip

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

          @da_Woody sagte in Test Adapter iQontrol 1.4.x:

          @s-bormann wow, jetzt hab ich auch plötzlich auf dem startschirm gleich einen hintergrund! vorher musst ich einmal auf räume gehn, erst dann wurde auf home der HG angezeigt.
          könntest du die vorinstallierten als .zip zu verfügung stellen? würd da gern meine "persönliche" note eventuell dazu schnitzen...
          einfach zu faul um die jetzt in dem linux gewusel zu suchen... :face_with_rolling_eyes:

          userfiles_demo (1).zip

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

          @s-bormann tankö! werd mal mit gimp drüberfummeln... wenn ich was gutes zusammen bekomme, stell ichs zu verfügung... ;)

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

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

            @s-bormann sagte in Test Adapter iQontrol 1.4.x:

            @muuulle sagte in Test Adapter iQontrol 1.4.x:

            @s-bormann
            Hallo, kriegt man den Abstand kleiner? Ist irgendwo der Abstand zwischen den Kacheln einzusehen?

            Schön wäre ein Abstand wie die „normalen“ Abstände zwischen den Kacheln.
            Danke

            PNG-Bild.png

            Hast Du das mit "Neue Zeile" gemacht? Nur damit ich weiß, wo ich schauen muss.

            Versuch mal die aktuelle Github-Version.
            57b7c36f-8e12-4e24-85b5-38a1d42449a3-image.png

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

            @s-bormann
            Super, funktioniert.

            Ist das nur bei mir so, dass mein Background html nun im Vordergrund ist? 🥴 (Fehler gefunden)

            Ich kann seeehr weit nach unten scrollen:
            Bildschirmfoto 2020-11-02 um 21.14.28.png

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

              @s-bormann sagte in Test Adapter iQontrol 1.4.x:

              @muuulle sagte in Test Adapter iQontrol 1.4.x:

              @s-bormann
              Hallo, kriegt man den Abstand kleiner? Ist irgendwo der Abstand zwischen den Kacheln einzusehen?

              Schön wäre ein Abstand wie die „normalen“ Abstände zwischen den Kacheln.
              Danke

              PNG-Bild.png

              Hast Du das mit "Neue Zeile" gemacht? Nur damit ich weiß, wo ich schauen muss.

              Versuch mal die aktuelle Github-Version.
              57b7c36f-8e12-4e24-85b5-38a1d42449a3-image.png

              dslraserD Offline
              dslraserD Offline
              dslraser
              Forum Testing Most Active
              schrieb am zuletzt editiert von
              #3663

              @s-bormann sagte in Test Adapter iQontrol 1.4.x:

              Versuch mal die aktuelle Github-Version

              Jetzt sind die kleinen Icon schön dicht untereinander. 👍
              Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

              Screenshot_20201102-222950_Chrome.jpg

              s.bormannS B da_WoodyD 3 Antworten Letzte Antwort
              0
              • B Offline
                B Offline
                blackeagle998
                schrieb am zuletzt editiert von blackeagle998
                #3664

                Hi, in der aktuellen Version besteht das Problem aus folgendem Post wieder (DIALOG wird nicht zentriert angezeigt):
                Du hattest das ja damals schon gefixt, kannst du das bitte nochmal prüfen?

                Danke!

                s.bormannS 1 Antwort Letzte Antwort
                0
                • Z zahnheinrich

                  @s-bormann
                  Danke, hatte ich probiert.
                  Ging nicht.
                  Geht das bei dir?

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

                  @zahnheinrich sagte in Test Adapter iQontrol 1.4.x:

                  @s-bormann
                  Danke, hatte ich probiert.
                  Ging nicht.
                  Geht das bei dir?

                  Habs gerade noch mal probiert, bei mir klappt es.

                  Hier mein Test-Datenpunkt:

                  {
                    "from": "system.adapter.admin.0",
                    "user": "system.user.admin",
                    "ts": 1602936231881,
                    "common": {
                      "name": "Test.Testbool",
                      "role": "button",
                      "type": "boolean",
                      "desc": "Manuell erzeugt",
                      "def": "",
                      "read": true,
                      "write": true
                    },
                    "native": {},
                    "acl": {
                      "object": 1636,
                      "owner": "system.user.admin",
                      "ownerGroup": "system.group.administrator",
                      "state": 1636
                    },
                    "_id": "javascript.0.Test.Testbool",
                    "type": "state"
                  }
                  

                  Was genau klappt den nicht? Gibt es eine Meldung in der Konsole?

                  1 Antwort Letzte Antwort
                  0
                  • dslraserD dslraser

                    @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                    Versuch mal die aktuelle Github-Version

                    Jetzt sind die kleinen Icon schön dicht untereinander. 👍
                    Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

                    Screenshot_20201102-222950_Chrome.jpg

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

                    @dslraser sagte in Test Adapter iQontrol 1.4.x:

                    @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                    Versuch mal die aktuelle Github-Version

                    Jetzt sind die kleinen Icon schön dicht untereinander. 👍
                    Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

                    Screenshot_20201102-222950_Chrome.jpg

                    Hi,
                    nein, die neue Zeile generiert quasi einen neuen Container, in dem die Kacheln angeordnet werden. Deshalb geht das nicht.
                    Aber warum machst Du eigentlich "per Hand" eine neue Zeile? Wenn nach 6 voll ist, macht er doch automatisch eine neue Zeile auf. Dann ordnet er sich auch neu an, wenn eine Kachel ausgeblendet wird.
                    LG

                    PS: Echt geiles Layout - coole Umsetzung mit den kleinen Buttons mit und ohne Hintergrund bei aktiv/inaktiv!
                    Dürfte ich den Screenshot vielleicht auf der Github-Seite im Readme als Beispiel veröffentlichen (gerne mit (C) by dslraser)?

                    dslraserD 1 Antwort Letzte Antwort
                    0
                    • B blackeagle998

                      Hi, in der aktuellen Version besteht das Problem aus folgendem Post wieder (DIALOG wird nicht zentriert angezeigt):
                      Du hattest das ja damals schon gefixt, kannst du das bitte nochmal prüfen?

                      Danke!

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

                      @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                      @s-bormann
                      Hi, in der aktuellen Version besteht das Problem aus folgendem Post wieder (DIALOG wird nicht zentriert angezeigt):

                      @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                      @s-bormann
                      Hey, openDialog einer Popup Kachel mit URL wird nicht vernünftig skaliert, das Popup rutscht immer aus dem Bild rechts raus:
                      Screenshot_20201004-232908_Chrome_1.png

                      Bei einem "normalen" Dialog klappt es:
                      Screenshot_20201004-232945_Chrome_1.png

                      Kannst du mal bitte schauen ob du da noch was drehen kannst?

                      Du hattest das ja damals schon gefixt, kannst du das bitte nochmal prüfen?

                      Danke!

                      Seltsam, habe ich eigentlich nichts mehr dran geändert. Vielleicht ist jetzt durch die vielen iFrames für die Widgets, die er laden muss, das Timing etwas verschoben. Versuch es bitte noch mal mit der aktuellen Github-Version, da habe ich das Timing noch mal angepasst.

                      LG

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

                        @dslraser sagte in Test Adapter iQontrol 1.4.x:

                        @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                        Versuch mal die aktuelle Github-Version

                        Jetzt sind die kleinen Icon schön dicht untereinander. 👍
                        Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

                        Screenshot_20201102-222950_Chrome.jpg

                        Hi,
                        nein, die neue Zeile generiert quasi einen neuen Container, in dem die Kacheln angeordnet werden. Deshalb geht das nicht.
                        Aber warum machst Du eigentlich "per Hand" eine neue Zeile? Wenn nach 6 voll ist, macht er doch automatisch eine neue Zeile auf. Dann ordnet er sich auch neu an, wenn eine Kachel ausgeblendet wird.
                        LG

                        PS: Echt geiles Layout - coole Umsetzung mit den kleinen Buttons mit und ohne Hintergrund bei aktiv/inaktiv!
                        Dürfte ich den Screenshot vielleicht auf der Github-Seite im Readme als Beispiel veröffentlichen (gerne mit (C) by dslraser)?

                        dslraserD Offline
                        dslraserD Offline
                        dslraser
                        Forum Testing Most Active
                        schrieb am zuletzt editiert von
                        #3668

                        @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                        Aber warum machst Du eigentlich "per Hand" eine neue Zeile? Wenn nach 6 voll ist, macht er doch automatisch eine neue Zeile auf. Dann ordnet er sich auch neu an, wenn eine Kachel ausgeblendet wird.
                        LG

                        Hi, neue Zeile mache ich, damit die Ansicht am Mac genau so aussieht.

                        PS: Echt geiles Layout - coole Umsetzung mit den kleinen Buttons mit und ohne Hintergrund bei aktiv/inaktiv!

                        Danke für die Blumen.

                        Dürfte ich den Screenshot vielleicht auf der Github-Seite im Readme als Beispiel veröffentlichen (gerne mit (C) by dslraser)?

                        Klar, kannst Du gern machen.

                        1 Antwort Letzte Antwort
                        0
                        • S sandro_gera

                          @s-bormann

                          Ja im IO broker ist sie unter meinen deConz devices drin.
                          hier der Screenshot vom Philips Dimmer

                          f75040c7-688c-4c94-9e39-090328671915-image.png

                          Hier der von Sonoff Touch 2CH

                          4ec5be60-facb-449e-a03f-4673866e45cf-image.png

                          Bitte bescheid sagen alls du noch mehr brauchst

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

                          @sandro_gera sagte in Test Adapter iQontrol 1.4.x:

                          @s-bormann

                          Ja im IO broker ist sie unter meinen deConz devices drin.
                          hier der Screenshot vom Philips Dimmer

                          f75040c7-688c-4c94-9e39-090328671915-image.png

                          Hier der von Sonoff Touch 2CH

                          4ec5be60-facb-449e-a03f-4673866e45cf-image.png

                          Bitte bescheid sagen alls du noch mehr brauchst

                          Hi,
                          ich denke, der "Philips Dimmschalter" ist nur eine Fernbedienung, oder? (Da steht sensor als Rolle). In iQontrol musst Du aber das Endgerät einbinden, das Du schalten möchtest (also die Lampe(n)). Willst Du mehrere Lampen auf einmal schalten, dann kannst Du Dir z.B. eine virtuelle Gruppe mit dem Szenes-Adapter erstellen und dann diese virutelle Gruppe in iQontrol einbinden und ansteuern.
                          VG!

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

                            @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                            @s-bormann
                            Hi, in der aktuellen Version besteht das Problem aus folgendem Post wieder (DIALOG wird nicht zentriert angezeigt):

                            @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                            @s-bormann
                            Hey, openDialog einer Popup Kachel mit URL wird nicht vernünftig skaliert, das Popup rutscht immer aus dem Bild rechts raus:
                            Screenshot_20201004-232908_Chrome_1.png

                            Bei einem "normalen" Dialog klappt es:
                            Screenshot_20201004-232945_Chrome_1.png

                            Kannst du mal bitte schauen ob du da noch was drehen kannst?

                            Du hattest das ja damals schon gefixt, kannst du das bitte nochmal prüfen?

                            Danke!

                            Seltsam, habe ich eigentlich nichts mehr dran geändert. Vielleicht ist jetzt durch die vielen iFrames für die Widgets, die er laden muss, das Timing etwas verschoben. Versuch es bitte noch mal mit der aktuellen Github-Version, da habe ich das Timing noch mal angepasst.

                            LG

                            B Offline
                            B Offline
                            blackeagle998
                            schrieb am zuletzt editiert von
                            #3670

                            @s-bormann
                            Jepp, funktioniert wieder, danköööööööö!

                            1 Antwort Letzte Antwort
                            0
                            • dslraserD dslraser

                              @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                              Versuch mal die aktuelle Github-Version

                              Jetzt sind die kleinen Icon schön dicht untereinander. 👍
                              Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

                              Screenshot_20201102-222950_Chrome.jpg

                              B Offline
                              B Offline
                              blackeagle998
                              schrieb am zuletzt editiert von
                              #3671

                              @dslraser
                              Echt ne schicke View!
                              Sollte dich der blaue Hintergrund der Uhr-Kachel stören, sag Bescheid, dann machen wir das transparent und die Schriftfarbe weiß. Würde bestimmt auch cool aussehen.

                              dslraserD 1 Antwort Letzte Antwort
                              0
                              • B blackeagle998

                                @dslraser
                                Echt ne schicke View!
                                Sollte dich der blaue Hintergrund der Uhr-Kachel stören, sag Bescheid, dann machen wir das transparent und die Schriftfarbe weiß. Würde bestimmt auch cool aussehen.

                                dslraserD Offline
                                dslraserD Offline
                                dslraser
                                Forum Testing Most Active
                                schrieb am zuletzt editiert von
                                #3672

                                @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                                @dslraser
                                Echt ne schicke View!
                                Sollte dich der blaue Hintergrund der Uhr-Kachel stören, sag Bescheid, dann machen wir das transparent und die Schriftfarbe weiß. Würde bestimmt auch cool aussehen.

                                Danke, in der View sind ja auch Deine Sachen dabei.👍
                                Deine Vorschläge würde ich gern probieren. (ich nutze die Version ohne Müll usw. Brauchst Du das Script in Kopie ?)

                                B 1 Antwort Letzte Antwort
                                0
                                • dslraserD dslraser

                                  @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                                  @dslraser
                                  Echt ne schicke View!
                                  Sollte dich der blaue Hintergrund der Uhr-Kachel stören, sag Bescheid, dann machen wir das transparent und die Schriftfarbe weiß. Würde bestimmt auch cool aussehen.

                                  Danke, in der View sind ja auch Deine Sachen dabei.👍
                                  Deine Vorschläge würde ich gern probieren. (ich nutze die Version ohne Müll usw. Brauchst Du das Script in Kopie ?)

                                  B Offline
                                  B Offline
                                  blackeagle998
                                  schrieb am zuletzt editiert von
                                  #3673

                                  @dslraser
                                  Ja, die Kopie brauche ich bitte, sonst komme ich nur durcheinander und dann funktioniert am Ende nichts :-)

                                  dslraserD 1 Antwort Letzte Antwort
                                  0
                                  • dslraserD dslraser

                                    @s-bormann sagte in Test Adapter iQontrol 1.4.x:

                                    Versuch mal die aktuelle Github-Version

                                    Jetzt sind die kleinen Icon schön dicht untereinander. 👍
                                    Ich habe in meiner Ansicht bei Listen inaktive Kacheln versteckt. Es passen sechs Kacheln in eine Reihe, danach habe ich NZ (neue Zeile) gemacht. Ist das so gewollt, das dann der "leere Platz" reserviert ist, oder könnte auch das Icon aus der neuen Zeile da hin rutschen ?

                                    Screenshot_20201102-222950_Chrome.jpg

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

                                    @dslraser jau, sieht echt geil aus! in welcher px grösse hast du deine icons gespeichert?

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

                                    1 Antwort Letzte Antwort
                                    0
                                    • B blackeagle998

                                      @dslraser
                                      Ja, die Kopie brauche ich bitte, sonst komme ich nur durcheinander und dann funktioniert am Ende nichts :-)

                                      dslraserD Offline
                                      dslraserD Offline
                                      dslraser
                                      Forum Testing Most Active
                                      schrieb am zuletzt editiert von dslraser
                                      #3675

                                      @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                                      Ja, die Kopie brauche ich bitte, sonst komme ich nur durcheinander und dann funktioniert am Ende nichts

                                      ich nutze aktuell dieses Script

                                      
                                      const DP_Uhr_digital 				= '0_userdata.0.Uhr.Digital_Uhr_HTML_Uhrzeit_und_Datum_V7_neu';
                                      const DP_Wetter_Vorschau 			= '0_userdata.0.Uhr.Wetter_Vorschau';
                                      const DP_Wetter_Vorschau_Trigger	= '0_userdata.0.Uhr.Wetter_Vorschau_Trigger';
                                      
                                      fctInit();
                                      
                                      on({id:DP_Wetter_Vorschau_Trigger, val:true} , function (dp) {
                                        if (getState(DP_Wetter_Vorschau).val){
                                            setState(DP_Wetter_Vorschau, false);
                                        }else{
                                            setState(DP_Wetter_Vorschau, true);
                                        }
                                      });
                                      
                                      function fctInit(){
                                      if(!existsState(DP_Uhr_digital)) {
                                          createState(DP_Uhr_digital,
                                              {type: 'string', name: 'iQontrol Uhr', role: 'value', read: true , write: true}
                                          );
                                      }
                                      if(!existsState(DP_Wetter_Vorschau_Trigger)) {
                                          createState(DP_Wetter_Vorschau_Trigger,
                                              {type: 'boolean', name: 'Wetter Vorschau Trigger', role: 'button', read: false , write: true}
                                          );
                                      }
                                      if(!existsState(DP_Wetter_Vorschau)) {
                                          createState(DP_Wetter_Vorschau,
                                              {type: 'boolean', name: 'Wetter Vorschau', role: 'switch', read: true , write: true, def: false}
                                          );
                                      }
                                      setStateDelayed(DP_Uhr_digital, fctUhrzeitDatumWetter_V7(), 1000);
                                      schedule("*/10 * * * * *", function () {
                                          setState(DP_Uhr_digital, fctUhrzeitDatumWetter_V7());
                                      })
                                      }
                                      
                                      function fctUhrzeitDatumWetter_V7() {
                                      let str_Uhrzeit         = String(formatDate(new Date(), "hh:mm"));
                                      let str_Datum           = String(formatDate(new Date(), "DD.MM.YYYY"));
                                      let str_Wochentag       = String(formatDate(new Date(), "WW", "de"));
                                      
                                      let str_color_body      = '#005c78';
                                      let str_color_cell      = '#47575c';
                                      let str_color_font      = 'Silver';
                                      
                                      let str_position_font   = 'left'
                                      let str_Tageszeit       = 'Tag';
                                      let str_html            = '';
                                      let str_html_head       = '';
                                      let image_Wetter_Pfad   = './../iqontrol.meta/userimages/usericons/wetter/';
                                      
                                      // ##########################################################################
                                      // CSS Style (Formatierung der HTML Elemente)
                                      // ##########################################################################
                                      str_html_head = str_html_head + '<head><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">';
                                      str_html_head = str_html_head + '<style>';
                                      str_html_head = str_html_head + 'body {';
                                      str_html_head = str_html_head + 'background-color:' + str_color_body + ';';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + 'span {';
                                      //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                      //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:1px solid gainsboro;border-color:White;';
                                      //Textausrichtung
                                      str_html_head = str_html_head + 'text-align:' + str_position_font + ';';
                                      //Schriftfarbe
                                      str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                      //Wer keine Hintergrundfarbe für die Boxen will, kommentiert die nachfolgende Zeile aus oder löscht sie.
                                      //str_html_head = str_html_head + 'background-color:' + str_color_cell + ';';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + 'td {';
                                      str_html_head = str_html_head + 'border-width:1px;';
                                      str_html_head = str_html_head + 'border-style:solid;';
                                      str_html_head = str_html_head + 'border-color:black;';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + '.container_column {';
                                      str_html_head = str_html_head + 'display:flex;';
                                      //Elemente werden untereinander dargestellt
                                      str_html_head = str_html_head + 'flex-direction: column;';
                                      str_html_head = str_html_head + 'justify-content: flex-start;';
                                      //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                      //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + '.container_row {';
                                      str_html_head = str_html_head + 'display: flex;';
                                      //Elemente werden untereinander dargestellt
                                      str_html_head = str_html_head + 'flex-direction: row;';
                                      str_html_head = str_html_head + 'justify-content: space-between;';
                                      //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                      //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + 'input {';
                                      str_html_head = str_html_head + 'height:10vw;';
                                      str_html_head = str_html_head + 'width:10vw;';
                                      str_html_head = str_html_head + '}';
                                      
                                      str_html_head = str_html_head + '.img_wetter {';
                                      str_html_head = str_html_head + 'height:15vw;';
                                      str_html_head = str_html_head + 'width:15vw;';
                                      str_html_head = str_html_head + '}';
                                      
                                      //Hier habt ihr die Möglichkeit, CSS Eigenschaften für jede Box einzeln einzutragen.
                                      //Bspw. könnt ihr hier eine separate Hintergrundfarbe einstellen.
                                      //Außerdem steuert ihr hier die Schriftgrößen der einzelnen Boxen
                                      str_html_head = str_html_head + '.box_uhr {font-size:14vmax;}';
                                      str_html_head = str_html_head + '.box_datum {font-size:4vmax;text-align:center;}';
                                      str_html_head = str_html_head + '.box_wetter {font-size:4vmax;margin-right:1.5vw;text-align:center;}';
                                      
                                      str_html_head = str_html_head + '.table_Wettervorschau {';
                                      str_html_head = str_html_head + 'margin-top:3vw;';
                                      str_html_head = str_html_head + 'border-collapse: collapse;';
                                      str_html_head = str_html_head + 'font-size:3vmax;';
                                      str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                      str_html_head = str_html_head + '}';
                                      str_html_head = str_html_head + '</style>';
                                      str_html_head = str_html_head + '<script type="text/javascript">';
                                      str_html_head = str_html_head + 'function setState(stateId, value){';
                                      str_html_head = str_html_head + 'sendPostMessage("setState", stateId, value);';
                                      str_html_head = str_html_head + '}';
                                      str_html_head = str_html_head + 'function sendPostMessage(command, stateId, value){';
                                      str_html_head = str_html_head + 'message = { command: command, stateId: stateId, value: value};';
                                      str_html_head = str_html_head + 'window.parent.postMessage(message, "*");';
                                      str_html_head = str_html_head + '}';
                                      str_html_head = str_html_head + '</script>';
                                      str_html_head = str_html_head + '</head>';
                                      
                                      // ##########################################################################
                                      // Prüfen ob Tag oder Nacht um Sonne oder Mond Icons anzuzeigen
                                      // ##########################################################################
                                      //Wenn ihr den nachfolgenden Datenpunkt 'javascript.0.Astro.Tageszeit.current' auch habt, könnt ihr das einkommentieren --> /* und */ löschen
                                      //--> dafür gibt es ein ASTRO Skript hier im Forum
                                      /*
                                      switch (getState('javascript.0.Astro.Tageszeit.current').val){
                                          case "Sonnenuntergang":
                                          case "Abenddämmerung":
                                          case "Nacht":
                                          case "Morgendämmerung":
                                              str_Tageszeit = 'Nacht';
                                              break;
                                          default:
                                              break;
                                      }
                                      */
                                      
                                      // ##########################################################################
                                      // Ab hier werden die verschiedenen HTML Flex Container zusammengebaut
                                      // ##########################################################################
                                      //Box 1 = Uhrzeit und Wettersymbol
                                      str_html = str_html + str_html_head + '<div class="container_row">';
                                      str_html = str_html + '<span class="box_uhr"><b>' + str_Uhrzeit + ' Uhr</b></span>';
                                      if (str_Tageszeit == 'Tag'){
                                            str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_value').val + '.png' + '" />';
                                      }else{
                                            str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + 'mond/' + getState('daswetter.0.NextHours.Location_1.Day_1.moon_symbol').val + '.png' + '" />';
                                      }
                                      str_html = str_html + '</div>';
                                      
                                      //Box 2 = Wochentag/Datum, Abfallentsorgung und aktuelle Wetterdaten
                                      str_html = str_html + '<div class="container_row">';
                                      str_html = str_html + '<div class="container_column">';
                                      str_html = str_html + '<span class="box_datum"><b><i>' + str_Wochentag + ', ' + str_Datum + '</i></b></span>';
                                      str_html = str_html + '</div>';
                                      str_html = str_html + '<div class="container_column">';
                                      str_html = str_html + '<span class="box_wetter"><b><i>' + Math.round(getState('hm-rpc.0.0010D8A98AD4AC.1.ACTUAL_TEMPERATURE'/*Temperatursensor aussen ACTUAL TEMPERATURE*/).val) + '°C</i></b></span>';
                                      if (str_Tageszeit == 'Tag'){
                                          str_html = str_html + '<span class="box_wetter"><i>' + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_desc').val + '</i></span>';
                                      }else{
                                          str_html = str_html + '<span class="box_wetter"><i>' + str_Tageszeit + '</i></span>';
                                      }
                                      
                                      str_html = str_html + '</div>';
                                      str_html = str_html + '</div>';
                                      
                                      //Box 3 = Wettervorschau
                                      str_html = str_html + '<div class="container_column">';
                                      str_html = str_html + '<table class="table_Wettervorschau">';
                                      
                                      str_html = str_html + '<tr>';
                                      str_html = str_html + '<td>heute</td>';
                                      str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_value').val + '.png' + '"/></td>';
                                      str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_1.tempmin_value').val + '°C bis ';
                                      str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_1.tempmax_value').val + '°C</td>';
                                      //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_1.humidity_value').val + '%</td>';
                                      str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_desc').val + '</td>';
                                      str_html = str_html + '</tr>';
                                      
                                      str_html = str_html + '<tr>';
                                      str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.day_name').val + '</td>';
                                      str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_value').val + '.png' + '"/></td>';
                                      str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_2.tempmin_value').val + '°C bis ';
                                      str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_2.tempmax_value').val + '°C</td>';
                                      //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.humidity_value').val + '%</td>';
                                      str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_desc').val + '</td>';
                                      str_html = str_html + '</tr>';
                                      
                                      str_html = str_html + '<tr>';
                                      str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.day_name').val + '</td>';
                                      str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_value').val + '.png' + '"/></td>';
                                      str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_3.tempmin_value').val + '°C bis ';
                                      str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_3.tempmax_value').val + '°C</td>';
                                      //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.humidity_value').val + '%</td>';
                                      str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_desc').val + '</td>';
                                      str_html = str_html + '</tr>';
                                      
                                      str_html = str_html + '<tr>';
                                      str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.day_name').val + '</td>';
                                      str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_value').val + '.png' + '"/></td>';
                                      str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_4.tempmin_value').val + '°C bis ';
                                      str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_4.tempmax_value').val + '°C</td>';
                                      //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.humidity_value').val + '%</td>';
                                      str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_desc').val + '</td>';
                                      str_html = str_html + '</tr>';
                                      
                                      str_html = str_html + '<tr>';
                                      str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.day_name').val + '</td>';
                                      str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_value').val + '.png' + '"/></td>';
                                      str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_5.tempmin_value').val + '°C bis ';
                                      str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_5.tempmax_value').val + '°C</td>';
                                      //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.humidity_value').val + '%</td>';
                                      str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_desc').val + '</td>';
                                      str_html = str_html + '</tr>';
                                      
                                      str_html = str_html + '</table>';
                                      str_html = str_html + '</div>';
                                      
                                      return str_html;
                                      }
                                      
                                      
                                      

                                      In meinen Listen nutze ich aktuell Die Überschrift auch in weiß und Border und inaktive Geräte ist die Schriftfarbe : silver. Der Hintergrund ist in #424242

                                      Beispiel Liste

                                      Screenshot_20201103-131357_Chrome.jpg

                                      B S 2 Antworten Letzte Antwort
                                      0
                                      • dslraserD dslraser

                                        @blackeagle998 sagte in Test Adapter iQontrol 1.4.x:

                                        Ja, die Kopie brauche ich bitte, sonst komme ich nur durcheinander und dann funktioniert am Ende nichts

                                        ich nutze aktuell dieses Script

                                        
                                        const DP_Uhr_digital 				= '0_userdata.0.Uhr.Digital_Uhr_HTML_Uhrzeit_und_Datum_V7_neu';
                                        const DP_Wetter_Vorschau 			= '0_userdata.0.Uhr.Wetter_Vorschau';
                                        const DP_Wetter_Vorschau_Trigger	= '0_userdata.0.Uhr.Wetter_Vorschau_Trigger';
                                        
                                        fctInit();
                                        
                                        on({id:DP_Wetter_Vorschau_Trigger, val:true} , function (dp) {
                                          if (getState(DP_Wetter_Vorschau).val){
                                              setState(DP_Wetter_Vorschau, false);
                                          }else{
                                              setState(DP_Wetter_Vorschau, true);
                                          }
                                        });
                                        
                                        function fctInit(){
                                        if(!existsState(DP_Uhr_digital)) {
                                            createState(DP_Uhr_digital,
                                                {type: 'string', name: 'iQontrol Uhr', role: 'value', read: true , write: true}
                                            );
                                        }
                                        if(!existsState(DP_Wetter_Vorschau_Trigger)) {
                                            createState(DP_Wetter_Vorschau_Trigger,
                                                {type: 'boolean', name: 'Wetter Vorschau Trigger', role: 'button', read: false , write: true}
                                            );
                                        }
                                        if(!existsState(DP_Wetter_Vorschau)) {
                                            createState(DP_Wetter_Vorschau,
                                                {type: 'boolean', name: 'Wetter Vorschau', role: 'switch', read: true , write: true, def: false}
                                            );
                                        }
                                        setStateDelayed(DP_Uhr_digital, fctUhrzeitDatumWetter_V7(), 1000);
                                        schedule("*/10 * * * * *", function () {
                                            setState(DP_Uhr_digital, fctUhrzeitDatumWetter_V7());
                                        })
                                        }
                                        
                                        function fctUhrzeitDatumWetter_V7() {
                                        let str_Uhrzeit         = String(formatDate(new Date(), "hh:mm"));
                                        let str_Datum           = String(formatDate(new Date(), "DD.MM.YYYY"));
                                        let str_Wochentag       = String(formatDate(new Date(), "WW", "de"));
                                        
                                        let str_color_body      = '#005c78';
                                        let str_color_cell      = '#47575c';
                                        let str_color_font      = 'Silver';
                                        
                                        let str_position_font   = 'left'
                                        let str_Tageszeit       = 'Tag';
                                        let str_html            = '';
                                        let str_html_head       = '';
                                        let image_Wetter_Pfad   = './../iqontrol.meta/userimages/usericons/wetter/';
                                        
                                        // ##########################################################################
                                        // CSS Style (Formatierung der HTML Elemente)
                                        // ##########################################################################
                                        str_html_head = str_html_head + '<head><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">';
                                        str_html_head = str_html_head + '<style>';
                                        str_html_head = str_html_head + 'body {';
                                        str_html_head = str_html_head + 'background-color:' + str_color_body + ';';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + 'span {';
                                        //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                        //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:1px solid gainsboro;border-color:White;';
                                        //Textausrichtung
                                        str_html_head = str_html_head + 'text-align:' + str_position_font + ';';
                                        //Schriftfarbe
                                        str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                        //Wer keine Hintergrundfarbe für die Boxen will, kommentiert die nachfolgende Zeile aus oder löscht sie.
                                        //str_html_head = str_html_head + 'background-color:' + str_color_cell + ';';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + 'td {';
                                        str_html_head = str_html_head + 'border-width:1px;';
                                        str_html_head = str_html_head + 'border-style:solid;';
                                        str_html_head = str_html_head + 'border-color:black;';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + '.container_column {';
                                        str_html_head = str_html_head + 'display:flex;';
                                        //Elemente werden untereinander dargestellt
                                        str_html_head = str_html_head + 'flex-direction: column;';
                                        str_html_head = str_html_head + 'justify-content: flex-start;';
                                        //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                        //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + '.container_row {';
                                        str_html_head = str_html_head + 'display: flex;';
                                        //Elemente werden untereinander dargestellt
                                        str_html_head = str_html_head + 'flex-direction: row;';
                                        str_html_head = str_html_head + 'justify-content: space-between;';
                                        //Rahmen: abgerundete Ecken (5px), Strichstärke (0px = aus) und Farbe
                                        //str_html_head = str_html_head + 'border-radius:5px;border-collapse:separate;border:2px solid gainsboro;border-color:yellow;';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + 'input {';
                                        str_html_head = str_html_head + 'height:10vw;';
                                        str_html_head = str_html_head + 'width:10vw;';
                                        str_html_head = str_html_head + '}';
                                        
                                        str_html_head = str_html_head + '.img_wetter {';
                                        str_html_head = str_html_head + 'height:15vw;';
                                        str_html_head = str_html_head + 'width:15vw;';
                                        str_html_head = str_html_head + '}';
                                        
                                        //Hier habt ihr die Möglichkeit, CSS Eigenschaften für jede Box einzeln einzutragen.
                                        //Bspw. könnt ihr hier eine separate Hintergrundfarbe einstellen.
                                        //Außerdem steuert ihr hier die Schriftgrößen der einzelnen Boxen
                                        str_html_head = str_html_head + '.box_uhr {font-size:14vmax;}';
                                        str_html_head = str_html_head + '.box_datum {font-size:4vmax;text-align:center;}';
                                        str_html_head = str_html_head + '.box_wetter {font-size:4vmax;margin-right:1.5vw;text-align:center;}';
                                        
                                        str_html_head = str_html_head + '.table_Wettervorschau {';
                                        str_html_head = str_html_head + 'margin-top:3vw;';
                                        str_html_head = str_html_head + 'border-collapse: collapse;';
                                        str_html_head = str_html_head + 'font-size:3vmax;';
                                        str_html_head = str_html_head + 'color:' + str_color_font + ';';
                                        str_html_head = str_html_head + '}';
                                        str_html_head = str_html_head + '</style>';
                                        str_html_head = str_html_head + '<script type="text/javascript">';
                                        str_html_head = str_html_head + 'function setState(stateId, value){';
                                        str_html_head = str_html_head + 'sendPostMessage("setState", stateId, value);';
                                        str_html_head = str_html_head + '}';
                                        str_html_head = str_html_head + 'function sendPostMessage(command, stateId, value){';
                                        str_html_head = str_html_head + 'message = { command: command, stateId: stateId, value: value};';
                                        str_html_head = str_html_head + 'window.parent.postMessage(message, "*");';
                                        str_html_head = str_html_head + '}';
                                        str_html_head = str_html_head + '</script>';
                                        str_html_head = str_html_head + '</head>';
                                        
                                        // ##########################################################################
                                        // Prüfen ob Tag oder Nacht um Sonne oder Mond Icons anzuzeigen
                                        // ##########################################################################
                                        //Wenn ihr den nachfolgenden Datenpunkt 'javascript.0.Astro.Tageszeit.current' auch habt, könnt ihr das einkommentieren --> /* und */ löschen
                                        //--> dafür gibt es ein ASTRO Skript hier im Forum
                                        /*
                                        switch (getState('javascript.0.Astro.Tageszeit.current').val){
                                            case "Sonnenuntergang":
                                            case "Abenddämmerung":
                                            case "Nacht":
                                            case "Morgendämmerung":
                                                str_Tageszeit = 'Nacht';
                                                break;
                                            default:
                                                break;
                                        }
                                        */
                                        
                                        // ##########################################################################
                                        // Ab hier werden die verschiedenen HTML Flex Container zusammengebaut
                                        // ##########################################################################
                                        //Box 1 = Uhrzeit und Wettersymbol
                                        str_html = str_html + str_html_head + '<div class="container_row">';
                                        str_html = str_html + '<span class="box_uhr"><b>' + str_Uhrzeit + ' Uhr</b></span>';
                                        if (str_Tageszeit == 'Tag'){
                                              str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_value').val + '.png' + '" />';
                                        }else{
                                              str_html = str_html + '<input type="image" class="img_wetter" onclick="setState(\'' + DP_Wetter_Vorschau_Trigger + '\', true)" src="' + image_Wetter_Pfad + 'mond/' + getState('daswetter.0.NextHours.Location_1.Day_1.moon_symbol').val + '.png' + '" />';
                                        }
                                        str_html = str_html + '</div>';
                                        
                                        //Box 2 = Wochentag/Datum, Abfallentsorgung und aktuelle Wetterdaten
                                        str_html = str_html + '<div class="container_row">';
                                        str_html = str_html + '<div class="container_column">';
                                        str_html = str_html + '<span class="box_datum"><b><i>' + str_Wochentag + ', ' + str_Datum + '</i></b></span>';
                                        str_html = str_html + '</div>';
                                        str_html = str_html + '<div class="container_column">';
                                        str_html = str_html + '<span class="box_wetter"><b><i>' + Math.round(getState('hm-rpc.0.0010D8A98AD4AC.1.ACTUAL_TEMPERATURE'/*Temperatursensor aussen ACTUAL TEMPERATURE*/).val) + '°C</i></b></span>';
                                        if (str_Tageszeit == 'Tag'){
                                            str_html = str_html + '<span class="box_wetter"><i>' + getState('daswetter.0.NextHours.Location_1.Day_1.current.symbol_desc').val + '</i></span>';
                                        }else{
                                            str_html = str_html + '<span class="box_wetter"><i>' + str_Tageszeit + '</i></span>';
                                        }
                                        
                                        str_html = str_html + '</div>';
                                        str_html = str_html + '</div>';
                                        
                                        //Box 3 = Wettervorschau
                                        str_html = str_html + '<div class="container_column">';
                                        str_html = str_html + '<table class="table_Wettervorschau">';
                                        
                                        str_html = str_html + '<tr>';
                                        str_html = str_html + '<td>heute</td>';
                                        str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_value').val + '.png' + '"/></td>';
                                        str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_1.tempmin_value').val + '°C bis ';
                                        str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_1.tempmax_value').val + '°C</td>';
                                        //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_1.humidity_value').val + '%</td>';
                                        str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_1.symbol_desc').val + '</td>';
                                        str_html = str_html + '</tr>';
                                        
                                        str_html = str_html + '<tr>';
                                        str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.day_name').val + '</td>';
                                        str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_value').val + '.png' + '"/></td>';
                                        str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_2.tempmin_value').val + '°C bis ';
                                        str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_2.tempmax_value').val + '°C</td>';
                                        //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_2.humidity_value').val + '%</td>';
                                        str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_2.symbol_desc').val + '</td>';
                                        str_html = str_html + '</tr>';
                                        
                                        str_html = str_html + '<tr>';
                                        str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.day_name').val + '</td>';
                                        str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_value').val + '.png' + '"/></td>';
                                        str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_3.tempmin_value').val + '°C bis ';
                                        str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_3.tempmax_value').val + '°C</td>';
                                        //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_3.humidity_value').val + '%</td>';
                                        str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_3.symbol_desc').val + '</td>';
                                        str_html = str_html + '</tr>';
                                        
                                        str_html = str_html + '<tr>';
                                        str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.day_name').val + '</td>';
                                        str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_value').val + '.png' + '"/></td>';
                                        str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_4.tempmin_value').val + '°C bis ';
                                        str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_4.tempmax_value').val + '°C</td>';
                                        //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_4.humidity_value').val + '%</td>';
                                        str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_4.symbol_desc').val + '</td>';
                                        str_html = str_html + '</tr>';
                                        
                                        str_html = str_html + '<tr>';
                                        str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.day_name').val + '</td>';
                                        str_html = str_html + '<td><img src="' + image_Wetter_Pfad + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_value').val + '.png' + '"/></td>';
                                        str_html = str_html + '<td nowrap>' + getState('daswetter.0.NextHours.Location_1.Day_5.tempmin_value').val + '°C bis ';
                                        str_html = str_html + getState('daswetter.0.NextHours.Location_1.Day_5.tempmax_value').val + '°C</td>';
                                        //str_html = str_html + '<td>' + getState('daswetter.0.NextHours.Location_1.Day_5.humidity_value').val + '%</td>';
                                        str_html = str_html + '<td align=left>' + getState('daswetter.0.NextHours.Location_1.Day_5.symbol_desc').val + '</td>';
                                        str_html = str_html + '</tr>';
                                        
                                        str_html = str_html + '</table>';
                                        str_html = str_html + '</div>';
                                        
                                        return str_html;
                                        }
                                        
                                        
                                        

                                        In meinen Listen nutze ich aktuell Die Überschrift auch in weiß und Border und inaktive Geräte ist die Schriftfarbe : silver. Der Hintergrund ist in #424242

                                        Beispiel Liste

                                        Screenshot_20201103-131357_Chrome.jpg

                                        B Offline
                                        B Offline
                                        blackeagle998
                                        schrieb am zuletzt editiert von blackeagle998
                                        #3676

                                        @dslraser
                                        Ändere mal bitte diese drei Zeilen

                                        let str_color_body      = '#005c78';
                                        let str_color_cell      = '#47575c';
                                        let str_color_font      = 'Silver';
                                        

                                        in

                                        let str_color_body      = 'rgba(0, 92, 120, 0)';
                                        let str_color_cell      = 'rgba(71, 87, 92, 0)';
                                        let str_color_font      = 'rgba(255, 255, 255, 1)';
                                        

                                        Hinweis:
                                        rgba(255, 255, 255, 1) = weiß, silber wäre (192, 192, 192, 1)

                                        Die 0 bzw. 1 am Ende gibt die Deckkraft (opacity) an, 1 = 100%, bei 0 sollte der Hintergrund also unsichtbar sein.
                                        Außerdem kannst du bei der Tabellenformatierung der Wettervorschau noch die Schriftfarbe von "black" in "silver" ändern, das wäre dann in diesem Abschnitt:

                                        str_html_head = str_html_head + 'td {';
                                        str_html_head = str_html_head + 'border-width:1px;';
                                        str_html_head = str_html_head + 'border-style:solid;';
                                        str_html_head = str_html_head + 'border-color:black;';
                                        str_html_head = str_html_head + '}';
                                        

                                        Für weiß wäre das dann --> border-color:rgba(255, 255, 255, 1);
                                        Für Silber wäre das dann --> border-color:rgba(192, 192, 192, 1);

                                        Probier mal ob's klappt.

                                        dslraserD 2 Antworten Letzte Antwort
                                        0
                                        • B blackeagle998

                                          @dslraser
                                          Ändere mal bitte diese drei Zeilen

                                          let str_color_body      = '#005c78';
                                          let str_color_cell      = '#47575c';
                                          let str_color_font      = 'Silver';
                                          

                                          in

                                          let str_color_body      = 'rgba(0, 92, 120, 0)';
                                          let str_color_cell      = 'rgba(71, 87, 92, 0)';
                                          let str_color_font      = 'rgba(255, 255, 255, 1)';
                                          

                                          Hinweis:
                                          rgba(255, 255, 255, 1) = weiß, silber wäre (192, 192, 192, 1)

                                          Die 0 bzw. 1 am Ende gibt die Deckkraft (opacity) an, 1 = 100%, bei 0 sollte der Hintergrund also unsichtbar sein.
                                          Außerdem kannst du bei der Tabellenformatierung der Wettervorschau noch die Schriftfarbe von "black" in "silver" ändern, das wäre dann in diesem Abschnitt:

                                          str_html_head = str_html_head + 'td {';
                                          str_html_head = str_html_head + 'border-width:1px;';
                                          str_html_head = str_html_head + 'border-style:solid;';
                                          str_html_head = str_html_head + 'border-color:black;';
                                          str_html_head = str_html_head + '}';
                                          

                                          Für weiß wäre das dann --> border-color:rgba(255, 255, 255, 1);
                                          Für Silber wäre das dann --> border-color:rgba(192, 192, 192, 1);

                                          Probier mal ob's klappt.

                                          dslraserD Offline
                                          dslraserD Offline
                                          dslraser
                                          Forum Testing Most Active
                                          schrieb am zuletzt editiert von
                                          #3677

                                          @blackeagle998
                                          so sieht es jetzt aus:

                                          Screenshot_20201103-143221_Chrome.jpg

                                          Screenshot_20201103-143239_Chrome.jpg

                                          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

                                          667

                                          Online

                                          32.4k

                                          Benutzer

                                          81.5k

                                          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