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.
  • N nyuk

    @Feuersturm Zunächst vielen Dank, bei mir funktioniert es Prima. Ich finde es nur Schade, dass bei mir nur 3 Tage angezeigt werden. Es wäre schön, wenn die ersten 3 Tage mit "Heute", "Morgen" und "Übermorgen" bezeichnet werden und die restlichen Tage (>30Tage) einfach als Datum.

    Ist das irgendwie Möglich?

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

    @nyuk Hi, das sollte eigentlich schon möglich sein. Poste doch bitte einmal einen Screenshot mit den Einstellungen von deiner ical Instanz.

    Ich werde mir das Verhalten heute im Laufe des Tages bei mir auch nochmal genauer anschauen.

    1 Antwort Letzte Antwort
    0
    • N nyuk

      @Feuersturm Zunächst vielen Dank, bei mir funktioniert es Prima. Ich finde es nur Schade, dass bei mir nur 3 Tage angezeigt werden. Es wäre schön, wenn die ersten 3 Tage mit "Heute", "Morgen" und "Übermorgen" bezeichnet werden und die restlichen Tage (>30Tage) einfach als Datum.

      Ist das irgendwie Möglich?

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

      @nyuk Ich hab es gerade bei mir einmal mit dem aktuellen Skript ausprobiert. Bei den Geburtstagen habe ich das Ergebnis was du dir vorstellst:
      b800ed4d-a335-4d94-8a83-83d6f6f76d57-grafik.png
      So sehen meine Haupteinstellungen bei der entsprechenden ical Instanz aus:
      7b18d5c0-2b0c-4ec3-9671-021b895b750b-grafik.png

      T 1 Antwort Letzte Antwort
      0
      • FeuersturmF Feuersturm

        @nyuk Ich hab es gerade bei mir einmal mit dem aktuellen Skript ausprobiert. Bei den Geburtstagen habe ich das Ergebnis was du dir vorstellst:
        b800ed4d-a335-4d94-8a83-83d6f6f76d57-grafik.png
        So sehen meine Haupteinstellungen bei der entsprechenden ical Instanz aus:
        7b18d5c0-2b0c-4ec3-9671-021b895b750b-grafik.png

        T Offline
        T Offline
        Toni61
        schrieb am zuletzt editiert von Toni61
        #44

        Selbst gelöst habe verstanden das "javascript.0.ical.html" auch die Ordnerstrucktur ist und nicht der Name. Der Name ist nur html...
        Manchmal kann es so einfach sein....

        Hallo zusammen,
        irgentwie habe ich Pobleme nach der Anleitung den Kalender umzusetzen hatte erst am Anfang das Datumproblem was ich aber gelöst bekommen habe.
        Jetzt bekomme ich die Fehlermeldung:

        javascript.0	2020-11-01 10:05:35.481	warn	(12000) at script.js.common.Meine_Geräte.Kalender_Test_2:121:3
        javascript.0	2020-11-01 10:05:35.481	warn	(12000) at script.js.common.Meine_Geräte.Kalender_Test_2:118:1
        javascript.0	2020-11-01 10:05:35.481	warn	(12000) at iCalToHTMLTable (script.js.common.Meine_Geräte.Kalender_Test_2:103:5)
        javascript.0	2020-11-01 10:05:35.481	warn	(12000) at setState (/opt/iobroker/node_modules/iobroker.javascript/lib/sandbox.js:1368:20)
        javascript.0	2020-11-01 10:05:35.479	warn	(12000) State "javascript.0.Status.Ical.html" not found
        

        Wo habt ihr euren Datenpunkt erstellt und wie habt ihr ihn formatiert? Ich habe ihn zu den anderen Datenpunkten erstellt aber ohne Erfolg bzw. es wurde gleich ein Unterordner erstellt mit javascript / 0/ ical/ und dann der Datenpunkt aber dort wird mir nicht der link eingetragen.
        Ich habe die Felder als Zeichenkette formatiert und als Rolle html.

        Könnt ihr das Script sowie den Datenpunkt mal zeigen?
        Vielen Dank.

        Toni61

        FeuersturmF 1 Antwort Letzte Antwort
        0
        • T Toni61

          Selbst gelöst habe verstanden das "javascript.0.ical.html" auch die Ordnerstrucktur ist und nicht der Name. Der Name ist nur html...
          Manchmal kann es so einfach sein....

          Hallo zusammen,
          irgentwie habe ich Pobleme nach der Anleitung den Kalender umzusetzen hatte erst am Anfang das Datumproblem was ich aber gelöst bekommen habe.
          Jetzt bekomme ich die Fehlermeldung:

          javascript.0	2020-11-01 10:05:35.481	warn	(12000) at script.js.common.Meine_Geräte.Kalender_Test_2:121:3
          javascript.0	2020-11-01 10:05:35.481	warn	(12000) at script.js.common.Meine_Geräte.Kalender_Test_2:118:1
          javascript.0	2020-11-01 10:05:35.481	warn	(12000) at iCalToHTMLTable (script.js.common.Meine_Geräte.Kalender_Test_2:103:5)
          javascript.0	2020-11-01 10:05:35.481	warn	(12000) at setState (/opt/iobroker/node_modules/iobroker.javascript/lib/sandbox.js:1368:20)
          javascript.0	2020-11-01 10:05:35.479	warn	(12000) State "javascript.0.Status.Ical.html" not found
          

          Wo habt ihr euren Datenpunkt erstellt und wie habt ihr ihn formatiert? Ich habe ihn zu den anderen Datenpunkten erstellt aber ohne Erfolg bzw. es wurde gleich ein Unterordner erstellt mit javascript / 0/ ical/ und dann der Datenpunkt aber dort wird mir nicht der link eingetragen.
          Ich habe die Felder als Zeichenkette formatiert und als Rolle html.

          Könnt ihr das Script sowie den Datenpunkt mal zeigen?
          Vielen Dank.

          Toni61

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

          @Toni61 Hallo Toni, poste doch bitte mal einen Screenshot von deinen Objekten, was du dort angelegt hast.
          Zusätlich einmal aus deinem Quellcode die Zeile, um zu schauen was dort eingetragen ist.

          var idCalHTMLtable = '.....';
          

          Wenn du hierhin klickst wird automatisch der richtige "Pfad" zum Datenpunkt kopiert den du im Skript eintragen musst.
          15d3837c-23d0-4e8e-8c3d-e6035b3df863-grafik.png

          Der Datenpunkt ist bei mir so konfiguriert
          df39f738-ef73-4b71-b74b-4316b55b0f44-grafik.png

          1 Antwort Letzte Antwort
          0
          • haselchenH haselchen

            Mahlzeit,

            ich war auch auf der Suche nach verschiedenen Farben für Datum und Termine, da nach einem ICAL Update alles weg war.
            Da bin ich auf den Thread hier gestoßen, allerdings habe ich mich gefragt, ob man tatsächlich Skripte etc.braucht und habe rumprobiert.
            Ich habe nun mit den vorhandenen Mitteln in VIS und in den Adaptereinstellungen genau das hinbekommen. Verschiedene Farbe für Event und Datum.

            815666de-3ac4-4104-bf17-f9b58e8f2d05-grafik.png

            4c322ebd-f0ba-49df-82de-2803728c136c-grafik.png

            AlmixxA Offline
            AlmixxA Offline
            Almixx
            schrieb am zuletzt editiert von Almixx
            #46

            @haselchen und wie hast du das gemacht?
            habs gefunden, steht ja in der Anleitung :see_no_evil:

            1 Antwort Letzte Antwort
            0
            • FeuersturmF Feuersturm

              @n3ucr0n
              Danke für das Lob. Der Größte Lob geht aber (auch von mir) an @bahnuhr, er hat das Skript erstellt. Ich hab es nur um meine Bedürfnisse erweitert.

              zu Punkt 1:
              Die Farbe für Übermorgen vergibst du mit dieser Zeile:

              else if (entry._class.includes("ical_dayafter")) _color = "color:cfcfcf";
              

              Funktioniert bei mir ohne Probleme.

              zu 2.
              Bei den Uhrzeiten gibt es noch ein komisches Verhalten, was ich noch nicht weiter untersucht habe.
              Wenn man das Skript mehrfach startet startet, weil man gerade am programmieren ist verschwinden die Uhrzeiten. Was hilft ist, wenn das Skript läuft und mann dann die ical Instanz einmal pausiert und neu startet. Danach ist alles gut und die Zeiten bleiben angezeigt.

              A Offline
              A Offline
              andyf2000
              schrieb am zuletzt editiert von
              #47

              @Feuersturm Hallo.
              Gratulation Dir und Bahnuhr für dieses grandiose Skript.
              Was ich noch nicht ganz verstehe, sind die bgcolor Einstellungen.

              Ich "Missbrauche" die Müllkalender-Optionen für Geburtstagseinträge.
              Immer wenn ein Eintrag im Kalender aufscheint, bei dem das Wort "GEBURTSTAG" enthalten ist, soll der Eintrag in einer anderen Farbe angezeigt werden. Das habe ich soweit mal geschafft.
              Aber, wie ist "bgcolor" definiert - ist das die Text-Hintergrund-Farbe? Das wäre nämlich auch ganz schön wenn die Geburtstage so hervorgehoben werden würden. (oder auch andere wichtige Jahrestage)

              Egal was ich bei bgcolor als Farbe definiere, es ändert sich nichts.

               var _bgcolor = "";
                      if(calendar.name == "Familie") {
                          if(entry.event == "a") {
                              _bgcolor = "#a0e878";
                              _color="color:#a0e878";
                          }
                          else if(entry.event <= "GEBURTSTAG!") {
                              _bgcolor = "color:white"; 
                              _color = "color:#003391";
                          }
                          else if(entry.event == "Blaue Tonne") {
                              _bgcolor = "#508fdc";
                              _color="color:#508fdc";
                          }
                          else if(entry.event == "Gelber Sack") {
                              _bgcolor = "white";
                              _color="color:#eee06d";
                          }
              

              was mache ich falsch...

              LG andy

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

                bgcolor ist der Balken der links angezeigt wird, wenn dieser Balken eingeschaltet wird.

                Und dies kannst du ziemlich oben auf true setzen.
                balken = true


                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

                L 1 Antwort Letzte Antwort
                0
                • bahnuhrB bahnuhr

                  bgcolor ist der Balken der links angezeigt wird, wenn dieser Balken eingeschaltet wird.

                  Und dies kannst du ziemlich oben auf true setzen.
                  balken = true

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

                  @bahnuhr

                  Hallo, guten Morgen!

                  Ich habe das Script installiert, funktioniert!
                  Was bei mir nicht geht, ist den Balken anzeigen und der Abstand zwischen den Tagen...

                  Wo habe ich das Brett vor dem Kopf?

                  f2b95f66-4037-4e9b-b9f0-80c5f6150b8d-image.png

                  e07f59f6-9ded-4c8a-bbf7-53a5855a4696-image.png

                  3152f6fc-84c8-4b69-9fef-c9f0ff5672dd-image.png

                  Danke euch...

                  bahnuhrB FeuersturmF 2 Antworten Letzte Antwort
                  0
                  • L lucajordi

                    @bahnuhr

                    Hallo, guten Morgen!

                    Ich habe das Script installiert, funktioniert!
                    Was bei mir nicht geht, ist den Balken anzeigen und der Abstand zwischen den Tagen...

                    Wo habe ich das Brett vor dem Kopf?

                    f2b95f66-4037-4e9b-b9f0-80c5f6150b8d-image.png

                    e07f59f6-9ded-4c8a-bbf7-53a5855a4696-image.png

                    3152f6fc-84c8-4b69-9fef-c9f0ff5672dd-image.png

                    Danke euch...

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

                    @lucajordi sagte in ical Kalender Farben anpassen?:

                    @bahnuhr

                    Was bei mir nicht geht, ist den Balken anzeigen und der Abstand zwischen den Tagen...

                    Dann hast du an dem Script etwas geändert.
                    Das ursprüngliche Script funktioniert einwandfrei.

                    
                    // 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 = true;         // 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);
                        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>";
                    
                    if (i>0 && (abstand_zwischen_Tagen == true)){
                                if (calTable.val[i].date != calTable.val[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; }
                    
                    .icalNormal.iCal-Müll {
                        font-weight:normal;
                        color:#f87149;
                    }
                    .icalNormal.iCal-Märkte {
                        font-weight:normal;
                        color:#bc7dd8;
                    }
                    */
                    
                    
                    

                    Und in VIS kommt dann:
                    1b3ee90a-0e7e-471a-ad70-894293c3eefe-image.png


                    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

                    L 1 Antwort Letzte Antwort
                    0
                    • L lucajordi

                      @bahnuhr

                      Hallo, guten Morgen!

                      Ich habe das Script installiert, funktioniert!
                      Was bei mir nicht geht, ist den Balken anzeigen und der Abstand zwischen den Tagen...

                      Wo habe ich das Brett vor dem Kopf?

                      f2b95f66-4037-4e9b-b9f0-80c5f6150b8d-image.png

                      e07f59f6-9ded-4c8a-bbf7-53a5855a4696-image.png

                      3152f6fc-84c8-4b69-9fef-c9f0ff5672dd-image.png

                      Danke euch...

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

                      @lucajordi welchen Datenpunkt hast du hinter deinem widget hinterlegt? Das Skript lernt einen neuen Datenpunkt idcalhtmltable im Javascript.0 Pfad (oder was du im Skript entsprechend angibst) an. Den musst du im widget hinterlegen.

                      L 1 Antwort Letzte Antwort
                      0
                      • FeuersturmF Feuersturm

                        @lucajordi welchen Datenpunkt hast du hinter deinem widget hinterlegt? Das Skript lernt einen neuen Datenpunkt idcalhtmltable im Javascript.0 Pfad (oder was du im Skript entsprechend angibst) an. Den musst du im widget hinterlegen.

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

                        @feuersturm
                        45e51575-4325-4c62-aa0a-f028fba0b89f-image.png

                        1 Antwort Letzte Antwort
                        0
                        • bahnuhrB bahnuhr

                          @lucajordi sagte in ical Kalender Farben anpassen?:

                          @bahnuhr

                          Was bei mir nicht geht, ist den Balken anzeigen und der Abstand zwischen den Tagen...

                          Dann hast du an dem Script etwas geändert.
                          Das ursprüngliche Script funktioniert einwandfrei.

                          
                          // 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 = true;         // 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);
                              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>";
                          
                          if (i>0 && (abstand_zwischen_Tagen == true)){
                                      if (calTable.val[i].date != calTable.val[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; }
                          
                          .icalNormal.iCal-Müll {
                              font-weight:normal;
                              color:#f87149;
                          }
                          .icalNormal.iCal-Märkte {
                              font-weight:normal;
                              color:#bc7dd8;
                          }
                          */
                          
                          
                          

                          Und in VIS kommt dann:
                          1b3ee90a-0e7e-471a-ad70-894293c3eefe-image.png

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

                          @bahnuhr
                          Habe dein Script nochmal neu eingefügt...

                          immernoch das selbe...

                          bahnuhrB 1 Antwort Letzte Antwort
                          0
                          • L lucajordi

                            @bahnuhr
                            Habe dein Script nochmal neu eingefügt...

                            immernoch das selbe...

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

                            @lucajordi sagte in ical Kalender Farben anpassen?:

                            @bahnuhr
                            Habe dein Script nochmal neu eingefügt...

                            immernoch das selbe...

                            Das glaub ich nicht.

                            Du hast wirklich diesen DP angelegt:
                            "javascript.0.Sonstige.ical.html"

                            Dann funktioniert dies auch.


                            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

                            L 1 Antwort Letzte Antwort
                            0
                            • sigi234S Online
                              sigi234S Online
                              sigi234
                              Forum Testing Most Active
                              schrieb am zuletzt editiert von
                              #55

                              @bahnuhr

                              Getestet, funktioniert.

                              Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
                              Immer Daten sichern!

                              bahnuhrB 1 Antwort Letzte Antwort
                              1
                              • sigi234S sigi234

                                @bahnuhr

                                Getestet, funktioniert.

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

                                @sigi234 sagte in ical Kalender Farben anpassen?:

                                Getestet, funktioniert.

                                Ich weiß, aber trotzdem danke ;-)
                                mfg
                                Dieter


                                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

                                  @lucajordi sagte in ical Kalender Farben anpassen?:

                                  @bahnuhr
                                  Habe dein Script nochmal neu eingefügt...

                                  immernoch das selbe...

                                  Das glaub ich nicht.

                                  Du hast wirklich diesen DP angelegt:
                                  "javascript.0.Sonstige.ical.html"

                                  Dann funktioniert dies auch.

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

                                  @bahnuhr said in ical Kalender Farben anpassen?:

                                  Sonstige.ical.html

                                  Ähhhh, welchen Datenpunkt muss ich anlegen?

                                  Dachte der wird durch das Script angelegt?

                                  Sorry, wenn ich zu doof bin... ?!

                                  FeuersturmF 1 Antwort Letzte Antwort
                                  0
                                  • L lucajordi

                                    @bahnuhr said in ical Kalender Farben anpassen?:

                                    Sonstige.ical.html

                                    Ähhhh, welchen Datenpunkt muss ich anlegen?

                                    Dachte der wird durch das Script angelegt?

                                    Sorry, wenn ich zu doof bin... ?!

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

                                    @lucajordi
                                    Es geht um diesen Datenpunkt. Der Screenshot stammt aus deinem Beitrag:
                                    153b78fe-6f4a-4655-89e9-04f926f644ec-grafik.png

                                    @bahnuhr verwendet var idCalHTMLtable = "javascript.0.Sonstige.ical.html;" bei mir heißt er var idCalHTMLtable = '0_userdata.0.icalToHtml.ical_0_html';

                                    Prüfe in ioBroker unter "Objekte" ob es deinen Datenpunkt bereits gibt:
                                    fb63b931-a091-4cef-b42b-a88f31361f92-grafik.png

                                    Wenn du diese Version https://forum.iobroker.net/topic/26782/ical-kalender-farben-anpassen/33 vom Skript genommen hast, musst du den Datenpunkt manuell anlegen. Das wird nicht vom Skript gemacht.

                                    Prüft bitte auch bei dir im Skript diesen Wert var idCal = "ical.2";
                                    Nach deinem Screenshot verwendest du nur ical.0. Dementsprechend musst du bei dir var idCal = "ical.0"; eintragen.
                                    9ea3cf95-ad5e-4483-a22f-a964ccfdbef1-grafik.png

                                    Im "Basic String" Widget musst du dann den Pfad zum Datenpunkt hinterlegen welcher im Skript gefüllt wird (idCalHTMLtable)
                                    a1a8af34-3b0a-4d9f-9a70-83160777bcbc-grafik.png

                                    L 1 Antwort Letzte Antwort
                                    0
                                    • FeuersturmF Feuersturm

                                      @lucajordi
                                      Es geht um diesen Datenpunkt. Der Screenshot stammt aus deinem Beitrag:
                                      153b78fe-6f4a-4655-89e9-04f926f644ec-grafik.png

                                      @bahnuhr verwendet var idCalHTMLtable = "javascript.0.Sonstige.ical.html;" bei mir heißt er var idCalHTMLtable = '0_userdata.0.icalToHtml.ical_0_html';

                                      Prüfe in ioBroker unter "Objekte" ob es deinen Datenpunkt bereits gibt:
                                      fb63b931-a091-4cef-b42b-a88f31361f92-grafik.png

                                      Wenn du diese Version https://forum.iobroker.net/topic/26782/ical-kalender-farben-anpassen/33 vom Skript genommen hast, musst du den Datenpunkt manuell anlegen. Das wird nicht vom Skript gemacht.

                                      Prüft bitte auch bei dir im Skript diesen Wert var idCal = "ical.2";
                                      Nach deinem Screenshot verwendest du nur ical.0. Dementsprechend musst du bei dir var idCal = "ical.0"; eintragen.
                                      9ea3cf95-ad5e-4483-a22f-a964ccfdbef1-grafik.png

                                      Im "Basic String" Widget musst du dann den Pfad zum Datenpunkt hinterlegen welcher im Skript gefüllt wird (idCalHTMLtable)
                                      a1a8af34-3b0a-4d9f-9a70-83160777bcbc-grafik.png

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

                                      @feuersturm

                                      @feuersturm
                                      ok, denke ich habe das soweit angepasst, aber immer
                                      noch das gleiche...

                                      Ihr müsst auch nicht antworten, wenn ich euch auf den S... gehe...

                                      Screenshot 2021-03-07 115905.png
                                      Screenshot 2021-03-07 115827.png
                                      Screenshot 2021-03-07 115759.png
                                      c9b07557-bdfa-4c27-a5e4-4bb635bd174b-image.png

                                      bahnuhrB 1 Antwort Letzte Antwort
                                      0
                                      • L lucajordi

                                        @feuersturm

                                        @feuersturm
                                        ok, denke ich habe das soweit angepasst, aber immer
                                        noch das gleiche...

                                        Ihr müsst auch nicht antworten, wenn ich euch auf den S... gehe...

                                        Screenshot 2021-03-07 115905.png
                                        Screenshot 2021-03-07 115827.png
                                        Screenshot 2021-03-07 115759.png
                                        c9b07557-bdfa-4c27-a5e4-4bb635bd174b-image.png

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

                                        @lucajordi

                                        Du musst ! einen extra DP anlegen.
                                        Ändere zeile 12 wieder ab in:
                                        var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';

                                        Und dann erzeugst du ein Extra Script und lässt dieses laufen:

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

                                        Dadurch wird der DP erzeugt. Kannst diesen aber auch manuell anlegen.

                                        Und dann diesen Datenpunkt im Widget in VIS eintragen.
                                        Also nicht ! ical.0...
                                        sondern
                                        javascript.0....


                                        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

                                        L 1 Antwort Letzte Antwort
                                        0
                                        • bahnuhrB bahnuhr

                                          @lucajordi

                                          Du musst ! einen extra DP anlegen.
                                          Ändere zeile 12 wieder ab in:
                                          var idCalHTMLtable = 'javascript.0.Sonstige.Ical.html';

                                          Und dann erzeugst du ein Extra Script und lässt dieses laufen:

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

                                          Dadurch wird der DP erzeugt. Kannst diesen aber auch manuell anlegen.

                                          Und dann diesen Datenpunkt im Widget in VIS eintragen.
                                          Also nicht ! ical.0...
                                          sondern
                                          javascript.0....

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

                                          @bahnuhr

                                          Auch wenn deine Anleitung schon für Dummies wie mich ist:

                                          2bc8bb93-64f7-48ef-9487-6cdf78470cd8-image.png

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


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          485

                                          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