• 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 Search description of event to trigger event color change.

Scheduled Pinned Locked Moved Solved Troubleshooting
8 Posts 2 Posters 1.1k Views 2 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.
  • H Offline
    Hobbit
    last edited by Mar 23, 2024, 3:08 PM

    Hello all,
    I know I’m simply not understanding the correct string to cause a search of the event to return my changes. I’m using the Transformation function on the documentation of Ext3. My goal is for the description of the event to be searched so that I can change the color of the event (sorta). So far this only changes the icon color next to the event, which is all I want to do. I see from other post, that to change the font color, that is a css issue to change. Not interested in that, a simple icon color change is enough.

    eventTransformer: (ev) => {
      if (ev.title.search('John') > -1) ev.color = 'blue'
      return ev
    }
    

    Using the title is no issue, I just don’t understand what string to use to search the description. This is all new to me, but I’m starting to understand the logic of many functions. Any direction or links to what I need to read to understand would be helpful.

    M 1 Reply Last reply Mar 23, 2024, 6:21 PM Reply Quote 0
    • M Offline
      MMRIZE @Hobbit
      last edited by Mar 24, 2024, 6:37 PM

      @Hobbit
      Hmmm… you are using CX3? or CX3A? minimonth... options are for CX3A, not CX3
      Anyway,
      32668946-4524-4b80-9046-2b160fc8ff0e-image.png

      /* In your config.js */
      {
      	module: "MMM-CalendarExt3",
      	position: "bottom_bar",
      	config: {
      		eventTransformer: (ev) => {
      			console.log(ev)
      			if (ev.description && ev.description.search('foo') > -1) {
      				ev.color = 'green'
      				ev.title = '[FOO] ' + ev.title
      			}
      			return ev
      		},
      	}
      },
      

      7f1730d3-7b7b-4ac8-a2aa-5850745458d7-image.png

      H 1 Reply Last reply Mar 24, 2024, 8:35 PM Reply Quote 0
      • M Offline
        MMRIZE @Hobbit
        last edited by MMRIZE Mar 23, 2024, 6:22 PM Mar 23, 2024, 6:21 PM

        @Hobbit
        .description instead of the .title
        https://github.com/MMRIZE/MMM-CalendarExt3?tab=readme-ov-file#handling-events

        H 1 Reply Last reply Mar 23, 2024, 6:43 PM Reply Quote 0
        • H Offline
          Hobbit @MMRIZE
          last edited by Mar 23, 2024, 6:43 PM

          @MMRIZE OK. Yes, that is what I thought. I replaced the .title to .description. When I did that, all events disappeared.

          M 1 Reply Last reply Mar 23, 2024, 11:04 PM Reply Quote 0
          • M Offline
            MMRIZE @Hobbit
            last edited by Mar 23, 2024, 11:04 PM

            @Hobbit
            Show me your parts of config. You probably miss ‘return’ statements.

            H 1 Reply Last reply Mar 24, 2024, 3:57 AM Reply Quote 0
            • H Offline
              Hobbit @MMRIZE
              last edited by Mar 24, 2024, 3:57 AM

              @MMRIZE Very possible. Thanks again for your time. If I use the normal .title everything works, but I switch to .description and nothing shows up at all in the calendar.

              miniMonthWeekdayOptions:{ weekday: 'short' },
                  eventTransformer: (ev) => {
                if (ev.description.search('HL') > -1) ev.color = 'green'
                return ev
              }
              
              M 1 Reply Last reply Mar 24, 2024, 6:37 PM Reply Quote 0
              • M Offline
                MMRIZE @Hobbit
                last edited by Mar 24, 2024, 6:37 PM

                @Hobbit
                Hmmm… you are using CX3? or CX3A? minimonth... options are for CX3A, not CX3
                Anyway,
                32668946-4524-4b80-9046-2b160fc8ff0e-image.png

                /* In your config.js */
                {
                	module: "MMM-CalendarExt3",
                	position: "bottom_bar",
                	config: {
                		eventTransformer: (ev) => {
                			console.log(ev)
                			if (ev.description && ev.description.search('foo') > -1) {
                				ev.color = 'green'
                				ev.title = '[FOO] ' + ev.title
                			}
                			return ev
                		},
                	}
                },
                

                7f1730d3-7b7b-4ac8-a2aa-5850745458d7-image.png

                H 1 Reply Last reply Mar 24, 2024, 8:35 PM Reply Quote 0
                • H Offline
                  Hobbit @MMRIZE
                  last edited by Mar 24, 2024, 8:35 PM

                  @MMRIZE I’m using CX3A, just the agenda part, I’ve got calendar displayed with only the events as dots. The script you send worked. I just removed the changing of the title,

                  eventTransformer: (ev) => {
                  			console.log(ev)
                  			if (ev.description && ev.description.search('HL') > -1) {
                  				ev.color = 'green'
                  				}
                  			return ev
                  

                  This is what I was looking for. I did not know how to do whatever you did using console.log and the if{ e.description && …}. I’ll do some reading to try and understand that function. I appreciate it.

                  For everyone else reading this in the future:
                  I’m using the default calendar module to handle symbols for events in a category. example: band practice. I’m then using the Ext3 agenda function to list out by day. But then by adding the above function I’m only changing the color of the icon not the text of the event. This gives a subtle color scheme to the agenda calendar. This allows me to create events in my google calendar and display colors to represent different family members based on terms in the description and the symbols to represent category. This way I don’t need different calendars for separate people, I can manage all simply by putting their name or keyword in the description. This may not be the best way but this is the path I took to achieve it.

                  M 1 Reply Last reply Mar 25, 2024, 8:37 AM Reply Quote 0
                  • M Offline
                    MMRIZE @Hobbit
                    last edited by Mar 25, 2024, 8:37 AM

                    @Hobbit
                    console.log() was used just to check event object has which properties. You can remove that line.
                    Sometimes, .description has no value at all, as false or null. In that case .description.search() couldn’t be perform, so whether check .description is not false or null at first hand. that’s all.

                    Some enhanced features of my module require JS or CSS skills. So sorry.

                    1 Reply Last reply Reply Quote 0
                    • 1 / 1
                    1 / 1
                    • First post
                      7/8
                      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