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

Collaboration of MMM-ProfileSwitcher and MMM-pages modules

Scheduled Pinned Locked Moved Solved Troubleshooting
9 Posts 2 Posters 1.1k Views 2 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.
  • K Offline
    Kostosso
    last edited by Sep 28, 2022, 7:56 PM

    Please help me to get torn using MMM-ProfileSwitcher and MMM-pages modules

    I have multiple calendars and I want to display them separately on my page. To do this, I want to get the current page number from MMM-pages and use it as ‘classes:’ in the ProfileSwitcher.

    Here is what my config file looks like.

    let config = {
    	address: "0.0.0.0", 	// Address to listen on, can be:
    	port: 8080,
    	basePath: "/", 	
    	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1", "192.168.1.0/24"],
    	useHttps: false, 		
    	httpsPrivateKey: "", 	
    	httpsCertificate: "", 
    
    	logLevel: ["INFO", "LOG", "WARN", "ERROR"], 
    	timeFormat: 24,
    	units: "metric",
    	modules: [
    //------------------------MMM-WatchDog----------------------------------------
    		{
    			module: 'MMM-WatchDog',
    			config: {
    				interval: 10,
    				timeout: 15,
    				// See 'Configuration options' for more information.
    			}
    		},
    //---------------------------MMM-pages--------------------------------------
    		{
    	        module: 'MMM-pages',
    	        config: {
    	        		modules:
    	                	[["alert", "clock", "updatenotification", "calendar"],
    	                	 ["calendar"]],
    					rotationTime: 15000, 
    					delayTime: 15000, 
    // !!!	        		  Action: [
    //!!!!	        		sendNotification("CURRENT_PROFILE", "1"),
    //!!!!        		notification:'CURRENT_PROFILE', payload: this.NEW_PAGE,
    	        		// ]
    	        		},
    		},
    //-------------------MMM-ProfileSwitcher ----------------------------
        {
            module: 'MMM-ProfileSwitcher',
            config: {
                // See 'Configuration options' for more information.
            },
        },
    //-------------------MMM-page-indicator Page0 -------------------------
    		{
    	        module: 'MMM-page-indicator',
    	        classes: 'default everyone', 
    	        position: 'bottom_bar',
    	        config: {
    	            pages: 2,
    //!!!!	            notification:'CURRENT_PROFILE', payload: NEW_PAGE,
    //!!!!!	          Action: [
    //!!!!!			{notification:'CURRENT_PROFILE',payload: this.NEW_PAGE},
    //!!!!!				],
    			},	
    		},
    //------------
    		{
    			module: "alert",
    //			classes: 'default everyone', 
    			config: {
    				position: "center",
    				display_time: 4500,
    		},
    		{
    			module: "clock",
    			classes: 'default everyone', 
    			position: "top_left"
    		},
    //------------------calendar Page1 ---------
    {
    		module: "calendar",
    		classes: 1, 
    		header: "Alex",
    		position: "top_right",
    			config: {
    				displaySymbol: true,
    				maximumEntries: 12,
    				maximumNumberOfDays: 4,
    				coloredSymbolOnly: true,
    				calendars: [
    					{
    						name: "Alex",
    						displaySymbol: true,
    						symbol: 'user-secret',
    						url: "-------",
    //						maximumNumberOfDays: 1,
    						fade: false,
    						showEnd: true,
    						auth: {
    							user: '-----',
    							pass: '-------',
    							method: 'basic',
    						}	
    					},
    {
    		module: "calendar",
    		classes: '2',
    		header: "Den",
    		position: "top_right",
    			config: {
    				displaySymbol: true,
    				maximumEntries: 12,
    				maximumNumberOfDays: 4,
    				coloredSymbolOnly: true,
    				calendars: [
    					{
    						name: "Den",
    						symbol: 'user-astronaut',
    						url: "--------",
    //						maximumNumberOfDays: 1,
    						fade: false,
    						showEnd: true,
    						auth: {
    							user: '----------',
    							pass: '---------',
    							method: 'basic',
    						}	
    					},	
    				],
    			},
    },
    ]
    

    But I don’t know how should I write this.sendNotification(‘CURRENT_PROFILE’, ‘DESIRED_PROFILE_NAME_HERE’);

    Please help me figure it out. If possible, an example config file. And then I’ll figure it out myself.

    I will be very grateful for any help.
    Thanks in advance!

    S 2 Replies Last reply Sep 28, 2022, 8:07 PM Reply Quote 0
    • S Offline
      sdetweil @Kostosso
      last edited by sdetweil Sep 28, 2022, 9:22 PM Sep 28, 2022, 9:18 PM

      @Kostosso

      you won’t find this documented anywhere, its just my idea of making it all better

      i took the sample config (config.js.sample)

      and added mmm-pages

      and used the sample mm-pages config (its only for a few modules) (from the readme.md)

      mmm-pages added at the end…
      only classes: added for the pages defined

      
          modules: [
              {
                  module: "alert",
              },
              {
                  module: "updatenotification",
                  position: "top_bar"
              },
              {
                  module: "clock",
                  position: "top_left"
              },
              {
                  module: "calendar",
                  header: "US Holidays",
                  position: "top_left",
                  classes:"page2"
                  config: {
                      calendars: [
                          {
                              symbol: "calendar-check",
                              url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics"
                          }
                      ]
                  }
              },
              {
                  module: "compliments",
                  position: "lower_third",
                  classes:"page2"
              },
              {
                  module: "weather",
                  position: "top_right",
                  config: {
                      weatherProvider: "openweathermap",
                      type: "current",
                      location: "New York",
                      locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                      apiKey: "YOUR_OPENWEATHER_API_KEY"
                  }
              },
              {
                  module: "weather",
                  position: "top_right",
                  header: "Weather Forecast",
                  config: {
                      weatherProvider: "openweathermap",
                      type: "forecast",
                      location: "New York",
                      locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                      apiKey: "YOUR_OPENWEATHER_API_KEY"
                  }
              },
              {
                  module: "newsfeed",
                  position: "bottom_bar",
                  classes:"page1",
                  config: {
                      feeds: [
                          {
                              title: "New York Times",
                              url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
                          }
                      ],
                      showSourceTitle: true,
                      showPublishDate: true,
                      broadcastNewsFeeds: true,
                      broadcastNewsUpdates: true
                  }
              },
              {
                  module: 'MMM-pages',
                  config: {
                          modules:
                              [
                               [ "page1"],
                               [ "page2"]
                              ],
                          fixed: [ "clock", "weather", "MMM-page-indicator" ], // could have used 'fixed' as a classname here and add that to fixed modules
                          hiddenPages: {      // same here screensaver and admin classes
                              "screenSaver": [ "clock", "MMM-SomeBackgroundImageModule" ],
                              "admin": [ "MMM-ShowMeSystemStatsModule", "MMM-AnOnScreenMenuModule" ],
                          },
                  }
              }
         ]
      };
      

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 0
      • S Offline
        sdetweil @Kostosso
        last edited by Sep 28, 2022, 8:07 PM

        @Kostosso so, before I get to switcher, etc

        change your model for pages

        pages uses the CLASSES of the modules.
        either the module name class, or those assigned in the classes: property

        for me the most logical thing is the declare in pages

            modules [
                                     ["page1"],
                                     ["page2"],
                                      ...
                                     ["pagen"]
              ]
        

        for each of the ‘pages’ (module groupings) you want to display

        THEN at each module, in the classes: property
        set the pages u want that module to show on

        so, for only page1

              classes:"page1"
        

        for pages 1 and 3

              classes:"page1 page3"
        

        then you configure at the module

        now, that also fixes the problem of multiple instances, cause you assign the instance to the page u want it on…

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        K 1 Reply Last reply Sep 28, 2022, 8:24 PM Reply Quote 0
        • S Offline
          sdetweil @Kostosso
          last edited by sdetweil Sep 28, 2022, 8:14 PM Sep 28, 2022, 8:12 PM

          @Kostosso said in Collaboration of MMM-ProfileSwitcher and MMM-pages modules:

          But I don’t know how should I write this.sendNotification(‘CURRENT_PROFILE’, ‘DESIRED_PROFILE_NAME_HERE’);

          now… that needs to be sent by SOME other module…

          most of those other modules have some kind of config

          remote_control
          alexaControl
          facereco_dnn (altho it uses classes directly like pages, so you wouldn’t need profile switcher)…

          where u can put the notification string ‘CURRENT_PROFILE’
          and whatever data (aka payload) that notification expects…

          now you can ALSO add other classes that can make profile switching easier…

          for me add SAM to the list of classes
          then show modules with classes containing SAM

          that is what the profile module does…

          so, in remote_control is would be ‘CURRENT_PROFILE’,'SAM"

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • K Offline
            Kostosso @sdetweil
            last edited by Sep 28, 2022, 8:24 PM

            @sdetweil
            Thank you so much, but I didn’t fully understand where I need to specify

            ['page1']
            ['page2']
            
            
            ['pagen'] 
            

            and how do I link this definition to MMM-pages modules?

            I realized that I define classes in the header of each module

            module:'MMM-page-indicator',
                    classes: 'default everyone',
            

            Can you elaborate a little more on this or a link where you can read it.

            S 2 Replies Last reply Sep 28, 2022, 8:27 PM Reply Quote 1
            • S Offline
              sdetweil @Kostosso
              last edited by sdetweil Sep 28, 2022, 8:28 PM Sep 28, 2022, 8:27 PM

              @Kostosso i posted it

              pages has a config option

                  modules: [
                  ]
              

              which has the list of page configurations

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              1 Reply Last reply Reply Quote 0
              • S Offline
                sdetweil @Kostosso
                last edited by sdetweil Sep 28, 2022, 8:36 PM Sep 28, 2022, 8:34 PM

                @Kostosso

                setup your pages config as I had shown

                only one classname in each ‘page’ definition, ‘page1’,‘page2’, etc

                then go to a module definition

                calendar

                what pages do you want THIS instance to appear on

                add those ‘page’ names to the classes list

                repeat thru all the modules in config.

                now profile is a DIFFERENT way of selecting modules

                they take some logical profile name

                by person
                SAM
                MARY
                SUE
                TOM

                so you would add THOSE profile name(maybe more than 1) to the modules you want shown of THAT person (or more)

                suppose u want the family calendar to be shown for both mom and dad and they have profile names that way
                you would add “mom dad” to the classes list for that calendar entry, but not for the kids profiles

                and then u would tell profile switch (via the notification), which PROFILE name to show modules for…

                MagicMirror can only show or hide modules… everything in config.js is loaded EVERY time it starts up.

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                K 1 Reply Last reply Sep 28, 2022, 8:57 PM Reply Quote 0
                • K Offline
                  Kostosso @sdetweil
                  last edited by Sep 28, 2022, 8:57 PM

                  @sdetweil
                  How and where to use classes: I understood in modules.

                  I read a lot of articles in the forum, but never our sample structure

                  modules:[
                  [ ‘page1’ ],
                  [‘page2’]
                  ]
                  And how to apply it in practice, I did not find.

                  Maybe there is a piece of the config file where it can be seen in detail (example).

                  :folded_hands: Thanks again for your help.

                  S 1 Reply Last reply Sep 28, 2022, 9:18 PM Reply Quote 0
                  • S Offline
                    sdetweil @Kostosso
                    last edited by sdetweil Sep 28, 2022, 9:22 PM Sep 28, 2022, 9:18 PM

                    @Kostosso

                    you won’t find this documented anywhere, its just my idea of making it all better

                    i took the sample config (config.js.sample)

                    and added mmm-pages

                    and used the sample mm-pages config (its only for a few modules) (from the readme.md)

                    mmm-pages added at the end…
                    only classes: added for the pages defined

                    
                        modules: [
                            {
                                module: "alert",
                            },
                            {
                                module: "updatenotification",
                                position: "top_bar"
                            },
                            {
                                module: "clock",
                                position: "top_left"
                            },
                            {
                                module: "calendar",
                                header: "US Holidays",
                                position: "top_left",
                                classes:"page2"
                                config: {
                                    calendars: [
                                        {
                                            symbol: "calendar-check",
                                            url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics"
                                        }
                                    ]
                                }
                            },
                            {
                                module: "compliments",
                                position: "lower_third",
                                classes:"page2"
                            },
                            {
                                module: "weather",
                                position: "top_right",
                                config: {
                                    weatherProvider: "openweathermap",
                                    type: "current",
                                    location: "New York",
                                    locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                                    apiKey: "YOUR_OPENWEATHER_API_KEY"
                                }
                            },
                            {
                                module: "weather",
                                position: "top_right",
                                header: "Weather Forecast",
                                config: {
                                    weatherProvider: "openweathermap",
                                    type: "forecast",
                                    location: "New York",
                                    locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
                                    apiKey: "YOUR_OPENWEATHER_API_KEY"
                                }
                            },
                            {
                                module: "newsfeed",
                                position: "bottom_bar",
                                classes:"page1",
                                config: {
                                    feeds: [
                                        {
                                            title: "New York Times",
                                            url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
                                        }
                                    ],
                                    showSourceTitle: true,
                                    showPublishDate: true,
                                    broadcastNewsFeeds: true,
                                    broadcastNewsUpdates: true
                                }
                            },
                            {
                                module: 'MMM-pages',
                                config: {
                                        modules:
                                            [
                                             [ "page1"],
                                             [ "page2"]
                                            ],
                                        fixed: [ "clock", "weather", "MMM-page-indicator" ], // could have used 'fixed' as a classname here and add that to fixed modules
                                        hiddenPages: {      // same here screensaver and admin classes
                                            "screenSaver": [ "clock", "MMM-SomeBackgroundImageModule" ],
                                            "admin": [ "MMM-ShowMeSystemStatsModule", "MMM-AnOnScreenMenuModule" ],
                                        },
                                }
                            }
                       ]
                    };
                    

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    1 Reply Last reply Reply Quote 0
                    • K Offline
                      Kostosso
                      last edited by Sep 28, 2022, 9:23 PM

                      :thumbs_up: Super! Issue closed!

                      THANK YOU SO MUCH!:handshake:

                      1 Reply Last reply Reply Quote 1
                      • S sdetweil referenced this topic on Oct 13, 2022, 12:01 PM
                      • 1 / 1
                      1 / 1
                      • First post
                        1/9
                        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