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.

    How to add modules. For absolute beginners.

    Scheduled Pinned Locked Moved Troubleshooting
    91 Posts 16 Posters 132.4k Views 24 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
      sdetweil @Dask
      last edited by

      @Dask you should use a terminal window, and cd ~/MagicMirror/modules/??? where ??? is the module name

      and then type
      ``
      npm install

      ONLY of there is a file called package.json present in the module folder
      (npm install reads that file)
      
      and hit enter
      node and npm are installed system wide so there should be no problem

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 0
      • BKeyportB Offline
        BKeyport Module Developer @Dask
        last edited by

        @Dask I’ll walk you through this one, same for most non-scripted modules:

        assuming MagicMirror is installed with defaults:

        1. go to your modules directory: cd ~/MagicMirror/modules/
        2. Clone the module to get it on your machine: git clone https://github.com/mykle1/MMM-PilotWX.git
        3. go to the module’s directory: cd MMM-PilotWX
        4. install the dependencies npm install
        5. configure, and restart magic mirror.

        Cheers.

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

        1 Reply Last reply Reply Quote 0
        • Mykle1M Offline
          Mykle1 Project Sponsor Module Developer @Dask
          last edited by

          @Dask said in How to add modules. For absolute beginners.:

          First of all I would like to say thank you for the step by step tutorial. It helped me a lot and I can now install some MM modules.

          You’re welcome, mate.

          Create a working config
          How to add modules

          1 Reply Last reply Reply Quote 0
          • Mykle1M Offline
            Mykle1 Project Sponsor Module Developer @Dask
            last edited by Mykle1

            @Dask

            I haven’t touched MMM-PilotWX in some time so I loaded it up. All is well.

            This would be your default config entry. Once you have it up an running you can make your changes.

            {
            	disabled: false,
            	module: "MMM-PilotWX",
            	position: "top_left",         // for mode: "Static",  bottom_bar for mode: "Rotating",
            	config: {
            		ICAO: "KJFK,EGLL,UUDD,EDDT,RJAA,ZBAA,LFPG,LIRF", // list of INTL ICAO's
            		colorCode: "Alternative", // Standard or Alternative
            		mode: "Static",           // Static (List) or Rotating (one by one)
            		mostRecentPerStation: true,	//limits observations to 1 per station
            		sym: "@",                 // @ or / (Separator for Wind speed and direction)
            		tempUnits: "C",		   // C or F (F converted from C)
            		measure: "SM",            // SM or KM (KM converted from SM data)
            		time: "Local",            // Zulu or Local (observation time)
            		maxWidth: "100%",         // 100% for mode: Rotating, approx 300px for mode: Static
            		useAltHeader: true,	  // Use alternative header
            		useHeader: false,
            		header: "",
            	}
            },
            

            Create a working config
            How to add modules

            1 Reply Last reply Reply Quote 0
            • D Offline
              Dask
              last edited by

              Thank you all for the help. I am slowly getting it. Honest.

              1 Reply Last reply Reply Quote 0
              • D Offline
                Dask
                last edited by

                Mykle! I have the PilotMX instlled and working on the bottom bar with my chosen 2 airports but it takes up the full width of the screen. Can I make it narrower. I changed the maxWidth to 300px but it is still all the way across.

                BKeyportB 1 Reply Last reply Reply Quote 0
                • BKeyportB Offline
                  BKeyport Module Developer @Dask
                  last edited by

                  @Dask bottom bar is designed to do exactly that. you’d be better to use bottom_left, bottom_right, or bottom_center (or is it middle, I don’t recall, I keep my config organized by the regions, so I get reminded when I redesign)

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

                  1 Reply Last reply Reply Quote 0
                  • T Offline
                    TheSij @Mykle1
                    last edited by

                    @Mykle1 - thanks for this guide. I promise I’ve studied it through and read the additional helpful comments that other contributors have made. However, I’ve having trouble adding the MMM-PrayerTime module to config.js. When I add the module and MM restarts, it shows blank and an error telling me to create a config file. Grateful for pointers on where I’m going wrong (please see code below. I’ve hidden any personal information). Thanks.

                    To note that without the entry to the MMM-PrayerTime module added to config.js Magic Mirror runs fine with the other modules.

                    modules: [
                    		{
                    			module: "alert",
                    		},
                    		{
                    			module: "updatenotification",
                    			position: "top_bar"
                    		},
                    		{
                    			module: "clock",
                    			position: "top_left"		
                    		},
                    		{
                    			module: "MMM-PrayerTime",
                    			position: "top_left",	// This can be any of the regions. Best result is in the top_left/top_right.
                    			config: {
                    				apiVersion: "1.0", // please, leave unchanged. reserved for future use.
                    				lat: xx.xxxxxxx, // latitude of your position (city)
                    				lon: -x.xxxxxxx, // longitude of your position (city)
                    				timezone: Europe/London, // please refer to http://php.net/manual/en/timezones.php
                    				timeFormat: 24,
                    				method: 5,
                    				playAdzan: ["fajr", "dhuhr", "asr", "maghrib", "isha"],
                    				notDisplayed: ["midnight", "sunset"],
                    				useUpdateInterval: true,
                    				updateInterval: 86400 * 1000, // How often do you want to fetch new praying time? (milliseconds)
                    				animationSpeed: 2.5 * 1000, // Speed of the update animation. (milliseconds)
                    				language: config.language,
                    				showAdzanAlert: true,
                    				showTomorrow: true,
                    				vertical: true, // set false for horizontal view
                    				alertTimer: 15000
                    			}
                    		},
                    		{
                    			module: "calendar",
                    			header: "UK Holidays",
                    			position: "top_left",
                    			config: {
                    				calendars: [
                    					{
                    						symbol: "calendar-check",
                    						url: "webcal://www.calendarlabs.com/ical-calendar/ics/75/UK_Holidays.ics"					}
                    				]
                    			}
                    		},
                    		{
                    			module: "currentweather",
                    			position: "top_right",
                    			config: {
                    				location: "London",
                    				locationID: "2643743", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                    				appid: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
                    			}
                    		},
                    		{
                    			module: "weatherforecast",
                    			position: "top_right",
                    			header: "Weather Forecast",
                    			config: {
                    				location: "London",
                    				locationID: "2643743", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                    				appid: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
                    			}
                    		},
                    		{
                    			module: "newsfeed",
                    			position: "bottom_bar",
                    			config: {
                    				feeds: [
                    					{
                    						title: "New York Times",
                    						url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
                    					},
                    					{
                    						title: "BBC World News",
                    						url: "http://feeds.bbci.co.uk/news/world/rss.xml"
                    					},
                    					{
                    						title: "Reddit",
                    						url: "https://www.reddit.com/r/worldnews/.rss"
                    					},
                    					{
                    						title: "Buzzfeed",
                    						url: "https://www.buzzfeed.com/world.xml"
                    					},
                    					{
                    						title: "Al Jazeera",
                    						url: "http://www.aljazeera.com/xml/rss/all.xml"
                    					}
                    
                    				],
                    				showSourceTitle: true,
                    				showPublishDate: true,
                    				broadcastNewsFeeds: true,
                    				broadcastNewsUpdates: true
                    			}
                    		},
                    	]
                    };
                    
                    S 1 Reply Last reply Reply Quote 0
                    • S Offline
                      sdetweil @TheSij
                      last edited by

                      @TheSij ok, general rules for config values

                      thing to the right of :

                      if numeric or true/false
                      no quotes

                      otherwise quoted, single or double doesn’t matter as long as both ends are the same

                      exception here, if the string is config.something (yours has config.language)
                      then not quoted, as this means use the value of that item from this config

                      so, your timezone is text, but has no quotes.
                      I assume u xx the lat/long so we won’t know where u are

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      T 1 Reply Last reply Reply Quote 1
                      • T Offline
                        TheSij @sdetweil
                        last edited by

                        @sdetweil. Thanks, Sam. That’s helpful to explain the general rules.

                        I’ve made a slight amendment - I figured that the timezone parameters was not correctly entered (see below - this time just showing the modules before and after). To answer your last point, I did remove the lat/lon values to hide my exact location (this time I’ve put in made-up numbers). With the slight amendment to the code, it’s still not working - do you think it’s the ‘timezone’ value that is causing the problem? I’ve not made any changes to the other modules.

                        {
                        			module: "weatherforecast",
                        			position: "top_right",
                        			header: "Weather Forecast",
                        			config: {
                        				location: "London",
                        				locationID: "2643743", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                        				appid: "1ab234c567defgh89012ij34k56l78mn"
                        			}
                        		},
                        		{
                        			module: 'MMM-PrayerTime',
                        			position: 'top_left',	// This can be any of the regions. Best result is in the top_left/top_right.
                        			config: {
                        				apiVersion: '1.0', // please, leave unchanged. reserved for future use.
                        				lat: 12.3456789, // latitude of your position (city)
                        				lon: -0.1234567, // longitude of your position (city)
                        				timezone: date_default_timezone_set('Europe/London'), // please refer to http://php.net/manual/en/timezones.php
                        				timeFormat: 24,
                        				method: 5,
                        				playAdzan: ['fajr', 'dhuhr', 'asr', 'maghrib', 'isha'],
                        				notDisplayed: ['midnight', 'sunset'],
                        				useUpdateInterval: true,
                        				updateInterval: 86400 * 1000, // How often do you want to fetch new praying time? (milliseconds)
                        				animationSpeed: 2.5 * 1000, // Speed of the update animation. (milliseconds)
                        				language: config.language,
                        				showAdzanAlert: true,
                        				showTomorrow: true,
                        				vertical: true, // set false for horizontal view
                        				alertTimer: 15000
                        			}
                        		},
                        		{
                        			module: "newsfeed",
                        			position: "bottom_bar",
                        			config: {
                        				feeds: [
                        					{
                        						title: "New York Times",
                        						url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
                        					},
                        					{
                        						title: "BBC World News",
                        						url: "http://feeds.bbci.co.uk/news/world/rss.xml"
                        					},
                        					{
                        						title: "Reddit",
                        						url: "https://www.reddit.com/r/worldnews/.rss"
                        					},
                        					{
                        						title: "Buzzfeed",
                        						url: "https://www.buzzfeed.com/world.xml"
                        					},
                        					{
                        						title: "Al Jazeera",
                        						url: "http://www.aljazeera.com/xml/rss/all.xml"
                        					}
                        
                        S 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 4
                        • 5
                        • 6
                        • 9
                        • 10
                        • 4 / 10
                        • First post
                          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