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. Visualisierung
  4. ical Kalender Farben anpassen?

NEWS

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

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

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

ical Kalender Farben anpassen?

Geplant Angeheftet Gesperrt Verschoben Visualisierung
vis
112 Beiträge 22 Kommentatoren 15.6k Aufrufe 20 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.
  • NashraN Nashra

    Moin, nutze das geänderte Skript von @Feuersturm welches jetzt auch Fehler anzeigt

    javascript.0	2021-08-04 15:11:41.911	error	(8539) at Script.runInContext (vm.js:130:18)
    javascript.0	2021-08-04 15:11:41.911	error	(8539) at script.js.Kalender.ICal-farben-Kalender:149:3
    javascript.0	2021-08-04 15:11:41.911	error	(8539) at script.js.Kalender.ICal-farben-Kalender:147:1
    javascript.0	2021-08-04 15:11:41.910	error	(8539) at iCalToHTMLTable (script.js.Kalender.ICal-farben-Kalender:36:24)
    javascript.0	2021-08-04 15:11:41.909	error	(8539) script.js.Kalender.ICal-farben-Kalender: TypeError: Cannot read property 'indexOf' of undefined
    
    // Script stammt von uhula und sputnik
    // Das Script greift auf die ical.0.html zu und ändert den Text.
    // Gespeichert wird das geänderte Script in "javascript.0.ical.html"
    // Geändert und erweitert in 12/2017 von bahnuhr
    // 02.02.2020 - Feuersturm - Anstatt der Daten für heute, morgen, übermorgen wird der String "Heute" "Morgen" "Übermorgen" angezeigt
    // 19.06.2020 - Feuersturm - Über den Schalter abstand_zwischen_Tagen wird aktiviert, dass ein Absatz zwischen den Terminen der nächsten Tage entsteht
    // 20.06.2020 - Feuersturm - Korrektur damit bei aktiviertem "balken" diese wieder korrekt angezeigt werden, wenn auch "abstand_zwischen_Tagen" aktiv ist
     
     //Quelle: https://forum.iobroker.net/topic/26782/ical-kalender-farben-anpassen/2
     
    var idCal = "ical.0";
    var idCalHTMLtable = 'javascript.0.ICalFarbe.Ical0.html';
    var idCalTrigger   = idCal + ".data.trigger";
    var idCalTable     = idCal + ".data.table";
    var idCalHTML      = idCal + ".data.html";
     
    var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
    var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
    var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
    var ersetze_datum_in_Worte = true;    // wenn true wird anstatt des Datums für heut, morgen, übermorgen der String "Heute" "Morgen" "Übermorgen" angezeigt
    var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
     
    function iCalToHTMLTable() {
        var html     = "<table style='font-size:0.9em;'><tbody>";
        var calTable = getState(idCalTable).val; //.val eingefügt
        var inst     = getObject("system.adapter."+idCal);
        var instopt  = inst.native;
        var calendar = {};
     
        for (var i = 0; i < calTable.length; i++) { 
            var entry = calTable[i];
            var _date = new Date(entry._date);
            var _time = "";
     
            // "_time und date" Variable festlegen
            if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                    _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                    entry.date = Datum_holen("tm");
                } else {
                    _time= "ganzer Tag";
                    entry.date = Datum_holen("tm");
                }
            } else {                                    // Pfeil ist nicht enthalten
                if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                    _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                } else {
                    _time= "ganzer Tag";
                }
                entry.date = getFormattedDate(_date);
            }
     
            if(ersetze_datum_in_Worte == true) {
                if(entry.date == Datum_holen("tm"))
                {
                    entry.date = "Heute";
                } 
                else if (entry.date == Datum_morgen_holen("tm")){
                    entry.date ="Morgen";
                }
                else if (entry.date == Datum_uebermorgen_holen("tm")){
                    entry.date="Übermorgen";
                }
            }        
     
     
            if ( entry._calName != calendar.name ) {
                calendar = {};
                for (var c = 0; c < instopt.calendars.length; c++ ) {
                    if (entry._calName == instopt.calendars[c].name ) {
                        calendar = instopt.calendars[c];
                        break;
                    }
                }
            }
     
            if (i>0 && (abstand_zwischen_Tagen == true)){
                if (calTable.val[i].date != calTable.val[i-1].date){
                    html+="<tr><td></td><td></td></tr>";
                    html+="<tr><td></td><td></td></tr>";
                    html+="<tr><td></td><td></td></tr>";
                    //html+="<tr><td></td><td></td></tr>";
                }
            }
     
            var _color = "color:"+calendar.color;
            if (entry._class.includes("ical_today")) _color = "color:#01DF01";
            else if (entry._class.includes("ical_tomorrow")) _color = "color:#FFBF00";
            else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
     
            var _bgcolor = "";
            if(calendar.name == "Müll") {
                if(entry.event == "Bio Tonne") {
                    _bgcolor = "#a0e878";
                    _color="color:#a0e878";
                }
                else if(entry.event == "Restmüll Tonne") {
                    _bgcolor = "#ce6f6f"; 
                    _color="color:#ce6f6f";
                }
                else if(entry.event == "Blaue Tonne") {
                    _bgcolor = "#508fdc";
                    _color="color:#508fdc";
                }
                else if(entry.event == "Gelbe Tonne") {
                    _bgcolor = "#eee06d";
                    _color="color:#eee06d";
                }
            }
            else _bgcolor = calendar.color;
            
            if (balken === false) _bgcolor = "";
     
            if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
            else html+="<tr>";
     
            var abstand = "15px;";
            if (balken === false) abstand = "3px;";
            html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
     
            if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen        
            } else {
                html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
            }
     
            html+="</tr>";
        }
     
        html+="</body></table>";   
        console.log(html); 
        setState(idCalHTMLtable, html);    
    }
     
    function getFormattedDate(date) {
        var month = (1 + date.getMonth()).toString();
        month = month.length > 1 ? month : '0' + month;
        var day = date.getDate().toString();
        day = day.length > 1 ? day : '0' + day;
        return day + '.' + month + '.';
    }
     
    on({id: idCalTable, change: "ne"}, function (obj) {
        iCalToHTMLTable();
    });
     
    iCalToHTMLTable();
    
    

    Was müßte hier geänder/angepasst werden? Habe keine Plan davon :confused:

    FeuersturmF Online
    FeuersturmF Online
    Feuersturm
    schrieb am zuletzt editiert von
    #78

    @nashra Ich versuche gerade zu verstehen, warum ich mit meiner Version vom Skript (https://forum.iobroker.net/topic/26782/ical-kalender-farben-anpassen/33) und ical Adapter 1.11.3 und js-controller 3.3.15 den von dir und von @bahnuhr beschriebenen Fehler

    TypeError: Cannot read property 'indexOf' of undefined
    

    bei mir nicht sehe :-\

    1 Antwort Letzte Antwort
    0
    • NashraN Nashra

      Moin, nutze das geänderte Skript von @Feuersturm welches jetzt auch Fehler anzeigt

      javascript.0	2021-08-04 15:11:41.911	error	(8539) at Script.runInContext (vm.js:130:18)
      javascript.0	2021-08-04 15:11:41.911	error	(8539) at script.js.Kalender.ICal-farben-Kalender:149:3
      javascript.0	2021-08-04 15:11:41.911	error	(8539) at script.js.Kalender.ICal-farben-Kalender:147:1
      javascript.0	2021-08-04 15:11:41.910	error	(8539) at iCalToHTMLTable (script.js.Kalender.ICal-farben-Kalender:36:24)
      javascript.0	2021-08-04 15:11:41.909	error	(8539) script.js.Kalender.ICal-farben-Kalender: TypeError: Cannot read property 'indexOf' of undefined
      
      // Script stammt von uhula und sputnik
      // Das Script greift auf die ical.0.html zu und ändert den Text.
      // Gespeichert wird das geänderte Script in "javascript.0.ical.html"
      // Geändert und erweitert in 12/2017 von bahnuhr
      // 02.02.2020 - Feuersturm - Anstatt der Daten für heute, morgen, übermorgen wird der String "Heute" "Morgen" "Übermorgen" angezeigt
      // 19.06.2020 - Feuersturm - Über den Schalter abstand_zwischen_Tagen wird aktiviert, dass ein Absatz zwischen den Terminen der nächsten Tage entsteht
      // 20.06.2020 - Feuersturm - Korrektur damit bei aktiviertem "balken" diese wieder korrekt angezeigt werden, wenn auch "abstand_zwischen_Tagen" aktiv ist
       
       //Quelle: https://forum.iobroker.net/topic/26782/ical-kalender-farben-anpassen/2
       
      var idCal = "ical.0";
      var idCalHTMLtable = 'javascript.0.ICalFarbe.Ical0.html';
      var idCalTrigger   = idCal + ".data.trigger";
      var idCalTable     = idCal + ".data.table";
      var idCalHTML      = idCal + ".data.html";
       
      var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
      var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
      var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
      var ersetze_datum_in_Worte = true;    // wenn true wird anstatt des Datums für heut, morgen, übermorgen der String "Heute" "Morgen" "Übermorgen" angezeigt
      var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
       
      function iCalToHTMLTable() {
          var html     = "<table style='font-size:0.9em;'><tbody>";
          var calTable = getState(idCalTable).val; //.val eingefügt
          var inst     = getObject("system.adapter."+idCal);
          var instopt  = inst.native;
          var calendar = {};
       
          for (var i = 0; i < calTable.length; i++) { 
              var entry = calTable[i];
              var _date = new Date(entry._date);
              var _time = "";
       
              // "_time und date" Variable festlegen
              if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                  if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                      _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                      entry.date = Datum_holen("tm");
                  } else {
                      _time= "ganzer Tag";
                      entry.date = Datum_holen("tm");
                  }
              } else {                                    // Pfeil ist nicht enthalten
                  if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                      _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                  } else {
                      _time= "ganzer Tag";
                  }
                  entry.date = getFormattedDate(_date);
              }
       
              if(ersetze_datum_in_Worte == true) {
                  if(entry.date == Datum_holen("tm"))
                  {
                      entry.date = "Heute";
                  } 
                  else if (entry.date == Datum_morgen_holen("tm")){
                      entry.date ="Morgen";
                  }
                  else if (entry.date == Datum_uebermorgen_holen("tm")){
                      entry.date="Übermorgen";
                  }
              }        
       
       
              if ( entry._calName != calendar.name ) {
                  calendar = {};
                  for (var c = 0; c < instopt.calendars.length; c++ ) {
                      if (entry._calName == instopt.calendars[c].name ) {
                          calendar = instopt.calendars[c];
                          break;
                      }
                  }
              }
       
              if (i>0 && (abstand_zwischen_Tagen == true)){
                  if (calTable.val[i].date != calTable.val[i-1].date){
                      html+="<tr><td></td><td></td></tr>";
                      html+="<tr><td></td><td></td></tr>";
                      html+="<tr><td></td><td></td></tr>";
                      //html+="<tr><td></td><td></td></tr>";
                  }
              }
       
              var _color = "color:"+calendar.color;
              if (entry._class.includes("ical_today")) _color = "color:#01DF01";
              else if (entry._class.includes("ical_tomorrow")) _color = "color:#FFBF00";
              else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
       
              var _bgcolor = "";
              if(calendar.name == "Müll") {
                  if(entry.event == "Bio Tonne") {
                      _bgcolor = "#a0e878";
                      _color="color:#a0e878";
                  }
                  else if(entry.event == "Restmüll Tonne") {
                      _bgcolor = "#ce6f6f"; 
                      _color="color:#ce6f6f";
                  }
                  else if(entry.event == "Blaue Tonne") {
                      _bgcolor = "#508fdc";
                      _color="color:#508fdc";
                  }
                  else if(entry.event == "Gelbe Tonne") {
                      _bgcolor = "#eee06d";
                      _color="color:#eee06d";
                  }
              }
              else _bgcolor = calendar.color;
              
              if (balken === false) _bgcolor = "";
       
              if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
              else html+="<tr>";
       
              var abstand = "15px;";
              if (balken === false) abstand = "3px;";
              html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
       
              if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                  html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen        
              } else {
                  html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
              }
       
              html+="</tr>";
          }
       
          html+="</body></table>";   
          console.log(html); 
          setState(idCalHTMLtable, html);    
      }
       
      function getFormattedDate(date) {
          var month = (1 + date.getMonth()).toString();
          month = month.length > 1 ? month : '0' + month;
          var day = date.getDate().toString();
          day = day.length > 1 ? day : '0' + day;
          return day + '.' + month + '.';
      }
       
      on({id: idCalTable, change: "ne"}, function (obj) {
          iCalToHTMLTable();
      });
       
      iCalToHTMLTable();
      
      

      Was müßte hier geänder/angepasst werden? Habe keine Plan davon :confused:

      FeuersturmF Online
      FeuersturmF Online
      Feuersturm
      schrieb am zuletzt editiert von
      #79

      @nashra und @bahnuhr Wie sehen die Objekt Daten von ical.0.data.table bei euch aus?
      Im Laufe der ical Tests hatte ich auch schon desöfteren meine ical.* Datenpunkte mal gelöscht und neu anlegen lassen.

      Bei mir steht dort:

      {
        "_id": "ical.0.data.table",
        "type": "state",
        "common": {
          "name": "JS iCal table",
          "desc": "JS table: []",
          "type": "array",
          "role": "list",
          "read": true,
          "write": false
        },
        "native": {},
        "from": "system.adapter.ical.0",
        "user": "system.user.admin",
        "ts": 1628197910969,
        "acl": {
          "object": 1636,
          "state": 1636,
          "owner": "system.user.admin",
          "ownerGroup": "system.group.administrator"
        }
      }
      
      NashraN 1 Antwort Letzte Antwort
      0
      • FeuersturmF Feuersturm

        @nashra und @bahnuhr Wie sehen die Objekt Daten von ical.0.data.table bei euch aus?
        Im Laufe der ical Tests hatte ich auch schon desöfteren meine ical.* Datenpunkte mal gelöscht und neu anlegen lassen.

        Bei mir steht dort:

        {
          "_id": "ical.0.data.table",
          "type": "state",
          "common": {
            "name": "JS iCal table",
            "desc": "JS table: []",
            "type": "array",
            "role": "list",
            "read": true,
            "write": false
          },
          "native": {},
          "from": "system.adapter.ical.0",
          "user": "system.user.admin",
          "ts": 1628197910969,
          "acl": {
            "object": 1636,
            "state": 1636,
            "owner": "system.user.admin",
            "ownerGroup": "system.group.administrator"
          }
        }
        
        NashraN Offline
        NashraN Offline
        Nashra
        Most Active Forum Testing
        schrieb am zuletzt editiert von Nashra
        #80

        @feuersturm, bei mir sieht es etwas anders aus

        {
          "from": "system.adapter.ical.0",
          "user": "system.user.admin",
          "ts": 1628227201752,
          "common": {
            "name": "JS iCal table",
            "desc": "JS table: []",
            "type": "array",
            "role": "list",
            "read": true,
            "write": false
          },
          "native": {},
          "acl": {
            "object": 1636,
            "owner": "system.user.admin",
            "ownerGroup": "system.group.administrator",
            "state": 1636
          },
          "_id": "ical.0.data.table",
          "type": "state"
        }
        

        Was aber auch noch ist, habe eine komplett aktuelle Beta auf einem anderen
        Rechner laufen und dort kommen keine Fehlermeldungen und es sieht aus wie bei dir

        {
          "_id": "ical.0.data.table",
          "type": "state",
          "common": {
            "name": "JS iCal table",
            "desc": "JS table: []",
            "type": "array",
            "role": "list",
            "read": true,
            "write": false
          },
          "native": {},
          "from": "system.adapter.ical.0",
          "user": "system.user.admin",
          "ts": 1628227500440,
          "acl": {
            "object": 1636,
            "state": 1636,
            "owner": "system.user.admin",
            "ownerGroup": "system.group.administrator"
          }
        }
        

        Dann werde ich die DP auf dem alten System mal neu anlegen lassen

        Gruß Ralf
        Mir egal, wer Dein Vater ist! Wenn ich hier angel, wird nicht übers Wasser gelaufen!!

        Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

        L 1 Antwort Letzte Antwort
        0
        • NashraN Nashra

          @feuersturm, bei mir sieht es etwas anders aus

          {
            "from": "system.adapter.ical.0",
            "user": "system.user.admin",
            "ts": 1628227201752,
            "common": {
              "name": "JS iCal table",
              "desc": "JS table: []",
              "type": "array",
              "role": "list",
              "read": true,
              "write": false
            },
            "native": {},
            "acl": {
              "object": 1636,
              "owner": "system.user.admin",
              "ownerGroup": "system.group.administrator",
              "state": 1636
            },
            "_id": "ical.0.data.table",
            "type": "state"
          }
          

          Was aber auch noch ist, habe eine komplett aktuelle Beta auf einem anderen
          Rechner laufen und dort kommen keine Fehlermeldungen und es sieht aus wie bei dir

          {
            "_id": "ical.0.data.table",
            "type": "state",
            "common": {
              "name": "JS iCal table",
              "desc": "JS table: []",
              "type": "array",
              "role": "list",
              "read": true,
              "write": false
            },
            "native": {},
            "from": "system.adapter.ical.0",
            "user": "system.user.admin",
            "ts": 1628227500440,
            "acl": {
              "object": 1636,
              "state": 1636,
              "owner": "system.user.admin",
              "ownerGroup": "system.group.administrator"
            }
          }
          

          Dann werde ich die DP auf dem alten System mal neu anlegen lassen

          L Offline
          L Offline
          lucajordi
          schrieb am zuletzt editiert von lucajordi
          #81

          Hallo,

          Script läuft noch ohne Fehler, aber im Vis steht:

          a1ded5a5-c37c-4a2f-9579-6aee179170e4-image.png

          Und nicht nur der eigentliche Eintrag...
          Eine Idee?

          FeuersturmF 1 Antwort Letzte Antwort
          0
          • L lucajordi

            Hallo,

            Script läuft noch ohne Fehler, aber im Vis steht:

            a1ded5a5-c37c-4a2f-9579-6aee179170e4-image.png

            Und nicht nur der eigentliche Eintrag...
            Eine Idee?

            FeuersturmF Online
            FeuersturmF Online
            Feuersturm
            schrieb am zuletzt editiert von
            #82

            @lucajordi Was für ein Widget hast du in VIS genommen und welchen Datenpunkt hast du dort hinterlegt?

            1 Antwort Letzte Antwort
            0
            • bahnuhrB bahnuhr

              Anbei ein kleines Script was ich auch aus dem Forum habe und dann geändert und angepasst habe.
              Dort kannst du sowas ändern.

              Vorteil:
              Farben ändern je nach Wunsch.
              Auch das Datum wird dann in der entsprechenden Farbe angezeigt.
              Datenpunkt musst du selber anlegen/anpassen.

              Wenn gefällt dann Daumen hoch.

              mfg
              bahnuhr

              // Script stammt von uhula und sputnik
              // Das Script greift auf die ical.0.html zu und ändert den Text.
              // Gespeichert wird das geänderte Script in "javascript.0.ical.html"
              // Geändert und erweitert in 12/2017 von bahnuhr
              
              
              var idCal = "ical.0";
              var idCalTrigger   = idCal + ".data.trigger";
              var idCalTable     = idCal + ".data.table";
              var idCalHTML      = idCal + ".data.html";
              var idCalHTMLtable = 'javascript.0.Status.Ical.html';
              
              var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
              var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
              var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
              
              function iCalToHTMLTable() {
                  var html     = "<table style='font-size:0.9em;'><tbody>";
                  var calTable = getState(idCalTable);
                  var inst     = getObject("system.adapter."+idCal);
                  var instopt  = inst.native;
                  var calendar = {};
              
                  for (var i = 0; i < calTable.val.length; i++) { 
                      var entry = calTable.val[i];
                      var _date = new Date(entry._date);
                      var _time = "";
              
              
                      // "_time und date" Variable festlegen
                      if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                          if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                              _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                              entry.date = Datum_holen("tm");
                          } else {
                              _time= "ganzer Tag";
                              entry.date = Datum_holen("tm");
                          }
                      } else {                                    // Pfeil ist nicht enthalten
                          if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                              _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                          } else {
                              _time= "ganzer Tag";
                          }
                          entry.date = getFormattedDate(_date);
                      }
              
              
                      if ( entry._calName != calendar.name ) {
                          calendar = {};
                          for (var c = 0; c < instopt.calendars.length; c++ ) {
                              if (entry._calName == instopt.calendars[c].name ) {
                                  calendar = instopt.calendars[c];
                                  break;
                              }
                          }
                      }
              
                      var _color = "color:"+calendar.color;
                      if (entry._class.includes("ical_today")) _color = "color:red;";
                      else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                      else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
              
                      var _bgcolor = "";
                      if(calendar.name == "Müll") {
                          if(entry.event == "Bio Tonne") {
                              _bgcolor = "#a0e878";
                              _color="color:#a0e878";
                          }
                          else if(entry.event == "Restmüll Tonne") {
                              _bgcolor = "#ce6f6f"; 
                              _color="color:#ce6f6f";
                          }
                          else if(entry.event == "Blaue Tonne") {
                              _bgcolor = "#508fdc";
                              _color="color:#508fdc";
                          }
                          else if(entry.event == "Gelbe Tonne") {
                              _bgcolor = "#eee06d";
                              _color="color:#eee06d";
                          }
                      }
                      else _bgcolor = calendar.color;
                      
                      if (balken === false) _bgcolor = "";
                      
                      if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                      else html+="<tr>";
              
                          var abstand = "15px;";
                          if (balken === false) abstand = "3px;";
                          html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
              
                      if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                          html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                      } else {
                          html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                      }
                      html+="</tr>";
                  }
              
                  html+="</body></table>";    
                  setState(idCalHTMLtable, html);    
              }
              
              function getFormattedDate(date) {
                  var month = (1 + date.getMonth()).toString();
                  month = month.length > 1 ? month : '0' + month;
                  var day = date.getDate().toString();
                  day = day.length > 1 ? day : '0' + day;
                  return day + '.' + month + '.';
              }
              
              on({id: idCalTable, change: "ne"}, function (obj) {
                  iCalToHTMLTable();
              });
              
              iCalToHTMLTable();
              
              
              S Offline
              S Offline
              sit-in
              schrieb am zuletzt editiert von
              #83

              @bahnuhr

              Hallo Zusammen,
              Ich habe versucht die Farben zu ändern, aber ich stehe auf dem Schlauch... Ich weiß nicht wo der Fehler liegt, aber die Farben werden nicht geändert...

              Ich habe das Script kopiert (Welches als 2. Post in diesem Thread vorhanden ist):
              607017c0-bb80-4cbd-b44b-3b0be52641dc-grafik.png

              und folgende Farben eingestellt:
              4611cbb9-0b78-4d06-a490-02dee857fbdd-grafik.png

              Anschließend habe ich einen Datenpunkt angelegt:
              1cdac161-f738-4b33-b83f-bb9e6d72498a-grafik.png

              Und das ganze in die Vis eingebunden über Widget "Basic String (unescaped):
              8f161b7d-871c-493f-a037-511faf252146-grafik.png

              Meine Einstellungen in ical sehen so aus:
              771df191-b962-44ce-895a-7bfeeb7d8476-grafik.png

              Wo ist mein Fehler, dass die Farben nicht auf Orange (meine Testfarbe um Änderungen zu sehen) geändert werden?

              Ich freue mich auf Eure Hilfe!

              bahnuhrB 1 Antwort Letzte Antwort
              0
              • S sit-in

                @bahnuhr

                Hallo Zusammen,
                Ich habe versucht die Farben zu ändern, aber ich stehe auf dem Schlauch... Ich weiß nicht wo der Fehler liegt, aber die Farben werden nicht geändert...

                Ich habe das Script kopiert (Welches als 2. Post in diesem Thread vorhanden ist):
                607017c0-bb80-4cbd-b44b-3b0be52641dc-grafik.png

                und folgende Farben eingestellt:
                4611cbb9-0b78-4d06-a490-02dee857fbdd-grafik.png

                Anschließend habe ich einen Datenpunkt angelegt:
                1cdac161-f738-4b33-b83f-bb9e6d72498a-grafik.png

                Und das ganze in die Vis eingebunden über Widget "Basic String (unescaped):
                8f161b7d-871c-493f-a037-511faf252146-grafik.png

                Meine Einstellungen in ical sehen so aus:
                771df191-b962-44ce-895a-7bfeeb7d8476-grafik.png

                Wo ist mein Fehler, dass die Farben nicht auf Orange (meine Testfarbe um Änderungen zu sehen) geändert werden?

                Ich freue mich auf Eure Hilfe!

                bahnuhrB Online
                bahnuhrB Online
                bahnuhr
                Forum Testing Most Active
                schrieb am zuletzt editiert von
                #84

                @sit-in
                Script in code tags.
                So kann man gar nichts beurteilen.

                https://forum.iobroker.net/topic/51555/hinweise-für-gute-forenbeiträge/1


                Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                Danke.
                gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                ScreenToGif :https://www.screentogif.com/downloads.html

                S 1 Antwort Letzte Antwort
                0
                • bahnuhrB bahnuhr

                  @sit-in
                  Script in code tags.
                  So kann man gar nichts beurteilen.

                  https://forum.iobroker.net/topic/51555/hinweise-für-gute-forenbeiträge/1

                  S Offline
                  S Offline
                  sit-in
                  schrieb am zuletzt editiert von
                  #85

                  @bahnuhr

                  Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema :)
                  Nur, dass ich die Farbe zu orange geändert habe.

                  bahnuhrB liv-in-skyL 4 Antworten Letzte Antwort
                  0
                  • S sit-in

                    @bahnuhr

                    Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema :)
                    Nur, dass ich die Farbe zu orange geändert habe.

                    bahnuhrB Online
                    bahnuhrB Online
                    bahnuhr
                    Forum Testing Most Active
                    schrieb am zuletzt editiert von
                    #86

                    @sit-in sagte in ical Kalender Farben anpassen?:

                    Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema

                    Wenn das so ist, dann klappt es auch.

                    Dann musst du halt irgendwas anderes gemacht haben.


                    Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                    Danke.
                    gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                    ScreenToGif :https://www.screentogif.com/downloads.html

                    1 Antwort Letzte Antwort
                    0
                    • S sit-in

                      @bahnuhr

                      Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema :)
                      Nur, dass ich die Farbe zu orange geändert habe.

                      bahnuhrB Online
                      bahnuhrB Online
                      bahnuhr
                      Forum Testing Most Active
                      schrieb am zuletzt editiert von
                      #87

                      @sit-in
                      877a21f5-47af-4599-8f59-2e1001c20b6f-image.png

                      das kann mit sicherheit nicht stimmen.

                      Hier muss natürlich der DP rein, in dem du das neue schreibst.


                      Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                      Danke.
                      gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                      ScreenToGif :https://www.screentogif.com/downloads.html

                      1 Antwort Letzte Antwort
                      0
                      • S sit-in

                        @bahnuhr

                        Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema :)
                        Nur, dass ich die Farbe zu orange geändert habe.

                        bahnuhrB Online
                        bahnuhrB Online
                        bahnuhr
                        Forum Testing Most Active
                        schrieb am zuletzt editiert von
                        #88

                        @sit-in sagte in ical Kalender Farben anpassen?:

                        Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema

                        Und das kann auch nicht sein.
                        Denn dein DP ist anders.
                        Also musst du zumindest diesen mal anpassen.


                        Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                        Danke.
                        gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                        ScreenToGif :https://www.screentogif.com/downloads.html

                        S 1 Antwort Letzte Antwort
                        0
                        • S sit-in

                          @bahnuhr

                          Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema :)
                          Nur, dass ich die Farbe zu orange geändert habe.

                          liv-in-skyL Offline
                          liv-in-skyL Offline
                          liv-in-sky
                          schrieb am zuletzt editiert von
                          #89

                          @sit-in das ganze gibt es auch in einer anderen art zum anzeigen der ical instanzen

                          https://forum.iobroker.net/topic/40691/html-tabelle-für-ical-adapter-mehrere-instanzen?page=1

                          nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                          S 1 Antwort Letzte Antwort
                          0
                          • bahnuhrB bahnuhr

                            @sit-in sagte in ical Kalender Farben anpassen?:

                            Es ist 1 zu 1 Dein Code aus dem 2. Beitrag in diesem Thema

                            Und das kann auch nicht sein.
                            Denn dein DP ist anders.
                            Also musst du zumindest diesen mal anpassen.

                            S Offline
                            S Offline
                            sit-in
                            schrieb am zuletzt editiert von sit-in
                            #90

                            @bahnuhr Ich habe nun noch einmal das ganze thema durch gelesen und probiert...

                            Aktueller Stand:

                            1. Letztes Script von Dir, Bahnuhr, eingesetzt:
                            // Script stammt von uhula und sputnik
                            
                            // Das Script greift auf die ical.0.html zu und ändert den Text.
                            
                            // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                            
                            // Geändert und erweitert in 12/2017 von bahnuhr
                            
                             
                            
                             
                            
                            var idCal = "ical.0";
                            
                            var idCalTrigger   = idCal + ".data.trigger";
                            
                            var idCalTable     = idCal + ".data.table";
                            
                            var idCalHTML      = idCal + ".data.html";
                            
                            var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                            
                             
                            
                            var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                            
                            var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                            
                            var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                            
                            var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                            
                             
                            
                            function iCalToHTMLTable() {
                            
                               var html     = "<table style='font-size:0.9em;'><tbody>";
                            
                               var calTable = JSON.parse(getState(idCalTable).val);
                            
                               var inst     = getObject("system.adapter."+idCal);
                            
                               var instopt  = inst.native;
                            
                               var calendar = {};
                            
                             
                            
                               for (var i = 0; i < calTable.length; i++) { 
                            
                                   log (calTable[i]);
                            
                                   var entry = calTable[i];
                            
                                   var _date = new Date(entry._date);
                            
                                   var _time = "";
                            
                             
                            
                             
                            
                                   // "_time und date" Variable festlegen
                            
                                   log (entry);
                            
                                   if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                            
                                       if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                            
                                           _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                            
                                           entry.date = Datum_holen("tm");
                            
                                       } else {
                            
                                           _time= "ganzer Tag";
                            
                                           entry.date = Datum_holen("tm");
                            
                                       }
                            
                                   } else {                                    // Pfeil ist nicht enthalten
                            
                                       if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                            
                                           _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                            
                                       } else {
                            
                                           _time= "ganzer Tag";
                            
                                       }
                            
                                       entry.date = getFormattedDate(_date);
                            
                                   }
                            
                             
                            
                             
                            
                                   if ( entry._calName != calendar.name ) {
                            
                                       calendar = {};
                            
                                       for (var c = 0; c < instopt.calendars.length; c++ ) {
                            
                                           if (entry._calName == instopt.calendars[c].name ) {
                            
                                               calendar = instopt.calendars[c];
                            
                                               break;
                            
                                           }
                            
                                       }
                            
                                   }
                            
                             
                            
                                   var _color = "color:"+calendar.color;
                            
                                   if (entry._class.includes("ical_today")) _color = "color:red;";
                            
                                   else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                            
                                   else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                            
                             
                            
                                   var _bgcolor = "";
                            
                                   if(calendar.name == "Müll") {
                            
                                       if(entry.event == "Bio Tonne") {
                            
                                           _bgcolor = "#a0e878";
                            
                                           _color="color:#a0e878";
                            
                                       }
                            
                                       else if(entry.event == "Restmüll Tonne") {
                            
                                           _bgcolor = "#ce6f6f"; 
                            
                                           _color="color:#ce6f6f";
                            
                                       }
                            
                                       else if(entry.event == "Blaue Tonne") {
                            
                                           _bgcolor = "#508fdc";
                            
                                           _color="color:#508fdc";
                            
                                       }
                            
                                       else if(entry.event == "Gelbe Tonne") {
                            
                                           _bgcolor = "#eee06d";
                            
                                           _color="color:#eee06d";
                            
                                       }
                            
                                   }
                            
                                   else _bgcolor = calendar.color;
                            
                                   
                            
                                   if (balken === false) _bgcolor = "";
                            
                                   
                            
                                   if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                            
                                   else html+="<tr>";
                            
                             
                            
                            if (i>0 && (abstand_zwischen_Tagen == true)){
                            
                                       if (calTable[i].date != calTable[i-1].date){
                            
                                           html+="<tr><td></td></tr>";
                            
                                           html+="<tr><td></td></tr>";
                            
                                           html+="<tr><td></td></tr>";
                            
                                           html+="<tr><td></td></tr>";    
                            
                                       }
                            
                                   }
                            
                             
                            
                                       var abstand = "15px;";
                            
                                       if (balken === false) abstand = "3px;";
                            
                                       html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                            
                             
                            
                                   if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                            
                                       html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                            
                                   } else {
                            
                                       html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                            
                                   }
                            
                                   html+="</tr>";
                            
                               }
                            
                             
                            
                               html+="</body></table>";    
                            
                               setState(idCalHTMLtable, html);    
                            
                            }
                            
                             
                            
                            function getFormattedDate(date) {
                            
                               var month = (1 + date.getMonth()).toString();
                            
                               month = month.length > 1 ? month : '0' + month;
                            
                               var day = date.getDate().toString();
                            
                               day = day.length > 1 ? day : '0' + day;
                            
                               return day + '.' + month + '.';
                            
                            }
                            
                             
                            
                            on({id: idCalTable, change: "ne"}, function (obj) {
                            
                               iCalToHTMLTable();
                            
                            });
                            
                             
                            
                            iCalToHTMLTable();
                            
                             
                            
                             
                            
                            // als CSS einfügen ------------------------------------------------------------------
                            
                            /*
                            
                            .icalWarn { font-weight:normal; }
                            
                            .icalWarn2  { color:red; }
                            
                            .icalPreWarn { font-weight:normal; }
                            
                            .icalPreWarn2  { color:orange; }
                            
                            .icalPrePreWarn { font-weight:normal; }
                            
                            .icalPrePreWarn2  { color:yellow; }
                            
                            .icalNormal { font-weight:normal; }
                            
                            {1}
                            
                            .icalNormal.iCal-Müll {
                            
                               font-weight:normal;
                            
                               color:#f87149;
                            
                            }
                            
                            .icalNormal.iCal-Märkte {
                            
                               font-weight:normal;
                            
                               color:#bc7dd8;
                            
                            }
                            
                            */
                            
                             
                            
                             
                            
                            

                            Datenpunkt über ein extra script erzeugt:

                            createState('javascript.0.Sonstige.Ical.html', '', {type: 'string',name: 'ical_geändert',read: true,write: true,role: 'per Script'}); 
                            

                            Die Scripte heißen bei mir so:

                            464a23d9-37ac-44ac-b527-7d7ba96523cc-grafik.png

                            Der Datenpunkt ist vorhanden/wurde durch das Script erstellt:
                            c72a3ce6-7477-4fdc-8f29-befe20babd97-grafik.png

                            Datenpunkt auch in der Vis bzw. im Widget "Basic - String (unescaped" verknüpft. Dennoch wird nichts angezeigt:
                            57c552b7-2569-4ab0-bec4-fdf54af0e2a0-grafik.png

                            Was mir auch auffällt sind die Fehler, die mir unterhalb des Scripts angezeigt werden:
                            011edc5a-2e00-44b5-af76-528efc1e89df-grafik.png

                            Ich probiere seit gestern nun schon seit einigen Stunden hin- und her... Dennoch komme ich nicht auf die Lösung und finde den Fehler nicht... -.-

                            bahnuhrB 2 Antworten Letzte Antwort
                            0
                            • liv-in-skyL liv-in-sky

                              @sit-in das ganze gibt es auch in einer anderen art zum anzeigen der ical instanzen

                              https://forum.iobroker.net/topic/40691/html-tabelle-für-ical-adapter-mehrere-instanzen?page=1

                              S Offline
                              S Offline
                              sit-in
                              schrieb am zuletzt editiert von
                              #91

                              @liv-in-sky Danke, aber ich würde vorerst lieber bei diesem Thema bleiben und versuchen dieses am Laufen zu bekommen. :)

                              1 Antwort Letzte Antwort
                              0
                              • S sit-in

                                @bahnuhr Ich habe nun noch einmal das ganze thema durch gelesen und probiert...

                                Aktueller Stand:

                                1. Letztes Script von Dir, Bahnuhr, eingesetzt:
                                // Script stammt von uhula und sputnik
                                
                                // Das Script greift auf die ical.0.html zu und ändert den Text.
                                
                                // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                                
                                // Geändert und erweitert in 12/2017 von bahnuhr
                                
                                 
                                
                                 
                                
                                var idCal = "ical.0";
                                
                                var idCalTrigger   = idCal + ".data.trigger";
                                
                                var idCalTable     = idCal + ".data.table";
                                
                                var idCalHTML      = idCal + ".data.html";
                                
                                var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                                
                                 
                                
                                var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                                
                                var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                                
                                var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                                
                                var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                                
                                 
                                
                                function iCalToHTMLTable() {
                                
                                   var html     = "<table style='font-size:0.9em;'><tbody>";
                                
                                   var calTable = JSON.parse(getState(idCalTable).val);
                                
                                   var inst     = getObject("system.adapter."+idCal);
                                
                                   var instopt  = inst.native;
                                
                                   var calendar = {};
                                
                                 
                                
                                   for (var i = 0; i < calTable.length; i++) { 
                                
                                       log (calTable[i]);
                                
                                       var entry = calTable[i];
                                
                                       var _date = new Date(entry._date);
                                
                                       var _time = "";
                                
                                 
                                
                                 
                                
                                       // "_time und date" Variable festlegen
                                
                                       log (entry);
                                
                                       if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                                
                                           if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                
                                               _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                                
                                               entry.date = Datum_holen("tm");
                                
                                           } else {
                                
                                               _time= "ganzer Tag";
                                
                                               entry.date = Datum_holen("tm");
                                
                                           }
                                
                                       } else {                                    // Pfeil ist nicht enthalten
                                
                                           if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                
                                               _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                                
                                           } else {
                                
                                               _time= "ganzer Tag";
                                
                                           }
                                
                                           entry.date = getFormattedDate(_date);
                                
                                       }
                                
                                 
                                
                                 
                                
                                       if ( entry._calName != calendar.name ) {
                                
                                           calendar = {};
                                
                                           for (var c = 0; c < instopt.calendars.length; c++ ) {
                                
                                               if (entry._calName == instopt.calendars[c].name ) {
                                
                                                   calendar = instopt.calendars[c];
                                
                                                   break;
                                
                                               }
                                
                                           }
                                
                                       }
                                
                                 
                                
                                       var _color = "color:"+calendar.color;
                                
                                       if (entry._class.includes("ical_today")) _color = "color:red;";
                                
                                       else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                                
                                       else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                                
                                 
                                
                                       var _bgcolor = "";
                                
                                       if(calendar.name == "Müll") {
                                
                                           if(entry.event == "Bio Tonne") {
                                
                                               _bgcolor = "#a0e878";
                                
                                               _color="color:#a0e878";
                                
                                           }
                                
                                           else if(entry.event == "Restmüll Tonne") {
                                
                                               _bgcolor = "#ce6f6f"; 
                                
                                               _color="color:#ce6f6f";
                                
                                           }
                                
                                           else if(entry.event == "Blaue Tonne") {
                                
                                               _bgcolor = "#508fdc";
                                
                                               _color="color:#508fdc";
                                
                                           }
                                
                                           else if(entry.event == "Gelbe Tonne") {
                                
                                               _bgcolor = "#eee06d";
                                
                                               _color="color:#eee06d";
                                
                                           }
                                
                                       }
                                
                                       else _bgcolor = calendar.color;
                                
                                       
                                
                                       if (balken === false) _bgcolor = "";
                                
                                       
                                
                                       if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                                
                                       else html+="<tr>";
                                
                                 
                                
                                if (i>0 && (abstand_zwischen_Tagen == true)){
                                
                                           if (calTable[i].date != calTable[i-1].date){
                                
                                               html+="<tr><td></td></tr>";
                                
                                               html+="<tr><td></td></tr>";
                                
                                               html+="<tr><td></td></tr>";
                                
                                               html+="<tr><td></td></tr>";    
                                
                                           }
                                
                                       }
                                
                                 
                                
                                           var abstand = "15px;";
                                
                                           if (balken === false) abstand = "3px;";
                                
                                           html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                                
                                 
                                
                                       if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                                
                                           html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                                
                                       } else {
                                
                                           html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                                
                                       }
                                
                                       html+="</tr>";
                                
                                   }
                                
                                 
                                
                                   html+="</body></table>";    
                                
                                   setState(idCalHTMLtable, html);    
                                
                                }
                                
                                 
                                
                                function getFormattedDate(date) {
                                
                                   var month = (1 + date.getMonth()).toString();
                                
                                   month = month.length > 1 ? month : '0' + month;
                                
                                   var day = date.getDate().toString();
                                
                                   day = day.length > 1 ? day : '0' + day;
                                
                                   return day + '.' + month + '.';
                                
                                }
                                
                                 
                                
                                on({id: idCalTable, change: "ne"}, function (obj) {
                                
                                   iCalToHTMLTable();
                                
                                });
                                
                                 
                                
                                iCalToHTMLTable();
                                
                                 
                                
                                 
                                
                                // als CSS einfügen ------------------------------------------------------------------
                                
                                /*
                                
                                .icalWarn { font-weight:normal; }
                                
                                .icalWarn2  { color:red; }
                                
                                .icalPreWarn { font-weight:normal; }
                                
                                .icalPreWarn2  { color:orange; }
                                
                                .icalPrePreWarn { font-weight:normal; }
                                
                                .icalPrePreWarn2  { color:yellow; }
                                
                                .icalNormal { font-weight:normal; }
                                
                                {1}
                                
                                .icalNormal.iCal-Müll {
                                
                                   font-weight:normal;
                                
                                   color:#f87149;
                                
                                }
                                
                                .icalNormal.iCal-Märkte {
                                
                                   font-weight:normal;
                                
                                   color:#bc7dd8;
                                
                                }
                                
                                */
                                
                                 
                                
                                 
                                
                                

                                Datenpunkt über ein extra script erzeugt:

                                createState('javascript.0.Sonstige.Ical.html', '', {type: 'string',name: 'ical_geändert',read: true,write: true,role: 'per Script'}); 
                                

                                Die Scripte heißen bei mir so:

                                464a23d9-37ac-44ac-b527-7d7ba96523cc-grafik.png

                                Der Datenpunkt ist vorhanden/wurde durch das Script erstellt:
                                c72a3ce6-7477-4fdc-8f29-befe20babd97-grafik.png

                                Datenpunkt auch in der Vis bzw. im Widget "Basic - String (unescaped" verknüpft. Dennoch wird nichts angezeigt:
                                57c552b7-2569-4ab0-bec4-fdf54af0e2a0-grafik.png

                                Was mir auch auffällt sind die Fehler, die mir unterhalb des Scripts angezeigt werden:
                                011edc5a-2e00-44b5-af76-528efc1e89df-grafik.png

                                Ich probiere seit gestern nun schon seit einigen Stunden hin- und her... Dennoch komme ich nicht auf die Lösung und finde den Fehler nicht... -.-

                                bahnuhrB Online
                                bahnuhrB Online
                                bahnuhr
                                Forum Testing Most Active
                                schrieb am zuletzt editiert von bahnuhr
                                #92

                                @sit-in

                                hier nochmal das aktuelle Script was bei mir läuft:

                                
                                // Script stammt von uhula und sputnik
                                // Das Script greift auf die ical.0.html zu und ändert den Text.
                                // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                                // Geändert und erweitert in 12/2017 von bahnuhr
                                
                                
                                var idCal = "ical.0";
                                var idCalTrigger   = idCal + ".data.trigger";
                                var idCalTable     = idCal + ".data.table";
                                var idCalHTML      = idCal + ".data.html";
                                var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                                var logging = false;
                                
                                var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                                var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                                var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                                var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                                
                                function iCalToHTMLTable() {
                                    var html     = "<table style='font-size:0.9em;'><tbody>";
                                    var calTable = getState(idCalTable).val;
                                    var inst     = getObject("system.adapter."+idCal);
                                    var instopt  = inst.native;
                                    var calendar = {};
                                
                                    for (var i = 0; i < calTable.length; i++) { 
                                        if (logging) log (calTable[i]);
                                        var entry = calTable[i];
                                        var _date = new Date(entry._date);
                                        var _time = "";
                                
                                
                                        // "_time und date" Variable festlegen
                                        if (logging) log (entry);
                                        if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                                            if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                                                entry.date = Datum_holen("tm");
                                            } else {
                                                _time= "ganzer Tag";
                                                entry.date = Datum_holen("tm");
                                            }
                                        } else {                                    // Pfeil ist nicht enthalten
                                            if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                                            } else {
                                                _time= "ganzer Tag";
                                            }
                                            entry.date = getFormattedDate(_date);
                                        }
                                
                                
                                        if ( entry._calName != calendar.name ) {
                                            calendar = {};
                                            for (var c = 0; c < instopt.calendars.length; c++ ) {
                                                if (entry._calName == instopt.calendars[c].name ) {
                                                    calendar = instopt.calendars[c];
                                                    break;
                                                }
                                            }
                                        }
                                
                                        var _color = "color:"+calendar.color;
                                        if (entry._class.includes("ical_today")) _color = "color:red;";
                                        else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                                        else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                                
                                        var _bgcolor = "";
                                        if(calendar.name == "Müll") {
                                            if(entry.event == "Bio Tonne") {
                                                _bgcolor = "#a0e878";
                                                _color="color:#a0e878";
                                            }
                                            else if(entry.event == "Restmüll Tonne") {
                                                _bgcolor = "#ce6f6f"; 
                                                _color="color:#ce6f6f";
                                            }
                                            else if(entry.event == "Blaue Tonne") {
                                                _bgcolor = "#508fdc";
                                                _color="color:#508fdc";
                                            }
                                            else if(entry.event == "Gelbe Tonne") {
                                                _bgcolor = "#eee06d";
                                                _color="color:#eee06d";
                                            }
                                        }
                                        else _bgcolor = calendar.color;
                                        
                                        if (balken === false) _bgcolor = "";
                                        
                                        if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                                        else html+="<tr>";
                                
                                if (i>0 && (abstand_zwischen_Tagen == true)){
                                            if (calTable[i].date != calTable[i-1].date){
                                                html+="<tr><td></td></tr>";
                                                html+="<tr><td></td></tr>";
                                                html+="<tr><td></td></tr>";
                                                html+="<tr><td></td></tr>";    
                                            }
                                        }
                                
                                            var abstand = "15px;";
                                            if (balken === false) abstand = "3px;";
                                            html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                                
                                        if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                                            html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                                        } else {
                                            html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                                        }
                                        html+="</tr>";
                                    }
                                
                                    html+="</body></table>";    
                                    setState(idCalHTMLtable, html);    
                                }
                                
                                function getFormattedDate(date) {
                                    var month = (1 + date.getMonth()).toString();
                                    month = month.length > 1 ? month : '0' + month;
                                    var day = date.getDate().toString();
                                    day = day.length > 1 ? day : '0' + day;
                                    return day + '.' + month + '.';
                                }
                                
                                on({id: idCalTable, change: "ne"}, function (obj) {
                                    iCalToHTMLTable();
                                });
                                
                                iCalToHTMLTable();
                                
                                
                                
                                

                                Und dies als globales Script oder unten drunter setzen:

                                
                                // globale Variablen
                                
                                // Tag, Monat, Jahr -> aktuelles Datum als String               -> Aufruf der Funktion mit:   Datum_holen("tmj") oder Datum_holen("tm") oder Datum_holen("lang")
                                function Datum_holen(x) {
                                    var vTag = new Date().getDate(),
                                        vMonat = new Date().getMonth()+1,
                                        vJahr = new Date().getFullYear();
                                    if (vTag < 10) {vTag = "0" + vTag}
                                    if (vMonat < 10) {vMonat = "0" + vMonat}
                                    var sDatum_tmj = vTag + "." + vMonat + "." + vJahr.toString().substr(2,2);  // String mit Tag + Monat + Jahr (Jahr mit 2 Stellen)
                                    var sDatum_tm = vTag + "." + vMonat + ".";  // String mit Tag + Monat 
                                    var sDatum_lang = vTag + "." + vMonat + "." + vJahr;  // String mit Tag + Monat + Jahr (Jahr mit 4 Stellen)
                                
                                    if (x === "tmj") {
                                        return(sDatum_tmj);
                                    } else if (x === "tm") {
                                        return(sDatum_tm);
                                    } else {
                                        return(sDatum_lang);
                                    }
                                }
                                
                                // Stunde, Minute -> aktuelle Uhrzeit als String                 -> Aufruf der Funktion mit:   Zeit_holen("hms") oder Zeit_holen("hm")
                                function Zeit_holen(x) {
                                    var vStunde = new Date().getHours(),
                                        vMinute = new Date().getMinutes(),
                                        vSekunde = new Date().getSeconds();
                                    if (vMinute <10) {vMinute = "0" + vMinute}
                                    if (vSekunde <10) {vSekunde = "0" + vSekunde}
                                    var sZeit_hms = vStunde + ":" + vMinute + ":" + vSekunde;  // String mit Stunde + Minute + Sekunde
                                    var sZeit_hm = vStunde + ":" + vMinute;    // String mit Stunde + Minute 
                                    if (x === "hms") {
                                        return(sZeit_hms);
                                    } else {
                                        return(sZeit_hm);
                                    }
                                }
                                
                                

                                und jede zeile dann mal vergleichen.


                                Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                                Danke.
                                gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                                ScreenToGif :https://www.screentogif.com/downloads.html

                                S T Skyx3S E 4 Antworten Letzte Antwort
                                2
                                • S sit-in

                                  @bahnuhr Ich habe nun noch einmal das ganze thema durch gelesen und probiert...

                                  Aktueller Stand:

                                  1. Letztes Script von Dir, Bahnuhr, eingesetzt:
                                  // Script stammt von uhula und sputnik
                                  
                                  // Das Script greift auf die ical.0.html zu und ändert den Text.
                                  
                                  // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                                  
                                  // Geändert und erweitert in 12/2017 von bahnuhr
                                  
                                   
                                  
                                   
                                  
                                  var idCal = "ical.0";
                                  
                                  var idCalTrigger   = idCal + ".data.trigger";
                                  
                                  var idCalTable     = idCal + ".data.table";
                                  
                                  var idCalHTML      = idCal + ".data.html";
                                  
                                  var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                                  
                                   
                                  
                                  var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                                  
                                  var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                                  
                                  var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                                  
                                  var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                                  
                                   
                                  
                                  function iCalToHTMLTable() {
                                  
                                     var html     = "<table style='font-size:0.9em;'><tbody>";
                                  
                                     var calTable = JSON.parse(getState(idCalTable).val);
                                  
                                     var inst     = getObject("system.adapter."+idCal);
                                  
                                     var instopt  = inst.native;
                                  
                                     var calendar = {};
                                  
                                   
                                  
                                     for (var i = 0; i < calTable.length; i++) { 
                                  
                                         log (calTable[i]);
                                  
                                         var entry = calTable[i];
                                  
                                         var _date = new Date(entry._date);
                                  
                                         var _time = "";
                                  
                                   
                                  
                                   
                                  
                                         // "_time und date" Variable festlegen
                                  
                                         log (entry);
                                  
                                         if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                                  
                                             if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                  
                                                 _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                                  
                                                 entry.date = Datum_holen("tm");
                                  
                                             } else {
                                  
                                                 _time= "ganzer Tag";
                                  
                                                 entry.date = Datum_holen("tm");
                                  
                                             }
                                  
                                         } else {                                    // Pfeil ist nicht enthalten
                                  
                                             if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                  
                                                 _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                                  
                                             } else {
                                  
                                                 _time= "ganzer Tag";
                                  
                                             }
                                  
                                             entry.date = getFormattedDate(_date);
                                  
                                         }
                                  
                                   
                                  
                                   
                                  
                                         if ( entry._calName != calendar.name ) {
                                  
                                             calendar = {};
                                  
                                             for (var c = 0; c < instopt.calendars.length; c++ ) {
                                  
                                                 if (entry._calName == instopt.calendars[c].name ) {
                                  
                                                     calendar = instopt.calendars[c];
                                  
                                                     break;
                                  
                                                 }
                                  
                                             }
                                  
                                         }
                                  
                                   
                                  
                                         var _color = "color:"+calendar.color;
                                  
                                         if (entry._class.includes("ical_today")) _color = "color:red;";
                                  
                                         else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                                  
                                         else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                                  
                                   
                                  
                                         var _bgcolor = "";
                                  
                                         if(calendar.name == "Müll") {
                                  
                                             if(entry.event == "Bio Tonne") {
                                  
                                                 _bgcolor = "#a0e878";
                                  
                                                 _color="color:#a0e878";
                                  
                                             }
                                  
                                             else if(entry.event == "Restmüll Tonne") {
                                  
                                                 _bgcolor = "#ce6f6f"; 
                                  
                                                 _color="color:#ce6f6f";
                                  
                                             }
                                  
                                             else if(entry.event == "Blaue Tonne") {
                                  
                                                 _bgcolor = "#508fdc";
                                  
                                                 _color="color:#508fdc";
                                  
                                             }
                                  
                                             else if(entry.event == "Gelbe Tonne") {
                                  
                                                 _bgcolor = "#eee06d";
                                  
                                                 _color="color:#eee06d";
                                  
                                             }
                                  
                                         }
                                  
                                         else _bgcolor = calendar.color;
                                  
                                         
                                  
                                         if (balken === false) _bgcolor = "";
                                  
                                         
                                  
                                         if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                                  
                                         else html+="<tr>";
                                  
                                   
                                  
                                  if (i>0 && (abstand_zwischen_Tagen == true)){
                                  
                                             if (calTable[i].date != calTable[i-1].date){
                                  
                                                 html+="<tr><td></td></tr>";
                                  
                                                 html+="<tr><td></td></tr>";
                                  
                                                 html+="<tr><td></td></tr>";
                                  
                                                 html+="<tr><td></td></tr>";    
                                  
                                             }
                                  
                                         }
                                  
                                   
                                  
                                             var abstand = "15px;";
                                  
                                             if (balken === false) abstand = "3px;";
                                  
                                             html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                                  
                                   
                                  
                                         if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                                  
                                             html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                                  
                                         } else {
                                  
                                             html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                                  
                                         }
                                  
                                         html+="</tr>";
                                  
                                     }
                                  
                                   
                                  
                                     html+="</body></table>";    
                                  
                                     setState(idCalHTMLtable, html);    
                                  
                                  }
                                  
                                   
                                  
                                  function getFormattedDate(date) {
                                  
                                     var month = (1 + date.getMonth()).toString();
                                  
                                     month = month.length > 1 ? month : '0' + month;
                                  
                                     var day = date.getDate().toString();
                                  
                                     day = day.length > 1 ? day : '0' + day;
                                  
                                     return day + '.' + month + '.';
                                  
                                  }
                                  
                                   
                                  
                                  on({id: idCalTable, change: "ne"}, function (obj) {
                                  
                                     iCalToHTMLTable();
                                  
                                  });
                                  
                                   
                                  
                                  iCalToHTMLTable();
                                  
                                   
                                  
                                   
                                  
                                  // als CSS einfügen ------------------------------------------------------------------
                                  
                                  /*
                                  
                                  .icalWarn { font-weight:normal; }
                                  
                                  .icalWarn2  { color:red; }
                                  
                                  .icalPreWarn { font-weight:normal; }
                                  
                                  .icalPreWarn2  { color:orange; }
                                  
                                  .icalPrePreWarn { font-weight:normal; }
                                  
                                  .icalPrePreWarn2  { color:yellow; }
                                  
                                  .icalNormal { font-weight:normal; }
                                  
                                  {1}
                                  
                                  .icalNormal.iCal-Müll {
                                  
                                     font-weight:normal;
                                  
                                     color:#f87149;
                                  
                                  }
                                  
                                  .icalNormal.iCal-Märkte {
                                  
                                     font-weight:normal;
                                  
                                     color:#bc7dd8;
                                  
                                  }
                                  
                                  */
                                  
                                   
                                  
                                   
                                  
                                  

                                  Datenpunkt über ein extra script erzeugt:

                                  createState('javascript.0.Sonstige.Ical.html', '', {type: 'string',name: 'ical_geändert',read: true,write: true,role: 'per Script'}); 
                                  

                                  Die Scripte heißen bei mir so:

                                  464a23d9-37ac-44ac-b527-7d7ba96523cc-grafik.png

                                  Der Datenpunkt ist vorhanden/wurde durch das Script erstellt:
                                  c72a3ce6-7477-4fdc-8f29-befe20babd97-grafik.png

                                  Datenpunkt auch in der Vis bzw. im Widget "Basic - String (unescaped" verknüpft. Dennoch wird nichts angezeigt:
                                  57c552b7-2569-4ab0-bec4-fdf54af0e2a0-grafik.png

                                  Was mir auch auffällt sind die Fehler, die mir unterhalb des Scripts angezeigt werden:
                                  011edc5a-2e00-44b5-af76-528efc1e89df-grafik.png

                                  Ich probiere seit gestern nun schon seit einigen Stunden hin- und her... Dennoch komme ich nicht auf die Lösung und finde den Fehler nicht... -.-

                                  bahnuhrB Online
                                  bahnuhrB Online
                                  bahnuhr
                                  Forum Testing Most Active
                                  schrieb am zuletzt editiert von bahnuhr
                                  #93

                                  @sit-in sagte in ical Kalender Farben anpassen?:

                                  Was mir auch auffällt sind die Fehler, die mir unterhalb des Scripts angezeigt werden:

                                  Gibt es diesen DP bei dir:
                                  66d93059-c0b7-45ef-b5ca-705822b1fcd8-image.png

                                  Denn darauf bezieht sich der Fehler.

                                  Wenn ja, was steht hinter als Wert drin.


                                  Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                                  Danke.
                                  gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                                  ScreenToGif :https://www.screentogif.com/downloads.html

                                  1 Antwort Letzte Antwort
                                  0
                                  • bahnuhrB Online
                                    bahnuhrB Online
                                    bahnuhr
                                    Forum Testing Most Active
                                    schrieb am zuletzt editiert von
                                    #94

                                    Hab gerade gesehen, dass das ja alles schon im thread drin stand.
                                    na ja, dann halt jetzt doppelt.


                                    Wenn ich helfen konnte, dann Daumen hoch (Pfeil nach oben)!
                                    Danke.
                                    gute Forenbeiträge: https://forum.iobroker.net/topic/51555/hinweise-f%C3%BCr-gute-forenbeitr%C3%A4ge
                                    ScreenToGif :https://www.screentogif.com/downloads.html

                                    1 Antwort Letzte Antwort
                                    0
                                    • bahnuhrB bahnuhr

                                      @sit-in

                                      hier nochmal das aktuelle Script was bei mir läuft:

                                      
                                      // Script stammt von uhula und sputnik
                                      // Das Script greift auf die ical.0.html zu und ändert den Text.
                                      // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                                      // Geändert und erweitert in 12/2017 von bahnuhr
                                      
                                      
                                      var idCal = "ical.0";
                                      var idCalTrigger   = idCal + ".data.trigger";
                                      var idCalTable     = idCal + ".data.table";
                                      var idCalHTML      = idCal + ".data.html";
                                      var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                                      var logging = false;
                                      
                                      var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                                      var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                                      var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                                      var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                                      
                                      function iCalToHTMLTable() {
                                          var html     = "<table style='font-size:0.9em;'><tbody>";
                                          var calTable = getState(idCalTable).val;
                                          var inst     = getObject("system.adapter."+idCal);
                                          var instopt  = inst.native;
                                          var calendar = {};
                                      
                                          for (var i = 0; i < calTable.length; i++) { 
                                              if (logging) log (calTable[i]);
                                              var entry = calTable[i];
                                              var _date = new Date(entry._date);
                                              var _time = "";
                                      
                                      
                                              // "_time und date" Variable festlegen
                                              if (logging) log (entry);
                                              if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                                                  if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                      _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                                                      entry.date = Datum_holen("tm");
                                                  } else {
                                                      _time= "ganzer Tag";
                                                      entry.date = Datum_holen("tm");
                                                  }
                                              } else {                                    // Pfeil ist nicht enthalten
                                                  if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                      _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                                                  } else {
                                                      _time= "ganzer Tag";
                                                  }
                                                  entry.date = getFormattedDate(_date);
                                              }
                                      
                                      
                                              if ( entry._calName != calendar.name ) {
                                                  calendar = {};
                                                  for (var c = 0; c < instopt.calendars.length; c++ ) {
                                                      if (entry._calName == instopt.calendars[c].name ) {
                                                          calendar = instopt.calendars[c];
                                                          break;
                                                      }
                                                  }
                                              }
                                      
                                              var _color = "color:"+calendar.color;
                                              if (entry._class.includes("ical_today")) _color = "color:red;";
                                              else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                                              else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                                      
                                              var _bgcolor = "";
                                              if(calendar.name == "Müll") {
                                                  if(entry.event == "Bio Tonne") {
                                                      _bgcolor = "#a0e878";
                                                      _color="color:#a0e878";
                                                  }
                                                  else if(entry.event == "Restmüll Tonne") {
                                                      _bgcolor = "#ce6f6f"; 
                                                      _color="color:#ce6f6f";
                                                  }
                                                  else if(entry.event == "Blaue Tonne") {
                                                      _bgcolor = "#508fdc";
                                                      _color="color:#508fdc";
                                                  }
                                                  else if(entry.event == "Gelbe Tonne") {
                                                      _bgcolor = "#eee06d";
                                                      _color="color:#eee06d";
                                                  }
                                              }
                                              else _bgcolor = calendar.color;
                                              
                                              if (balken === false) _bgcolor = "";
                                              
                                              if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                                              else html+="<tr>";
                                      
                                      if (i>0 && (abstand_zwischen_Tagen == true)){
                                                  if (calTable[i].date != calTable[i-1].date){
                                                      html+="<tr><td></td></tr>";
                                                      html+="<tr><td></td></tr>";
                                                      html+="<tr><td></td></tr>";
                                                      html+="<tr><td></td></tr>";    
                                                  }
                                              }
                                      
                                                  var abstand = "15px;";
                                                  if (balken === false) abstand = "3px;";
                                                  html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                                      
                                              if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                                                  html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                                              } else {
                                                  html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                                              }
                                              html+="</tr>";
                                          }
                                      
                                          html+="</body></table>";    
                                          setState(idCalHTMLtable, html);    
                                      }
                                      
                                      function getFormattedDate(date) {
                                          var month = (1 + date.getMonth()).toString();
                                          month = month.length > 1 ? month : '0' + month;
                                          var day = date.getDate().toString();
                                          day = day.length > 1 ? day : '0' + day;
                                          return day + '.' + month + '.';
                                      }
                                      
                                      on({id: idCalTable, change: "ne"}, function (obj) {
                                          iCalToHTMLTable();
                                      });
                                      
                                      iCalToHTMLTable();
                                      
                                      
                                      
                                      

                                      Und dies als globales Script oder unten drunter setzen:

                                      
                                      // globale Variablen
                                      
                                      // Tag, Monat, Jahr -> aktuelles Datum als String               -> Aufruf der Funktion mit:   Datum_holen("tmj") oder Datum_holen("tm") oder Datum_holen("lang")
                                      function Datum_holen(x) {
                                          var vTag = new Date().getDate(),
                                              vMonat = new Date().getMonth()+1,
                                              vJahr = new Date().getFullYear();
                                          if (vTag < 10) {vTag = "0" + vTag}
                                          if (vMonat < 10) {vMonat = "0" + vMonat}
                                          var sDatum_tmj = vTag + "." + vMonat + "." + vJahr.toString().substr(2,2);  // String mit Tag + Monat + Jahr (Jahr mit 2 Stellen)
                                          var sDatum_tm = vTag + "." + vMonat + ".";  // String mit Tag + Monat 
                                          var sDatum_lang = vTag + "." + vMonat + "." + vJahr;  // String mit Tag + Monat + Jahr (Jahr mit 4 Stellen)
                                      
                                          if (x === "tmj") {
                                              return(sDatum_tmj);
                                          } else if (x === "tm") {
                                              return(sDatum_tm);
                                          } else {
                                              return(sDatum_lang);
                                          }
                                      }
                                      
                                      // Stunde, Minute -> aktuelle Uhrzeit als String                 -> Aufruf der Funktion mit:   Zeit_holen("hms") oder Zeit_holen("hm")
                                      function Zeit_holen(x) {
                                          var vStunde = new Date().getHours(),
                                              vMinute = new Date().getMinutes(),
                                              vSekunde = new Date().getSeconds();
                                          if (vMinute <10) {vMinute = "0" + vMinute}
                                          if (vSekunde <10) {vSekunde = "0" + vSekunde}
                                          var sZeit_hms = vStunde + ":" + vMinute + ":" + vSekunde;  // String mit Stunde + Minute + Sekunde
                                          var sZeit_hm = vStunde + ":" + vMinute;    // String mit Stunde + Minute 
                                          if (x === "hms") {
                                              return(sZeit_hms);
                                          } else {
                                              return(sZeit_hm);
                                          }
                                      }
                                      
                                      

                                      und jede zeile dann mal vergleichen.

                                      S Offline
                                      S Offline
                                      sit-in
                                      schrieb am zuletzt editiert von
                                      #95

                                      @bahnuhr

                                      Mahlzeit! :)

                                      Ich habe deine Scripts nochmal eingefügt und siehe da: Es funktioniert! :)
                                      Abgesehen von den Balken, die scheinen irgendwie nur sporadisch angezeigt zu werden und sind auch immer rot, unabhängig von den anderen Farben. Aber ich habe sie einfach wieder deaktiviert.

                                      Werde nun mal noch versuchen den Müllkalendar mit einzubringen.

                                      VIELEN DANK nochmal und ein schönes Wochenende!

                                      T 1 Antwort Letzte Antwort
                                      0
                                      • S sit-in

                                        @bahnuhr

                                        Mahlzeit! :)

                                        Ich habe deine Scripts nochmal eingefügt und siehe da: Es funktioniert! :)
                                        Abgesehen von den Balken, die scheinen irgendwie nur sporadisch angezeigt zu werden und sind auch immer rot, unabhängig von den anderen Farben. Aber ich habe sie einfach wieder deaktiviert.

                                        Werde nun mal noch versuchen den Müllkalendar mit einzubringen.

                                        VIELEN DANK nochmal und ein schönes Wochenende!

                                        T Offline
                                        T Offline
                                        thorkillar
                                        schrieb am zuletzt editiert von
                                        #96

                                        Mahlzeit!
                                        Das Skript ist wirklich wunderbar und ich habe es mehrfach und auch in abgewandelter Form als Stundenplananzeige für unsere Söhne im Einsatz.

                                        Das klappt, danke Deiner Hilfe @bahnuhr, auch wunderbar.
                                        Nun habe ich nochmals eine paar Anpassungen, die ich mit meinen Kenntnissen leider nicht hin bekomme.
                                        Ich würde gern, dass das Skript Termine aus einem Kalender gruppiert und anzeigt, wie viele Tag es noch sind.
                                        Als Beispiel:

                                        Zahnarzt => in 320 Tagen
                                        Kinderarzt => Kein Termin
                                        Urlaub => in 160 Tagen

                                        1 Antwort Letzte Antwort
                                        0
                                        • bahnuhrB bahnuhr

                                          @sit-in

                                          hier nochmal das aktuelle Script was bei mir läuft:

                                          
                                          // Script stammt von uhula und sputnik
                                          // Das Script greift auf die ical.0.html zu und ändert den Text.
                                          // Gespeichert wird das geänderte Script in "javascript.0.Sonstige.ical.html"
                                          // Geändert und erweitert in 12/2017 von bahnuhr
                                          
                                          
                                          var idCal = "ical.0";
                                          var idCalTrigger   = idCal + ".data.trigger";
                                          var idCalTable     = idCal + ".data.table";
                                          var idCalHTML      = idCal + ".data.html";
                                          var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';
                                          var logging = false;
                                          
                                          var anz_ganztags = false;   // wenn true wird bei Ganztags-Terminen als time auch "ganzer Tag" angezeigt; wenn false erfolgt gar keine Anzeige
                                          var anz_time = true;        // wenn true werden die Uhrzeiten angezeigt; wenn false erfolgt gar keine Anzeige
                                          var balken = false;         // wenn true wird Balken links angezeigt; wenn false dann erfolgt keine Anzeige
                                          var abstand_zwischen_Tagen = false; // wenn true wird ein Abstand zwischen den Terminen gesetzt, wenn diese nicht am gleichen Tag stattfinden
                                          
                                          function iCalToHTMLTable() {
                                              var html     = "<table style='font-size:0.9em;'><tbody>";
                                              var calTable = getState(idCalTable).val;
                                              var inst     = getObject("system.adapter."+idCal);
                                              var instopt  = inst.native;
                                              var calendar = {};
                                          
                                              for (var i = 0; i < calTable.length; i++) { 
                                                  if (logging) log (calTable[i]);
                                                  var entry = calTable[i];
                                                  var _date = new Date(entry._date);
                                                  var _time = "";
                                          
                                          
                                                  // "_time und date" Variable festlegen
                                                  if (logging) log (entry);
                                                  if (entry.date.indexOf("&#8594") >= 0) {    // Pfeil ist enthalten
                                                      if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                          _time = "bis " + (entry.date).substring(entry.date.length-5,entry.date.length);
                                                          entry.date = Datum_holen("tm");
                                                      } else {
                                                          _time= "ganzer Tag";
                                                          entry.date = Datum_holen("tm");
                                                      }
                                                  } else {                                    // Pfeil ist nicht enthalten
                                                      if (entry.date.indexOf(":") >= 0) {         // Uhrzeit ist enthalten
                                                          _time = (entry.date).substring(entry.date.length-11,entry.date.length);
                                                      } else {
                                                          _time= "ganzer Tag";
                                                      }
                                                      entry.date = getFormattedDate(_date);
                                                  }
                                          
                                          
                                                  if ( entry._calName != calendar.name ) {
                                                      calendar = {};
                                                      for (var c = 0; c < instopt.calendars.length; c++ ) {
                                                          if (entry._calName == instopt.calendars[c].name ) {
                                                              calendar = instopt.calendars[c];
                                                              break;
                                                          }
                                                      }
                                                  }
                                          
                                                  var _color = "color:"+calendar.color;
                                                  if (entry._class.includes("ical_today")) _color = "color:red;";
                                                  else if (entry._class.includes("ical_tomorrow")) _color = "color:orange";
                                                  else if (entry._class.includes("ical_dayafter")) _color = "color:yellow";
                                          
                                                  var _bgcolor = "";
                                                  if(calendar.name == "Müll") {
                                                      if(entry.event == "Bio Tonne") {
                                                          _bgcolor = "#a0e878";
                                                          _color="color:#a0e878";
                                                      }
                                                      else if(entry.event == "Restmüll Tonne") {
                                                          _bgcolor = "#ce6f6f"; 
                                                          _color="color:#ce6f6f";
                                                      }
                                                      else if(entry.event == "Blaue Tonne") {
                                                          _bgcolor = "#508fdc";
                                                          _color="color:#508fdc";
                                                      }
                                                      else if(entry.event == "Gelbe Tonne") {
                                                          _bgcolor = "#eee06d";
                                                          _color="color:#eee06d";
                                                      }
                                                  }
                                                  else _bgcolor = calendar.color;
                                                  
                                                  if (balken === false) _bgcolor = "";
                                                  
                                                  if (_bgcolor !== "") html+="<tr style='background:transparent; background-image: linear-gradient("+_bgcolor+","+_bgcolor+"); background-size: 6px 90%; background-repeat: no-repeat;'>";
                                                  else html+="<tr>";
                                          
                                          if (i>0 && (abstand_zwischen_Tagen == true)){
                                                      if (calTable[i].date != calTable[i-1].date){
                                                          html+="<tr><td></td></tr>";
                                                          html+="<tr><td></td></tr>";
                                                          html+="<tr><td></td></tr>";
                                                          html+="<tr><td></td></tr>";    
                                                      }
                                                  }
                                          
                                                      var abstand = "15px;";
                                                      if (balken === false) abstand = "3px;";
                                                      html+="<td style='font-size:1.1em; padding-left:"+abstand+_color+"'>"+entry.date+"</td>";
                                          
                                                  if ((_time === "ganzer Tag" && anz_ganztags === false) || anz_time === false) {
                                                      html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+entry.event+"</td>";                      // nur event anzeigen
                                                  } else {
                                                      html+="<td style='font-size:1.1em; padding-left:5px;"+_color+"'>"+_time + "  " + entry.event+"</td>";       // time + event wird angezeigt
                                                  }
                                                  html+="</tr>";
                                              }
                                          
                                              html+="</body></table>";    
                                              setState(idCalHTMLtable, html);    
                                          }
                                          
                                          function getFormattedDate(date) {
                                              var month = (1 + date.getMonth()).toString();
                                              month = month.length > 1 ? month : '0' + month;
                                              var day = date.getDate().toString();
                                              day = day.length > 1 ? day : '0' + day;
                                              return day + '.' + month + '.';
                                          }
                                          
                                          on({id: idCalTable, change: "ne"}, function (obj) {
                                              iCalToHTMLTable();
                                          });
                                          
                                          iCalToHTMLTable();
                                          
                                          
                                          
                                          

                                          Und dies als globales Script oder unten drunter setzen:

                                          
                                          // globale Variablen
                                          
                                          // Tag, Monat, Jahr -> aktuelles Datum als String               -> Aufruf der Funktion mit:   Datum_holen("tmj") oder Datum_holen("tm") oder Datum_holen("lang")
                                          function Datum_holen(x) {
                                              var vTag = new Date().getDate(),
                                                  vMonat = new Date().getMonth()+1,
                                                  vJahr = new Date().getFullYear();
                                              if (vTag < 10) {vTag = "0" + vTag}
                                              if (vMonat < 10) {vMonat = "0" + vMonat}
                                              var sDatum_tmj = vTag + "." + vMonat + "." + vJahr.toString().substr(2,2);  // String mit Tag + Monat + Jahr (Jahr mit 2 Stellen)
                                              var sDatum_tm = vTag + "." + vMonat + ".";  // String mit Tag + Monat 
                                              var sDatum_lang = vTag + "." + vMonat + "." + vJahr;  // String mit Tag + Monat + Jahr (Jahr mit 4 Stellen)
                                          
                                              if (x === "tmj") {
                                                  return(sDatum_tmj);
                                              } else if (x === "tm") {
                                                  return(sDatum_tm);
                                              } else {
                                                  return(sDatum_lang);
                                              }
                                          }
                                          
                                          // Stunde, Minute -> aktuelle Uhrzeit als String                 -> Aufruf der Funktion mit:   Zeit_holen("hms") oder Zeit_holen("hm")
                                          function Zeit_holen(x) {
                                              var vStunde = new Date().getHours(),
                                                  vMinute = new Date().getMinutes(),
                                                  vSekunde = new Date().getSeconds();
                                              if (vMinute <10) {vMinute = "0" + vMinute}
                                              if (vSekunde <10) {vSekunde = "0" + vSekunde}
                                              var sZeit_hms = vStunde + ":" + vMinute + ":" + vSekunde;  // String mit Stunde + Minute + Sekunde
                                              var sZeit_hm = vStunde + ":" + vMinute;    // String mit Stunde + Minute 
                                              if (x === "hms") {
                                                  return(sZeit_hms);
                                              } else {
                                                  return(sZeit_hm);
                                              }
                                          }
                                          
                                          

                                          und jede zeile dann mal vergleichen.

                                          Skyx3S Offline
                                          Skyx3S Offline
                                          Skyx3
                                          schrieb am zuletzt editiert von Skyx3
                                          #97

                                          @bahnuhr besteht irgendwie die Möglichkeit die angezeigten Termine auf maximal 5 zu beschränken? Wie man hier in meinem Dashboard sieht, ist leider nicht für mehr Platz. Ich habe aber weder in ical noch im Skript dafür irgendeine Möglichkeit gefunden.

                                          PS: Vielen Dank für das Skript :-)
                                          Screenshot_2023-06-08-23-57-01-723.jpg

                                          bahnuhrB 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

                                          585

                                          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