How to add an icon to the right hand side of the MacOS menu bar in Electron? - node.js

I am a fan of the bitbar project that enables you on MacOS to add menu bar items to the right side of the menu bar like this:
Those icons persist even when the focus is on another window and can give the user live information about services running in the background.
I am building some apps with the Electron Framework and was thinking of wrapping bitbar into my applications, but that seems a little bit over engineered.
Is there a way to add an icon to this side of the menu bar? If not: Does anybody know a good example of such an implementation that includes an installer?
Electron's documentation of the Menu bar doe not indicate it. But maybe I overlooked something or there are other implementations of this MacOS only feature?

user No Grabbing pointed me precisely in the right direction! Thank you!
I was looking with the wrong search parameters: "Tray" seems to be the term i was missing:
Electron actually does already provide an API for that and after testing it i can say: it works out of the box: https://electronjs.org/docs/api/tray

Related

Is there a way to make a responsive Zurb Foundation 6 menu that uses click or tap on desktop, rather than hover?

I've been searching the web for a while now trying to find documentation or an example of a responsive menu built in Zurb Foundation 6 that uses clicks rather than hovers on desktop. I see in the documentation that there were ways to do it in Foundation 5. But I can't find anything for 6. Can anyone point me in the right direction?
Thanks in advance!
Found it! the plugins on this page https://get.foundation/sites/docs/dropdown-menu.html#js-options explain that you can use "data-disable-hover" and "data-click-open". I have used them in conjunction to get a dropdown menu to work as a click menu.

Displaying a Classification Banner at the top of each computer monitor in Gnome Desktop

I work in an environment where we have to have a security classification banner displayed at the top of each monitor on our Gnome Desktops. Currently, I am using a Perl/Tk window to display the classification of the system. However, that window cannot be moved because of the way it is built (no decorations) and occasionally overlays open windows making it difficult for users to manage those windows.
I would like to be able to do something different, but I'm not sure where to start. Three ideas I have are this:
An icon or something in the Top Bar showing the classification
A banner, like the Top Bar, that sits above the Top Bar
A window, like I already have, but relocatable
I figure the first option would be easiest, but since the Top Bar isn't shown on every monitor, that may not be the best option. I don't even know if the second option is even possible. The third option would require me to use something other than Perl/Tk but that's the only language I'm fluent in at the moment.
So I'm looking for suggestions or examples or Gnome extensions I can use to solve this problem.
Thanks.
There is a classification-banner python utility at https://github.com/fcaviggia/classification-banner. It's no longer maintained, but we've been using it without change for a few years now. It's OK. One problem is that it doesn't "shrink" the desktop screen, so application windows can overlap it; it's set to Always On Top, but it would be nicer if it actually couldn't be overlaid at all.
A simple solution, of sorts, would be to change the desktop background image. This can have issues if you're displaying on multiple resolutions (I don't know if Gnome supports SVG for such purposes) and of course it can be obscured by windows covering it.
Older versions of Gnome let you create multiple bars that worked perfectly, but that disappeared - along with many other customizations - in Gnome 3.

Hiding the Hamburger while in shell using template10

Sorry if my query's a bit noobish, a uwp beginner here.
I'm trying to morph the hamburger template from template10 and an existing project of mine. Basically, I'd like to have a certain page with the hamburger menu being invisible, and display my own navigation buttons on the page (an intro page). Upon navigation away to any other page the menu will be visible again.
I tried changing Hamburger's visibility state as an experiment, but it seems to be affecting the content as well. Is what I'm talking about possible with this control and I'm missing something obvious? Or I'd have to manage shell usage in app.xaml and load my intro page without the shell?
Many thanks for the creation of the t10 btw (Jerry, Daren and everyone else), me being confused in this thing doesn't at all diminish my appreciation
There are a few options for you here. IsPaneOpen will only work for you depending on the DisplayMode you choose. But if I were to guess, it's HamburgerMenu,.IsFullScreen that you are really wanting to use here.
You can change the SplitView mode to Inline and set IsPaneOpen to false. That will hide the Pane.

Is there a menu component in Rikulo

I cannot find any examples in Rikulo on how to create and use menu bar, menu, sub menu and menu items.
could anyone point me in the right direction please?
regards
No, it is not supported. There are too many styles and variants. Many of them don't require much JS code. Here are some examples. You can port one to your application and wrap it as a Rikulo UI component, if you want.
I assumes you're talking about Rikulo UI. If you're using Bootjack, you can pick one from Bootstrap's 3rd party libraries.

Custom navigation Titanium

I need do a very special nav or tab bar for a app, I looked this but I not have idea how to make some similar, I work with Titanium mobile, someone with experience could tell me how to make some similar with Titanium, or if someone have other navigation bar more complex that the examples on the kitchensink.
This is where I'd start. Understand that that video is obviously a complex interface and will definitely take work on your part.
This (http://softlywired.com/ticustommenu/) piece of code will get you started, but you will need to go way beyond it writing that interface control. I'd then move on to creating the boxes that pop up, without animation, down the center. After that was working, I'd look at animating them and adding the event listeners to it.
You'd be a star in the Titanium community if you got it working and released the source code to it.

Resources