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.

    Need help with modules not displaying

    Scheduled Pinned Locked Moved Development
    4 Posts 3 Posters 360 Views 3 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.
    • I Offline
      Illimar
      last edited by

      Hi, I’m new at programming and made these two modules for a school project, but neither of them

      The first one is a days-left module that calculates how many days are to or from a given date:

      Module.register("days-left", {
        // config
        defaults: {
          textColor: "white",
          dates: [
            // format 'dd/MM/yyyy'
            { name: "2025", date: "01/01/2025" },
            { name: "2026", date: "01/01/2026" },
          ],
        },
        
        start: function () {
          var self = this;
          setInterval(function () {
            self.updateDom(); // updates instantly.
          }, 1000); //perform every 1000 milliseconds.
        },
      
        getDaysLeft: function (i) {
          const date = Date.now();
          
          const formattedDate = dateFormat(this.config.dates[i].date);
          const targetDate = new Date(formattedDate);
          
          const difference = targetDate - date;
          
          return Math.floor(difference / (1000 * 60 * 60 * 24));
        },
      
      
        dateFormat: function (date) {
          const dd = date.split("/")[0];
          const mm = date.split("/")[1];
          const yyyy = date.split("/")[2];
      
          const formattedDate = mm + "/" + dd + "/" + yyyy;
          return formattedDate;
        },
      
      
        getDom: function () {
          var wrapper = document.createElement("div");
          wrapper.style.color = this.config.textColor;
      
          for (let i in this.config.dates) {
            var days = getDaysLeft(i);
            var text = document.createTextNode(
              this.config.dates[i].name + ": " + days + " päeva pärast"
            );
      
            wrapper.appendChild(text);
      
            wrapper.appendChild(document.createElement("br"));
          }
          return wrapper;
        },
      });
      
      

      I have my suspection on the indexing of ‘this.config.dates[i].name’ but I’m not sure.

      And the other module is one that reads temp and humidity from the DHT11 sensor:

      Module.register("temperatuur", {
      
          // config
          defaults: {
              textColor: "white",
            },
          
          start: function () {
      
          },
      
          notificationReceived: function(notification) {
            switch(notification) {
              case "DOM_OBJECTS_CREATED":
      
                setInterval(()=>{
                  this.updateDom(500);
                }, 1000);
                break;
            }
          },
          
          getDom: function () {
            var wrapper = document.createElement("div");
            wrapper.style.color = this.config.textColor;
      
            this.sendSocketNotification("READ_FROM_SENSOR");
            var element = document.createElement("p");
            element.id = "text";
      
            wrapper.appendChild(element);
            
            return wrapper;
          },
      
          socketNotificationReceived: function(notification, payload) {
            switch(notification) {
              case "READ":
                var p = document.getElementById("text");
                p.innerHTML = payload;
                break
            }
          },
      });
        
      

      With this one I also used a node_helper.js file:

      var NodeHelper = require("node_helper")
      
      module.exports = NodeHelper.create({
      
        start: function() {
          this.temperature = '';
          this.humidity = '';
        },
      
        readFromSensor: function () {
          var sensor = require("node-dht-sensor")    
          sensor.read(11, 4, function(err, temperature, humidity) {
            if (!err) {
              return {temperature: temperature, 
                      humidity: humidity,
              };
            }
          });
        },
      
        getTemperature: function () {
          return this.readFromSensor().temperature;
        },
      
        getHumidity: function () {
          return this.readFromSensor().humidity;
        },
      
      
        socketNotificationReceived: function(notification) {
          switch(notification) {
            case "READ_FROM_SENSOR":
              var payload = (this.getTemperature() + "°C" + " - " + this.getHumidity() + "%");
              this.sendSocketNotification("READ", payload);
              break;
          }
        },
      })
      

      With the last one I have tested the read function and it works when run from a separate .js file. I’ve also tested that both modules can display simple string text.

      S M 3 Replies Last reply Reply Quote 0
      • S Do not disturb
        sdetweil @Illimar
        last edited by

        @Illimar the module name, folder, modulename.js AND the value in the module.register

        Module.register("days-left"
        

        MUST match exactly.

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • S Do not disturb
          sdetweil @Illimar
          last edited by

          @Illimar open the developers window, ctrl-shift-i

          select the sources tab, and send the left navigation to you module name

          the console tab could show errors too.

          put a unique part of the module name I the filter field

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • M Offline
            MMRIZE @Illimar
            last edited by

            @Illimar said in Need help with modules not displaying:

            getDaysLeft() and dateFormat() are defined as member methods of the module, but you are using them as general functions.

            var days = getDaysLeft(i);
            

            It should be;

            var days = this.getDaysLeft(i);
            

            Or, even better is; to define getDaysLeft as a general function inside of getDom(), because only there the function is used once and nowhere else. It doesn’t need to be defined as a member of the module.

            getDom: function() {
              const getDaysLeft = (i, config) => {
                const date = Date.now();
                ...
              }
              let wrapper = document.createElement('div');
              wrapper.style.color = this.config.textColor;
              for (let i in this.config.dates) {
                let days = getDaysLeft(i, this.config);
              ...
            
            
            1 Reply Last reply Reply Quote 0

            Hello! It looks like you're interested in this conversation, but you don't have an account yet.

            Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

            With your input, this post could be even better 💗

            Register Login
            • 1 / 1
            • 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