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

Hide a module by default

Scheduled Pinned Locked Moved Development
11 Posts 3 Posters 1.8k 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.
  • R Offline
    rudiau
    last edited by sdetweil Oct 29, 2022, 12:11 PM Oct 29, 2022, 12:08 PM

    Re: Hide a module by default
    Been following Sams instructions on this subject but cannot get it working.
    Below is the helloworld module I am experimenting with.
    Any help greatly appreciated, thanks.```

    /* MagicMirror²
     * Module: HelloWorld
     *
     * By Michael Teeuw https://michaelteeuw.nl
     * MIT Licensed.
     */
    Module.register("helloworld", {
    	// Default module config.
    	defaults: {
            hidden: false,
    		text: "Hello World!"
    	},
    
    	getTemplate: function () {
    		return "helloworld.njk";
    	},
    
    	getTemplateData: function () {
    		return this.config;
    }, 
        
      suspend: function (){
        this.hidden=true
    },
    
      resume: function (){
         this.hidden=false
    },
        
        notificationReceived: function (notification, payload, source) {
       // this comes before the first call to getDom()
       if(notification === "ALL_MODULES_STARTED")
          this.hidden=true;
    },
      
    getDom: function (){
     var wrapper=document.createElement('div')
    if(this.hidden==false){ 
         //create normal content
    }
    return wrapper;
    }
            
    });
    
    S 3 Replies Last reply Oct 29, 2022, 12:09 PM Reply Quote 0
    • S Away
      sdetweil @rudiau
      last edited by Oct 29, 2022, 12:09 PM

      @rudiau there is a new setting in config.js
      after module:

      hidden: true,
      

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 0
      • S Away
        sdetweil @rudiau
        last edited by sdetweil Oct 29, 2022, 12:12 PM Oct 29, 2022, 12:10 PM

        @rudiau said in Hide a module by default:

        if(notification === “ALL_MODULES_STARTED”)
        this.hidden=true;

        also, it would be

        this.hide()
        

        it will do all the work and call your suspend() function

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • S Away
          sdetweil @rudiau
          last edited by Oct 29, 2022, 12:12 PM

          @rudiau also, the code wrapper things have to be on their own line

          paste you text
          select it
          and hit the button above that looks like this

          </>
          

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • R Offline
            rudiau
            last edited by Oct 29, 2022, 1:16 PM

            Thanks for the quick response Sam.
            Still no good.
            Posted below are the config.js and helloworld .js(part of), is that what you meant by the ‘this.hide()’ placement.
            BTW on your code you posted on May 30, 2020, 6:07 AM
            there is a fullstop after the closing curly bracket, should that be a comma or nothing ie just a closing bracket.
            Thanks for the code posting tip, much easier.

            (closing bracket query)
            notificationReceived: function(notification, payload, source){
               // this comes before the first call to getDom()
               if(notification === "ALL_MODULES_STARTED")
                  this.hidden=true;
            }.
            
            -------------------------------------
            
            modules: [
              {
                module: "helloworld",
                hidden: true,
                position: "middle_center", // This can be any of the regions.
                config: {
                  // See 'Configuration options' for more information.
                  text: "Hello world!",
                },
              },
                    ]
            };
            -------------------------------------------
            (this.hide query)
             notificationReceived: function (notification, payload, source) {
               // this comes before the first call to getDom()
               //if(notification === "ALL_MODULES_STARTED")
                  //this.hidden=true;
                    this.hide()
            },
            
            S B 2 Replies Last reply Oct 29, 2022, 1:20 PM Reply Quote 0
            • S Away
              sdetweil @rudiau
              last edited by sdetweil Oct 29, 2022, 1:21 PM Oct 29, 2022, 1:20 PM

              @rudiau ok, full-stop? you mean semi-colon?

              not required in js unless everything is on the same line

              as for hidden, I am an idiot, see the doc

              Screenshot_20221029-081846_Chrome.jpg

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              B 1 Reply Last reply Oct 30, 2022, 2:00 AM Reply Quote 0
              • R Offline
                rudiau
                last edited by Oct 29, 2022, 2:07 PM

                hiddenOnStartup
                Perfect.
                Thank you Sam.

                1 Reply Last reply Reply Quote 0
                • B Offline
                  BKeyport Module Developer @sdetweil
                  last edited by Oct 30, 2022, 2:00 AM

                  @sdetweil “fullstop” is the period. In your original, it looks like there was a comma. :)

                  The "E" in "Javascript" stands for "Easy"

                  S 1 Reply Last reply Oct 30, 2022, 2:02 AM Reply Quote 0
                  • S Away
                    sdetweil @BKeyport
                    last edited by Oct 30, 2022, 2:02 AM

                    @BKeyport ok, I don’t see where you are referencing

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    1 Reply Last reply Reply Quote 0
                    • B Offline
                      BKeyport Module Developer @rudiau
                      last edited by Oct 30, 2022, 2:05 AM

                      @sdetweil:

                      @rudiau said in Hide a module by default:

                      > (closing bracket query)
                      > notificationReceived: function(notification, payload, source){
                      >    // this comes before the first call to getDom()
                      >    if(notification === "ALL_MODULES_STARTED")
                      >       this.hidden=true;
                      > }.
                      

                      Looks it was all his actually. The last line of that code has the fullstop after a closing curly bracket.

                      The "E" in "Javascript" stands for "Easy"

                      S 1 Reply Last reply Oct 30, 2022, 2:07 AM Reply Quote 0
                      • 1
                      • 2
                      • 1 / 2
                      1 / 2
                      • First post
                        1/11
                        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