MM-Navbar - Navigation Bar for Touchscreens to hide/show modules

[AlessandroRa]

@chrisyy thank you man, so let me get this straight: I find a button that I like on internet, I copy its code and I put it into the module?
I’m sorry, but I’m kinda new to this :)

[tosti007]

@AlessandroRa No you will have to take a look at Font Awsome which is being used throughout the magic mirror. In the link you can find all the icons you can use. (someone correct me if i’m wrong)

[shashank]

@in_a_days Hi, My requirement is i need to show clock, weather and Calendar by default and all other modules should be hide.

[tosti007]

@all, I made a module which is similair to this one. In mine you can set custom profiles and swap between them. Hope that this helps one of you guys :)

[in_a_days]

@shashank

Okay I think I know what you’re looking for. I’m not 100% sure how to make the change, but someone else here may be able to help.

notificationReceived: function(notification, payload, sender){
	if (notification === 'DOM_OBJECTS_CREATED'){
		MM.getModules().exceptModule(this).exceptWithClass('clock').enumerate(function(module){
			module.hide(1000, function(){
			});
		});
	}
},

Is there a simple way to include the ‘calendar’ and ‘weather’ modules in the exceptWithClass call? I don’t know how to include multiple Classes in this kind of context.

[tosti007]

@in_a_days put the names you want in an array, like so:

var exceptClasses = ["clock", "weather", "calendar"]; //The list of modules you want to keep.
MM.getModules().exceptModule(this).exceptWithClass(exceptClasses).enumerate(
    // Here the other code
);

[shashank]

@tosti007 hi, i tested using var exceptClasses as mentioned by you, it works perfectly as required for me. Thanks a lot for your suggestion.

[chrisyy]

As mentioned from @tosti007 he wrote a module that uses the ProfileSwitcher.
I will also continue on this project when i got the time for it.

I plan on adding some configurable variables, like which modules should be included as a button and a config-section where u can define an icon from Font-Awesome. That should handle a few problems with which u came up here.

But this will take me some time. So keep patient, i’m working.

[tosti007]

@shashank You’re welcome!
@chrisyy you can use front awsome by setting the class of the symbol’s container to fa fa-symbolname. Something like this (where symbolName can be any icon name):

var symbolName = "paper-plane";
var symbolContainer = document.createElement("span");
symbolContainer.className = "fa fa-" + symbolName;

[chrisyy]

@tosti007 Something like this is what i’m thinking about