MMM-CalendarExt

[jimmysmalls]

I can’t seem to figure out why I don’t have the start times on my calendar. I’m really liking it other than that. I’m sure it’s probably something simple but I’m open to feeling stupid after the time I’ve spend trying to figure it out haha

{
      module: 'MMM-CalendarExt',
      position: "lower_third", // ignore this.
      config: {
        system: {
          show: ['month'],
          locale: 'en',
	  showEmptyView: 1,
        },
        views: {
          month: {
            position:'lower_third',
	    showWeeks: 0,
	    onlyStartingTime:1,
          },
        },
        calendars :[
          {

[A Former User]

@jimmysmalls
By default, time of month/week view is hidden because there might be not enough space.
Add this into your css/custom.css;

.CALEXT .tableStyle .eventTime {
   display: block;
   order: 3; // when you want to display time under the event title. 
}

[jimmysmalls]

@sean
That did the trick, thank you! One other quick question that maybe I’m overlooking the answer to in the documentation but is there a way to have it show the time on a 12 hour format instead of 24?

[A Former User]

@jimmysmalls
use timeFormat: "hh:mm A" instead timeFormat: "HH:mm"
If you don’t want AM/PM indicator, just use "hh:mm"

[JKTitanium]

@vauxdvihl

Hi, Sorry I new here. Do I need a seperate Calender for each icon/emoj? Can I use Rules for one single Calendar?

[A Former User]

@jktitanium
Symbol is fixed per calendar.
However each event style(color or font except symbol) could be variable by condition.

[Frek]

Hi. In weeks view with event time displayed, is there a way to remove the starting time and ending time on full day events?

[A Former User]

@frek
Add this into your css/custom.css;

.CALEXT .tableStyle .eventTime {
display: none;
}

[Frek]

@sean
Thx for the reply.
I already have this in my css to display time, that I want:

div.CALEXT .tableStyle .eventTime {
display:block;
font-weight:normal;
font-size:70%;
}

But I was wondering if on full day events its possible to only show title, not the time

[A Former User]

@frek

div.CALEXT .tableStyle .fulldayevent .eventTime {
  display:none;
}

Try this.

[Frek]

@sean
tried adding i to my custom.css and no change. my .css looks like:

 /*****************************************************
 * Magic Mirror                                      *
 * Custom CSS                                        *
 *                                                   *
 * By Michael Teeuw http://michaelteeuw.nl           *
 * MIT Licensed.                                     *
 *                                                   *
 * Add any custom CSS below.                         *
 * Changes to this files will be ignored by GIT. *
 *****************************************************/

 body {
  margin: 10px;
  height: calc(100% - 20px);
  width: calc(100% - 20px);	
 }
 div.CALEXT .tableStyle .fulldayevent .eventTime {
  display:none;
 }
 div.CALEXT .tableStyle .eventTime {
  display:block;
  font-weight:normal;
  font-size:70%;
 }
 .CALEXT .tableStyle td.slot {
  max-height:200px;
  height:200px;
 }
 .CALEXT .tableStyle {
  margin:0;
  max-width: 100%;
 }

[A Former User]

@frek said in MMM-CalendarExt:

div.CALEXT .tableStyle .fulldayevent .eventTime {
display:none;
}
div.CALEXT .tableStyle .eventTime {
display:block;
font-weight:normal;
font-size:70%;
}
.CALEXT .tableStyle td.slot {
max-height:200px;
height:200px;
}
.CALEXT .tableStyle {
margin:0;
max-width: 100%;
}

I tested with your CSS but it works as expectation.

[Frek]

@sean ah suck… my test calendar didnt have a full day event… just a long normal event. Google calandar tricked me by showing me it as a fullday event in their app…No wonder why it didnt work… thx for the help =)

[goalie2k]

Is it possible to make the event time display on the SAME line as the event title?

[A Former User]

@goalie2k
Of course possible by adjusting CSS
Add this into your css/custom.css

.CALEXT .event .eventContainer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}


.CALEXT .eventTime {
  order: 2;
  width: 30%;
}

.CALEXT .eventContent {
  order: 1;
  width: 70%;
}

It will show like this.

[goalie2k]

@Sean said in MMM-CalendarExt:

order: 2;
width: 30%;

YOU ROCK! Thank you!

[Subintro]

Hey does anyone know how to change text on the calendars?

I’m using the ‘Current’ event, but it looks kind of confusing as it says ‘In 50 minutes’, which makes it seem like the event is in 50 minutes, but really ends in 50 minutes

[A Former User]

@Subintro

With MMM-CalendarExt, it’s not so easy. You just use useRelative:0 to display normal time. Anyway “CURRENT” event will not be thing of “START IN FUTURE”, It is already started and be a kind of “END IN FUTURE” things. “CURRENT” means that.

How about using MMM-CalendarExt2? That is new build-up and the feature can be configurable and customizable by configuration.
https://github.com/eouia/MMM-CalendarExt2/wiki/Event-Time#2-relative

[Subintro]

@Sean

Oh nice, I’ll check it out. Hopefully wont have to change too much with my config

[Smotx]

Hi,

Little help please,

how to reduce the height of the module?

It adapts automatically to the content, but suddenly exceeds the top one

Thx a lot.