Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Material Design Widgets: Calendar Widget

    NEWS

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Material Design Widgets: Calendar Widget

    This topic has been deleted. Only users with topic management privileges can see it.
    • T
      TT-Tom @Damrak2022 last edited by TT-Tom

      @damrak2022 bei den Abfragen sind das 3 Gleichheitszeichen ? muss hinter "return" nicht das Semikolon?

      Wie ist der Kalendername in der Instanz?

      Damrak2022 1 Reply Last reply Reply Quote 0
      • Damrak2022
        Damrak2022 @TT-Tom last edited by Damrak2022

        @tt-tom Ich habe das mit 2 Gleichheitszeichen und auch mit dem Semikolon probiert. Das ist es nicht. Die Kalendernamen sind identisch mit dem was im ical Adapter hinterlegt ist.

        Hier nochmal das komplette Script was ich von hier übernommen habe:

        // momentjs is required as dependecies in javascript adapter
        const moment = require("moment");
        
        var instances = $(`[id=ical.*.data.table]`);
        instances.on(ical2CalendarWidget);
        
        // remove this, if you know to use your own datapoint
        let datapointId = 'materialdesignwidgets.calendar.ical2calendar'
        createState(datapointId, "[]", {
          read: true, 
          write: false, 
          desc: "JSON String for Calendar Widget", 
          type: "string", 
          def: "[]"
        });
        
        function ical2CalendarWidget() {
            try {
                let calList = [];
        
                for (var inst = 0; inst <= instances.length - 1; inst++) {
                    let icalObj = getState(instances[inst]).val;
        
                    if (icalObj) {
                        for (var i = 0; i <= icalObj.length - 1; i++) {
                            let item = icalObj[i];
        
                            // extract calendar color
                            let calendarName = item._class.split(' ')[0].replace('ical_', '');
        
                            let startTime = moment(item._date);
                            let endTime = moment(item._end);
                            
                            let start = startTime.format("YYYY-MM-DD HH:mm");
                            let end = endTime.format("YYYY-MM-DD HH:mm");
        
                            if (startTime.format('HH:mm') === '00:00' && endTime.format('HH:mm') === '00:00') {
                                // is full-day event
                                if (endTime.diff(startTime, 'hours') === 24) {
                                    // full-day event, one day
                                    start = startTime.format("YYYY-MM-DD");
                                    end = startTime.format("YYYY-MM-DD");
                                } else {
                                    // full-day event, multiple days
                                    start = startTime.format("YYYY-MM-DD");
                                    end = endTime.format("YYYY-MM-DD");
                                }
                            }
        
                            // create object for calendar widget
                            calList.push({
                                name: item.event,
                                color: getMyCalendarColor(calendarName),
                                colorText: getMyCalendarTextColor(calendarName),
                                start: start,
                                end: end
                            })
                        }
        
                        function getMyCalendarColor(calendarName) {
                            // assign colors via the calendar names, use calendar name as set in ical
                            if (calendarName === 'ioBroker') {
                                return '#F16BBFB';
                            } else if (calendarName === 'Finanzen') {
                                return '#DA0B05'
                            } else if (calendarName === 'calendar3') {
                                return '#32a852'
                            }
                        }
        
                        function getMyCalendarTextColor(calendarName) {
                            // assign colors via the calendar names, use calendar name as set in ical
                            if (calendarName === 'calendar1') {
                                return '#FFFFFF';
                            } else if (calendarName === 'calendar2') {
                                return '#FFFFFF'
                            } else if (calendarName === 'calendar3') {
                                return '#FFFFFF'
                            }
                        }
                    }
        
                    // Enter the destination data point that is to be used as object ID in the widget                
                    setState(datapointId, JSON.stringify(calList), true);
                }
            } catch (e) {
                console.error(`ical2MaterialDesignCalendarWidget: message: ${e.message}, stack: ${e.stack}`);
            }
        }
        
        ical2CalendarWidget();
        
        T 1 Reply Last reply Reply Quote 0
        • T
          TT-Tom @Damrak2022 last edited by TT-Tom

          @damrak2022

          Okay, bei mir läuft das Script ohne Probleme. Schreibe mal in Zeile 30

          console.log(calendarName);
          

          Und prüfe mal die Ausgaben im Log. Vielleicht ein Leerzeichen versteckt.

          Damrak2022 1 Reply Last reply Reply Quote 0
          • Damrak2022
            Damrak2022 @TT-Tom last edited by Damrak2022

            @tt-tom Dann erscheint das:
            Bildschirmfoto 2022-06-12 um 04.57.05.png

            2022-06-12 04:56:41.170	error	script.js.common.Kalender.Kalender_ical: ical2MaterialDesignCalendarWidget: message: iobroker is not defined, stack: ReferenceError: iobroker is not defined at ical2CalendarWidget (script.js.common.Kalender.Kalender_ical:31:99) at script.js.common.Kalender.Kalender_ical:93:1 at script.js.common.Kalender.Kalender_ical:94:3 at Script.runInContext (vm.js:144:12) at Script.runInNewContext (vm.js:149:17) at execute (/opt/iobroker/node_modules/iobroker.javascript/main.js:1687:27) at prepareScript (/opt/iobroker/node_modules/iobroker.javascript/main.js:1901:38) at /opt/iobroker/node_modules/iobroker.javascript/main.js:2001:17 at Immediate._onImmediate (/opt/iobroker/node_modules/iobroker.javascript/main.js:1472:17) at processImmediate (internal/timers.js:466:21)
            

            Das hatte ich eingetragen:
            Bildschirmfoto 2022-06-12 um 04.59.31.png

            Wie behebe ich Calendar iobroker ist not defined

            T 1 Reply Last reply Reply Quote 0
            • T
              TT-Tom @Damrak2022 last edited by TT-Tom

              @damrak2022
              Okay bei dir ist es Zeile 31. das Semikolon raus und dafür den Befehl so wie ich ihn geschrieben habe. Du möchtest im log den Inhalt der Variable sehen.

              Damrak2022 1 Reply Last reply Reply Quote 0
              • Damrak2022
                Damrak2022 @TT-Tom last edited by Damrak2022

                @tt-tom Soory,

                07:45:18.278	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Gesundheit
                07:45:18.279	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Freizeit
                07:45:18.281	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Haushalt
                07:45:18.282	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Haushalt
                07:45:18.284	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Gesundheit
                07:45:18.285	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Arbeit
                07:45:18.287	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Freizeit
                07:45:18.289	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: registered 1 subscription and 0 schedules
                

                Bildschirmfoto 2022-06-12 um 07.47.14.png

                Wieso steht da was ganz anderes als meine Einstellungen in ical?

                T 1 Reply Last reply Reply Quote 0
                • T
                  TT-Tom @Damrak2022 last edited by

                  @damrak2022
                  Stop

                  Damrak2022 1 Reply Last reply Reply Quote 0
                  • Damrak2022
                    Damrak2022 @TT-Tom last edited by Damrak2022

                    @tt-tom Hier nochmal aus Zeile 31

                    07:49:27.938	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Gesundheit
                    07:49:27.939	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Freizeit
                    07:49:27.940	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Haushalt
                    07:49:27.941	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Haushalt
                    07:49:27.942	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Gesundheit
                    07:49:27.944	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Arbeit
                    07:49:27.945	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: Freizeit
                    07:49:27.946	info	javascript.0 (952) script.js.common.Kalender.Kalender_ical: registered 1 subscription and 0 schedules
                    

                    Script ist gestoppt

                    Habe das Semikolon am Anfang entfernt - selbe Ausgabe

                    T 1 Reply Last reply Reply Quote 0
                    • T
                      TT-Tom @Damrak2022 last edited by

                      @damrak2022

                      Langsam habe nur das Handy am Start.

                      Das Script liest vermutlich nicht die Farben vom Adapter. Das muss ich mir Zuhause ansehen, am Rechner heute Abend.

                      Jetzt ist es so das der Name vom Kalender ermittelt wird und ihm dann vom Script eine Farbe für Hintergrund und Schrift zugewiesen wird.

                      Damrak2022 1 Reply Last reply Reply Quote 0
                      • Damrak2022
                        Damrak2022 @TT-Tom last edited by

                        @tt-tom Ja, kein Problem, lass Dir Zeit. Aber es werden ja auch völlig falsche Kalendernamen eingelesen - siehe ical Screenshot.
                        Okay, bis später

                        1 Reply Last reply Reply Quote 0
                        • T
                          TT-Tom last edited by

                          @damrak2022
                          Haben allen Kalender aktuell Daten, schau mal in den Objekten von iCal nach. Das würde erklären warum er nicht alle Kalender logt.

                          Das Script erstellt die Farben für Hintergrund und Schrift selber. Du musst die Funktion erweitern für deine Kalender. Aktuell sind es ja nur für drei.

                          Damrak2022 1 Reply Last reply Reply Quote 0
                          • Damrak2022
                            Damrak2022 @TT-Tom last edited by

                            @tt-tom Momentan sieht das bei den Objekten so aus:
                            Bildschirmfoto 2022-06-12 um 08.57.32.png

                            Im Kalender selbst so:
                            Bildschirmfoto 2022-06-12 um 08.59.31.png

                            Da stehen Termin drin
                            Ich werde das erstmal erweitern

                            T 1 Reply Last reply Reply Quote 0
                            • T
                              TT-Tom @Damrak2022 last edited by

                              @damrak2022

                              Melde mich heute Abend nochmal. Bin jetzt weg

                              Damrak2022 1 Reply Last reply Reply Quote 0
                              • Damrak2022
                                Damrak2022 @TT-Tom last edited by

                                @tt-tom Ja, alles okay,

                                ich habe das jetzt erweitert, aber hier werden manche Einträge blass dargestellt und unten ist noch ein Teil der wahrscheinlich weg kann
                                Bildschirmfoto_2022-06-12_um_09_24_34.png

                                T 1 Reply Last reply Reply Quote 0
                                • T
                                  TT-Tom @Damrak2022 last edited by TT-Tom

                                  @damrak2022

                                  Falsche Klammern, vergleiche mit der ersten if

                                  Das erste else muss auch weg

                                  Der untere Teil ist für die Schriftfarbe, wenn dein Hintergrund schwarz ist musst du hier weiß ein stellen für den Kalender

                                  Damrak2022 1 Reply Last reply Reply Quote 0
                                  • Damrak2022
                                    Damrak2022 @TT-Tom last edited by

                                    @tt-tom Garnicht so einfach, wenn die Augen nicht mehr so Top sind und man sich mit JS nicht auskennt.
                                    Jetzt habe ich das angepasst, aber 3 Einträge sind immer noch blass dargestellt
                                    Bildschirmfoto 2022-06-12 um 11.13.32.png

                                    Muss ich den unteren Bereich auch bis auf die 7 Kalender erweitern, und überall meine gewünschte Schriftfarbe einstellen?

                                    T 1 Reply Last reply Reply Quote 0
                                    • T
                                      TT-Tom @Damrak2022 last edited by TT-Tom

                                      @damrak2022 sagte in Material Design Widgets: Calendar Widget:

                                      Muss ich den unteren Bereich auch bis auf die 7 Kalender erweitern, und überall meine gewünschte Schriftfarbe einstellen?

                                      Nein, nur für die, die nicht schwarz sein sollen.

                                      Du hast oben immer noch ein Problem mit den Klammern.
                                      Ab Office fehlt die Klammer } vor else und hinter dem letzten Return müssen zwei

                                      Vergleiche mit dem Original, da kannst du es erkennen.

                                      So bin mal wieder weg.

                                      Damrak2022 1 Reply Last reply Reply Quote 0
                                      • Damrak2022
                                        Damrak2022 @TT-Tom last edited by

                                        @tt-tom Danke, aber mach Dir keinen Stress. Heute Abend, oder morgen ist völlig ausreichend

                                        T 1 Reply Last reply Reply Quote 0
                                        • T
                                          TT-Tom @Damrak2022 last edited by

                                          @damrak2022

                                          Ich schau heute Abend rein.

                                          Damrak2022 1 Reply Last reply Reply Quote 0
                                          • Damrak2022
                                            Damrak2022 @TT-Tom last edited by

                                            @tt-tom Danke Dir

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

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            1.1k
                                            Online

                                            31.7k
                                            Users

                                            79.7k
                                            Topics

                                            1.3m
                                            Posts

                                            vis
                                            45
                                            200
                                            26098
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo