Kalender und calendar.waste

[Cannon]

Ich gehe davon aus, dass Du die üblichen Caches gelöscht hast und die custom.de.ini in Deiner Konfiguration als Sprache ausgewählt ist.

Das war das Problem. Danke. Ich muss ja die Custom-Sprache noch mal extra einbinden.

[wvhn]

Moin Cannon,

es gab ein paar kleinere Änderungen. Das Widget wurde toleranter gegenüber Leerzeichen in der Liste der Kalender in der config.ini gemacht und die Suchsystematik in der Sprachdatei wurde geändert. Der Titel des Müll-Events im Kalender muss nicht mehr exakt mit dem Eintrag der Sprachdatei übereinstimmen, sondern er muss damit beginnen. Ein Eintrag in der custom.de.ini

[calendar_event_format]
Biotonne[icon] = message_garbage
Biotonne[color] = #92561c

ergibt Treffer bei "Biotonne" und "Biotonne klein", aber nicht bei "kleine Biotonne".

Ich gehe davon aus, dass Du die üblichen Caches gelöscht hast und die custom.de.ini in Deiner Konfiguration als Sprache ausgewählt ist.

Schritte zur Diagnose:

1. Inline-Doku aufrufen und prüfen, ob calendar.waste bei Dir eine sinnvolle Anzeige ergibt. Wenn ja, ist das Widget in Ordnung.
2. Browser-Tools auf der Seite mit dem Waste-Kalender öffnen und

   widget.buffer

   eingeben. Dies sollte folgendes anzeigen:
   
   grafik.png
   Das zeigt, ob die Kalenderdaten korrekt ankommen.
3. Wenn 2. keine Daten liefert, den php Kalender-Service mit Option "debug=1" aufrufen und auf Fehler prüfen.

Gruß
Wolfram

[Cannon]

Ich habe mal einen Screenshot gemacht über die gesamte SmartVISU. Dann sieht man das auch mit dem Kalende rim Verhältnis besser. Ich habe das Bild um die Hälfte verkleinert, wenn das so nicht gut zu sehen ist, dann lade ich noch mal die Original-Größe hoch.

Nachdem ich nun die SmartVISU 3.3.1 installiert habe (vorher 3.2.1) geht der Müllkalender nicht mehr. Er zeigt einfach nichts an. Ich habe die alte smartVISU\dropins\lang\cusom.de.ini wieder reinkopiert, da die meine Definitionen der Kalendereinträge enthält.

Gab es sonst noch Änderungen, die das verusachen könnten?

[Tom Bombadil]

So, reicht - das, was ich bauen wollte, funktioniert für meine Zwecke und ist handhabbar. Vorerst finaler Stand (falls mir nicht noch weitere Ideen kommen):

_1.png

Falls es jemand nachbauen oder erweitern will:

Inhalt von <shng-dir>/items/jahreskalender.yaml:

%YAML 1.1
---

jahreskalender:

    Januar:
        type: str
        cache: true

    Februar:
        type: str
        cache: true

    Maerz:
        type: str
        cache: true

    April:
        type: str
        cache: true

    Mai:
        type: str
        cache: true

    Juni:
        type: str
        cache: true

    Juli:
        type: str
        cache: true

    August:
        type: str
        cache: true

    September:
        type: str
        cache: true

    Oktober:
        type: str
        cache: true

    November:
        type: str
        cache: true

    Dezember:
        type: str
        cache: true

Inhalt von <smartVISU-dir>/pages/<deine-page>/jahreskalender.html:

{% extends "1block.html" %}

{% block one %}

    <style type="text/css">  

        .calblock {
            display: inline-block;
            vertical-align: top;
            overflow: hidden;
            height: 40vh;
            width: 15%;
            margin: 10px 10px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
        }

        .calheader {
            text-align: center;
            font-weight: bold;
            line-height: 2;
        }

    </style>

    {% set months_locale = [
       'Januar', 'Februar', 'Maerz',
       'April', 'Mai', 'Juni',
       'Juli', 'August', 'September',
       'Oktober', 'November', 'Dezember'  
    ] %}

    {% set months_calcolors = [
       '#9ddbff, #393663, #9ddbff', '#b0edff, #1849a5, #b0edff', '#d6fced, #479386, #d6fced',
       '#efffcb, #7f9e40, #efffcb', '#ffff9e, #add133, #ffff9e', '#ffffa2, #fa9f1d, #ffffa2',
       '#fffed8, #f2652d, #fffed8', '#ffe1e3, #a51610, #ffe1e3', '#ead7ff, #71357b, #ead7ff',
       '#ffc2ff, #9c2e87, #ffc2ff', '#d6f7fe, #1fa4b5, #d6f7fe', '#deedff, #6675ae, #deedff'
    ] %}

    <br/><br/>
    <center>

    {% for month in 1..12 %}
        <div class='calblock' style='border: {%if "now"|date('m')==month%} 5px {%else%} 1px {%endif%} {{months_calcolors[month-1]|slice(0,7)}} solid;'>
            <div class='calheader' style='background-image: linear-gradient(0.33turn, {{ months_calcolors[month-1]}} )'>{{months_locale[month-1]|replace({'ae':'ä'})}}</div>
            <span style='text-align:left'>{{ basic.print('', 'jahreskalender.'~months_locale[month-1], 'html') }}</span>
        </div>
    {% endfor %}

    </center>

