• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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
654 Posts 77 Posters 1.8m Views 81 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.
  • A Offline
    almightyyoshi @MMRIZE
    last edited by Jul 18, 2024, 6:56 PM

    @MMRIZE Perfect. Thanks!

    1 Reply Last reply Reply Quote 0
    • A Offline
      almightyyoshi @MMRIZE
      last edited by Jul 18, 2024, 7:17 PM

      @MMRIZE I have two instances of CalExt3: monthly (currentMonth) and weekly (currentWeek). Except for one calendar (Dinner), they both currently shows events with the event time like this:

      7490b2cf-aa2d-4cbc-9b4f-a751723b6170-image.png

      What I’d like is for only the currentMonth instance to show events without the event time like this:

      bd4ad26a-65ea-4796-baff-daaed64cd52f-image.png

      M 1 Reply Last reply Jul 19, 2024, 6:56 AM Reply Quote 0
      • M Offline
        MMRIZE @almightyyoshi
        last edited by Jul 19, 2024, 6:56 AM

        @almightyyoshi

        /* css/custom.css */
        .CX3_currentMonth .event.singleday .headline .time {
          display: none;
        }
        

        Before
        0bfad0a3-4e6e-4ddc-9225-cc1b0f4e8d45-image.png

        After
        6a85d25f-0a1d-42f2-ab13-0af2117b1d8a-image.png

        A 1 Reply Last reply Jul 20, 2024, 11:57 AM Reply Quote 0
        • A Offline
          almightyyoshi @MMRIZE
          last edited by Jul 20, 2024, 11:57 AM

          @MMRIZE That worked…after I figured out I spelled instanceId incorrectly (I had instanceID). Thanks!

          1 Reply Last reply Reply Quote 0
          • M Offline
            moosespectacles
            last edited by Sep 4, 2024, 1:30 AM

            Anyone know of a config that looks identical/similar to the skylight calendar layout? I’m trying to emulate that look and those features, as a starting point, but I’m having trouble with getting the calendar to even display one week or 3 days, only. At the moment I see a week, with another week right next to it, instead of underneath it, as well as week numbers being show. I haven’t been able to figure out how to get rid of the extra days, nor the week numbers.

            S M 2 Replies Last reply Sep 4, 2024, 1:39 AM Reply Quote 0
            • S Offline
              sdetweil @moosespectacles
              last edited by Sep 4, 2024, 1:39 AM

              @moosespectacles well the skylight view is one week

              so

              mode:‘week’,
              weeksInView:1,

              then you have to use css to remove the weeknumber

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              1 Reply Last reply Reply Quote 0
              • M Offline
                MMRIZE @moosespectacles
                last edited by Sep 4, 2024, 6:13 AM

                @moosespectacles
                I think what you want is MMM-CalendarExtJournal, not this module.

                M 1 Reply Last reply Sep 4, 2024, 5:57 PM Reply Quote 0
                • M Offline
                  moosespectacles @MMRIZE
                  last edited by Sep 4, 2024, 5:57 PM

                  @MMRIZE said in MMM-CalendarExt3:

                  @moosespectacles
                  I think what you want is MMM-CalendarExtJournal, not this module.

                  The thing is I want the full calendar functionality, similar to Google calendar/skylight, so I have the ability to change views. Is that possible with either module or another? My main goal is a fully functional Google/skylight calendar clone, in terms of looks and features and use that as my layout, and build the rest of my features/modules off of that, so if I decide I want to add a tab for a shopping list or to do list later on, I can, but at minimum I’d love to be able to have a calendar that syncs with all of my family’s devices to be a family calendar

                  1 Reply Last reply Reply Quote 0
                  • D Offline
                    danncabrera
                    last edited by Sep 14, 2024, 5:33 AM

                    Love this module, and have spent some time modifying some parts of it using CSS and learning a lot on the way. One thing i have not been able to achieve is to have the time format to show exactly how i want it to be.

                    I want the time for any event to show like 9am / 9:15am instead of the “9:00 a.m.”, to save some space and try to make it more readable. Any ideas on how to achieve this?? i have tried to modify with eventtransformer code in many ways, but all i get is to turn back to 24hr; it seems like it defaults to my locale (ES), and i don’t want to switch since i want everything to be in Spanish.

                    Any suggestions are welcomed, thank you.

                    eventTransformer: (event) => {
                      // Get the event's start time as a Date object
                      let startDate = new Date(event.startDate);
                    
                      // Manually extract hours and minutes
                      let hours = startDate.getHours();
                      let minutes = startDate.getMinutes();
                      
                      // Determine AM or PM
                      let ampm = hours >= 12 ? 'pm' : 'am';
                      
                      // Convert 24-hour format to 12-hour
                      hours = hours % 12;
                      hours = hours ? hours : 12;  // If 0 (midnight/noon), set to 12
                    
                      // Format minutes (add leading zero if needed)
                      let formattedMinutes = minutes < 10 ? '0' + minutes : minutes;
                      
                      // Construct the final time format (e.g., "9am" or "9:15am")
                      let formattedTime = `${hours}${minutes === 0 ? '' : ':' + formattedMinutes}${ampm}`;
                    
                      // Manually set the formatted time as the event's start time
                      event.startTime = formattedTime;
                      
                      return event;  // Return the modified event with the new time
                    },
                    
                    S M 2 Replies Last reply Sep 14, 2024, 10:27 AM Reply Quote 0
                    • S Offline
                      sdetweil @danncabrera
                      last edited by Sep 14, 2024, 10:27 AM

                      @danncabrera did you try to change the formatting via the module configuration ?
                      see
                      https://devhints.io/moment

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      M 1 Reply Last reply Sep 14, 2024, 2:51 PM Reply Quote 0
                      • 1
                      • 2
                      • 51
                      • 52
                      • 53
                      • 54
                      • 55
                      • 65
                      • 66
                      • 53 / 66
                      • 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