Resizing html window with javascript, KeyboardMaestro.ResizeWindow- MOVES it

Hi Friends

I'd like my floating info window to resize itself dynamically to its content. the ResizeWindow callback works great at resizing - passing just 2 args for size. But if the window has previously been moved by the user, Resize also snaps its position back to its previous location. I have a strong hunch :slight_smile: that it has to do with the optional args defaulting to a previous value?

function myDynamicResize()
{
		//	dynamic height. keep width
		newheight = document.getElementById('myStats').clientHeight;
		kMyWindowWidthString = "240,"    // with trailing comma
   		 // note - that '+' is a  string cat. works fine
		window.KeyboardMaestro.ResizeWindow(kMyWindowWidthString + newheight);
		// Hey, what are you doing way over there??
}

(bump :slight_smile: )

to be clear, i believe this is a bug. Any thoughts?

added observation - even when the window has not been moved by the user, the resize function changes to Y position of the window, to maintain the 'midline'. I think it should maintain the Y pos, and just extend/shrink the bottom if possible.

I've worked around it by calling the 'native' javascript resize, which works fine.

// window.KeyboardMaestro.ResizeWindow("240,"+newheight);
window.resizeTo(240,newheight);|

edit - I spoke too soon. javascript’s window resize restricts to a minimim height of 80 pixels, and I need to get down to 60, so back to KM’s resize. It works as I wish if I include all 4 coords:

	//	workaround:
	oldTop = window.screenY+titleBarHeight;	//	account for title bar, 19px
	oldLeft = window.screenX;
	oldWidth = window.outerWidth;

	resizeString = String(oldLeft) + "," + oldTop + "," + oldWidth + "," + newheight;

	window.KeyboardMaestro.ResizeWindow(resizeString);

So that solves your issue, correct?

So that solves your issue, correct?

Yes. It's a workaround. I'd humbly suggest that there's a bug in the "2 arg" version, but with this workaround, maybe not as high priority as before.

I can confirm that it seems to be a bug.

from: action:Custom HTML Prompt [Keyboard Maestro Wiki]

window.KeyboardMaestro.ResizeWindow(“width,height”) does not resize the window, it moves the window to new position: winX = width; winY = height.

@peternlewis, can you take a look at it?

This is incorrect.

When only width and height are provided it resizes the window as specified and then centers it on the screen. This stems naturally from its use when the window opens, if you only specify width and height it needs to put it somewhere.

You can base it on the current position of the window using:

window.KeyboardMaestro.ResizeWindow(window.screenLeft+","+(window.screenTop+19)+",220,100")

19 is the current title bar height, since ResizeWindow actually expects the content size rather than the window size.

I will add the context sensitive WINDOW function for future versions (which will also return the content size in this case for compatibility with the behaviour in this instance).

1 Like

Thank you for the clarification. My fallible eyes could only notice the window moving. :sweat_smile:

Please consider adding this info to the wiki page. It will simplify some of my macros.

Link to Peter's post has been added to KM Wiki Using JavaScript in the HTML Prompt.

How do you get the size to reflect the content of the page?

I had to make a <div> to include all elements in <body>:

<body data-kmwindowid="CustomKMMacroList" id="body" data-kmwindow="600,300,650,290">
<div id="wholepage">
...
</div>
</body>

And then use JS:

    function KMDidShowWindow() {
        // set window width and height
        // Note: width is determined by the width set in the body field.
        let width = document.getElementById('wholepage').clientWidth;
        let height = document.getElementById('wholepage').clientHeight + 20;

        // resize Window and move to center.
        window.KeyboardMaestro.ResizeWindow(width + "," + height);
    }

If I use let width = document.getElementById('body').clientWidth; etc., the new width (and height) will be determined by the width (and height) I set in data-kmwindow="600,300,650,290".

I can get a new height by let height = document.getElementById('wholepage').clientHeight + 20;. But using let width = document.getElementById('wholepage').clientWidth;, the width is still determined by the initial data: data-kmwindow="600,300,650,290".

Is there a way to get a dynamic width based on the content of the page?

a LOT of trial & error :grin:
I am certainly not an html/css savant, so I don't know which elements + margin + border + inner / outer...??? is the "true" dimension, but I found some attributes that work. it breaks easily and I've had to add some magic constants as the project evolves.

luckily my width is fixed, so its just height I'm tracking.

Now that a couple of years have passed, would anyone be able to lay out a definitive method for adding dynamic sizing to an HTML script?

I think I might have it partly figured out...

HTML
<!DOCTYPE html>
<html>
<head><title>Test HTML Resize</title></head>
<script>
async function kmResize() {
    var scrollWidth = document.documentElement.scrollWidth;
    var scrollHeight = document.documentElement.scrollHeight + 20;
    window.KeyboardMaestro.ResizeWindow(scrollWidth + "," + scrollHeight);
}
</script>
<body onload="kmResize()">
<p>
Must you with him from him her were more. In eldest be it result should remark vanity square. Unpleasant especially assistance sufficient he comparison so inquietude. Branch one shy edward stairs turned has law wonder horses. Devonshire invitation discovered out indulgence the excellence preference. Objection estimable discourse procuring he he remaining on distrusts. Simplicity affronting inquietude for now sympathize age. She meant new their sex could defer child. An lose at quit to life do dull.

Material confined likewise it humanity raillery an unpacked as he. Three chief merit no if. Now how her edward engage not horses. Oh resolution he dissimilar precaution to comparison an. Matters engaged between he of pursuit manners we moments. Merit gay end sight front. Manor equal it on again ye folly by match. In so melancholy as an sentiments simplicity connection. Far supply depart branch agreed old get our.

At as in understood an remarkably solicitude. Mean them very seen she she. Use totally written the observe pressed justice. Instantly cordially far intention recommend estimable yet her his. Ladies stairs enough esteem add fat all enable. Needed its design number winter see. Oh be me sure wise sons no. Piqued ye of am spirit regret. Stimulated discretion impossible admiration in particular conviction up.

Sussex result matter any end see. It speedily me addition weddings vicinity in pleasure. Happiness commanded an conveying breakfast in. Regard her say warmly elinor. Him these are visit front end for seven walls. Money eat scale now ask law learn. Side its they just any upon see last. He prepared no shutters perceive do greatest. Ye at unpleasant solicitude in companions interested.

Comfort reached gay perhaps chamber his six detract besides add. Moonlight newspaper up he it enjoyment agreeable depending. Timed voice share led his widen noisy young. On weddings believed laughing although material do exercise of. Up attempt offered ye civilly so sitting to. She new course get living within elinor joy. She her rapturous suffering concealed.

For who thoroughly her boy estimating conviction. Removed demands expense account in outward tedious do. Particular way thoroughly unaffected projection favourable mrs can projecting own. Thirty it matter enable become admire in giving. See resolved goodness felicity shy civility domestic had but. Drawings offended yet answered jennings perceive laughing six did far.

In alteration insipidity impression by travelling reasonable up motionless. Of regard warmth by unable sudden garden ladies. No kept hung am size spot no. Likewise led and dissuade rejoiced welcomed husbands boy. Do listening on he suspected resembled. Water would still if to. Position boy required law moderate was may.

An country demesne message it. Bachelor domestic extended doubtful as concerns at. Morning prudent removal an letters by. On could my in order never it. Or excited certain sixteen it to parties colonel. Depending conveying direction has led immediate. Law gate her well bed life feet seen rent. On nature or no except it sussex.
</p>
</body>
</html>

This will automatically adapt the prompt height for differing volumes of text. However, the minimum width seems to be ~650px and the height ~350px.

1 Like