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

How to add modules. For absolute beginners.

Scheduled Pinned Locked Moved Troubleshooting
91 Posts 16 Posters 113.6k 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.
  • B Offline
    BKeyport Module Developer @Dask
    last edited by Jun 20, 2020, 9:51 PM

    @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 Jul 25, 2020, 2:13 PM

      @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 Jul 25, 2020, 2:21 PM Reply Quote 0
      • S Offline
        sdetweil @TheSij
        last edited by Jul 25, 2020, 2:21 PM

        @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 Jul 27, 2020, 7:26 PM Reply Quote 1
        • T Offline
          TheSij @sdetweil
          last edited by Jul 27, 2020, 7:26 PM

          @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 Jul 27, 2020, 8:18 PM Reply Quote 0
          • S Offline
            sdetweil @TheSij
            last edited by Jul 27, 2020, 8:18 PM

            @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

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            T 1 Reply Last reply Jul 27, 2020, 8:52 PM Reply Quote 0
            • T Offline
              TheSij @sdetweil
              last edited by Jul 27, 2020, 8:52 PM

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

              1 Reply Last reply Reply Quote 0
              • Mykle1M Offline
                Mykle1 Project Sponsor Module Developer
                last edited by Mykle1 Jul 27, 2020, 9:05 PM Jul 27, 2020, 9:04 PM

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

                I may have to abandon my desire to add this particular module.

                Don’t give up! I just installed this to test it for you. I can see why it was confusing for you but it does work. Here is my config entry. Use it as a template for yours, replacing your info for mine. The following screenshot shows it working.

                Screenshot from 2020-07-27 17-02-42.png

                {
                		module: 'MMM-PrayerTime',
                		position: 'top_center',	// 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: myLat, // latitude of your position (city)
                			lon: myLong, // 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
                		}
                	},
                

                Create a working config
                How to add modules

                S T 2 Replies Last reply Jul 27, 2020, 9:09 PM Reply Quote 0
                • S Offline
                  sdetweil @Mykle1
                  last edited by Jul 27, 2020, 9:09 PM

                  @Mykle1 thx!

                  so the original problem was the timezone wasn’t quoted.

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  Mykle1M 1 Reply Last reply Jul 27, 2020, 9:12 PM Reply Quote 0
                  • Mykle1M Offline
                    Mykle1 Project Sponsor Module Developer @sdetweil
                    last edited by Mykle1 Jul 27, 2020, 9:15 PM Jul 27, 2020, 9:12 PM

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

                    so the original problem was the timezone wasn’t quoted.

                    That and language: config.language, was causing an error. I simply commented it out and the module uses the config language by default. :-)

                    Edit: Oh, and timeFormat: 24, in the module’s config entry, as well. Again, I commented it out as it was redundant.

                    Create a working config
                    How to add modules

                    S 1 Reply Last reply Jul 27, 2020, 9:20 PM Reply Quote 0
                    • S Offline
                      sdetweil @Mykle1
                      last edited by Jul 27, 2020, 9:20 PM

                      @Mykle1 yep, didn’t see that right… because the javascript source code processor is in the process of reading the config object definition

                      var config= {
                      

                      the config object is not yet defined. so config.language cannot exist (yet)

                      but the timeFormat can be present AND redundant and not cause a startup error

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      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