Building a context menu

Ignition
1

I have a multi-zone conveyor displayed on my perspective view where a user can click to bring up a popup giving them control over that conveyor as a whole. Alternatively, they can right-click to show a context menu which allows them to select whether they want to bring up the popup for that whole conveyor, or a detail popup on the individual zone that was clicked. The context menu is working but there's a couple of fine detail things I can't seem to get working exactly how I want.

How it works so far:

  1. The conveyor is a flex repeater with multiple instances of "zones"
  2. Each zone has an onContextMenu script which calls a popup. Into the popup I pass an array of strings, representing the options that I want on shown on the context menu, as well as an "identifier" parameter so that I know which zone triggered the popup
  3. The popup contains a flex repeater, showing multiple instances of a label (populated by the array of strings from #2)
  4. The labels embedded in the flex repeater send a message called contextMenuClick, with a payload consisting of the context menu item that was clicked, and the identifier
  5. Each zone listens for the contextMenuClick message, and when it is received, compares the payload against it's own identifier to see if it needs to trigger a popup. If so, it checks the payload to determine which popup to show

What doesn't work:

  1. I want the context menu to look like a regular context menu in that when I hover the mouse over an item it should be highlighted. To achieve this I've added onMouseOver and onMouseOut scripts to the root container of the label view that's embedded in the flex repeater, which changes the style class of the label. It kind of works but it's not reliable - sometimes it doesn't highlight, sometimes it does but then un-highlights well before the cursor moves down to the next option. How can I fine tune this?

  2. Clicking on an option in the context menu also calls system.perspective.closePopup() so that the context menu disappears when you click on it, just like a regular context menu. However, I'd also like the popup to close if the user clicks anywhere else on the screen, again, like a regular context menu. I can do this by making the popup modal and setting overlayDismiss to True, but making the popup modal is a bit of a hack and isn't a great user experience. Is there a way to get the popup to be background dismissible without it having to be modal?

2

Wow reading through all of this makes me really feel like there should be better native support for custom context menus.

I don't know if it makes sense to need to build this entire thing from scratch all of the time.

4 Likes
3

You can use styles/css for hover effects.

How so? What makes this a bad user experience?

1 Like
4

Native context menus on all components are a feature that's actively in development. @cmallonee keeps being a good advocate for y'all and kicking the feature back :slight_smile:

I'm not the developer, but I think y'all will be pretty happy.

8 Likes
5

Of course, I didn't think of using the built in style class for hovering. I'll have a play with that!

It just seems like a bad user experience because it puts that overlay over the whole screen, which is a little jarring when all you did was right click to bring up a context menu.

@PGriffith great to hear they're in development - do you have a ballpark timeline? If it's coming in the next 3-6 months I'll probably not spend too much more time trying to tweak things and just wait until it's built for me.

6

I would be surprised if it takes 3 months. With the state they're currently in, 8.1.23 is possible; I wouldn't rely on that, but they're pretty close to the finish line.

6 Likes
7

:drooling_face:

This is great to hear! This is one of the things I reaaaalllllly missed from vision. Building a popup for context menus is a PITA

2 Likes
8

You could try some css trickery to make the overlay invisible, would that solve the issue for you ?

9

It would, but given the indication that we'll have it built in natively in a few months, I'm happy to deal with it until then. Thanks though!

10

Hey Paul, there isn't a public place showing what's currently in active development, is there? It'd be cool to know what cool new things we might expect to see in coming versions, but I can understand why this might also not be made public until release as well

11

We've talked in the past about a public mirror or something of our internal bug tracker, but there's not a lot of push for it internally relative to other things, so it hasn't really gone anywhere.

2 Likes
12
1 Like