{% endblock %}

Befüllen der Items (Nutzung von copy/paste empfohlen - Zeilenumbrüche ggf. über < br / > realisieren):

_2.png

Hinweis: Das oben verwendete Template '1block' ist eine Eigenentwicklung. {% extends "1block.html" %} sollte durch das aktuell verwendete Template ersetzt werden. Viel Erfolg.

/tom

[Tom Bombadil]

Danke - ich befülle gerade die ersten Items, stehe aber erst am Anfang, da fehlt noch jede Menge. Habe mich dann doch gegen den Kalender und für normale String-Items entschieden, weil mir die Ladezeiten zu lang waren. Kann man zwar zur Zeit nur über das Admin-Interface von shNG befüllen, aber ist ja eh statischer Content, also nur 1x notwendig - damit kann ich leben.

jahreskalender2.png

/tom

[Cannon]

Ich finde das mit dem Lyout des Kalenders überhaupt gut. So könnte man den als Fullscreen einbinden, evl. auch als Monatsansicht ... oder Wochenansicht.

[Tom Bombadil]

Ja, ich sehe mal, ob ich das irgendwie zusammenbekomme. Hier mal ein 'proof of concept', was ich eigentlich machen will (Jahreskalender mit jährlich wiederkehrenden Terminen - Werte ablesen, Reifen wechseln, Baumschnitt, Hecke düngen, Heizungs- und Entkalkerservice im September vereinbaren, TüV alle 2 Jahre etc etc):

jahreskalender.png

Im Moment überlege ich, von der Kalenderkomponente doch wieder wegzugehen und einfach eine Textanzeige zu machen. Grund: 12x Anholung desselben Kalenders von einer NextCloud im LAN dauert fast 45s. Zweiter Grund: Bei einem einfachen Textfeld muss man keine wiederkehrenden Termine im Kalender erstellen. Ich muss mal sehen, ob ich ein Item vom Typ 'string' als bulleted list in den Boxen darstellen kann.

Bisheriger Code (quick&dirty zusammengeschrieben), falls noch jemand Lust hat, da ein bisschen zu experimentieren:

{% extends "1block.html" %}

{% block one %}

    <style type="text/css">  

        .calblock {
            display: inline-block;
            vertical-align: top;
            overflow: hidden;
            height: 40vh;
            width: 15%;
            margin: 10px 10px;
        }
        
        .calueberschrift {
            text-align: center;
            /** opacity: 33%; **/
            font-weight: bold;
            line-height: 2;
        }

    </style>

    {% set months_locale = [
     'Januar', 'Februar', 'März',
     'April', 'Mai', 'Juni',
     'Juli', 'August', 'September',
     'Oktober', 'November', 'Dezember'  
    ] %}

    {% set months_calcolors = [
       '#ffe1e3, #a51610, #ffe1e3', '#fffed8, #f2652d, #fffed8', '#ffffa2, #fa9f1d, #ffffa2',
       '#ffff9e, #add133, #ffff9e', '#efffcb, #7f9e40, #efffcb', '#d6fced, #479386, #d6fced',
       '#d6f7fe, #1fa4b5, #d6f7fe', '#b0edff, #1849a5, #b0edff', '#9ddbff, #393663, #9ddbff',
       '#deedff, #6675ae, #deedff', '#ead7ff, #71357b, #ead7ff', '#ffc2ff, #9c2e87, #ffc2ff'
    ] %}
    
    {% import "calendar.html" as calendar %}

    {% for month in 1..12 %}
        {% set month_id = 'monat'~month %}
        <div id={{month_id}} class='calblock' style='border: 1px {{ months_calcolors[month-1]|slice(0,7) }} solid;'>
            <div class='calueberschrift' style='background-image: linear-gradient(0.33turn, {{ months_calcolors[month-1]}} )'>{{months_locale[month-1]}}</div>
            {{ calendar.list('clist', '', '6', 'yellow', '', 'K1') }}
        </div>
    {% endfor %}

{% endblock %}

Trotz allem wäre das Filtern nach Tags in Kalendern wohl trotzdem sinnvoll - um z.B. verschiedene Familienmitglieder in unterschiedlichen Blöcken darstellen zu können.

/tom

[wvhn]

Tom Bombadil Da bei mir weitgehend Google-freie Zone ist, brauche ich als Vorarbeit von Dir ein paar Tests, denn die Kalender werden entweder durch das extern bezogene iCal-Modul geparst oder bei GoogleV3 direkt als json geliefert.
Wenn Du Kalendereinträge mit Tags/Kategorien versiehst und die Kalender-Services dann im Debug-Modus ausführst und mir die Ergebnisse schickst, dann können wir in den Rohdaten sehen, welche Daten mitkommen und ob ich die im jeweiligen Service hinzufügen kann.

Wenn die Daten da sind, ist das Filtern sicher nicht so aufwendig.

Gruß
Wolfram

[Tom Bombadil]

wvhn Wolfram, da Du kürzlich sowieso die Kalender am Wickel hattest - wäre es ohne größeren Aufwand möglich, einen optionalen Tag-Filter (=Kategorien) in das Widget zu integrieren? Also aus:

{{ calendar.list(id, title, count, color, repeat, calendar) }}

wird:

{{ calendar.list(id, title, count, color, repeat, calendar, optional_tagfilter) }}

Irgendwo wird da auch schon ansatzweise was gemacht, aber so recht schlau werde ich daraus nicht.

Ich hätte dafür einen konkreten Anwendungsfall, auf den mich die neuen Zusatzinfos von oben gebracht haben.

iCloud/iCal scheinen übrigens keine Kategorien zu kennen, dort werden für sowas wohl grundsätzlich verschiedene Kalender verwendet. Aber für die Caldav und GoogleV3 Services wäre das sicher eine feine Sache ...

/tom

[Cannon]

Bei mir sah das so aus, als ich die Änderung in der base.css noch nicht gemacht hatte. Wichtig ist Zeile 1221

Ja ich hatte nur 2 Dateien geändert, die Base fehlte noch. Aber super. Sieht gut aus! :-)

[wvhn]

Bei mir sah das so aus, als ich die Änderung in der base.css noch nicht gemacht hatte. Wichtig ist Zeile 1221

.calendarlist dl

anstelle …ul.

[Tom Bombadil]

- das Widget ist breiter geworden (irgendwas stimmt mit Margin oder Padding nicht)

Das hängt bestimmt damit zusammen, dass im css <ul> adressiert, jetzt aber <dl> verwendet wird.
Die Styles werden somit nicht angewendet, da das Element nicht (mehr) gefunden wird.

/tom

[Cannon]

Ich habe mal einen Screenshot gemacht über die gesamte SmartVISU. Dann sieht man das auch mit dem Kalende rim Verhältnis besser. Ich habe das Bild um die Hälfte verkleinert, wenn das so nicht gut zu sehen ist, dann lade ich noch mal die Original-Größe hoch.

smartvisu kalender.jpg

[wvhn]

Habe ich mal probiert. Ist doch schon mal echt toll. Anmerkungen dazu:

- das Widget ist breiter geworden (irgendwas stimmt mit Margin oder Padding nicht)
- vielleicht sollte da nicht "Info" stehen, sondenr man nimmt ein Symbol evtl. das + Symbol, was man ja bei den Containern schon hat
- die Info evtl. nur dann sichbar, wenn nicht genug Platz ist

Ich musste bei mir den Browser-Cache bzw. die Websitedaten für die IP des Raspberry löschen, damit es funktionierte. Grund ist eine winzige Änderung in der base.css. Die Kalenderliste wird jetzt nicht mehr als <ul> aufgebaut, sondern als <dl>, damit das Feld mit den zusätzlichen Inhalten beim Anzeigen der Seite erstmal zugeklappt ist. Wer hier eigenes css verwendet, muss das entsprechend anpassen.
Die Breite der Liste ist bei mir unverändert.

Das „+“ finde ich eine gute Idee. Ist auch eindeutiger.

EDIT: Das "+" sieht blöd aus. Das muss ich gelegentlich mal auf die jQuery Symbole umstellen. Einstweilen bleibt es bei "Info".

[wvhn]

Ich habs getestet. Das Austauschen des DIenstes hatte dazu geführt, dass der gar keinen Kalender lädt. Es gab keinen Fehler und es nicht nachvollziehbar warum nicht, denn deine geänderte Zeile 29 funktionierte, wenn ich das bei mir änderte, obwohl beim Vergleich sonst kein anderer Unterschied feststellbar war. Es wurde aber mehr als nur das + und * getauscht:

Aber um es noch mal zu sagen die Änderung auf "neu" macht auch Kalendernamen mit Leerzeichen möglich.

Verstehe ich das richtig: wenn Du die gepostete Datei verwendest (Endung umbenannt von .txt in .php), funktioniert es nicht, aber wenn Du die Änderung manuell machst, funktioniert es?

alt: '/[\s,]+/m': hier wird der String der Kalendernamen bei Leerzeichen oder Komma getrennt, oder wenn beides in beliebiger Reihenfolge vorkommt. Das geht bei Kalendernamen mit Leerzeichen schief.
neu: '/,\s*/m': hier wir beim Komma getrennt und direkt darauf folgende Leerzeichen werden entfernt.

Gruß
Wolfram