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.

    MMM-MealViewer

    Scheduled Pinned Locked Moved Development
    48 Posts 6 Posters 30.4k Views 6 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 Do not disturb
      sdetweil
      last edited by

      Open the developers window, ctrl-shift-i on the keyboard. Select the console tab and scroll up to see any errors. Usually red text

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      G 1 Reply Last reply Reply Quote 0
      • G Offline
        gonzonia @sdetweil
        last edited by

        @sdetweil Thank you. That’s helpful (I’m still learning the ins and outs of Magic Mirror) but there’s no errors. The “Undefined” is coming up while it’s loading the data. There’s no documentation for the module, I’m thinking there’s something that’s missing in the setup.

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

          @gonzonia can u should your config info?

          looking at the code, these are the options that are configurable

            defaults: {
              schools: [],
              maxWidth: "300px",
              updateInterval: 5 * 60 * 1000,
              interval: 1000 * 60 * 15,
            }
          

          where schools is an array of names
          [ ‘school1’,school2’, ‘school3’]

          used to call the api

          https://api.mealviewer.com/api/v4/school/’ + this.config.schools[i]

          school names can be found here
          https://schools.mealviewer.com/

          comment says only for one day
          // Currently set to only pull one day’s data so endDayFormatted = todayFormatted

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          G 1 Reply Last reply Reply Quote 0
          • G Offline
            gonzonia @sdetweil
            last edited by

            @sdetweil
            Thanks. I actually went in to the code and tweaked it. It was pulling the data fine, I think the issue was that the original developer’s usage only had a single meal (Lunch) available at the school and so it worked as is. Our school has Breakfast and Lunch I added an additional iteration to show all the meals or just what was placed in the config. The header now also reflects that. I’m not sure what that was supposed to do before because I couldn’t figure out where it was expecting the data.header to come from since nothing was loaded.

            My changes can be found here.

            https://github.com/gonzonia/MMM-MealViewer/tree/patch-1
            added shortName to config to replace text based on config option instead of hardcoded
            changed className to menuWrapper to allow for style control without interfering with other modules
            added config option for showing single or multiple meals based on name, default is All

            Still need to add some documentation but it might be a couple of weeks.

            1 Reply Last reply Reply Quote 0
            • G Offline
              gonzonia
              last edited by

              The module works great on the initial load. The problem is that it doesn’t seem to be updating. After 12pm it’s supposed to start showing the next days meals but doesn’t. Even the next day it doesn’t update. I’ll try to dig into the core aspects of developing a module and see if I can find out why, but if anyone with more experience has any ideas where I should start looking I’d appreciate it.

              1 Reply Last reply Reply Quote 0
              • G Offline
                gonzonia
                last edited by

                Okay. I’ve identified the problem. In the code below, everything gets setup in the “start” function. Then it calls getMenuData. That function ends by setting up a timer to call itself but isn’t supplying the object necessary. This means it won’t work. If I add the _this object to pass it causes all sorts of problems.
                I’m not a js expert. I’m sure a way to re-factor this will eventually occur to me, but right now I’m just not seeing it.

                start:  function() {
                    Log.log('Starting module: ' + this.name);
                
                    // Set up the local values
                    var today = moment();
                    this.loaded = false;
                    this.urls = [];
                    this.results = [];
                
                    // Uses now are today if before noon and tomorrow as today if after noon
                    if (today.hour() >= 12) {
                      var todayFormatted = today.add(1, 'day').format('MM-DD-YYYY');
                    }
                    else {
                      var todayFormatted = today.format('MM-DD-YYYY');
                    }
                
                    // Currently set to only pull one day's data so endDayFormatted = todayFormatted
                    //var endDay = today.add(config.showDays, 'days');
                    //var endDayFormatted = endDay.format('MM-DD-YYYY');
                    var endDayFormatted = todayFormatted;
                
                    // Construct the url array for the schools
                    for (var i in this.config.schools) {
                			this.urls.push({school: this.config.schools[i], url: 'https://api.mealviewer.com/api/v4/school/' + this.config.schools[i] + '/' + todayFormatted + '/' + endDayFormatted + '/'});
                    }
                
                    // Trigger the first request
                    this.getMenuData(this);
                  },
                
                  getMenuData: function(_this) {
                    // Make the initial request to the helper then set up the timer to perform the updates
                    _this.sendSocketNotification('GET-MENU-DATA', _this.urls);
                    setTimeout(_this.getMenuData(), _this.config.interval, _this);
                  },
                
                
                
                S 1 Reply Last reply Reply Quote 0
                • S Do not disturb
                  sdetweil @gonzonia
                  last edited by

                  @gonzonia said in MMM-MealViewer:

                  getMenuData: function(_this) {
                  // Make the initial request to the helper then set up the timer to perform the updates
                  _this.sendSocketNotification(‘GET-MENU-DATA’, _this.urls);
                  setTimeout(_this.getMenuData(), _this.config.interval, _this);
                  },

                  do this

                   getMenuData: function(_this) {
                      // Make the initial request to the helper then set up the timer to perform the updates
                      _this.sendSocketNotification('GET-MENU-DATA', _this.urls);
                      setTimeout(function() {_this.getMenuData(_this)}, _this.config.interval);
                    },
                  

                  this creates a little inline function which CAN pass parms on to the next routine

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  G 1 Reply Last reply Reply Quote 0
                  • G Offline
                    gonzonia @sdetweil
                    last edited by

                    @sdetweil Thanks! I’ll make the change and see what happens when it should update mid-day tomorrow.

                    1 Reply Last reply Reply Quote 0
                    • cowboysdudeC Offline
                      cowboysdude Module Developer
                      last edited by cowboysdude

                      Or you could do this:

                      scheduleUpdate: function() {
                             setInterval(() => {
                                 this.getMenuData();
                             }, this.config.updateInterval); 
                         },
                          getMenuData: function() {
                             this.sendSocketNotification('GET-MENU-DATA');
                         }
                      

                      At the top of the main js you set the interval:

                      updateInterval: 15 * 60 * 1000,
                      

                      Then in the start section you call it:

                      // Define start sequence.
                         start: function() {
                             Log.info("Starting module: " + this.name); 
                             this.scheduleUpdate();
                         },
                      

                      Either the way Sam showed you or the above will work :)

                      G 1 Reply Last reply Reply Quote 0
                      • G Offline
                        gonzonia @cowboysdude
                        last edited by gonzonia

                        @cowboysdude Thanks! I might switch to that. I’ve had to rework it a little because the URL wasn’t getting set except at the first call. I just moved setup for that into the getMenuData and I think it’s all working now. I’ll give it a day to run and see what happens tomorrow before I try messing with it again and update the file on github.

                        -updated to fix grammar

                        1 Reply Last reply Reply Quote 1
                        • cowboysdudeC Offline
                          cowboysdude Module Developer
                          last edited by cowboysdude

                          Sam is a REALLY smart guy so he gives you the smart guy answer…
                          I’m not as smart so I give you my dumb guy answer LOL

                          It will work either way … so now you def have an answer that works :)

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

                            @cowboysdude said in MMM-MealViewer:

                            Sam is a REALLY smart guy so he gives you the smart guy answer

                            nah, Sam is the LAZY guy… change as LITTLE as possible. especially for folks just starting out

                            Sam

                            How to add modules

                            learning how to use browser developers window for css changes

                            1 Reply Last reply Reply Quote 1
                            • G Offline
                              gonzonia
                              last edited by

                              Well, thanks to both of you! I can confirm it is finally working.

                              Now to update github. Someday I should write some documentation too.

                              1 Reply Last reply Reply Quote 0
                              • htilburgsH Offline
                                htilburgs
                                last edited by

                                @cowboysdude, I’m looking for the part where you “change” the XML data to JSON data. I’m trying to write a new MMM, but the data is presented in XML. I like the have it in JSON, so I can use it.

                                Maybe I read over it, but I cannot figure out where you do this.

                                (still trying to learn JS, but not afraid to ask and AI is my best friend) ☺

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

                                  @htilburgs there are a few xml to json modules

                                  https://www.npmjs.com/package/xml2js

                                  google search
                                  ‘nodejs xmltojson’

                                  here is one with a just code, no extra libs

                                  https://davidwalsh.name/convert-xml-json

                                  Sam

                                  How to add modules

                                  learning how to use browser developers window for css changes

                                  1 Reply Last reply Reply Quote 0
                                  • htilburgsH Offline
                                    htilburgs
                                    last edited by

                                    @sdetweil , I’ve found them, but I don’t know how to use it in combination with the URL that creates the XML.

                                    Indeed the last one with no extra libs looks promising. I tried to simply add this in the node_helper.js but getting stuck at how to use it.
                                    I’ve looked into all the MMM Modules but cannot seem to find an example.

                                    (still trying to learn JS, but not afraid to ask and AI is my best friend) ☺

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

                                      @htilburgs the url bring back the data with request

                                      request(url, function(err, res, body) {
                                          // if no error and server was happy
                                          if(err == null && res.statusCode ==200){
                                          console.log(body);
                                          var json_data=this.xmlToJson(body)
                                          console.log("Speed[0] text is "+json_data.SD[0].SPEED.@attributes.TEXT)
                                      }
                                      });
                                      

                                      when the server responds, the function is called and passed the data, body)
                                      and then u would convert it from xml to json . using the last code

                                      var json_data=this.xmlToJson(body)

                                      then the json is accessed with the normal structure notation
                                      (using the sample with the code in the last link)

                                      json_data.SD[0].SPEED.@attributes.TEXT will be ‘1421’

                                      SD is an array (multiple of same xml tags)

                                      a little ugly in the data layour, could get rid of the @attributes thing with a small code change

                                      Sam

                                      How to add modules

                                      learning how to use browser developers window for css changes

                                      1 Reply Last reply Reply Quote 0
                                      • htilburgsH Offline
                                        htilburgs
                                        last edited by

                                        So in my case the URL produces:

                                        0_1576260496007_7fa5a24c-528a-4697-9557-2a9058df2860-image.png image url)

                                        json_data.SD[0].SPEED@attributes.TEXT will be:

                                        json.data.film[0].titel    --> 'Bellicher: Cel'
                                        

                                        Correct?

                                        (still trying to learn JS, but not afraid to ask and AI is my best friend) ☺

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

                                          @htilburgs correct (json_data is the name of the output variable, note underscore, not dot, using dot means ‘go into’) … if you use one of the module add ons… not the code shown…

                                          Sam

                                          How to add modules

                                          learning how to use browser developers window for css changes

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

                                            @htilburgs and the number of films in the array would be

                                            json_data.film.length

                                            using the developers window you can put a code stop on the line after the xml2json
                                            and then u can explore the conversion…

                                            you can also use console.log(JSON.stringify(some_object)) and it will dump the structure in json format

                                            Sam

                                            How to add modules

                                            learning how to use browser developers window for css changes

                                            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
                                            • 2
                                            • 3
                                            • 2 / 3
                                            • 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