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

Scheduled Pinned Locked Moved Troubleshooting
4 Posts 3 Posters 2.0k Views 4 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.
  • S Offline
    shfaxx
    last edited by shfaxx Nov 30, 2019, 7:47 PM Nov 30, 2019, 5:02 PM

    Re: MMM-CalendarExt2
    Hello all, loving this project, new to MM… I see lots of things I like but don’t always see how to accomplish then, any help you guys can provide would be awesome.

    Using a 1920x1080 display rotated, want full month view to replace traditional wall calendar.

    • How can I get events to wrap to second line in month view?
      Saw somewhere that it’s not possible due to multi day events? However I think I just saw someone post this.

    • My entire left side of my calendar getting cut off - How can I shift the whole calendar to the right? I’m assuming I have some conflict border or margin setting somewhere, but after many edits, I still cannot correct it.

    • Why does calendar disappear for a second and come back? Is it refreshing? Can I stop it from disappearing?

    *************  CONFIG.JS **********
     {
                              module: 'MMM-CalendarExt2',
                              config: {
                                calendars : [
                                  {
                                    url: "https://rest.cozi.com/api/ext/
    /*                              url: "https://calendar.google.com/calendar/
                                  },
                                ],
                                views: [
                                    {
                                      title: "What's Happening Soon",
                                      name: "DailyView",
                                      mode: "daily",
                                      calendars: [],
                                      position:"top_left",
                                      hideOverflow: false,
                                      slotCount: 3,
                                      className: "remove_empty_slot"
                                    },
    
                                  {
                                    mode: "month",
                                    position: "fullscreen_below",
                                    timeFormat: "h:mm",
                                    hideOverflow: false,
                                    slotMaxHeight: "200px",
                                    maxItems: 500,
                                  },
                                ],
                                scenes: [
                                  {
                                    name: "DEFAULT",
                                  },
                                ],
                              },
                            },]
    
    };
    
    
    ******************CSS*****************
    
    body {
            margin: 10px;
    /*      height: calc(100%);*/
            width: 1060px;
    }
    
    .CX2 .remove_empty_slot .eventCount_0 {
      display:none;
    }
    
    .CX2 .cellSlot .slotSubTitle {
    color:#3A6061;
    }
    
    .CX2 .cellSlot .slotTitle {
    color:#999;
    text-alignment: "right";
    }
    
    .CX2 .cellSlot.weekday_6 .slotSubTitle {
    color:#3A6061;
    }
    
    .CX2 .cellSlot.weekday_6 .slotTitle {
    color:#999;
    }
    
    .CX2 .cellSlot.weekday_7 .slotSubTitle {
    color:#661414;
    }
    
    .CX2 .slot{
    padding:0px 4px;
    border:4px solid #000000;
    }
    
    /* Formats header */
    .CX2 .slot .slotHeader {
    background-color:#000000;
    border-top:2px solid #3A6061;
    border-bottom:2px solid #3A6061;
    margin-top:5px;
    margin-bottom:15px;
    height:calc(var(--font-size) + 6px);
    font-weight:normal;
    padding:6px 6px 0;
    }
    
    .CX2 .today .slotHeader { /* today slot /
    background-color:#afcecf;
    /* background-color:#080a0a;*/
    color:#999;
    }
    
    .CX2 .today .slotHeader * {
    color:#999;
    }
    
    .CX2 .today .slotSubTitle {
    color:#3A6061;
    }
    
    .CX2 .weekSlot {
    position:relative;
    }
    
    .CX2 .today.slot {
    /*background-color:#afcecf;*/
    background-color:#0a1010;
    border:4px solid #1d2f30;
    }
    
    .CX2 .slot > .slotContent{
    position:relative;
    width:100%;
    background-image: none;
    }
    
    .CX2 .module-content { /* fake module body */
    color:#999;
    font-family: 'Roboto', sans-serif;
    }
    
    .CX2 .weeksmark {
    display:none;
    }
    
    /***** Event *****/
    .CX2 .event {
    padding:5px;
    margin:12px 0 0 8px;
    background-color:transparent;
    position:relative;
    text-align:left;
    }
    
    /* how to treat full day events*/
    .CX2 .event.fullday {
    border-radius:unset;
    background-color:transparent;
    color:#999;
    margin:12px 0 0 8px;
    }
    
    

    0_1575133369426_IMG-7613.jpg

    S ? 2 Replies Last reply Nov 30, 2019, 7:46 PM Reply Quote 0
    • S Offline
      shfaxx @shfaxx
      last edited by Nov 30, 2019, 7:46 PM

      Also would like to know how to remove the extra line at the bottom of the events in each day. This sucks up a bunch of space.

      B 1 Reply Last reply Dec 1, 2019, 8:53 AM Reply Quote 0
      • B Offline
        BKeyport Module Developer @shfaxx
        last edited by BKeyport Dec 1, 2019, 8:56 AM Dec 1, 2019, 8:53 AM

        @shfaxx Check to see if “hideOverflow: false,” in your view section takes out the extra space. It did for me in another view style.

        also, @sean would have the answer on the cutoff, but I suspect it’s something to do with the rotation - I think it’s been covered before, check the main topic at https://forum.magicmirror.builders/topic/9279/

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

        1 Reply Last reply Reply Quote 0
        • ? Offline
          A Former User @shfaxx
          last edited by Dec 1, 2019, 2:23 PM

          @shfaxx said in MMM-CalendarExt2:

          How can I get events to wrap to second line in month view?
          Saw somewhere that it’s not possible due to multi day events? However I think I just saw someone post this.

          Can’t wrap. Ideally, it could be done by modification of CSS, but I don’t recommend it.
          I regard this table views as a summary or overview, so I didn’t make it show details. MagicMirror screen resolution is not so enough(especially vertical layout). If wrapping would be allowed, the number of showing events should be less. For example, you have 6 events on Nov. 13, 4 are partially shown and 2 are hidden. With wrapping, 1 or 2 events would be displayed fully but others might be hidden. I believe it would be worse than current.

          My suggestions are;

          • To use with other detail views - daily or upcoming, current views - together to get detailed information.
          • You can abbreviate titles and give separated styles by transform option to distinguish easily with less text.
            (Example; you can give an icon and blue font for Kim's schedule and remove the text Kim from event Title.)

          My entire left side of my calendar getting cut off - How can I shift the whole calendar to the right? I’m assuming I have some conflict border or margin setting somewhere, but after many edits, I still cannot correct it.

          Maybe. But without whole CSS, I have no idea about it.

          Why does calendar disappear for a second and come back? Is it refreshing? Can I stop it from disappearing?

          Yes, it is refreshing. Adjust interval from configuration.

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