Navigation

    MagicMirror Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • Donate
    • Discord

    My 1st MagicMirror2

    Show your Mirror
    10
    21
    17393
    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
      sithlordhood last edited by sithlordhood

      Here is my first MagicMirror:
      alt text alt text

      alt text

      Rear View:
      alt text
      (the green tape covers the very sensitive motion sensor, I went for this one in the end: http://tinyurl.com/jdkb9fw)

      The frame was made from Pine, stained with varnish.
      Vent holes in the top and bottom, small fan in the top to aid airflow.
      The bottom holes also allow for a few Status LED’s (Monitor power / PIR trigger) and also allow access to a potentiometer to adjust the sensitivity of the PIR.
      I also extended 2x USB ports from the Pi to the bottom of the mirror so that I can plug in a keyboard/mouse for maintenance purposes whilst the mirror is still mounted on the wall.

      If there is no PIR trigger for a few minutes the Pi disables HDMI output, putting the monitor into Standby. Detection to monitor back on is 4 seconds, since the sensor is very sensitive I never see the monitor powering back up.

      1 Reply Last reply Reply Quote 4
      • Cato
        Cato Module Developer last edited by

        Nice!

        You say that the motion sensor is very sensitive. Do you get any false positives or is it sometimes it doesn’t trigger when it should?

        I like the idea of an USB extension! Why didn’t I think of that… 😉

        S cowboysdude 2 Replies Last reply Reply Quote 1
        • P
          plumcraft last edited by

          Nice, really clean dashboard

          1 Reply Last reply Reply Quote 0
          • D
            djdwayneanthony last edited by

            I love this! What a great dashboard! The colours, the layout, the features/modules you are using! I really like the “Hood Family mobile phones” module! What a brilliant way of keeping tabs on who’s in and who’s out! Commute to different destinations, it’s great!

            I’m sure none of it is overly difficult to an experienced wizard, me however, it’s like learning Russian and Cantonese at the same time, my mind is melting! haha

            Would you be willing to share your config.js.sample, .css and any other relevant info (probably with instructions for the newbies like me) and for others to clone parts of your fantastic design?

            S 2 Replies Last reply Reply Quote 1
            • S
              sithlordhood @Cato last edited by

              @Cato It always triggers when it should. The sensor is quite powerful though in that it will work through stud walls… even with the sensitivity at the lowest setting! Not really a problem as the Mirror is downstairs in the house so when people are in the mirror is ‘on’ but come bed time and when the house is unoccupied the mirror turns off.

              1 Reply Last reply Reply Quote 0
              • S
                sithlordhood @djdwayneanthony last edited by sithlordhood

                @djdwayneanthony Sure,

                Here is my config.js:

                /* Magic Mirror Config fILE
                *

                • By Michael Teeuw http://michaelteeuw.nl
                • MIT Licensed.
                  */

                var config = {
                port: 8080,

                language: 'en',
                timeFormat: 24,
                units: 'metric',
                
                modules: [
                	{
                		module: 'alert',
                		config: {
                			welcome_message: 'Welcome, Magic Mirror boot-up successful!',
                			},
                	},
                	{
                		module: 'MMM-Remote-Control',
                

                //uncomment for url position: ‘top_left’,
                },
                //uncomment {
                //for module: ‘MMM-Snow’,
                //s position: ‘fullscreen_above’,
                //n config: {
                //o flakeCount: 50,
                //w }
                //! },
                {
                module: ‘clock’,
                position: ‘top_left’
                },
                {
                module: ‘calendar’,
                position: ‘top_left’,
                header: ‘The Hoods Calendar’,
                config: {
                maximumEntries: 25,
                maximumNumberOfDays: 365,
                maxTitleLength: 25,
                animationSpeed: 0,
                fadePoint: 1,
                timeFormat: ‘absolute’,
                urgency: 7,
                calendars: [
                {
                symbol: ‘calendar’,
                url: ‘GOOGLE CALENDAR URL’
                }
                ]
                }
                },
                {
                module: ‘currentweather’,
                position: ‘top_right’,
                config: {
                location: ‘Portchester,United Kingdom’,
                locationID: ‘2649692’, //ID from http://www.openweathermap.org
                appid: ‘API KEY’,
                },
                },
                {
                module: ‘weatherforecast’,
                position: ‘top_right’,
                header: ‘Weather Forecast’,
                config: {
                fadePoint: 1,
                location: ‘Portchester,United Kingdom’,
                locationID: ‘2649692’, //ID from http://www.openweathermap.org
                appid: ‘API KEY’,
                showRainAmount: true,
                },
                },
                {
                module: ‘MMM-NetworkScanner’,
                position: ‘top_right’,
                header: ‘Hood Family Mobile Phones’,
                config: {
                devices: [
                { macAddress: “MAC1”, name: " Internet Router", icon: “wifi”},
                { macAddress: “MAC2”, name: “Simon”, icon: “mobile”},
                { macAddress: “MAC3”, name: “Emma”, icon: “mobile”},
                { macAddress: “MAC4”, name: “Jacob”, icon: “mobile”},
                { macAddress: “MAC5”, name: “Rhiannon”, icon: “mobile”},
                ],
                showUnknown: false,
                showOffline: true,
                keepAlive: 240,
                updateInterval: 10,
                },
                },
                {
                module: ‘calendar_monthly’,
                position: ‘top_right’,
                config: {
                fadeSpeed: 2,
                showHeader: ‘true’,
                cssStyle: ‘custom’, //block, clean, slate or custom
                updateDelay: 5,
                },
                },
                {
                module: ‘newsfeed’,
                position: ‘bottom_bar’,
                config: {
                showDescription: true,
                feeds: [
                {
                title: “BBC News”,
                url: “http://feeds.bbci.co.uk/news/rss.xml?edition=uk”
                },
                ],
                showSourceTitle: true,
                showPublishDate: true
                }
                },
                {
                module: ‘MMM-Traffic’,
                position: ‘bottom_bar’,
                classes: ‘dimmed medium’,
                config: {
                api_key: ‘API KEY’,
                mode: ‘driving’,
                origin: ‘ORIGIN’,
                destination: ‘DESTINATION’,
                // arrival_time: ‘0730’, //optional, but needs to be in 24 hour time if used.
                route_name: ‘Simon - Home to Work’,
                changeColor: ‘true’,
                showGreen: ‘true’,
                limitYellow: 15, //Greater than 15% of journey time due to traffic
                limitRed: 30, //Greater than 30% of journey time due to traffic
                traffic_model: ‘pessimistic’,
                interval: 120000 //2 minutes
                },
                },
                {
                module: ‘MMM-Traffic’,
                position: ‘bottom_bar’,
                classes: ‘dimmed medium’, //optional, default is ‘bright medium’, only applies to commute info not r$
                config: {
                api_key: ‘API KEY’,
                mode: ‘driving’,
                origin: ‘ORIGIN’,
                destination: ‘DESTINATION’,
                // arrival_time: ‘0730’, //optional, but needs to be in 24 hour time if used.
                route_name: ‘Emma - Home to Nursery’,
                changeColor: ‘true’,
                showGreen: ‘true’,
                limitYellow: 15, //Greater than 15% of journey time due to traffic
                limitRed: 30, //Greater than 30% of journey time due to traffic
                traffic_model: ‘pessimistic’,
                interval: 120000 //2 minutes
                },
                },
                {
                module: ‘MMM-Traffic’,
                position: ‘bottom_bar’,
                classes: ‘dimmed medium’, //optional, default is ‘bright medium’, only applies to commute info not r$
                config: {
                api_key: ‘API KEY’,
                mode: ‘driving’,
                origin: ‘ORIGIN’,
                destination: ‘DESTINATION’,
                // arrival_time: ‘0730’, //optional, but needs to be in 24 hour time if used.
                route_name: ‘Home to Nana & Grandad Hoods’,
                changeColor: ‘true’,
                showGreen: ‘true’,
                limitYellow: 15, //Greater than 15% of journey time due to traffic
                limitRed: 30, //Greater than 30% of journey time due to traffic
                traffic_model: ‘pessimistic’,
                interval: 120000 //2 minutes
                },
                },
                {
                module: ‘mmm-systemtemperature’,
                position: ‘bottom_bar’,
                classes: ‘small dimmed’,
                config: {
                prependString: 'CPU Temp: ',
                updateInterval: 5000,
                animationSpeed: 0,
                },
                },
                {
                module: ‘updatenotification’,
                position: ‘bottom_bar’,
                },
                ]

                };

                /*************** DO NOT EDIT THE LINE BELOW ***************/
                if (typeof module !== ‘undefined’) {module.exports = config;}
                bolded text


                I have removed api keys, destinations, etc so anything in ITALICS you would require adding your own variable here as described in the modules.

                The Modules I used are:
                alert (default module)
                MMM-Remote-Control
                MMM-Snow (I only configure this ON during the holiday period!)
                clock (default module)
                calendar (default module)
                currentweather (default module)
                weatherforecast (default module)
                MMM-NetworkScanner
                calendar_monthly
                newsfeed (default module)
                MMM-Traffic (used three times, for different commutes)
                mmm-systemtemperature
                updatenotification (default module)

                1 Reply Last reply Reply Quote 2
                • broberg
                  broberg Project Sponsor last edited by

                  You could remove the margins of the MM body, that way you would utilize more of the screen itself, since you have more mirror on the sides of the monitor 🙂

                  S schlachtkreuzer6 4 Replies Last reply Reply Quote 0
                  • S
                    sithlordhood @broberg last edited by

                    @broberg I will look into this - will give me a little more room. Cheers!

                    1 Reply Last reply Reply Quote 0
                    • S
                      sithlordhood @djdwayneanthony last edited by

                      @djdwayneanthony Also here is my custom.css - it is only colour changes for the Weather forecast and not my work - copied from someone else’s post here…

                      #/*****************************************************

                      • 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 {
                      }

                      .dimmed {
                      color: #666;
                      }

                      .normal {
                      color: #999’
                      }

                      .bright {
                      color: #fff;
                      }

                      .brightb {
                      color: #55acee;
                      }
                      .currentweather .wi-sunrise {
                      color: #ffd700;
                      }
                      .currentweather .wi-sunset {
                      color: #ffa500;
                      }
                      .currentweather .wi-day-sunny {
                      color: #ffff00;
                      }
                      .currentweather .wi-night-showers {
                      color: #55acee;
                      }
                      .currentweather .wi-degrees {
                      color: #415;
                      }
                      .currentweather .wi-rain {
                      color: #55acee;
                      }
                      .currentweather .wi-showers {
                      color: #55acee;
                      }
                      .currentweather .wi-night-showers {
                      color: #55acee;
                      }
                      .currentweather .wi-night-alt-cloudy-windy {
                      color: #aaa;
                      }
                      .currentweather .wi-night-cloudy {
                      color: #aaa;
                      }
                      .currentweather .wi-cloudy {
                      color: #aaa;
                      }
                      .currentweather .wi-day-cloudy {
                      color: #aaa;
                      }
                      .currentweather .wi-cloudy {
                      color: #aaa;
                      }
                      .currentweather .wi-cloudy-windy {
                      color: #aaa;
                      }
                      .currentweather .wi-showers {
                      color: #55acee;
                      }
                      .currentweather .wi-thunderstorm {
                      color: #ff00ff;
                      }
                      .currentweather .wi-snow {
                      color: #fff;
                      }
                      .currentweather .wi-fog {
                      color: #999;
                      }
                      .currentweather .wi-night-clear {
                      color: #fff;
                      }
                      .currentweather .wi-night-rain {
                      color: #55acee;
                      }
                      .currentweather .wi-night-thunderstorm {
                      color: #ff00ff;
                      }
                      .currentweather .wi-night-snow {
                      color: #fff;
                      }

                      .weatherforecast .wi-sunrise {
                      color: #ffd700;
                      }
                      .weatherforecast .wi-sunset {
                      color: #ffa500;
                      }
                      .weatherforecast .wi-day-sunny {
                      color: #ffff00;
                      }
                      .weatherforecast .wi-night-showers {
                      color: #55acee;
                      }
                      .weatherforecast .wi-degrees {
                      color: #415;
                      }
                      .weatherforecast .wi-rain {
                      color: #55acee;
                      }
                      .weatherforecast .wi-showers {
                      color: #55acee;
                      }
                      .weatherforecast .wi-night-showers {
                      color: #55acee;
                      }
                      .weatherforecast .wi-night-alt-cloudy-windy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-night-cloudy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-cloudy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-day-cloudy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-cloudy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-cloudy-windy {
                      color: #aaa;
                      }
                      .weatherforecast .wi-showers {
                      color: #55acee;
                      }
                      .weatherforecast .wi-thunderstorm {
                      color: #ff00ff;
                      }
                      .weatherforecast .wi-snow {
                      color: #fff;
                      }
                      .weatherforecast .wi-fog {
                      color: #999;
                      }
                      .weatherforecast .wi-night-clear {
                      color: #fff;
                      }
                      .weatherforecast .wi-night-rain {
                      color: #55acee;
                      }
                      .weatherforecast .wi-night-thunderstorm {
                      color: #ff00ff;
                      }
                      .currentweather .wi-night-snow {
                      color: #fff;
                      }

                      }

                      1 Reply Last reply Reply Quote 3
                      • D
                        djdwayneanthony last edited by

                        Legend! Will play about with this tomorrow! Thank you, and once again, well done!

                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 1 / 3
                        • First post
                          Last post
                        Enjoying MagicMirror? Please consider a donation!
                        MagicMirror created by Michael Teeuw.
                        Forum managed by Paul-Vincent Roll and Rodrigo Ramírez Norambuena.
                        This forum is using NodeBB as its core | Contributors
                        Contact | Privacy Policy