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
    222 Posts 29 Posters 286.3k Views 31 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.
    • luisestradaL Offline
      luisestrada @BKeyport
      last edited by

      @BKeyport I tried to find the source but no idea where this comes from.

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

        @BKeyport said in MMM-CalendarExt3Agenda:

        @luisestrada I believe that’s a translation error - and may not even be “our” fault…

        I see there’s nothing we can do, with my limited programming skills I was able to get to row 271 in MMM-CalendarExt3Agenda.js

        let p = new Intl.RelativeTimeFormat(options.locale, { numeric: "auto", style: "long" })
        

        and I found out that Intl​.Relative​Time​Format is written like that, for Spanish locale settings.

        As I said before it’s not wrong but they could have said “en 3 días” instead of “dentro de 3 días”. It’s like in English when you say “in 3 days” and “within 3 days”.

        https://hpneo.dev/2019/05/13/apis-internacionalizacion.html#:~:text=Intl​.,-Relative​Time&text=Relative​Time​Format es una API interesante que,podemos hacerlo con esta API.

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

          @luisestrada
          I’ll prepare how to customize it soon. I’m on travel abroad now and will return to next week. Plz wait a while. Until then, you can hide it with css.

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

            @luisestrada
            Almost done (not yet released).
            By the way, which locale did you use and which country are you living?

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

              @luisestrada
              Done. (Released. v1.4.2)
              A new config value, relativeNamedDayOptions, is introduced. Now People can modify the option generally.

              However, for your specific purpose (en X días instead of dentro de X días), further step is needed.

              Only the Mexican locale supports en X días format with relativeNamedDayOptions: {style : 'short' }, other Spanish-locales don’t.
              So to get en X días, you have to use locale: 'es-MX' regardless of which country you live.

              locale: "es-MX",
              relativeNamedDayOptions: {
              	style: "short",
              },
              

              077dac12-38a4-4b6a-8bf3-049b35d08783-image.png

              If you are living in Mexico, there would be no issue. But in other countries where the week starts on Monday, 2 more configuration is needed.

              locale: "es-MX",
              relativeNamedDayOptions: {
              	style: "short",
              },				
              firstDayOfWeek: 1,
              minimalDaysOfNewYear: 4,
              

              bbfdc421-775f-4233-a6a7-ec64ffea0dc7-image.png

              Of course, if you don’t care dentro de 3 días, You can use any locale under which you live.

              locale: "es-ES",
              

              8dfad298-6fea-42ad-bb1d-3a8907e24f22-image.png

              luisestradaL 1 Reply Last reply Reply Quote 0
              • Z Offline
                ZiggidyZ
                last edited by

                Thank you so much for the awesome module!! I am enjoying both the EXT3 view for a 3 week peek, and use the Agenda for only the events for the current day.

                Does this module allow for symbols to be used on full day events? I have the full day events with symbol without issue on the EXT3 calendar, as well as 3 vanilla calendars I use to note what upcoming birthdays, anniversaries, and holidays there are, and it works there as well. The symbols DO work in Agenda for events that have a begin and end time.

                In looking at the css files for both modules, I noticed that there are more configurations for symbols in the EXT3 versus the EXT3A css. Is there something that I am missing that I need to do in order to enable them specifically for the Agenda module?

                From the module .css file for MMM-CalendarExt3:

                .CX3 .event .headline .symbol {
                  order: 1;
                }
                
                .CX3 .event.singleday .headline:not(.useSymbol)::before,
                .CX3 .event.singleday .headline.useSymbol .symbol.noSymbol::before {
                  content: "⬤";
                  color: var(--calendarColor);
                  display: inline-block;
                  padding-right: 2px;
                  font-size: 75%;
                }
                
                .CX3 .event .headline:not(.useSymbol) .symbol {
                  display: none;
                }
                
                .CX3 .event .headline.useSymbol .symbol {
                  display: inline-block;
                  padding-right: 2px;
                  font-size: 75%;
                  align-self: center;
                }
                
                .CX3 .event.singleday .headline.useSymbol .symbol {
                  color: var(--calendarColor);
                }
                

                From the module .css file for MMM-CalendarExt3Agenda:

                .CX3A .event .headline .symbol {
                  color: var(--calendarColor);
                  font-size: 75%;
                  vertical-align: text-bottom;
                }
                
                .CX3A .event .headline .symbol.noSymbol::after {
                  content: "⬤";
                }
                
                M 1 Reply Last reply Reply Quote 0
                • luisestradaL Offline
                  luisestrada @MMRIZE
                  last edited by

                  @MMRIZE said in MMM-CalendarExt3Agenda:

                  @luisestrada
                  Done. (Released. v1.4.2)
                  A new config value, relativeNamedDayOptions, is introduced. Now People can modify the option generally.

                  However, for your specific purpose (en X días instead of dentro de X días), further step is needed.

                  Only the Mexican locale supports en X días format with relativeNamedDayOptions: {style : 'short' }, other Spanish-locales don’t.
                  So to get en X días, you have to use locale: 'es-MX' regardless of which country you live.

                  locale: "es-MX",
                  relativeNamedDayOptions: {
                  	style: "short",
                  },
                  

                  077dac12-38a4-4b6a-8bf3-049b35d08783-image.png

                  If you are living in Mexico, there would be no issue. But in other countries where the week starts on Monday, 2 more configuration is needed.

                  locale: "es-MX",
                  relativeNamedDayOptions: {
                  	style: "short",
                  },				
                  firstDayOfWeek: 1,
                  minimalDaysOfNewYear: 4,
                  

                  bbfdc421-775f-4233-a6a7-ec64ffea0dc7-image.png

                  Of course, if you don’t care dentro de 3 días, You can use any locale under which you live.

                  locale: "es-ES",
                  

                  8dfad298-6fea-42ad-bb1d-3a8907e24f22-image.png

                  Thank you so much, it’s working perfectly. I had Spanish Colombia but I ended up switching to Mexico to make it work.

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

                    @ZiggidyZ
                    Sorry for late reply.

                    /* In your custom.css */
                    .CX3A .cellBody .fullday .event .headline .symbol,
                    .CX3A .cellBody .fullday .event .headline .symbol * {
                      display: inline-block;
                      color: var(--oppositeColor);
                    }
                    
                    
                    1 Reply Last reply Reply Quote 0
                    • J Offline
                      jimmy_382837
                      last edited by

                      1.4.2 looks great, thanks for the update!

                      i wanted to change the color of the weekend days from dodgerblue and crimson to a diff color. i had the below in my custom.css file from the previous version of the module, but it doesn’t seem to work any longer.

                      any suggestions?

                      
                      .CX3A {
                        font-size: 16px;
                        min-width: 300px;
                        max-width: 400px;
                        text-align: left;
                        color: lightgray;
                        --saturdayColor: rgb(147, 112, 219);
                        --sundayColor: rgb(147, 112, 219);
                        --todayColor: rgb(210,105,30);
                        --weekend_1_color: rgb(147, 112, 219);
                        --weekend_2_color: rgb(147, 112, 219);
                      }
                      
                      
                      1 Reply Last reply Reply Quote 0
                      • F Offline
                        ffingers6
                        last edited by

                        I was curious if it was possible to get a row view similar to the way MMM-CalendarExt2 worked. I have a good setup that works well for our use case, but want to move to CX3 if possible for some additional features and the reliance on the default calendar module for parsing.

                        This is my current setup…is it possible to adjust agenda to look like this? I can deal with the styling, but changing to a row format is the big question for me.

                        tempsnip.png

                        M D 3 Replies Last reply Reply Quote 0
                        • 1
                        • 2
                        • 13
                        • 14
                        • 15
                        • 16
                        • 17
                        • 22
                        • 23
                        • 15 / 23
                        • 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