Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Praktische Anwendungen (Showcase)
    4. Einfach mal zeigen will….. :-) - Teil 2

    NEWS

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Einfach mal zeigen will….. :-) - Teil 2

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

      @ltsalvatore:

      Hi Walkinlarge2010!,

      ich hab mal ne frage zu einem deiner Widgets, welches du in deinem Systemstatus View benutzt.

      Und zwar bspw. dem Hue Widget.

      Du hast bei CSS Hintergrund, in dem Wert backgrund folgendes hineingeschrieben:

      {v:system.adapter.cloud.0.alive;v == "true" ? "#ffffff" : "#f26e6e"}

      Wofür genau ist das?

      Hintergrund warum ich frage:

      Ich möchte meine iobroker Instanzen im view darstellen/überwachen, und diese sollen sowohl ein- und ausschaltbar sein sowie die farbe von on (weiß) in off (rot) wechseln können.

      Da bin ich auf dein Widget gestoßen und habe mich gefragt, ob man das mit deinem in background eingetragenen Wert, wenn man es unter color setzt, umsetzen kann.

      danke und gruß

      ltsalvatore `

      Ja genau das macht das Binding im Background. In dem Fall wird hier gesteuert, wenn der Datenpunkt cloud.0.alive true ist, dann macht er es weiß (#ffffff), sonst rot. Das geht bei allen html Widgets.

      Fälschlicherweise war es beim Export noch ein copy‘n‘paste Fehler. Bei meinem hue adapter würde dann hue.0.alive stehen 😉

      Im Grunde kopierst du das Widget und trägst deine datenpunkte ein und gut <emoji seq="1f60a">😊</emoji>

      1 Reply Last reply Reply Quote 0
      • L
        ltsalvatore last edited by

        super, danke für die schnelle rückmeldung.

        habe es für mein eigentliches anliegen nun anders gelöst, werde aber mit sicherheit deine lösung später irgendwo in meinem vis noch einsetzen.

        deshalb nochmal ne frage..

        ich habe es versucht nachzustellen und es gelingt mir irgendwie noch nicht so ganz..finde aber auch den fehler nicht..

        wenn mein email adapter aus ist, dann wird die schrift rot.. soweit so gut.

        ist der adapter an, ist die schrift statt weiß aber blau. 😐

        und der weiße hintergrund.. den hab ich auch nicht bestellt.. sollte doch eigentlich transparent sein, oder?

        unter css color steht:

        {v:system.adapter.email.0.alive;v == "false" ? "#ff0000" : "#ffffff"}

        6497_screenshot_2018.06.21_23_58_19_001.jpg
        6497_screenshot_2018.06.21_23_58_04_001.jpg

        1 Reply Last reply Reply Quote 0
        • rudikx
          rudikx last edited by Jey Cee

          Auch ich bin nun gutes Stück weiter und möchte euch mal meine Kreation zeigen 😉

          Hier und da noch einige kleine Baustellen und notierte Ideen aber schon täglich im Einsatz.

          iPad.jpg Aussen.png Setting-Sprenkler.png Technik.png L-ftung-Chart.png Musik.png Fenster.png Testumgebung.png

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

            Sehr schön gemacht. 😉

            Die Fotos solltes du direkt in ioBroker hochladen…...

            1 Reply Last reply Reply Quote 0
            • A
              Ace-k last edited by

              sehr schön. Gradlinig und einfach zu bedienen auf dem Tablet.

              Ist dass das große ipad?

              für was ist der Kreis mit der Zahl in der mitte?

              1 Reply Last reply Reply Quote 0
              • P
                pix last edited by

                Hallo rudikx,

                sehr schöne Views.

                Mir gefällt die Idee eines Demo Knopfes für die Sprinkler Anlage. Nur zum Sehen, ob's geht 😄

                Auch der Fortschritt des Programmes wird visualisiert. Sehr schön.

                Wie schaltest du dein iPad Display (letzter Screenshot)? Ist das ein/aus oder die Helligkeit? Servomotor?

                Gruß,

                Pix

                1 Reply Last reply Reply Quote 0
                • Meistertr
                  Meistertr Developer last edited by

                  ich sitze auch seit zwei Wochen an einem neuen Design. Schlank übersichtlich aber Informativ ist das ziel, der Anfang ist gemacht. Fehlt aber noch viel. hier mal das, was ich bis jetzt gemacht habe.
                  1768_2018-06-28_19h40_58.gif

                  1 Reply Last reply Reply Quote 0
                  • P
                    pfuhsy last edited by Jey Cee

                    Hallo zusammen,

                    ich möchte auch gerne meine Visualisierung zeigen. Ich fange damit gerade erst an und hab noch nicht die Masse an Komponenten. Anfang ging es damit los meine Alarmanlage an den ioBroker zu koppeln, inkl. Einschalten per Smartphone und Statusmeldungen. Das ganze wird hauptsächlich auf meinen Smartphone bedient, ein paar Inspirationen hab ich mir aus dem Forum geholt. Ich überlege noch die komplette Navigationsleiste mittig auf dem Startbildschirm zu verlegen und den jeweiligen Gewerke ein eigenen Zurück-Button zu geben. So hätte ich mehr Platz für die Navigation, es sollen ja in Zukunft mehr Komponenten und Kategorien entstehen.

                    Gruss
                    6863_screenshot_20180702-174419.png 6863_screenshot_20180630-083632.png 6863_screenshot_20180702-174437.png 6863_screenshot_20180702-174450.png 6863_screenshot_20180702-174457.png

                    1 Reply Last reply Reply Quote 0
                    • Rummelmug
                      Rummelmug last edited by Jey Cee

                      @Rummelmugge:

                      Hallo zusammen,

                      im Zuge eines Hauskaufs mit Ausbau einer Einliegerwohnung, beschäftige ich mich nun seit Januar neben den Umbauarbeiten auch mit dem Thema Smarthome.

                      Ich finde die Arbeit der Community hier extrem gelungen und vorbildlich. Viele Dinge musste ich einfach direkt übernehmen, wie zb das Raumklima Skript. 😉

                      Gerade beim Arbeiten mit VIS fand ich es unheimlich hilfreich mir andere Kreationen anzuschauen und Ideen zu sammeln. Deswegen möchte ich euch meine VIS Projekte nicht vorenthalten.

                      Da mein Tablet Projekt noch nicht ganz fertig ist, zeige ich erst mal mein Smartphone UI.

                      Ihr findet das ganze auch auf YouTube: https://youtu.be/mLnzey2sco4

                      Screenshot_20180611-233805.jpg

                      ! Screenshot_20180611-234003.jpg

                      ! Screenshot_20180611-233944.jpg `

                      Da ich nun schon über andere Quellen angesprochen wurde, ob ich nicht meine VIS zur Verfügung stellen kann, habe ich sie mal hier mit angehängt, für alle die auch Interesse daran haben.

                      Icons sind entweder selbst erstellt oder von https://www.flaticon.com/
                      7700_op5t.7z
                      7700_screenshot_20180611-233805.jpg

                      1 Reply Last reply Reply Quote 1
                      • S
                        screetch82 last edited by

                        Hallo

                        ich kann dein Projekt importieren dann habe ich main mit dem demoview und das neue Projekt. gehe ich auf IP:8082 dann wird standardmaessig der demoview geladen. loesche ich diesen view dann wird der hergestellt. ich habe keine einstellung gefunden wo ich einen default view in einem anderen project (nicht in main) lade, wenn ich nur die IP angebe. Das ist doch echt verflixt. Es gibt mehrere Threads dazu aber ohne Loesung.

                        Das einzige was geht, ist einen View aus deinem Projekt zu exportieren, den code zu markieren, und im projekt main ein neuen view zu erzeugen und dort den code einzufuegen. Loescht man dann den demoview wird der soeben eingepasstete view sogar standartmaessige geladen. Allerdings sind auch alle CSS und Bezüge zu den SVGs usw weg. Also irgendwie faehlt es mir hier ein einer vernünftigen Funktion ein Projekt zu importieren und als default zu markieren. hat jmd ne idee?

                        1 Reply Last reply Reply Quote 0
                        • R
                          Regalo last edited by

                          @tempestas:

                          viewtopic.php?f=35&t=5369&start=380#p126465 `
                          @tempestas: Deine Zeitschaltung ist genau was ich suche. Würdest du auch die Widgets dazu veröffentlichen? Danke vorab!

                          1 Reply Last reply Reply Quote 0
                          • M
                            Marcel85 last edited by Jey Cee

                            So sieht es aktuell auf meinem Wandtablet aus.

                            3473_1home.png 3473_2rolladen.png 3473_3heizung.png 3473_4beleuchtung.png 3473_5spotify.png 3473_6radio.png 3473_7ger_teauswahl.png 3473_8harmonyaus.png 3473_9harmonyein.png 3473_10alarmanlage.png 3473_11verschluss.png 3473_12apps.png 3473_13wlanthermo.png

                            S H 2 Replies Last reply Reply Quote 8
                            • T
                              tempestas last edited by

                              wie immer bei dir klasse Optik!

                              1 Reply Last reply Reply Quote 0
                              • T
                                tempestas last edited by Jey Cee

                                @Regalo:

                                @tempestas:

                                viewtopic.php?f=35&t=5369&start=380#p126465 @tempestas: Deine Zeitschaltung ist genau was ich suche. Würdest du auch die Widgets dazu veröffentlichen? Danke vorab!

                                Hi,

                                bei mir sieht das inzwschen schon wieder anders aus, da mir dass alte Widget icht gefiel. Daher kann ich dir das nicht geben, aber hier die Widgets für meine aktuelle Ansicht, die so aussieht:

                                2395_zeitschaltung2.png 2395_zeitschaltung1.png

                                Hier Widgets für die "normale Ansicht":

                                widgets.txt

                                Hier die Widgets zur Zeitauswahl

                                widgets.txt

                                1 Reply Last reply Reply Quote 0
                                • 2
                                  2hot4you last edited by

                                  Hallo tempestas,

                                  kannst Du die Skripte auch dazu hochladen ?

                                  1 Reply Last reply Reply Quote 0
                                  • T
                                    tempestas last edited by Jey Cee

                                    Klar. Es gibt hier allerdings noch deutlich schönere Timing Skripte im Forum mit Tagesauswahl z.B.

                                    // ##########
                                    // Skript zum Schalten einer Steckdose zwischen zu zwei definierten Zeitpunkten. Steuerbar über Vis
                                    // Dank an paul53 für das Schedule Skript
                                    // v 1.0 stable, tempestas 24.1.2018; Zeitauswahl stark vereinfacht (jqui input date time overlay), zu steuernder Aktor via VIS auswählbar
                                    // v 0.2, stable, tempestas, 2.12.2017
                                    // Changes: boolean neu angelegt
                                    // telegram eingefügt
                                     // Skripteinstellungen
                                    var force = false;         // true erzwingt bei Neustart des Skripts das Anlegen der States mit den nachfolgend definierten Werten
                                    var debug = false;
                                     // STATES FÜR AKTIV UND TELEGRAM INFO 
                                     createState('javascript.0.Zeitschaltung.Aktor1.Aktiv', false, force, {
                                      read: true, 
                                      write: true, 
                                      name: "Zeitschaltung aktiv oder aus?", 
                                      type: "boolean", 
                                      def: false
                                    });
                                     createState('javascript.0.Zeitschaltung.Aktor1.telegram', false, force, {
                                      read: true, 
                                      write: true, 
                                      name: "Telegram senden?", 
                                      type: "boolean", 
                                      def: false
                                    });
                                     // State für zu steuernden Aktor anlegen
                                     createState('javascript.0.Zeitschaltung.Aktor1.Aktor','', force, {               
                                        name: 'Einstellung zu steuernder Aktor',
                                        type: 'string',
                                    });
                                     // STARTZEIT STATES
                                     createState('javascript.0.Zeitschaltung.Aktor1.Start.Zeit',"17:00:00", force, {          // String der Startzeit      
                                        name: 'Startzeit ',
                                        type: 'string',
                                     });
                                     createState('javascript.0.Zeitschaltung.Aktor1.Start.Stunde',"", force, {          // Startzeit-Stundenstring für Anzeige in VIS
                                        name: 'Startstunde ',
                                        type: 'string',
                                     });
                                     createState('javascript.0.Zeitschaltung.Aktor1.Start.Minute',"", force, {          // Startzeit-Minutenstring für Anzeige in VIS
                                        name: 'Startminute ',
                                        type: 'string',
                                     });
                                    // ENDZEIT STATES
                                     createState('javascript.0.Zeitschaltung.Aktor1.Ende.Zeit',"20:00:00", force, {          // String der Endzeit      
                                        name: 'Startzeit ',
                                        type: 'string',
                                     });
                                     createState('javascript.0.Zeitschaltung.Aktor1.Ende.Stunde','', force, {           // Endzeit-Stundenstring für Anzeige in VIS    
                                        name: 'Endminute ',
                                        type: 'string',
                                     });
                                     createState('javascript.0.Zeitschaltung.Aktor1.Ende.Minute','', force, {           // Endzeit-Minutenstring für Anzeige in VIS    
                                        name: 'Endminute ',
                                        type: 'string',
                                     });
                                     var idAktor = 'javascript.0.Zeitschaltung.Aktor1.Aktor';     
                                    var aktor;
                                     var idAktiv         =   "javascript.0.Zeitschaltung.Aktor1.Aktiv";
                                    var idTelegram      =   "javascript.0.Zeitschaltung.Aktor1.telegram";
                                     var idStartzeit     =   "javascript.0.Zeitschaltung.Aktor1.Start.Zeit";
                                    var idEndzeit       =   "javascript.0.Zeitschaltung.Aktor1.Ende.Zeit";
                                     var idMinStart      = "javascript.0.Zeitschaltung.Aktor1.Start.Minute" ;
                                    var idStdStart      = "javascript.0.Zeitschaltung.Aktor1.Start.Stunde";
                                     var idMinEnd        = "javascript.0.Zeitschaltung.Aktor1.Ende.Minute";
                                    var idStdEnd        = "javascript.0.Zeitschaltung.Aktor1.Ende.Stunde";
                                     var einschalten,
                                        timerEinschalten;
                                    
                                    var ausschalten,
                                        timerAusschalten;
                                    
                                    // ##################################################################################################
                                    //                                      Functions und Trigger
                                    // ##################################################################################################
                                     // Trigger Startzeit / Endzeit
                                     var arrStart = [idMinStart, idStdStart];
                                    on(arrStart, function(){
                                    
                                        var minString;
                                    
                                        var stdStart = getState(idStdStart).val;
                                        var minStart = getState(idMinStart).val;
                                    
                                        if(minStart.lenght == 1) minString = '0' + minStart;
                                        else minString = minStart;
                                        var stringTime = stdStart.toString() + ':' +minString.toString();     
                                    
                                        setState(idStartzeit, stringTime);
                                    } );
                                     var arrEnd = [idMinEnd, idStdEnd];
                                    on(arrEnd, function(){
                                    
                                        var minString;
                                    
                                        var stdEnd = getState(idStdEnd).val;
                                        var minEnd = getState(idMinEnd).val;
                                    
                                        if(minEnd.lenght == 1) minString = '0' + minEnd;
                                        else minString = minEnd;    
                                    
                                        var stringTime = stdEnd.toString() + ':' +minString.toString(); 
                                    
                                        setState(idEndzeit, stringTime);
                                    } );
                                     // FUNCTION WECHSEL DES ZU SCHALTENDEN AKTORS
                                     on({id: idAktor, change: "any"}, function(obj){
                                        aktor = obj.state.val;
                                       if(debug) log("Aktor ist "+aktor);    
                                    });
                                     // STARTZEIT TRIGGER (SCHEDULE)
                                     on(idStartzeit, function(dp) {                                                                          // Triggern bei Änderung des Startzeit-Strings
                                        einschalten= dp.state.val.split(':');                                             
                                        if(debug) log("Timer wird eingeschaltet um "+einschalten[0] +':' +einschalten[1]);
                                    
                                        //setState(idStdStart, einschalten[0]);                                                               // States für VIS Visualisierung setzen
                                        //setState(idMinStart, einschalten[1]);                                                               // States für VIS Visualisierung setzen
                                         clearSchedule(timerEinschalten);                                                                    // altes Schedule löschen
                                        timerEinschalten = schedule(einschalten[1] + ' ' + einschalten[0] + ' * * 0-6', fEinschalten);      // neues Schedule einstellen
                                    });
                                     // ENDZEIT TRIGGER ( SCHEDULE)
                                     on(idEndzeit, function(dp) {                                                                            // Triggern bei Änderung des Endzeit-Strings
                                        ausschalten= dp.state.val.split(':');
                                        if(debug) log("Timer wird ausgeschaltet um "+ausschalten[0] +':' +ausschalten[1]);
                                    
                                        //setState(idStdEnd, ausschalten[0]);                                                                 // States für VIS Visualisierung setzen
                                        //setState(idMinEnd, ausschalten[1]);                                                                 // States für VIS Visualisierung setzen
                                    
                                        clearSchedule(timerAusschalten);                                                                    // altes Schedule löschen
                                        timerAusschalten = schedule(ausschalten[1] + ' ' + ausschalten[0] + ' * * 0-6', fAusschalten);      // neues Schedule einstellen
                                    });
                                     // Functions ein- und ausschalten (Festlegen der durch Schedule getriggerten Aktionen)
                                     function fAusschalten(){
                                        if (getState(idAktiv).val === true) {
                                                setState(aktor, false);         // nur, wenn die Automatik eingeschaltet ist wird die Steckdose geschaltet
                                                if(getState(idTelegram).val === true) {sendTo('telegram.0', {                                          // Nachricht per Telegram
                                                    text: "Test-Zeitschaltung wurde ausgeschaltet"         
                                                });
                                            }
                                        }
                                    }
                                    
                                    function fEinschalten(){
                                        if (getState(idAktiv).val === true) {
                                                setState(aktor, true);         // nur, wenn die Automatik eingeschaltet ist wird die Steckdose geschaltet
                                                 if(getState(idTelegram).val === true) {sendTo('telegram.0', {                                          // Nachricht per Telegram
                                                    text: "Test-Zeitschaltung wurde eingeschaltet"        
                                                });
                                            }
                                        }
                                    }
                                     // FUNCTION FÜR ERSTMALIGES EINLESEN
                                     function fSkriptStart(){
                                        einschalten = getState(idStartzeit).val.split(':'); 
                                        timerEinschalten = schedule(einschalten[1] + ' ' + einschalten[0] + ' * * 0-6', fEinschalten); 
                                        if(debug) log("Einschalten um:" +einschalten[0] + ":" + einschalten[1]);
                                        setState(idStdStart, einschalten[0]);
                                        setState(idMinStart, einschalten[1]);
                                    
                                        ausschalten = getState(idEndzeit).val.split(':'); 
                                        timerAusschalten = schedule(ausschalten[1] + ' ' + ausschalten[0] + ' * * 0-6', fAusschalten); 
                                        if(debug) log("Ausschalten um:" + ausschalten[0] + ":" + ausschalten[1] );
                                        setState(idStdEnd, ausschalten[0]);
                                        setState(idMinEnd, ausschalten[1]);    
                                    
                                    }
                                    // Bei Start eine Sekunde verzögert, damit States angelegt werden können
                                    setTimeout(fSkriptStart, 1000) ; 
                                    
                                    1 Reply Last reply Reply Quote 0
                                    • Rummelmug
                                      Rummelmug last edited by Jey Cee

                                      Sooo,

                                      mein Tablet UI ist auch soweit vorzeigefähig. Das ganze läuft über ein, an der Wand hängendes, Huawei Mediapad T3 und über ein IPad Air 2.

                                      Im Reiter Sicherheit fehlen noch die Bilder der Kameras und der Reiter Neato wird noch um einen Mähroboter erweitert, sobald dieser installiert ist.

                                      Ein Video davon gibt's auf https://youtu.be/QRdilyfYdUM.
                                      7700_screenshot_20180715-124313.png 7700_screenshot_20180715-124302.png 7700_screenshot_20180715-124242.png 7700_screenshot_20180715-124214.png 7700_screenshot_20180715-124208.png 7700_screenshot_20180715-124203.png 7700_screenshot_20180715-124153.png 7700_screenshot_20180715-124148.png

                                      1 Reply Last reply Reply Quote 0
                                      • L
                                        ltsalvatore last edited by

                                        @Rummelmugge:

                                        Sooo,

                                        mein Tablet UI ist auch soweit vorzeigefähig. Das ganze läuft über ein, an der Wand hängendes, Huawei Mediapad T3 und über ein IPad Air 2.

                                        Im Reiter Sicherheit fehlen noch die Bilder der Kameras und der Reiter Neato wird noch um einen Mähroboter erweitert, sobald dieser installiert ist.

                                        Ein Video davon gibt's auf https://youtu.be/QRdilyfYdUM. `

                                        sieht sehr schön aus..

                                        was für hardware benutzt du bei deiner heizklima lösung? und könntest du den energie view auch teilen?

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

                                          @ltsalvatore:

                                          sieht sehr schön aus..

                                          was für hardware benutzt du bei deiner heizklima lösung? und könntest du den energie view auch teilen? `

                                          Danke danke,

                                          ich benutze Heizkörperventile und Hygrometer von Homematic IP. Die Lüftung wird über das Raumklima Skript von hier aus dem Forum gesteuert. Werte von draußen nehme ich von einer nahen Wetterstation per weather underground.

                                          Aktuell lohnt bei mir eine Steuerung direkt an der Heizung nicht, da den ganzen Tag jemand im Haus ist.

                                          Ich bin aktuell unterwegs. Ich schau die Tage mal, dass ich den View hier rein stelle.

                                          Gesendet von meinem ONEPLUS A5010 mit Tapatalk

                                          1 Reply Last reply Reply Quote 0
                                          • C
                                            Conquest last edited by

                                            @Marcel85:

                                            So sieht es aktuell auf meinem Wandtablet aus.

                                            1Home.PNG

                                            2Rolladen.PNG

                                            3Heizung.PNG

                                            4Beleuchtung.PNG

                                            5Spotify.PNG

                                            6Radio.PNG

                                            7Geräteauswahl.PNG

                                            8HarmonyAus.PNG

                                            9HarmonyEin.PNG

                                            10Alarmanlage.PNG

                                            11Verschluss.PNG

                                            12Apps.PNG

                                            13WlanThermo.PNG `

                                            Hallo Marcel85,

                                            Respekt ist wirklich klasse geworden. Ich hätte Interesse an zwei Views und zwar an der Beleuchtung und der Heizung. Wäre super wenn du das hier teilen könntest.

                                            Gruß Torsten

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            654
                                            Online

                                            31.6k
                                            Users

                                            79.6k
                                            Topics

                                            1.3m
                                            Posts

                                            185
                                            916
                                            360235
                                            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