Draw a Window to the right of FaceTime Macro (v11.0.2)

OOPS, I meant for this to be in a specific thread, but after considering it, I think it merits its own thread. Basically, I'm looking for help duplicating part of a window of an existing app and placing that duplicate on the right of the window. I'm working on the problem, but if anyone wants to contribute ideas, that would be welcome.

Here's a macro that provides the basic structure of what I was thinking about, for discussion purposes. Whenever the FaceTime window changes location, this macro makes a note of the new location, and draws a rectangle to the right of the FaceTime app, precisely where a copy of the left pane of the app should go. The next step would be to copy the left pane of the FaceTime app into a Custom HTML window and display the window where the blue frame is being drawn. I always struggle with the code needed to place Custom HTML windows, but I'm hopeful I can do it.

Draw a Window to the right of FaceTime Macro (v11.0.2)

Draw a Window to the right of FaceTime.kmmacros (3.9 KB)

Can anyone tell me why the Custom HTML window in the following macro is not closing? I carefully read another thread which said this is the way to close an asynchronous HTML window. (The Play Sound action, below, is just to keep the window visible for one second.)

Normally I would disable the "Has Title" flag, but since I can't get this window to close, I've left it enabled so that I don't have to restart the KM Engine each time this macro fails to close the window.

Add Window to the Right Macro (v11.0.2)

Add Window to the Right.kmmacros (3.0 KB)

The `data-kmwindowid' tag goes in the actual <body... element, like this:

<body data-kmwindowid="myWindowID" data-kmwindow="300,50" style="etc...">
    <img src.....etc>

You can then close it with a Javascript action on the myWindowID window, and this is what I use:



That helped. I didn't realize that you had to combine data-kmwindow and data-kmwindowid into the same "<clause>."

I will place it into the <body> but everything works regardless of whether it's in the body or not.

You did answer my second post, but since my first post is still open I won't mark your message as the solution.

This is exciting, as I think I have most of the tools now to make my idea work.

I don't think you should mark it as solved, as I was just addressing the one item.


I've got the main ideas working here. This macro will create a copy of the left pane of the FaceTime app, and place the copy on the right hand side of the app. It updates its image every 2 seconds (an arbitrary value for now.) It updates the window's position every time you move the FaceTime window.

Now that it's partly working, I'm seeing some issues that need to be addressed.

  1. I would prefer that the window not be closed and re-opened every time the app is moved, but that the current Custom HTML window simply be moved. I suspect this is possible, but I have no idea how to do that.
  2. I would like to know if there's a way to force a refresh on a custom HTML window, so that I can update it without closing and opening it.
  3. I still have no idea how to retrieve a click on the window and get KM to take action based on the location of the click. I have a small sense of how to do that, but that will take much more research on my part.
  4. I plan to use OCR to "detect" when the left pane of the FaceTime window has changed, so that I can force an update to the screenshot. I don't need help with this part of the problem.
  5. There is a frame around the Custom HTML window which is causing a small scaling issue. Is there a way to remove the frame? I suspect there is, and if I read the KM documentation, I'll probably find it.

If anyone has tips for items 1, 2, 3 or 5 above, I'd appreciate it. I may not be able to solve all of them without help.

Draw a Window to the right of FaceTime Macro (v11.0.2)

Draw a Window to the right of FaceTime.kmmacros (11 KB)

Save the Engine Window ID when you launch the prompt, then:

Or there's the window.KeyboardMaestro.ResizeWindow() if you want to do it with JS.


That will also reset the position so you'll need to follow it with either a rewrite or move action.

You'll need to add an event listener plus a function that updates KM variables -- if you are using an image rather than HTML elements it's probably easiest to return the {x,y} then do the decision-making in KM. This might get you started, although my limited experience means I can't get it to work in KM :frowning:

function updateXY(event) {
  window.KeyboardMaestro.SetVariable( 'GlobalMouseX', event.clientX );
  window.KeyboardMaestro.SetVariable( 'GlobalMouseX', event.clientY );

document.addEventListener("click", updateXY);
1 Like