Skip to content

Adds 'Mods only' visualizer#203

Open
colinta wants to merge 6 commits intokeycastr:minimal-visualizerfrom
colinta:main
Open

Adds 'Mods only' visualizer#203
colinta wants to merge 6 commits intokeycastr:minimal-visualizerfrom
colinta:main

Conversation

@colinta
Copy link

@colinta colinta commented May 20, 2021

I made this for my own purposes, but I'll offer it up in the spirit of open source. Based on the Svelte visualizer, this one displays the current modifiers and nothing more.

I use it because I have a custom keyboard that implements sticky keys, and I needed to see them on screen (it's easy to lose track of which keys are pressed).

Not really useful for screencasting, but it does show how to create a new visualizer. 🤷‍♂️

Example of pressing "command+shift" and "command+control+alt+shift".

screen shot 2019-02-27 at 11 08 05 am
screen shot 2019-02-27 at 11 07 47 am

@colinta
Copy link
Author

colinta commented Oct 18, 2023

I updated this yesterday to include fixes for clicking "through" the window when no (or few) mods are visible. In sonoma, anyway, the mods window was swallowing clicks.

@akitchen
Copy link
Member

Hey thanks for reviving this PR! I will make time to review it soon and try to figure out how we can incorporate it into an upcoming release.

In my own work there's been some tension between adding more features to the default visualizer vs introducing a new one, so I'm eager to (finally) give this a closer look alongside the upcoming mouse visualizer improvements.

@colinta
Copy link
Author

colinta commented Oct 18, 2023

Rad! Happy to make changes to it, it's a bit niche at the moment (it scratches an itch I have, but ofc I'd like it to be useful to more).

The default and Svelte plugins are useful and distinct (podcasts, pair programming) - this is more for personal use. But yeah improvements welcome. 👍

Copy link
Member

@akitchen akitchen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A licensing change and a couple minor formatting nits; I will look at more of the functional code locally and follow up later.

@akitchen
Copy link
Member

One other thing -- of course there's no real style guide or anything here, but at one point I thought it would make sense for the order of modifiers to match what Apple's macOS apps show in their menu items. Pretty sure it's control-option-shift-command.

@colinta
Copy link
Author

colinta commented Oct 19, 2023 via email

@colinta colinta requested a review from akitchen October 20, 2023 15:51
@colinta
Copy link
Author

colinta commented Oct 20, 2023

How's that? 🙂

@akitchen
Copy link
Member

Overall this is fantastic to see and I can see how it could be useful. Thanks again.

Additional code feedback is mainly just about code formatting for now -- please use Xcode's default formatting for multi-line statements just to keep things as consistent as possible.

A few more thoughts:

  • Could you make it remember its position on screen?
  • How about adding some configuration options for font size, colors, and maybe fade out duration?
  • I wonder if it would be possible (and useful) to display the 'fn' key as well?

@colinta
Copy link
Author

colinta commented Nov 2, 2023

  • Could you make it remember its position on screen?

I'm struggling with how easy this should be vs how easy it is...

    [_visualizerWindow setFrameUsingName:@"mods visualizerFrame" force:YES];
    [_visualizerWindow setFrameAutosaveName:@"mods visualizerFrame"];

This used to "just work", but is having no effect now. Anything obvious I'm getting wrong?

    NSRect windowFrame = { MODS_WIDTH, 100, 0, 100 };
    _visualizerWindow = [[NSWindow alloc]
         initWithContentRect:windowFrame
        styleMask:NSWindowStyleMaskBorderless
        backing:NSBackingStoreBuffered
        defer:NO];
    [_visualizerWindow setLevel:NSScreenSaverWindowLevel];
    [_visualizerWindow setBackgroundColor:[NSColor clearColor]];
    [_visualizerWindow setMovableByWindowBackground:YES];
    [_visualizerWindow setFrameUsingName:@"mods visualizerFrame" force:YES];
    [_visualizerWindow setFrameAutosaveName:@"mods visualizerFrame"];
    [_visualizerWindow setOpaque:NO];

    _visualizerView = [[ModsVisualizerView alloc] init];
    [_visualizerWindow setContentView:_visualizerView];
    [_visualizerView noteFlagsChanged:0];
// ... below ...
- (void)noteFlagsChanged:(uint32_t)flags {
    [_visualizerView noteFlagsChanged:flags];
    NSRect r = _visualizerWindow.frame;
    CGFloat right = r.origin.x + r.size.width;
    r.size.width = _visualizerView.frame.size.width;
    r.origin.x = right - r.size.width;
    [_visualizerWindow setFrame:r display:NO];
}

// ModsVisualizerView
- (void)noteFlagsChanged:(uint32_t)flags {
    _flags = flags;
    NSRect frame = self.frame;
    frame.size.width = MODS_WIDTH / 4 * (CGFloat)[self flagsCount];
    self.frame = frame;
    [self setNeedsDisplay:YES];
}

@colinta
Copy link
Author

colinta commented Nov 2, 2023

  • I wonder if it would be possible (and useful) to display the 'fn' key as well?
