How to add modules. For absolute beginners.

[johnnyboy]

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

@johnnyboy

Yes, I like and use NOAA3 still. Jeff’s weather module seems to be pretty popular. Have a look at that one. I use my own weather module mostly, MMM-BMW-DS. It uses the DarkSky API. I wanted something completely different in layout and appearance. Take a look if you like.

Thanks, Yeah, I like the look and layout of your one, but, I need to fill in the left hand side void, so will go with NOAA3 and see if that works across the pond.

I’ve not used a weather Mod since WunderGround stopped, and have been using several other Mod’s over time, but miss having the weather there as before.

I tried doing a search on here for 3rd party modules to see what is new, and which one’s members are looking at the most, and this thread came up in the search… (possibly because you have a link for 3rd party modules within?) clicked on your3rd party module link, and that is when I noticed it was an old one.

—Just a thought you may consider?.. Seeing as your ‘‘How To’’ threads are popular amongst the new members, would it be an idea to have a pinned post of all your ‘‘How To’s’’ ? One pinned post, with named links to all your tutorials? " How to Tutorials - For absolute beginners"

1/ How to add modules - < insert link >
2/ How to install MM on PC - < insert link >
3/ How to post code on the forum - < insert link >
4/ How to create a working config - < insert link >

Then lock the post so it does not become cluttered with questions? … Just a thought.

@cowboysdude

So @Mykle1 how do you add modules?

Hey up Amigo… How the hell are you? This place would be awfully quiet without your banter. … I’m sure your NOAA3 will be a good fit in my void :-D

[Mykle1]

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

—Just a thought you may consider?.. Seeing as your ‘‘How To’’ threads are popular amongst the new members, would it be an idea to have a pinned post of all your ‘‘How To’s’’ ? One pinned post, with named links to all your tutorials? " How to Tutorials - For absolute beginners"
1/ How to add modules - < insert link >
2/ How to install MM on PC - < insert link >
3/ How to post code on the forum - < insert link >
4/ How to create a working config - < insert link >
Then lock the post so it does not become cluttered with questions? … Just a thought.

That would be up to the administration of the forum. However, thank you for your vote of confidence, bro. :thumbsup:

[Chrisflex]

Where do I find the Windows version of what needs to be done here?

https://forum.magicmirror.builders/topic/4231/how-to-add-modules-for-absolute-beginners/2

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

Go to your Pi desktop

Click the File Manager folder. (Top menu bar, 3rd from the left, in Raspbian Jessie)

Double click the MagicMirror folder.

Double click the config folder.

Double click the config.js file. (Not the sample! The config.js file you made during setup)

Your config.js file is now open in a text editor. If not, open it in your text editor.

You have to add an entry for the module you just downloaded so that MM knows to load it.

Lets put the entry for MMM-JEOPARDY under your calendar module entry.

Modules that occupy the same postition display in the order they appear in the config.js file.

Scroll down to the calendar entry in the config.js file.

The calendar entry “ends” at the last }, and the compliments module entry begins with a {.
So, all module entries in the config.js file begin with a { and end with a },
Look at the way the modules are entered. What I just described should be evident.

Copy and paste the following “between” the ending of the calendar module entry - },

And the beginning of the compliments module entry - {

[Mykle1]

@Chrisflex

There isn’t one because the only difference is the path to your config folder. So, navigate to your config folder (inside the MagicMirror folder) and open it. If you don’t find a config.js file there then you need to copy and paste the config.js.sample file and rename the copy to config.js. Once you have made or found a config.js file then you can just follow the tutorial from there.

[Chrisflex]

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

There isn’t one because the only difference is the path to your config folder. So, navigate to your config folder (inside the MagicMirror folder) and open it. If you don’t find a config.js file there then you need to copy and paste the config.js.sample file and rename the copy to config.js. Once you have made or found a config.js file then you can just follow the tutorial from there.

Thank you very much, I will follow the instructions and see how I go.

[Dask]

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.
I do have a question though, I don’t really understand how to add dependencies. You say add it to the folder via the terminal??? I tried this on your PilotWX module but I don’t really know how to do it. I thought I did it eventually but nothing come up in my MM. I have also copied and pasted the other part into config.
Any help would be appreciated.

[BKeyport]

@Dask Dependencies are on a case by case basis. In many cases, it’s as simple as installing it into npm, by using npm install

In some cases, however, there’s additional outside programs or such that’s not covered by the npm install method. I’ve yet to see a module that requires additional software not include an installer script to take care of that for you, generally the readme will tell you if that’s the case.

Bottom line, follow the instructions in the readme.

[Dask]

BKeyport
Thank you for your reply. But I’m sorry to say I still don’t get it so let me explain my problem a little better.
The module says “npm install in your ~/MagicMirror/modules/MMM-PilotWX directory.” How do I do this. I tried going into ~/MagicMirror/modules/MMM-PilotWX but that command is not recognised in the terminal. How do I get into the correct place to add npm install.
Sorry if I am being stupid but this is all new to me.
Thanks

[sdetweil]

@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

[BKeyport]

@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.

[Mykle1]

@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.

[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: "",
	}
},

[Dask]

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

[Dask]

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.

[BKeyport]

@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)

[TheSij]

@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
			}
		},
	]
};

[sdetweil]

@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

[TheSij]

@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"
					}

[sdetweil]

@TheSij yes, still timezone., that syntax says call a function named date_default_timezone_set

but I don’t know where that would be.

just comment out that one line. add // at the start of the line

[TheSij]

@sdetweil - thanks! Unfortunately, still no luck on adding // at the start of the line, or after ‘timezone:’. According to the module creator, the timezone is a required field. I went to the php website that the module creator refers to, but it just doesn’t make sense to me - the coding information on that website is vast and much too advanced for me. I may have to abandon my desire to add this particular module. :-(