Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Vorlagen/Ideen MüllPlan VIEW / Widget ?

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    Vorlagen/Ideen MüllPlan VIEW / Widget ?

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

      @crunchip
      Ich check das nicht🤦‍♂️
      Hab jetzt alle Namen der Tonnen überall gleich. in den skripten und auch sonst.

      crunchip Glasfaser 2 Replies Last reply Reply Quote 0
      • crunchip
        crunchip Forum Testing Most Active @moppel2810 last edited by

        @moppel2810 was gibt´s denn da nicht zu checken, hehe
        du sollst in deinem Kalender eintragen
        Gelber Sack, Biotonne, Restmuell, Papiertonne...so wie hier zu sehen
        d024102d-ed67-431a-bab3-b11cbba08793-image.png
        und im Adapter diese bei Ereignisse eintragen

        die Skripte so lassen, wie sie sind

        moppel2810 1 Reply Last reply Reply Quote 0
        • Glasfaser
          Glasfaser @moppel2810 last edited by

          @moppel2810

          Hast du überhaupt etwas in den Datenpunkten vorhanden !?

          1.JPG

          1 Reply Last reply Reply Quote 0
          • moppel2810
            moppel2810 @crunchip last edited by

            @crunchip

            Achso. Ich hab nur die Daten von meinem Entsorger übernommen.

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

              @moppel2810 ja wenn du das übernehmen willst, dann musst du die Skripte anpassen

              Im skript Abfalltermine diesen Part

              const EINTRAEGE = {                       
                  "Restmuell": 'Vis.muell.restmuell',
                  "Papiertonne": 'Vis.muell.papiertonne',
                  "Biotonne": 'Vis.muell.biotonne',
                  "GelberSack": 'Vis.muell.gelbersack'
              

              und im Müllwarnung dieses

              // User Anpassungen
              var aSuchstringLiteral = ['Rest', 'Bio', 'Papier', 'Gelber Sack']; // Suchbegriff
              var aSuchstring = ['Rest', 'Bio', 'Papier', 'Gelber Sack'];
              
              1 Reply Last reply Reply Quote 0
              • E
                eMd last edited by eMd

                Screenshot_2019-09-22-19-18-19-127_com.android.chrome.png

                Meine Müllansicht.

                Die Zahlen werden rechtzeitig erst gelb dann rot. Alarm mit rot pulsieren und anschließend blinken ist dann eine Tag vorher schon, weil wir die Tonne ja schon abends rausstellen.

                MfG
                eMd

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

                  @eMd soweit sind wir noch nicht, erst muss seine Abfrage stimmen😂

                  moppel2810 1 Reply Last reply Reply Quote 0
                  • moppel2810
                    moppel2810 @crunchip last edited by

                    @crunchip

                    Es geht ✌ Danke für deine Geduld 😉

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

                      @moppel2810 kein Thema, hätte auch schon heut nachmittag funktioniert, wenn du richtig gelesen hättest👍

                      1 Reply Last reply Reply Quote 1
                      • moppel2810
                        moppel2810 @liv-in-sky last edited by

                        @liv-in-sky
                        Kann ich das auch für Anwesendheitssteuerung nutzen? Ich würde gern 2 png Leuchten lassen wenn anwesend und nicht leuchten bei abwesendheit bzw grün anwesend und rot abwesend.

                        1 Reply Last reply Reply Quote 0
                        • moppel2810
                          moppel2810 @liv-in-sky last edited by

                          @liv-in-sky said in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                          für interessierte - blinkende rahmen:
                          nochmal danke @crunchip - leicht geändert

                          verschieden farbiges blinken:

                          uml-ani-gif11.gif

                          hier die klasse:

                          kann beliebig variiert werden. zb. dir zeit verändern - oder die %-zahlen - und natürlich die farbcodes selbst

                          .blink-bunt   {
                            animation: mdui-bunt-blink-ani 2s linear infinite;
                              
                          }
                          @keyframes mdui-bunt-blink-ani {
                            8% {filter: drop-shadow(0px 0px 4px #AEB404) drop-shadow(0px 0px 4px #AEB404) drop-shadow(0px 0px 4px #AEB404); }
                            30% {filter: drop-shadow(0px 0px 4px #DBA901) drop-shadow(0px 0px 4px #DBA901) drop-shadow(0px 0px 4px #DBA901); }
                            60% {filter: drop-shadow(0px 0px 4px #FF0040) drop-shadow(0px 0px 4px #FF0040) drop-shadow(0px 0px 4px #FF0040); }
                            0% {filter: none;}
                          }
                          .blink-bunt-blau   {
                            animation: mdui-bunt-blau-blink-ani 3s linear infinite;
                              
                          }
                          @keyframes mdui-bunt-blau-blink-ani {
                            8% {filter: drop-shadow(0px 0px 4px #00BFFF) drop-shadow(0px 0px 4px #00BFFF) drop-shadow(0px 0px 4px #00BFFF); }
                            30% {filter: drop-shadow(0px 0px 4px #A9BCF5) drop-shadow(0px 0px 4px #A9BCF5) drop-shadow(0px 0px 4px #A9BCF5); }
                            60% {filter: drop-shadow(0px 0px 4px #FF0040) drop-shadow(0px 0px 4px #FF0040) drop-shadow(0px 0px 4px #FF0040); }
                            0% {filter: none;}
                          }
                          

                          Kann ich das auch für Anwesendheitssteuerung nutzen? Ich würde gern 2 png Leuchten lassen wenn anwesend und nicht leuchten bei abwesendheit bzw grün anwesend und rot abwesend.

                          liv-in-sky 1 Reply Last reply Reply Quote 0
                          • liv-in-sky
                            liv-in-sky @moppel2810 last edited by

                            @moppel2810

                            es geht mit jedem datenpunkt , welchen du abfragen kannst - egal ob boolean oder string oder zahl

                            das beispiel ist ein schalter für einen lüfter - durch drücken ändert sich der wert - true false - also wie bei anwesenheit

                            test2.gif

                            das steht in der vis:

                            Image 6.png
                            übersetzt: wenn controll-own.0.Luefter3 ist wahr nehme "blink-bunt" aus css-klasse - sonst "blink-red" (blink bunt entspricht bei mir grün)

                            {val:controll-own.0.Luefter3;val=="true"? "blink-bunt":  "blink-red"}
                            

                            das "blink-bunt" und "blink-red" ist in der css klasse definiert
                            Image 7.png

                            moppel2810 2 Replies Last reply Reply Quote 0
                            • moppel2810
                              moppel2810 @liv-in-sky last edited by

                              @liv-in-sky
                              Geht das auch wenn ich einfach ein img in die vis einfüge oder muss ich da was spezieles nehmen?

                              liv-in-sky 1 Reply Last reply Reply Quote 0
                              • liv-in-sky
                                liv-in-sky @moppel2810 last edited by liv-in-sky

                                @moppel2810 müßte auch mit image funktionieren - den css eintrag unter generell im image-widget gibt es ja dort auch

                                1 Reply Last reply Reply Quote 0
                                • moppel2810
                                  moppel2810 @liv-in-sky last edited by

                                  @liv-in-sky said in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                  {val:controll-own.0.Luefter3;val=="true"? "blink-bunt": "blink-red"}

                                  {val:controll-own.0.Luefter3;val=="true"? "blink-bunt": "blink-red"} da tausche ich einfach "controll-own.0.Luefter3" gegen meinen ping oder tr-064?

                                  wie bzw wo bekomm ich den blink code für die css klasse her?

                                  crunchip liv-in-sky 2 Replies Last reply Reply Quote 0
                                  • crunchip
                                    crunchip Forum Testing Most Active @moppel2810 last edited by

                                    @moppel2810 Das ist in dem Material Design Css Skript hinterlegt
                                    https://github.com/Uhula/ioBroker-Material-Design-Style

                                    1 Reply Last reply Reply Quote 1
                                    • liv-in-sky
                                      liv-in-sky @moppel2810 last edited by liv-in-sky

                                      @moppel2810 sagte in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                      @liv-in-sky said in Vorlagen/Ideen MüllPlan VIEW / Widget ?:

                                      {val:controll-own.0.Luefter3;val=="true"? "blink-bunt": "blink-red"}

                                      {val:controll-own.0.Luefter3;val=="true"? "blink-bunt": "blink-red"} da tausche ich einfach "controll-own.0.Luefter3" gegen meinen ping oder tr-064?

                                      wie bzw wo bekomm ich den blink code für die css klasse her?

                                      mit dem austausch liegst du richtig - statt lüfter kannst du ping/tr064 benutzen

                                      weiter oben ist der im post - hier nochmal:

                                      für rot blinkend:

                                      .blink-red   {
                                       animation: mdui-red-blink-ani 3s linear infinite;
                                      }
                                      @keyframes mdui-red-blink-ani  {
                                       0%,50% {filter: drop-shadow(0px 0px 4px #F44336) drop-shadow(0px 0px 4px #F44336) drop-shadow(0px 0px 4px #F44336); }
                                       51% {filter: none;}
                                      
                                      }
                                      .blink-yellow {
                                       animation: mdui-yellow-blink-ani 1s linear infinite;
                                      }
                                      @keyframes mdui-yellow-blink-ani  {
                                       0%,70% {filter: drop-shadow(0px 0px 4px #FFDB3B) drop-shadow(0px 0px 4px #FFDB3B) drop-shadow(0px 0px 4px #FFDB3B); }
                                       71% {filter: none;}
                                      
                                      }
                                      
                                      
                                      

                                      für gelb-grün blinkend

                                      .blink-bunt   {
                                       animation: mdui-bunt-blink-ani 3s linear infinite;
                                         
                                      }
                                      @keyframes mdui-bunt-blink-ani {
                                       8% {filter: drop-shadow(0px 0px 4px #FFFF00) drop-shadow(0px 0px 4px #FFFF00) drop-shadow(0px 0px 4px #FFFF00); }
                                       30% {filter: drop-shadow(0px 0px 4px #01DF3A) drop-shadow(0px 0px 4px #01DF3A) drop-shadow(0px 0px 4px #01DF3A); }
                                       60% {filter: drop-shadow(0px 0px 4px #2BF23F) drop-shadow(0px 0px 4px #2BF23F) drop-shadow(0px 0px 4px #2BF23F); }
                                       0% {filter: none;}
                                      }
                                      
                                      .blink-lila   {
                                       animation: mdui-lila-blink-ani 3s linear infinite;
                                         
                                      }
                                      

                                      für drehend vertikal

                                      
                                      .anime { animation: turner 4s infinite linear !important}
                                       
                                      @keyframes turner{
                                         from{  transform: rotateY(0deg)   }
                                         to  {  transform: rotateY(360deg) }
                                      }
                                      

                                      für drehend horizontal

                                      .anime2 { animation: turner2 4s infinite linear !important}
                                       
                                      @keyframes turner2{
                                         from{  transform: rotateX(0deg)   }
                                         to  {  transform: rotateX(360deg) }
                                      }
                                      
                                      .player {
                                         background: #273B7C !important;
                                      }
                                      
                                      .anime { animation: turner 4s infinite linear !important}
                                       
                                      @keyframes turner{
                                         from{  transform: rotateY(0deg)   }
                                         to  {  transform: rotateY(360deg) }
                                      }
                                      
                                      
                                      

                                      moppel2810 1 Reply Last reply Reply Quote 2
                                      • moppel2810
                                        moppel2810 @liv-in-sky last edited by

                                        @liv-in-sky

                                        was muss ich ändern das es nicht blinkt bzw nur leuchtet?
                                        Hab gerade noch ein Problem und zwar funktioniert es in der vis vorschau auf dem PC aber nicht auf dem Tablet🙄

                                        T liv-in-sky 2 Replies Last reply Reply Quote 0
                                        • T
                                          tempestas @moppel2810 last edited by

                                          @moppel2810

                                          Welches Tablet hast du?
                                          Wenn es sehr alt ist, kann es sein, dass das Klassen nicht funktionieren. ZB auf meinem alten Fire HD Tablet ist das so

                                          1 Reply Last reply Reply Quote 0
                                          • liv-in-sky
                                            liv-in-sky @moppel2810 last edited by liv-in-sky

                                            @moppel2810

                                            leuchte dauernd:

                                            .leuchte   {
                                             animation: mdui-leuchte-ani 10s linear infinite;
                                               
                                            }
                                            @keyframes mdui-leuchte-ani {
                                             0%, 100% {filter: drop-shadow(0px 0px 4px #DF013A) drop-shadow(0px 0px 4px #DF013A) drop-shadow(0px 0px 4px #DF013A); }
                                            
                                            }
                                            
                                            

                                            wie @tempestas schon erwähnte - ich ahbe auch ein sehr altes samsung tablet - da geht es auch nicht

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            461
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            vis
                                            38
                                            311
                                            49270
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo