Der neue Monatsrückblick für Mai und Juni 2026 ist online!

[Ro75]

Ist für mich nicht nachvollziehbar. Habe ehrlich gesagt im Moment keine Idee mehr. Was passiert wenn du mal einen Geburtstag, wie beschrieben, in den "normalen Kalender" einträgst. Da die Aktualisierung aller 5 Minuten ist (15:35, 15:40), müsstest du ja dann relativ schnell was sehen.

Ro75.

[Nashra]

@Ro75 sagte:

Ist für mich nicht nachvollziehbar. Habe ehrlich gesagt im Moment keine Idee mehr. Was passiert wenn du mal einen Geburtstag, wie beschrieben, in den "normalen Kalender" einträgst. Da die Aktualisierung aller 5 Minuten ist (15:35, 15:40), müsstest du ja dann relativ schnell was sehen.

Ro75.

Hatte ich gerade schon gemacht
Wird angezeigt.

Ich lege die Kalender bei Google mal neu an, mal sehen ob es dann klappt.

[Nashra]

Fehler wohl gefunden, es liegt an den Einträgen bei Google.
Habe mal einen Geburtstag komplett gelöscht und dann neu angelegt und wieder mit der Angabe jedes Jahr.
Wird jetzt angezeigt, schwere Geburt bzw. keine Ahnung was Google da für ein Problem hatte.
Werde jetzt alle Daten komplett löschen und neu eingeben.

[Ro75]

Super, dass das Problem gefunden wurde. Google ändert hin und wieder was. Das letzte Mal vor ein paar Wochen. Da gab es Änderungen bei wiederkehrenden Terminen. Beim Google Kalender selbst kein Problem, aber es gab geänderte Infos in der ICS. Aber da ist bereits im Script berücksichtigt.

Ro75.

[Nashra]

Ist echt ein Witz. Jahrelang keine Probleme mit Anzeige und dann ändern die was ohne
das man was mitbekommt. Naja, habe jetzt einige Termine in den jeweiligen Kalendern
gelöscht und eben neu angelegt, jetzt klappt es.

Vielen Dank an Dich für die Hilfe.

[Ro75]

@nashra Ich danke Dir dafür!

Ro75.

[Nashra]

@Ro75 sagte:

@nashra Ich danke Dir dafür!

Ro75.

Nix zu danken, mir ist geholfen und Du weißt beim nächsten User woran es liegt.

Aber einen habe ich noch...
Die Hintergrundfarbe für "In Memory", wo finde ich die?

[Ro75]

@Nashra sagte:

Die Hintergrundfarbe für "In Memory", wo finde ich die?

Wenn das jetzt keine separater Kalender ist, dann:

function renderEventC1(norm) {
    if (isInMemoryEvent(norm)) {
        norm.calColor = "#808080";
        norm.event   += " 🕯️";
    }

Wenn eigenständiger Kalender: dann auch in der Kalender-Konfig

        color: "#a71b1b", // Standardfarbe des Kalenders - großer Kalender (materialdesign - Scrounger)
        img: BASE_URL + "Mama.png" // Icon für Darstellung - kleiner Kalender
    },

schauen.

Ro75.

[sigi234]

@Ro75
Habe jetzt nicht alles gelesen, was ist der Fehler?

[Ro75]

Die Google Kalender hatten ein Problem. Bei @nashra hat die Neuanlage geholfen.

Ro75.

[Nashra]

@sigi234 sagte:

@Ro75
Habe jetzt nicht alles gelesen, was ist der Fehler?

Google ist der Fehler.
Geh mal hin und lösche einen Eintrag in dem Kalender der nicht angezeigt wird,
dann legst du den Eintrag neu an und schon taucht er im Kalender auf bzw. wird angezeigt.

[Eduard77]

Ich konnte jetzt mit hilfe von KI für Vis2 Vis-jsontemplate 2 Widget erstellen.

Für kleinen Kalender:

Code Vorlage:

<%
  var rawData = data.items || data.dpValue || data;
  var list = rawData;

  if (typeof list === 'string') {
    try {
      list = JSON.parse(list);
    } catch (e) {
      list = null;
    }
  }
