MMM-CalendarExt3Agenda

MMRIZE

@sdetweil
You are right.
However the example seems somehow ambiguous (though config description) It might mislead someone.(like @UncleRoger or me) :D

sdetweil

@MMRIZE yes, I would have preferred my description , but I can’t update the doc.

depends on where u want the config info (all in the pages config, which doesn’t support multi-instance cause it talks module name)

or all at the modules. page1, page2. etc

understandable, but spread out.

edit : I updated the MMM-Pages readme (also the front page of the module on Github )to describe this
https://github.com/sdetweil/MMM-pages

UncleRoger

@sdetweil @MMRIZE
You guys are amazing! Thank you!

Scenes2 looks really interesting but I think it’s probably overkill for what I’m trying to do (MagicMirror swapping with Mr. Rogers’ Picture Picture). I could see that there are a lot of possibilities with it. I might play around with it for a future build.

The reason I have two calendar modules is that one is displayed for the dinner menu and one is there just to define the calendars for MMM-MonthlyCalendar. I’m planning on playing with CalendarExt3 to see if I like it better than MonthlyCalendar but the latter was quick and easy to get going.

Anyway, thanks again!

sdetweil

@UncleRoger if it doesn’t have a position, it would.
be in the fixed section of pages, else it would think it is suspended, and not operate. fixedeans on all pages, but it still wouldn’t be shown

CDT

Possible bug here. The Agenda doesn’t show scheduled events on the final day as set by the endDateIndex.

I’m trying to get the Ext3Agenda to show me just a single day. Using startDayIndex:0, endDateIndex:0. When doing this, it only shows full-day events, not events scheduled a specific time.

If I change endDateIndex:1, then I get the proper items appearing, but also a header for day 2.

I notice that not matter what the endDateIndex is listed, it doesn’t seem to show sheduled events the last day. Only the header and any full-day events.

MMRIZE

@CDT thanks. I’ll check.

MMRIZE

@CDT
I’ve fixed it. Thanks for reporting it.

luisestrada

@CDT said in MMM-CalendarExt3Agenda:

Possible bug here. The Agenda doesn’t show scheduled events on the final day as set by the endDateIndex.

I’m trying to get the Ext3Agenda to show me just a single day. Using startDayIndex:0, endDateIndex:0. When doing this, it only shows full-day events, not events scheduled a specific time.

If I change endDateIndex:1, then I get the proper items appearing, but also a header for day 2.

I notice that not matter what the endDateIndex is listed, it doesn’t seem to show sheduled events the last day. Only the header and any full-day events.

I think you are referring to the same issue I posted a while ago but unfortunately I was not able to make myself clear.

CDT

@MMRIZE
Works perfectly now, thanks!

luisestrada

Happy new year everyone!

Indeed the fix works now. Thank you @MMRIZE

Another comment, even though “dentro de X días” is correct in Spanish it’s also long. It could also be said “En X días” and it will be also correct. Not an issue but a suggestion.
Screen Shot 2024-01-03 at 12.33.33 AM.png

BKeyport

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

luisestrada

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

luisestrada

@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.RelativeTimeFormat 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.,-RelativeTime&text=RelativeTimeFormat es una API interesante que,podemos hacerlo con esta API.

MMRIZE

@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.

MMRIZE

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

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",
},

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,

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

locale: "es-ES",

ZiggidyZ

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: "⬤";
}

luisestrada

@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",
},
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,
Of course, if you don’t care dentro de 3 días, You can use any locale under which you live.
locale: "es-ES",

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

MMRIZE

@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);
}

jimmy_382837

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);
}