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

Memory effect with MM2

Scheduled Pinned Locked Moved Hardware
16 Posts 8 Posters 9.2k Views 8 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 Offline
    strawberry 3.141 Project Sponsor Module Developer @schlachtkreuzer6
    last edited by Dec 27, 2016, 3:41 PM

    @schlachtkreuzer6 you could create a class and add this to the body where the margin is different than the basic 60px and toggle the class to the body every 6 hours or so

    Please create a github issue if you need help, so I can keep track

    S 1 Reply Last reply Dec 27, 2016, 3:43 PM Reply Quote 1
    • S Offline
      schlachtkreuzer6 @strawberry 3.141
      last edited by Dec 27, 2016, 3:43 PM

      @strawberry-3.141 yeah but i´m a css noob. maybe you can explain that a little? many thanks!

      S 1 Reply Last reply Dec 27, 2016, 3:51 PM Reply Quote 0
      • S Offline
        strawberry 3.141 Project Sponsor Module Developer @schlachtkreuzer6
        last edited by Dec 27, 2016, 3:51 PM

        @schlachtkreuzer6

        MMM-Anti-Screen-Burn-In.css

        .MMM-Anti-Screen-Burn-In {
            margin: 55px 55px 65px 65px; /*this would shift it 5 pixels higher and 5 pixels to the right side than the standard of 60px on each side*/
        }
        

        MMM-Anti-Screen-Burn-In.js

        start: function(){
            setInterval(() => {
                document.querySelector("body").classList.toggle("MMM-Anti-Screen-Burn-In");
            }, 6 * 60 * 60 * 1000); // every 6 hours
        },
        
        getStyles: function(){
            return ["MMM-Anti-Screen-Burn-In.css"];
        }
        

        Please create a github issue if you need help, so I can keep track

        S L K 3 Replies Last reply Dec 27, 2016, 3:52 PM Reply Quote 1
        • S Offline
          schlachtkreuzer6 @strawberry 3.141
          last edited by Dec 27, 2016, 3:52 PM

          @strawberry-3.141 WOW! Nice :) Thanks!

          1 Reply Last reply Reply Quote 0
          • L Offline
            lolobyte @strawberry 3.141
            last edited by Dec 27, 2016, 6:38 PM

            @strawberry-3.141

            Great, i’ll try it!

            1 Reply Last reply Reply Quote 0
            • K Offline
              kj3rra @strawberry 3.141
              last edited by Feb 11, 2018, 7:59 PM

              @strawberry-3.141 Hi. This is exactly what I need. However, I dont know how to proceed with the information. Yes, I made the .css and .js file and put them in a new folder inside the module folder, but how do I then “activate” this? Could someone be so kind and explain step by step how to make this work?

              Sorry for not knowing this I presume is quite basic, but so far I only installed ready made modules :)

              Thanks

              1 Reply Last reply Reply Quote 0
              • W Offline
                wladek
                last edited by Mar 27, 2019, 8:13 PM

                @strawberry-3.141 I tried to get your class into my MM but I don’t know where to put the .css and .js files and how to toggle them.

                S 1 Reply Last reply Mar 27, 2019, 8:17 PM Reply Quote 0
                • S Offline
                  sdetweil @wladek
                  last edited by sdetweil May 5, 2019, 11:56 AM Mar 27, 2019, 8:17 PM

                  @wladek you add the css file to your module folder… and then modify your module.js code per the instructions above to load the css, and the timer code to invoke the other css…

                  you could also make a complete new module with a little more code…

                  make a folder

                  MM/modules/MMM-Anti-Screen-Burn-In
                  

                  put the css file in that folder
                  create a new file in that folder

                  MMM-Anti-Screen-Burn-In.js
                  
                  Module.register("MMM-Anti-Screen-Burn-In", {
                  start: function(){
                      setInterval(() => {
                          document.querySelector("body").classList.toggle("MMM-Anti-Screen-Burn-In");
                      }, 6 * 60 * 60 * 1000); // every 6 hours
                  },
                  
                  getStyles: function(){
                      return ["MMM-Anti-Screen-Burn-In.css"];
                  },
                  getDom: function(){
                    var wrapper = document.createElement("div");
                    return wrapper
                  }
                  })
                  

                  and the module to config.js

                  {
                     module: "MMM-Anti-Screen-Burn-In",
                     position: middle
                  }
                  

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  W 1 Reply Last reply Mar 28, 2019, 12:12 PM Reply Quote 0
                  • W Offline
                    wladek @sdetweil
                    last edited by Mar 28, 2019, 12:12 PM

                    @sdetweil Tried that before, somehow works now though, thanks!
                    Only problem I have now is that the module displays two line of text right across the rest of my modules:

                    MMM-Anti-Screen-Burn-In
                    module_8_MMM-Anti-Screen-Burn-In

                    I didn’t add any text to the .js or .css file tho and I can’t figure out how to get rid of it.

                    S 1 Reply Last reply Mar 28, 2019, 12:32 PM Reply Quote 0
                    • S Offline
                      sdetweil @wladek
                      last edited by Mar 28, 2019, 12:32 PM

                      @wladek oops… if no getDom(), MM puts out some content

                      replace the js file with this

                      Module.register("MMM-Anti-Screen-Burn-In", {
                      start: function(){
                          setInterval(() => {
                              document.querySelector("body").classList.toggle("MMM-Anti-Screen-Burn-In");
                          }, 6 * 60 * 60 * 1000); // every 6 hours
                      },
                      
                      getStyles: function(){
                          return ["MMM-Anti-Screen-Burn-In.css"];
                      },
                      getDom: function(){
                        var wrapper = document.createElement("div");
                        return wrapper
                      }
                      })
                      

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      W 1 Reply Last reply Mar 28, 2019, 12:53 PM Reply Quote 0
                      • 1
                      • 2
                      • 1 / 2
                      • 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