• 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-CalendarExt3Agenda

Scheduled Pinned Locked Moved Utilities
221 Posts 28 Posters 275.9k Views 30 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.
  • B Offline
    BKeyport Module Developer @Wenike
    last edited by BKeyport Sep 3, 2022, 9:07 PM Sep 3, 2022, 9:04 PM

    @Wenike My max is set to 20, so I doubt that’s the issue. Here’s mine that works great - with events for weeks (because I follow sports)

    module: "calendar", // Built in
    //position: "top_right",
    config: {
    	broadcastEvents: true,
    	broadcastPastEvents: false,
    	fetchInterval: 30000,
    	maximumEntries: 20,
    (Calendars follow) 
    
    (cut)
    
    module: "MMM-CalendarExt3Agenda", // https://github.com/MMRIZE/MMM-CalendarExt3Agenda
    position: "top_center",
    config: {
    	showMiniMonthCalendar: false,
    	instanceId: "basicCalendar",
    	firstDayOfWeek: 0,
    	startDayIndex: 0,
    	endDayIndex: 99,
    	minimalDaysOfNewYear: 1,
    	animationSpeed: 0,
    	useSymbol: false,
    	useWeather: false,
    	waitFetch: 0,
    	eventTransformer: (ev) => {
    		if (ev.title.search("⚾") > -1)
    		ev.title = ev.title.replace("⚾️ ","");
    		return ev
    	},
    },
    

    62172bd1-9a9c-4621-8e66-bae7c1055180-image.png

    @hogedir - please post your configuration and screenshots like this. You can blur if needed. Alternatively, if you want a daily repeating event for testing, feel free to use my test calendar - I’ll give you the iCal address in private.

    The "E" in "Javascript" stands for "Easy"

    S 1 Reply Last reply Sep 3, 2022, 9:15 PM Reply Quote 0
    • S Offline
      sdetweil @BKeyport
      last edited by Sep 3, 2022, 9:15 PM

      @BKeyport I introduced a bug in 2.20.

      maximumentries includes those in the past incorrectly

      you can set it differently for each cal, but if u don’t then the module level value will be used.

      the bug is fixed in 2.21 coming oct 1.

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      B 1 Reply Last reply Sep 3, 2022, 9:17 PM Reply Quote 0
      • B Offline
        BKeyport Module Developer @sdetweil
        last edited by Sep 3, 2022, 9:17 PM

        @sdetweil really? I haven’t noticed. As you can see, I’ve got plenty of events…

        good to know, though.

        The "E" in "Javascript" stands for "Easy"

        S 1 Reply Last reply Sep 3, 2022, 10:15 PM Reply Quote 0
        • S Offline
          sdetweil @BKeyport
          last edited by Sep 3, 2022, 10:15 PM

          @BKeyport really trouble with past events getting counted

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • H Offline
            hogedir
            last edited by hogedir Sep 3, 2022, 11:35 PM Sep 3, 2022, 11:00 PM

            I’ve change it from 100 to 100000 and now its works,
            my calendar is showed now. thanks a lot for your reactivity guys, perfect answer.

            two other questions : this parameter symbol: ‘camera’ maybe be other value than ‘camera’? I did not understood why camera was by default… is there a list of other symbol values?

            other question : I want to extend the text limit showing because it’s looks like limited for the events that not have a eaxct duration like 10:00-12:00

            like you have here in your screen :
            b9cedf0c-6c5e-4919-8ab6-99b8dc848664-image.png

            Thanks.

            B 1 Reply Last reply Sep 3, 2022, 11:48 PM Reply Quote 0
            • B Offline
              BKeyport Module Developer @hogedir
              last edited by BKeyport Sep 3, 2022, 11:52 PM Sep 3, 2022, 11:48 PM

              @hogedir The event you point to is generated by the IRS, and is a full day event. the text is theirs.

              Here’s my CSS, fully commented for you to borrow:

              /* CalendarExt3Agenda */
              /* Set CX3a to size, etc. */
              .CX3A {
              	font-size: 18px;
              	min-width: 440px;
              	max-width: 440px;
              	max-height: 900px;
              	overflow-y: unset;
              	text-align: left;
              	position: relative;
              	color: var(--color-text);
              	--todayColor: DarkSlateGrey;
              	--saturdayColor : orange;
              	--sundayColor: darkGoldenRod; 
              }
              
              /* Hide useless descriptions, you wanna know, load your calendar */
              .CX3A .event .description {
              	display: none;
              }
              
              /* Hide useless locations, you wanna know, load your calendar */
              .CX3A .event .location {
              	display: none;
              }
              
              /* Set up custom full day look */ 
              .CX3A .cellBody .fullday .event {
              	color: var(--calendarColor);
              	background-color: var(--oppositeColor);
              	max-width: 100%;
              	padding: 0px 10px;
              	width: 100%;
              }
              
              /* make fullday events overflow onto next line */
              .CX3A .cellBody .fullday .event .title {
              	color: inherit;
              	overflow: unset;
              	white-space: unset;
              	text-overflow: unset;
              }
              
              /* Add the icon to full day events */
              .CX3A .cellBody .fullday .event .headline {
              	display: inline-block;
              }
              
              /* get rid of the icon for blanks	*/
              .CX3A .event .headline .symbol {
                display: none;
              }
              
              /* fullday keep the times hidden */
              .CX3A .cellBody .fullday .event .headline .time {
              	display: none;
              }
              
              /* Start Time Adjustments */
              .CX3A .event .time.startTime {
              	order: 2;
              	width: 90px;	
              	text-align: right;
              }
              
              /* Stretch title to left justify and organize */ 
              .CX3A .event .title { 
              	flex-grow: 1;
              	color: var(--calendarColor);
              }
              
              /* change date header to center & change color */
              .CX3A .agenda .cellHeader {
              	justify-content: center;
              	color: var(--text-color);
              }
              
              .CX3A .agenda .cellDay {
              	color: var(--text-color);
              }
              
              /* get rid of spare space & dash */
              .CX3A .event .startTime::after {
              	content: '';
              }
              
              /* Adjust time space */ 
              .CX3A .event .time {
              	font-size: unset;
               }
              
              /* Remove End time */
              .CX3A .event .endTime {
              	display: none;
              }
              
              /* Adjust how tall app is */
              .CX3A .agenda {
              	position: relative;
              	max-height: 900px;
              	overflow-y: hidden;
              }
              
              /* Fade adjustments */
              .CX3A .agenda::after {
              	position: absolute;
              	bottom: 0;
              	left: 0;
              	height: 6%;
              	width: 100%;
              	content: '';
              	background-image: unset;
              }
              

              8f5322a8-5dd8-4a48-83a6-fa1a62168e65-image.png
              (shading due to developer console)

              I decided to change it up, this is what it looks like now.

              color of events is set by the calendar functionality, thusly, background is via CSS:

              	url: "http://cal.events/VReW45.ics",
              	name: "Seahawks",
              	color: "#002244",
              

              The "E" in "Javascript" stands for "Easy"

              B H 2 Replies Last reply Sep 4, 2022, 12:29 AM Reply Quote 0
              • B Offline
                BKeyport Module Developer @BKeyport
                last edited by Sep 4, 2022, 12:29 AM

                @MMRIZE said in MMM-CalendarExt3:

                Small news.
                Now it could get the events from randomBrainstormer/MMM-GoogleCalendar module also.

                Are you planning on adding this to Agenda? I could use this.

                The "E" in "Javascript" stands for "Easy"

                M 1 Reply Last reply Sep 4, 2022, 1:14 PM Reply Quote 0
                • M Offline
                  MMRIZE @BKeyport
                  last edited by Sep 4, 2022, 1:14 PM

                  @BKeyport already applied.

                  1 Reply Last reply Reply Quote 0
                  • H Offline
                    hogedir @BKeyport
                    last edited by hogedir Sep 4, 2022, 7:26 PM Sep 4, 2022, 7:25 PM

                    @BKeyport I don’t understand how to extend the full day event like you. mine is limited and i have some space available like that

                    aab9321c-e70e-4f08-8665-38cd5186dc28-image.png

                    I want to extend totally the text for fullday event and not having these 3 points “…”

                    B L 2 Replies Last reply Sep 4, 2022, 11:38 PM Reply Quote 0
                    • B Offline
                      BKeyport Module Developer @hogedir
                      last edited by Sep 4, 2022, 11:38 PM

                      @hogedir It’s documented in my CSS above… Look closely you’ll find it. “fullday events overflow” is a clue.

                      The "E" in "Javascript" stands for "Easy"

                      W 1 Reply Last reply Sep 5, 2022, 1:28 AM Reply Quote 0
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 6
                      • 22
                      • 23
                      • 4 / 23
                      4 / 23
                      • First post
                        37/221
                        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