MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    MMM-CalendarExt3

    Scheduled Pinned Locked Moved Utilities
    676 Posts 81 Posters 2.4m Views 85 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • M Offline
      MMRIZE @hrmax
      last edited by MMRIZE

      @hrmax
      First, Thanks for the feedback. I found there was some mistype in code. I fixed it, so update with git pull.

      Second, for eventFilter

      eventFilter: (ev) => {
        if (ev.isFullday) return false
        return true
      },
      

      Third, for eventTransformer and symbol example.

      eventTransformer: (ev) => {
        ev.title = `<i class="fa fa-${ev.symbol}"></i>${ev.title}`
        return ev
      },
      

      Result;
      4f66a6de-633f-4cca-a921-1c0ce47e23b5-image.png

      H 1 Reply Last reply Reply Quote 0
      • H Offline
        hrmax @MMRIZE
        last edited by

        @MMRIZE This was super helpful, thank you! It resolved the issues I was having.

        I ended up modifying MMM-CalendarExt3.js so that I could better control the time format. Since I’m using this in portrait mode, I don’t much space so for time values I wanted

        4:00 PM -> 4
        5:30 PM -> 5:30
        
        M 1 Reply Last reply Reply Quote 0
        • M Offline
          MMRIZE @hrmax
          last edited by

          @hrmax

          You can adjust eventTimeOptions to format the time or date of the event.
          But not by condition.

          eventTimeOptions: {
            hour: "numeric",
          }
          

          will show only hour like 4

          or

          eventTimeOptions: {
            hour: "numeric",
            minute : "2-digit"
          }
          

          will show the hour and minute like 4:05

          or

          eventTimeOptions: {
            timeStyle: "short"
          }
          

          will show standard locale format like 4:05 am. (It depends on which locale is applied.)

          But not conditionally. (4 or 4:05 by condition)

          One possible idea is;
          Hide the real time parts with CSS, then transform event title to include time;

          /* In your custom.css */
          .CX3 .myTime {
            font-size: 80%;
            color: #999;
            font-weight: normal;
          }
          
          .CX3 .event:not(.fullday) .eventTime {
            display: none;
          }
          
          /* In your config */
          eventTransformer: (ev) => {
            if (!ev.isFullday) {
              let t = new Date(ev.startDate)
              let time = (t.getMinutes() === 0) ? String(t.getHours()) : String(t.getHours() + ':' + t.getMinutes())
              ev.title = `<span class="myTime">${time}</span> ${ev.title}`	
            }
            return ev 
          }
          

          The result will be;

          3f2e6599-cf2b-4c94-a064-3704e4ad72bd-image.png

          H W D 3 Replies Last reply Reply Quote 0
          • H Offline
            hrmax23 @MMRIZE
            last edited by

            @MMRIZE

            This is a much more elegant solution than what I came up with. Many thanks!

            1 Reply Last reply Reply Quote 0
            • AssassinsA Offline
              Assassins
              last edited by

              Will it be possible to pull out the birthday that is associated with a contact person from icloud. ???

              M 1 Reply Last reply Reply Quote 0
              • luisestradaL Offline
                luisestrada @luisestrada
                last edited by

                @MMRIZE , just a note. I also use the browser to open the mirror and works in all platforms I’ve tested except one, Tizen browser (Samsung TVs). All modules work but this, no idea what happens but probably any form of javascript may not be supported by Tizen.

                I’m quite happy with the module though

                M 1 Reply Last reply Reply Quote 0
                • M Offline
                  MMRIZE @Assassins
                  last edited by

                  @Assassins

                  Will it be possible to pull out the birthday that is associated with a contact person from cloud. ???

                  AFAIK, impossible (at least, no automatic way);

                  First; This module is not for parsing calendar events but for showing events already parsed. It means other ics format parser (like the original default calendar module) has to do that work.

                  Second, The birthday calendar of iCloud contacts is not a general calendar which could be sharable. If you want to export the contact birthday to any normal calendar; export the contacts as VCONTACT(.vcf) format, then convert it to VEVENT(.ics) then import them to your target calendar. But I’m not sure there is any convenient converter for this job.

                  1 Reply Last reply Reply Quote 0
                  • M Offline
                    MMRIZE @luisestrada
                    last edited by

                    @luisestrada
                    Tizen is using Chromium nowadays, but the version is a bit old. The latest Tizen 6.5(Model 2022) is still using M85. (Current the newest Chromium is M100, M85 was 2-years ago). And if your Samsung TV has some age, It probably is too old to run the modern JS features. (Model 2021 => M76, Model2020=>M69, …)

                    luisestradaL 1 Reply Last reply Reply Quote 0
                    • H Offline
                      hrmax23
                      last edited by hrmax23

                      @MMRIZE Is there a way to show a rolling 4/5 week in the month mode? Basically something like -1 week to +3 weeks rather than showing basically the current month until that month is over.

                      Also, is there a trick to get the calendar to re-render completely on some interval? On my MM right now, it’s currently showing the current day in the 5th week (i.e. still showing April as the current month). If I restart MM, it will update to show May as current month, but doesn’t seem to do it automatically. I only have 1 scene so not using MMM-Scenes.

                      M R 3 Replies Last reply Reply Quote 0
                      • M Offline
                        MMRIZE @hrmax23
                        last edited by

                        @hrmax23
                        It sounds unexpected bug. Can you show(or send mail) the screenshot and config?

                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 4
                        • 5
                        • 67
                        • 68
                        • 1 / 68
                        • First post
                          Last post
                        Enjoying MagicMirror? Please consider a donation!
                        MagicMirror created by Michael Teeuw.
                        Forum managed by Sam, technical setup by Karsten.
                        This forum is using NodeBB as its core | Contributors
                        Contact | Privacy Policy