sudara / melatonin_inspector

A JUCE module that gives you the ability to inspect and visually edit (non-destructively) components in your UI.
MIT License
145 stars 17 forks source link

Toggle dragging/resize and toggle "selection lock" #103

Closed dikadk closed 4 months ago

dikadk commented 7 months ago

Resolves #49 Resolves #90

We still need to use real "selection lock" icon, instead of placeholder. But selection/dragging logic is in place.

https://github.com/sudara/melatonin_inspector/assets/15266737/572395b2-d6f2-4e8d-b9e7-4635b5d42554

sudara commented 7 months ago

Hey, cool!

Is the goal to solve #49 as well as #90? I got confused by the vid a bit. Would these be the two features:

a) "lock" a selection (current selection is locked in place, another component can't be selected) b) disable ability to move and resize selected components

Some thoughts:

Also I just opened #102 which builds on the SelectionMode enum stuff that Baconpaul added. Not sure it makes sense but we could add a mode called LOCKED?

In it, I basically call overlayMouseListener.disable() to disable selection, so maybe we should at least align that stuff a bit!

dikadk commented 7 months ago

Hey, cool!

Is the goal to solve #49 as well as #90? I got confused by the vid a bit. Would these be the two features:

a) "lock" a selection (current selection is locked in place, another component can't be selected) b) disable ability to move and resize selected components

Some thoughts:

  • I'm wondering if we should call the latter readOnly or something internally, since it's more than dragging, it's also resizing dimensions.
  • When dragging/resizing is disabled, should this be consistent and include disabling editing from properties and the box model?

Also I just opened #102 which builds on the SelectionMode enum stuff that Baconpaul added. Not sure it makes sense but we could add a mode called LOCKED?

In it, I basically call overlayMouseListener.disable() to disable selection, so maybe we should at least align that stuff a bit!

Yes, this PR covers both https://github.com/sudara/melatonin_inspector/issues/49 and https://github.com/sudara/melatonin_inspector/issues/90

a) exactly how 'lock' works in this PR. Need a new icon for this. b) I think I only handled drag... will check resize as well

'readOnly' - makes more sense, since I missed resize. Totally make sense. I think I can disable properties and box model, didn't even think of that. I was focused on keeping selection and controls other component. 😊

Yeah, that would be nice! We're starting to have to many bool flags. I'll take a look at SelectionModes

sudara commented 7 months ago

I'll take a look at SelectionModes

Yeah, not 100% sure it makes sense, just thought I'd mention. To do that, we'd need to have the UI be a multi-select (mouse vs. tab vs. locked??).

Need a new icon for this.

I can get on that. I was originally thinking it would be nice to see a lock icon in the tree view... i guess we could actually make the toggle there (like a lock action button would show up when you hovered over an item) — but maybe it's just more straightforward to have it in the header and maybe bound to L key or something.

sudara commented 5 months ago

@dikadk Should I take a look at this and add a lock toggle? Or is there more you wanted to do on it...

dikadk commented 5 months ago

@dikadk Should I take a look at this and add a lock toggle? Or is there more you wanted to do on it...

I looked into adding Locked - SelectionMode, but I couldn't quite figure out logic with handling of old and new SelectionModes. I've updated 'resizing' logic to only work with focus mode and automatically switch. Short demo attached.

https://github.com/sudara/melatonin_inspector/assets/15266737/54b6dda3-6a68-4ce3-8000-45d5a1c2e821

sudara commented 5 months ago

Hey cool!

No worries on the SelectionModes, just wanted to mention them since they are new.

Wait, I got confused again. Does this PR cover #90 ? I'm guessing the answer is no and I can still click to select other components when dragging is disabled. That's 100% fine if true — and maybe ideal? (I guess we'd want the selection lock to be a different toggle? I think?)

I'll shut up and play with it now :)

dikadk commented 5 months ago

Just updated PR title. Sorry for confusion.

This one ONLY covers dragging and resizing functionality in FOLLOW_FOCUS SelectionMode. I found it kinda clunky in FOLLOW_FOCUS mode.

Maybe we can add another btn for LOCKING selection? Get a 'lock' icon and I can open another PR for that.

sudara commented 5 months ago

Ok perfect! I'll check it out asap and merge and figure out a lock icon while I'm at it...

sudara commented 5 months ago

I added the lock icon, did a bit of refactoring and then just decided to add the lock. It's very basic right now, just prevents any selection or hover. Not sure if we want to hover on lock?...