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-Sunrise-Sunset

    Scheduled Pinned Locked Moved Utilities
    44 Posts 9 Posters 23.6k Views 10 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.
    • Mykle1M Offline
      Mykle1 Project Sponsor Module Developer @vbloke
      last edited by

      @vbloke

      This is right out of my MMM-SunRiseSet module.

      Feel free to use it if you like. :thumbsup:

      // sunrise set to local time using moment
         var sunrise = document.createElement("div");
         sunrise.classList.add("small", "bright", "sunrise");
         sunrise.innerHTML = "Sunrise is at " + moment(SunRiseSet.sunrise).local().format("h:mm a") + " &nbsp &nbsp "
      + "Sunset is at " + moment(SunRiseSet.sunset).local().format("h:mm a");
         wrapper.appendChild(sunrise);
      

      Create a working config
      How to add modules

      1 Reply Last reply Reply Quote 0
      • pugslyP Offline
        pugsly @henry2man
        last edited by

        @henry2man
        I am having the same problem, whenever I put it in my config the display is blank.

        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @pugsly
          last edited by

          @pugsly not in config… you have to edit the actual module code

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          pugslyP 1 Reply Last reply Reply Quote 0
          • pugslyP Offline
            pugsly @sdetweil
            last edited by

            @sdetweil Not sure I know what you mean. When I put this in my config the screen is all blank:

                {
                    module: "MMM-Sunrise-Sunset",
                    position: "top_right",
                    header: "Sunrise",
                    config: {
                        latitude: "39.2907",
                        longitude: "-75.6344",
                        apikey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
                        layout: "inline"
                            }
                },
            
            S 2 Replies Last reply Reply Quote 0
            • S Offline
              sdetweil @pugsly
              last edited by

              @pugsly open the developers window on your blank screen MM, using ctrl-shift-i on the keyboard… select the tab labeled console and scroll up to find any errors

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              pugslyP 1 Reply Last reply Reply Quote 0
              • pugslyP Offline
                pugsly @sdetweil
                last edited by

                @sdetweil

                Uncaught ReferenceError: $ is not defined
                at Class.updateSun (MMM-Sunrise-Sunset.js:33)
                at Class.start (MMM-Sunrise-Sunset.js:12)
                at startModules (loader.js:55)
                at loader.js:40
                at HTMLLinkElement.stylesheet.onload (loader.js:200)

                S 1 Reply Last reply Reply Quote 0
                • S Offline
                  sdetweil @pugsly
                  last edited by sdetweil

                  @pugsly said in MMM-Sunrise-Sunset:

                  Uncaught ReferenceError: $ is not defined

                  this module depends on jquery library being installed for this module, but its not…,

                  I am working on instructions for you… hang on

                  do

                  cd ~/MagicMirror/modules/MMM-Sunrise-Sunset
                  npm install jquery
                  # note the trailing dot (.) on the next line
                  cp node_modules/jquery/dist/jquery.js .
                  

                  then start your mirror again

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  pugslyP D 2 Replies Last reply Reply Quote 0
                  • pugslyP Offline
                    pugsly @sdetweil
                    last edited by

                    @sdetweil said in MMM-Sunrise-Sunset:

                    cp node_modules/jquery/dist/jquery.js .

                    Slightly better, its displaying now but just says ‘Loading’

                    S 1 Reply Last reply Reply Quote 0
                    • S Offline
                      sdetweil @pugsly
                      last edited by

                      @pugsly ok, open the developers window again

                      this usually means that the api key is wrong … the api isn’t returning data

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      pugslyP 1 Reply Last reply Reply Quote 0
                      • pugslyP Offline
                        pugsly @sdetweil
                        last edited by

                        @sdetweil
                        Its not passing the API key in the HTML request.

                        https://api.ipgeolocation.io/astronomy?apiKey=&lang=en&lat=39.2907&long=-75.6344 401

                        pugslyP 1 Reply Last reply Reply Quote 0
                        • S Offline
                          sdetweil @pugsly
                          last edited by

                          @pugsly said in MMM-Sunrise-Sunset:

                          apikey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
                          

                          yep, case sensitive, it apiKey

                          Sam

                          How to add modules

                          learning how to use browser developers window for css changes

                          1 Reply Last reply Reply Quote 0
                          • pugslyP Offline
                            pugsly @pugsly
                            last edited by

                            @pugsly NVM… the K in apiKey is a capital. Its working now.

                            1 Reply Last reply Reply Quote 0
                            • D Offline
                              dankerthrone @sdetweil
                              last edited by

                              @sdetweil: Thank you so much for your help here. I’m having the exact same problem as @pugsly did, but unfortunately your suggestions seem to not do the trick. I was wondering if you could help me out, too. So far I got:

                                                      {
                              			module: "MMM-Sunrise-Sunset",
                              			position: "bottom_bar",
                              			config: {
                              				apiKey: "xxx", 				
                              				latitude: "xx.03586",
                              				longitude: "xx.06379",
                              				timezone: "Europe/Berlin",
                              				layout: "inline"
                              				}
                              		},
                              

                              My screen stays black, though, and the developer console is giving me this:

                              Uncaught ReferenceError: $ is not defined
                              at Class.updateSun (MMM-Sunrise-Sunset.js:33)
                              at Class.start (MMM-Sunrise-Sunset.js:12)
                              at startModules (loader.js:55)
                              at loader.js:40
                              at HTMLLinkElement.stylesheet.onload (loader.js:200)
                              

                              I even tried executing your suggestions as root, thinking that I must’ve done something wrong, but I got the same error messages as before:

                              root@raspberrypi:/home/pi/MagicMirror/modules/MMM-Sunrise-Sunset# npm install jquery
                              npm WARN saveError ENOENT: no such file or directory, open '/home/pi/MagicMirror/modules/package.json'
                              npm WARN enoent ENOENT: no such file or directory, open '/home/pi/MagicMirror/modules/package.json'
                              npm WARN modules No description
                              npm WARN modules No repository field.
                              npm WARN modules No README data
                              npm WARN modules No license field.
                              
                              + jquery@3.4.1
                              removed 1 package, updated 1 package and audited 1 package in 4.09s
                              found 0 vulnerabilities
                              
                              root@raspberrypi:/home/pi/MagicMirror/modules/MMM-Sunrise-Sunset# cp node/modules/jquery/dist/jquery.js .
                              cp: cannot stat 'node/modules/jquery/dist/jquery.js': No such file or directory
                              

                              What am I missing here?

                              S 1 Reply Last reply Reply Quote 0
                              • S Offline
                                sdetweil @dankerthrone
                                last edited by

                                @dankerthrone said in MMM-Sunrise-Sunset:

                                Uncaught ReferenceError: $ is not defined

                                cp node/modules/jquery/dist/jquery.js .
                                

                                should be (notice the underscore, _ instead of the slash /)

                                cp node_modules/jquery/dist/jquery.js .
                                

                                Sam

                                How to add modules

                                learning how to use browser developers window for css changes

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

                                  That seems to have been a copy/paste-error. My terminal history shows it with the underscore. To make sure, I tried it once again, but still get

                                  pi@raspberrypi:~/MagicMirror/modules/MMM-Sunrise-Sunset $ cp node_modules/jquery/dist/jquery.js .
                                  cp: cannot stat 'node_modules/jquery/dist/jquery.js': No such file or directory
                                  
                                  S 1 Reply Last reply Reply Quote 0
                                  • S Offline
                                    sdetweil @dankerthrone
                                    last edited by

                                    @dankerthrone weird
                                    show the output of

                                    cd  ~/MagicMirror/modules/MMM-Sunrise-Sunset
                                    ls node_modules -laF
                                    

                                    Sam

                                    How to add modules

                                    learning how to use browser developers window for css changes

                                    D 1 Reply Last reply Reply Quote 0
                                    • D Offline
                                      dankerthrone @sdetweil
                                      last edited by

                                      @sdetweil

                                      pi@raspberrypi:~/MagicMirror/modules/MMM-Sunrise-Sunset $ ls node_modules -laF
                                      ls: cannot access 'node_modules': No such file or directory
                                      
                                      

                                      … I’m starting to wonder if I messed up something bigger in the beginning since almost any change I apply to config.js results in weird errors.

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

                                        after rebooting, the black screen of MagicMirror now shows this in the developer console:

                                        Starting module: MMM-Sunrise-Sunset
                                        MMM-Sunrise-Sunset.js:50 Uncaught ReferenceError: $ is not defined
                                            at Class.updateSun (MMM-Sunrise-Sunset.js:50)
                                            at Class.start (MMM-Sunrise-Sunset.js:12)
                                            at startModules (loader.js:55)
                                            at loader.js:40
                                            at HTMLLinkElement.stylesheet.onload (loader.js:200)
                                        DailyXKCD.js:77 https://imgs.xkcd.com/comics/hotel_room_party.png
                                        7
                                        DailyXKCD.js:177 Uncaught TypeError: Cannot read property 'naturalHeight' of null
                                            at Class.scrollComic (DailyXKCD.js:177)
                                            at DailyXKCD.js:51
                                        6
                                        DailyXKCD.js:177 Uncaught TypeError: Cannot read property 'naturalHeight' of null
                                            at Class.scrollComic (DailyXKCD.js:177)
                                            at DailyXKCD.js:51
                                        

                                        I’m really starting to think I do something stupid everytime I install/clone a module from github. I do follow each readme.md for installation, but somehow keep messing up :-/

                                        S 2 Replies Last reply Reply Quote 0
                                        • S Offline
                                          sdetweil @dankerthrone
                                          last edited by sdetweil

                                          @dankerthrone installing a new module is pretty easy

                                          cd MagicMirror/modules
                                          git clone http:// the url of the git repo
                                          cd the name of the module
                                          

                                          if there is a package.,json file, then to load its dependencies do

                                          npm install 
                                          

                                          then

                                          cd ~/MagicMirror/config
                                          nano config.js
                                          
                                          insert the module definition  info, (see the module readme.md)
                                          save
                                          

                                          then restart mirror app

                                          this module does NOT list its dependency on jquery as it should
                                          so, you have to fix it manually.

                                          SO, i don’t know where you were when u did the npm install jquery
                                          lets find it

                                          cd ~/MagicMirror
                                          find . | grep jquery\.js
                                          

                                          Sam

                                          How to add modules

                                          learning how to use browser developers window for css changes

                                          D 1 Reply Last reply Reply Quote 0
                                          • S Offline
                                            sdetweil @dankerthrone
                                            last edited by

                                            @dankerthrone said in MMM-Sunrise-Sunset:

                                            DailyXKCD

                                            the XKCD errors look like poor programming by the author

                                            he tries to find the web content before its there, but doesn’t check if he got the location

                                            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