Heyhey! I also like to present my Magic(Dashboard)Mirror.

Here are some details:

Hardware:

• I used an 27" LG Screen because of the clean optic.
• To mount the screen as close as possible to the wall I ordered a Vogel’s WALL 3105
• Raspberry Pi 4 8GB w/ a 64 GB SD Card

Modules:

• Default Clock
• MMM-Wallpaper
• MMM-DarkSkyForecast
• MMM-MyCalendar
• MMM-PublicTransportBerlin
• MMM-Todoist (Connected with IFTTT Alexa Shopping List
• MMM-Fuel
• MMM-Remote-Control
• MMM-GoogleSheets (Stundenplan)
• MMM-NowPlayingOnSpotify

Styling Custom CSS:

• I used the custom layout from @earlman
• Next to that I spent a lot of time adjusting my custom CSS

Picture:

Hey everyone! Since last July I updated the Dashboard a bit and added new modules. If you are interested in the config.js and custom.css, I’ll upload the files on github later this week. So you can get in advantage of it.

Here some pics from the most recent dashboard.

@vandyck Right, that is not a Mirror. The title of the post is misleading. I used the MMM as a framework to display on a monitor all the details we need in my family. So let’s call it Family Dashboard

@mattkab Fantastic! Thank you very much for putting that together. Will test that later the day.

Hey there - the instructions above doesn’t worked for me. But I found a solution that works perfectly:

1. Open https://github.com/googlefonts/noto-emoji/tree/master/fonts
2. Download most recent NotoColorEmoji.ttf
3. Copy file in /home/pi/.fonts (if you cant see the .fonts folder please use CTRL+H to display it (Folders with names starting by “.” are hidden on Raspbian))
4. Done!

Hello @sdetweil - thanks for your quick response.

I guess you are half right. As soon as I trigger a timer with the EchoDot, I can see it on my iPad, iPhone etc.

There is some connection - similar to the Module “MMM-NowPlayingOnSpotify”

And I’ve noticed that some guys from the Home-Assistant Community developed a similar thing (Alexa Timer Card)

Here are some images from my iPad:

@sil3ntstorm Hey, ich nutze noch MMM-MyCalendar. Damit es aber richtig läuft, musste ich noch npm install request und npm install valid-url ausführen. In den letzten Updates vom MagicMirror wurden diese entfernt.

Quick update on this. Maybe someone else is looking for a similar way to automatically scroll through the list. You can added following code to the custom.css file:

/* MMM-Todoist Scrolling Animation */
.MMM-Todoist .divTable {
       white-space: nowrap;
       overflow: hidden;
       height:150px;   /* increase or decrease the height of the scrolling area*/
       box-sizing: border-box;
}

.MMM-Todoist .divTable div {
       -webkit-animation: divTable 25s linear infinite alternate;   /* adjust the seconds for the scrolling speed */
}

@-webkit-keyframes divTable {
      0% { -webkit-transform: translateY(5%); }
    100% { -webkit-transform: translateY(-70%); }
}

So the shopping or ToDo list is scrolling from the top to the bottom and back to the top again. Here an example: http://jsfiddle.net/51d4umwo/1/

@biebermann Ich hatte auch das Problem. Du musst deinen MM auf die neuste Version updaten.

(https://github.com/MichMich/MagicMirror/releases/tag/v2.17.1)

Great job! I also like your Medium article. Thanks for sharing and providing ideas.

Great job! I also like your Medium article. Thanks for sharing and providing ideas.

@Jalibu - fantastic Job! I just pulled the dev version and added the purchasePrice next to the quantity. The calculation is functioning properly. There is a slight discrepancy in the total amount, which is likely due to the exchange where I obtained my information. (The screenshot is from Parquet and they are utilizing Xetra as their exchange.

Overall the first iteration is really good.

Here some feedback (will share more as soon as I have time):

• Some of my stocks/ETFs have three decimal places for the prices (Column Kursgewinn)
• By adding more options like value increase % or total ect. new columns with header should be created. Otherwise it is confusing to understand where the number refers to.
• Kursgewinn could be colored with green or red

Hi @Jalibu - first, thanks for the great module and all the effort to help.

I was playing with the Depot feature and added all the quantities. It functions correctly, providing me with the current value based on the current market price of the stock. Now I’m wondering if is there a way to calculate the price gain since purchase, similar to the example provided?

Is it possible to add the purchase price next to the quantity, so that the price gain or loss can be automatically calculated based on the current price?

Best regards from Berlin

-Manuel

@mattkab Fantastic! Thank you very much for putting that together. Will test that later the day.

Hey there - just tested ChatGPT from OpenAI to create a module for the MM. The first lines of the description are looking very promising . Unfortunately, I’m getting a timeout in ChatGPT because of limited network capacity. Hope they will get back soon to test that more in detail.

Anyone else experience with ChatGPT?

Thank you! Is there also an option to disable it or can I only hide that via css?

Hello there - I finally got it to upload. I added the files (config.js, custom.css and main.css) to my Github. You can find it here:
https://github.com/mazim-co/Dashboard-Backup

NOTES:

1.) I removed all sensible information like API Keys and Access Tokens in the config.js. So, you have to follow the steps from each module (if requried) to get your own credentials.

2.) To get the same UI as my dasboard you have to replace the original main.css with my main.css.

3.) If you change the main.css you’ll get a notification every quarter as soon as MagicMirror will be updated. Because it will have a conflict with the original file. To inititate the MagicMirror update you can do a git reset --hard and replace the main.css again afterwards.

4.) The custom.css is designed in portrait mode for a 27 inch screen (LG 27MP89HM-S)

5.) For some modules you have to install valid-url and rrule-alt (e.g. MMM-MyCalendar).
For example:

cd MagicMirror/modules/MMM-MyCalendar
npm install valid-url
npm install rrule-alt

Good Luck!

Quick update on this. Maybe someone else is looking for a similar way to automatically scroll through the list. You can added following code to the custom.css file:

/* MMM-Todoist Scrolling Animation */
.MMM-Todoist .divTable {
       white-space: nowrap;
       overflow: hidden;
       height:150px;   /* increase or decrease the height of the scrolling area*/
       box-sizing: border-box;
}

.MMM-Todoist .divTable div {
       -webkit-animation: divTable 25s linear infinite alternate;   /* adjust the seconds for the scrolling speed */
}

@-webkit-keyframes divTable {
      0% { -webkit-transform: translateY(5%); }
    100% { -webkit-transform: translateY(-70%); }
}

So the shopping or ToDo list is scrolling from the top to the bottom and back to the top again. Here an example: http://jsfiddle.net/51d4umwo/1/

@MMRIZE Thank you!!

Hey everyone! Since last July I updated the Dashboard a bit and added new modules. If you are interested in the config.js and custom.css, I’ll upload the files on github later this week. So you can get in advantage of it.

Here some pics from the most recent dashboard.