%>

<% if (Array.isArray(list) && list.length > 0) { %>
  <div class="event-list-container">
    <% list.forEach(function(item) { %>
      <div class="event-card">
        <% if (item.img) { %>
          <img class="event-img" src="<%- item.img %>" alt="Foto" />
        <% } else { %>
          <div class="event-img-placeholder"></div>
        <% } %>

        <div class="event-time">
          <%- item.zeit || '' %>
        </div>

        <div class="event-details">
          <div class="event-title"><%- item.ereignis || '' %></div>
          <% if (item.ort) { %>
            <div class="event-location"><%- item.ort %></div>
          <% } %>
        </div>
      </div>
    <% }); %>
  </div>
<% } else { %>
  <div class="no-data">
    Keine Daten vorhanden
  </div>
<% } %>

<style>
#<%- widgetid %>
{
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  color: #ffffff;
  font-family: Roboto, "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  overflow-y: auto;
}

#<%- widgetid %> .event-list-container
{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px;
}

#<%- widgetid %> .event-card
{
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 8px;
  padding: 8px 12px;
  gap: 12px;
  backdrop-filter: blur(4px);
}

#<%- widgetid %> .event-img
{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

#<%- widgetid %> .event-img-placeholder
{
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

#<%- widgetid %> .event-time
{
  font-size: 0.85em;
  color: #ffffff;
  white-space: nowrap;
  font-weight: 500;
  min-width: 140px;
  opacity: 0.9;
}

#<%- widgetid %> .event-details
{
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  overflow: hidden;
}

#<%- widgetid %> .event-title
{
  font-size: 0.95em;
  font-weight: 600;
  color: #ffffff;
  word-break: break-word;
}

#<%- widgetid %> .event-location
{
  font-size: 0.8em;
  color: #ffffff;
  opacity: 0.75;
  margin-top: 2px;
}

#<%- widgetid %> .no-data
{
  padding: 12px;
  text-align: center;
  color: #ffffff;
  font-size: 0.9em;
  opacity: 0.7;
}
</style>

Und grossen Kalender:

Code Vorlage:

<style>
  .calendar-container {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-family: Arial, sans-serif;
    width: 100%;
    box-sizing: border-box;
    padding: 5px;
  }
  .calendar-item {
    padding: 8px 12px;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  }
  .calendar-header {
    display: flex;
    justify-content: space-between;
    font-size: 0.85em;
    opacity: 0.9;
    margin-bottom: 4px;
    font-weight: bold;
  }
  .calendar-title {
    font-size: 1em;
    font-weight: 600;
    line-height: 1.3;
  }
  .calendar-details {
    margin-top: 6px;
    font-size: 0.85em;
  }
  .calendar-details summary {
    cursor: pointer;
    opacity: 0.8;
  }
  .calendar-details pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: inherit;
    margin: 6px 0 0 0;
    padding: 6px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
  }
</style>

<div class="calendar-container">
  <% 
    var items = [];
    var rawData = (typeof data !== 'undefined' && data) ? data : ((typeof dp1 !== 'undefined' && dp1) ? dp1 : ((typeof val !== 'undefined' && val) ? val : null));

    try {
      if (typeof rawData === 'string') {
        items = JSON.parse(rawData);
      } else if (Array.isArray(rawData)) {
        items = rawData;
      }
    } catch(e) {
      items = [];
    }

    function formatDate(dateStr) {
      if (!dateStr || dateStr.length < 10) return dateStr;
      var parts = dateStr.substring(0, 10).split('-');
      return parts.length === 3 ? parts[2] + '.' + parts[1] + '.' + parts[0] : dateStr;
    }

    if (Array.isArray(items) && items.length > 0) {
      for (var i = 0; i < items.length; i++) { 
        var item = items[i];
        if (!item) continue;

        var rawName = item.name || '';
        var title = rawName;
        var details = '';

        // Trennung nach "Hallo" (auch ohne Leerzeichen davor)
        var halloIndex = rawName.search(/hallo/i);
        if (halloIndex > 0) {
          title = rawName.substring(0, halloIndex).trim();
          details = rawName.substring(halloIndex).trim();
        } else if (rawName.indexOf('\n') !== -1) {
          var nameLines = rawName.split('\n');
          title = nameLines[0].trim();
          details = nameLines.slice(1).join('\n').trim();
        }

        var startStr = item.start || '';
        var endStr = item.end || '';

        // Nur YYYY-MM-DD vergleichen
        var startDateOnly = startStr.substring(0, 10);
        var endDateOnly = endStr.substring(0, 10);
        
        var isMultiDay = endDateOnly && startDateOnly !== endDateOnly;
        var isFullDay = startStr.length === 10;

        var startDateFormatted = formatDate(startStr);
        var endDateFormatted = formatDate(endStr);

        var startTime = isFullDay ? '' : startStr.substring(11, 16);
        var endTime = isFullDay ? '' : (endStr ? endStr.substring(11, 16) : '');
        
        var bgColor = item.color || 'rgba(100,100,100,0.3)';
        var textColor = item.colorText || '#ffffff';
  %>
    <div class="calendar-item" style="background-color: <%= bgColor %>; color: <%= textColor %>; border-left: 4px solid <%= textColor %>;">
      <div class="calendar-header">
        <span class="calendar-date">
          <% if (isMultiDay) { %>
            <%= startDateFormatted %> – <%= endDateFormatted %>
          <% } else { %>
            <%= startDateFormatted %>
          <% } %>
        </span>

        <% if (isMultiDay) { %>
          <span class="calendar-time-fullday">Mehrtägig</span>
        <% } else if (!isFullDay && startTime) { %>
          <span class="calendar-time"><%= startTime %> - <%= endTime %> Uhr</span>
        <% } else { %>
          <span class="calendar-time-fullday">Ganztägig</span>
        <% } %>
      </div>

      <div class="calendar-title"><%= title %></div>

      <% if (details) { %>
        <details class="calendar-details">
          <summary>Details anzeigen</summary>
          <pre><%= details %></pre>
        </details>
      <% } %>
    </div>
  <% 
      } 
    } 
  %>
</div>

@ro75 Danke nochmal für das Skript.

[OliverIO]

@Eduard77

Teilen?

[Eduard77]

@OliverIO
Ich habe oben ergänzt.
Könntest du bitte es nochmal überfliegen ob alles Okay ist?

[OliverIO]

@Eduard77

Sieht gut aus.
Was hat es mit dem Hallo im grossen Kalender auf sich?
Welches prompt für die ki hast du eingegeben?
Welche Informationen hast du mitgegeben.
Wollte da mal für die Dokumentation mal noch was ergänzen.

[Eduard77]

@OliverIO
Was für Hallo, keine Ahnung, vielleicht weil man zb. bei ATU Termin noch Details anzeigen kann?

Ich habe Gemini benutzt und ihr dann erklärt, dass ich möchte für dein Widget in VIS2 eine Vorlage haben. Und habe links zur deiner GitHub Seite und von Skript erstellte Json DP gegeben.
Dann ein paar mal die Code von Gemini probiert und weitere änderungen von ihr gebeten, bis ich mit den Ergäbnis zufrieden war.

[OliverIO]

@Eduard77

Wenn im Namen hallo auftaucht formatiert er den Eintrag etwas anders.

[Eduard77]

@OliverIO
Das ist der Termin ATU wo man Details anzeigen kann.
Ist wahrscheinlich nicht optimal gelöst, wiel nicht jeder Hallo schreibt.

[Rudi-Ment]

Hallo.
Ich teste gerade ebenfalls das Skript und bin soweit auch sehr zufrieden.
Aber: die Termine über mehrere Tage werden gar nicht über mehrere Tage angezeigt.

Das betrifft Termine, die ganztags angelegt sind.
Wenn ich einen Termin von Samstag 08:00 Uhr bis Sonntag 16:00 Uhr anlege, wird dies auch über beide Tage angezeigt.

[Ro75]

@Rudi-Ment ich schaue mir das an.

Ro75.

EDIT: Habe das Problem isoliert.

Somit sollte das dann passen. Das Script werde ich dann im Laufe des Tages aktualisieren. Melde mich wieder.