Screenshot 2023-11-02 at 12 10 27 PM

@colinta
Copy link
Author

colinta commented Nov 2, 2023

  • How about adding some configuration options for font size, colors, and maybe fade out duration?

These... maybe I could use some help on these. 😬

The rest are done, except I can't figure out the frame-auto-save feature.

@colinta
Copy link
Author

colinta commented Nov 2, 2023

@akitchen I added you as a contributor to my fork, in case you wanted to do any more features/clean-up there.

@colinta
Copy link
Author

colinta commented Nov 9, 2023

Let's not let another year go by! 😬 What's next? I tried again today to save/restore the frame using autosave, but had no luck. What changed? 🤔

@akitchen
Copy link
Member

I haven't debugged this or spent too much time looking at it, but your starting frame is a bit suspicious to me at first glance. Maybe use the NSMakeRect function to help create your initial frame and ensure the origin and size are set properly. This code is manipulating the frame of both the window and the view, which may or may not be correct. A frame's origin is in its parent view's coordinate system. Not sure if you're using a flipped coordinate system or not, but you have to account for that as well.

I hope it helps!

Copy link
Member

@akitchen akitchen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

'REQUEST_CHANGES' performed by Xcode.

@Teufeuleu
Copy link

Hi, I just discovered Keycastr and I wanted to chime in here, because this is exactly the last feature I am missing!
I use apps (Cycling'74 Max, Ableton Live) on which I often use modifier key + click interactions.
The Svelte visualizer helps in this regard, but it's too big and obstructive as I don't need the modifier key placeholders. I just want something like the Default visualizer to display also modifier keys when they are pressed without combination with an "other" key.
I'm not sure how this is different from #284 but I feel like both would fill my need anyway.
So thank you all for maintaining and improving this awesome utility!

@colinta
Copy link
Author

colinta commented Sep 26, 2024

Yup, I'm back. It's working as intended now, rebased on main, updated the code to grow the mods view according to its position on the current screen.

I avoided the autosave bug by simply not using it 🤷‍♂️ – it uses NSUserDefaults under the hood, so that's what I used, too.

@colinta colinta requested a review from akitchen September 26, 2024 15:48
@akitchen
Copy link
Member

akitchen commented Oct 2, 2024

Hey @colinta thank you for following up here, I'll pull this locally and give it a try.

@akitchen
Copy link
Member

akitchen commented Oct 2, 2024

This is really great to see - thanks again!

One thing I noticed, the second and subsequent times I run the app after enabling this visualizer, on startup I see a blank square until the first modifier key event comes through. If you could find a fix for that, I'd be happy taking this pretty much as-is and maybe doing some minor cleanups before an upcoming release.

Also, let me know your thoughts on maintaining this visualizer going forward. There are a lot of obvious enhancements that could be done as well as potential other issues, and any release of KeyCastr has to be as high quality as possible given limited development time and potentially long gaps between releases.

Thanks again for your contribution! Much appreciated!

Copy link
Member

@akitchen akitchen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fix for phantom box on second and subsequent launch. TY!

@akitchen
Copy link
Member

Hey @colinta , I've been trying this out for a little while and I really like it! I'd like to figure out the remaining steps needed to include it in an upcoming release. Thanks again for sharing the work you put into this!

There are a few minor internal changes/improvements which I'll be happy to make, but I think we would need a few more user-facing things. Mainly color and size options, and the ability to include other keystrokes and even mouseclicks like the other visualizers.

I can help with some or all of that, but it also brings me to another topic. With the additional functionality to display regular keystrokes and mouse clicks it becomes more than just a "Mods" visualizer. Any thoughts on what it should be called?

@colinta
Copy link
Author

colinta commented Oct 18, 2024 via email

@SoCuul
Copy link

SoCuul commented Dec 9, 2024

Any update on the status of this? 👀

@odama626
Copy link

just found this, this is exactly what I ned as well.

is there anything I can help with to get this over the line?

@akitchen
Copy link
Member

Glad to see there's interest in this, I like it too :) I have a local branch with a handful of fixups and updates, but it will also need a bit more work before I'm comfortable including it in an official release. I hope to be able to share more of an update soon.

@colinta
Copy link
Author

colinta commented Feb 14, 2025

I'm happy to help test it!

@akitchen
Copy link
Member

Hey @colinta , sorry this has dragged on for so long. I had your changes on a local branch where I did some cleanups and started to pave the way for the rest of the changes I think this needs in order to be included in the app, but haven't been able to make much progress on it for a while.

If you're still interested you can check out the minimal-visualizer branch and consider opening some new PRs to that branch after you've had a chance to test and play around with it for a bit. Adding a third visualizer plus the need to add more options to the mouse visualizer means other infrastructure work is needed in the app before this can be launched as a part of the app, but I'd still like to do it.

@akitchen
Copy link
Member

#330 is relevant to this

@akitchen akitchen changed the base branch from main to minimal-visualizer August 24, 2025 01:08
@akitchen
Copy link
Member

I changed the target branch for this to the minimal-visualizer branch. Please merge that into your local copy or open a new PR if that's easier. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants