How Do I Create Custom HTML Prompt with Data for HTML List?

Questions & Suggestions
,
1

@JMichaelTX, how are you?

I got your script and macro to work here. Nicely done, thank you.

I have been trying to change it to fit my needs without success. I have an Applescript that extracts information from DEVONthink and formats it into an HTML list (it is a list of links, basically). I would like to use the custom HTML prompt to display the list. However, I could not find a way to simply make it display whatever text I have stored in another variable. I have read, of course, the wiki section related to this; still, no joy. Whenever I edit the HTML provided in your example, nothing comes up from the variables.

Could you perhaps point me in the right direction here?
Like I said, I have a HTML list and all I want to do is keep the window open displaying it.

2

If I understand your objective correctly, I see two possible, untested, approaches:

  1. Use AppleScript to construct the HTML code that includes the HTML list, and integrate it into the HTML file that KM needs.
  2. Design the HTML file to use data from KM Variables.

For me, I think #1 would be easier since both the structure (number of links) and the data (text and href) can change. Many many years ago when I was in the web business I basically took this approach, extracting data from a SQL server and building a dynamic web page.

Other than that, you can try looking at other topics her with about html prompt. Try a search on "tags:html_prompt".

3

Yep, that's tricky. Here's an example in which Local__Key is a Keyboard Maestro variable:

document.write(window.KeyboardMaestro.GetVariable('Local__Key'));
4

Apologies, but here is the thing: I don't know any JavaScript.
To make it very simple, let us assume that I have a variable called theHTML with the following content:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>Dummy 1</title>
<meta name="generator" content="DEVONthink"/>
<link type="text/css" rel="stylesheet" href="file:///Users/bcdav/Dropbox/Application%20Support/BBEdit/Preview%20CSS/1%20-%20SanHo%20DLight%20-%20Alegreya1.css"/>
<meta charset="utf-8"/>
</head>
<body>


<h2 id="metaphysicax-devonthink-item:61c7a707-5f38-40ac-b88a-f418dbcb0d53"><a href="x-devonthink-item://61C7A707-5F38-40AC-B88A-F418DBCB0D53">Metaphysica</a></h2>

<ul>
<li><a href="x-devonthink-item://E626766B-77C8-4862-B2D2-FA8082906725">Metaph A 1</a></li>
</ul>

<blockquote>
<p><a href="x-devonthink-item://07BBABB4-D4F2-4DEB-A800-A551A2D457A7">980a21</a> Πάντες <a href="x-devonthink-item://FF47518A-1905-48D7-AA62-A9CF40F9B2FA">ἄνθρωποι</a> τοῦ εἰδέναι <a href="x-devonthink-item://38180264-EDD9-48C2-8057-FDFFEC7CD5DF">ὀρέγονται</a> <a href="x-devonthink-item://803D114C-70BC-4500-A156-EB7403FD2DB1">φύσει</a>.</p>
</blockquote>

<ul>
<li><a href="x-devonthink-item://F66DEE1F-BD80-45CE-977D-F763CE535827">Metaph A 2</a></li>
</ul>

<blockquote>
<p><a href="x-devonthink-item://F66DEE1F-BD80-45CE-977D-F763CE535827">982a04</a> Ἐπεὶ δὲ ταύτην τὴν <a href="x-devonthink-item://5591AE45-4CAE-4C62-ABFA-23B17BA394E4">ἐπιστήμην</a> <a href="x-devonthink-item://8E63C264-C45D-45F4-B90F-D302F8E3DFDB">ζητοῦμεν</a>, τοῦτ᾽ ἂν <a href="x-devonthink-item://283E2C9E-EDA3-4BEA-8B5E-C6A2351F10B8">εἴη</a> <a href="x-devonthink-item://F66DEE1F-BD80-45CE-977D-F763CE535827">982a05</a> σκεπτέον, ἡ περὶ ποίας αἰτίας καὶ περὶ ποίας ἀρχὰς <a href="x-devonthink-item://5591AE45-4CAE-4C62-ABFA-23B17BA394E4">ἐπιστήμη</a> <a href="x-devonthink-item://F66DEE1F-BD80-45CE-977D-F763CE535827">982a06</a> <a href="x-devonthink-item://BE1D9580-639C-439B-A510-5EF0E6344FD4">σοφία</a> <a href="x-devonthink-item://283E2C9E-EDA3-4BEA-8B5E-C6A2351F10B8">ἐστίν</a>.</p>
</blockquote>


</body>
</html>

How do I make the prompt display that?

5

You put this code in the Custom Floating HTML Prompt:

<script>
document.write(window.KeyboardMaestro.GetVariable('theHTML'));
</script>

Set Variable to Text.kmmacros (4.3 KB)

2 Likes
6

I tried something similar, but my thick head just couldn't quite get it right. Thank you very much @mrpasini and @JMichaelTX.

7

One last thing: I was using @DanThomas's Custom HTML Prompt with Dynamic Size and Position.

Is it possible to have the best of both worlds?

__Testing Macros.kmmacros (49,7,KB)

EDIT: Never mind. It is working :slight_smile: It stores the position, just the size is changing dynamically.

8

Thanks for sharing your solution.
Makes for a very simple solution. :+1:

I had not used the KM HTML Prompt for a while, and not with the floating and resizable options. I have to say I am amazed that you did not need to use any of the special KM HTML that was needed before.

The immediate need I have is to:

  1. Open at a preset size the first time.
  2. When the user closes the window remember the position and size, and use the next that that window is opened.

Do you happen to have that handy? If not, I'm sure I can figure it out.

Oh, one more request: I notice that you use a CSS file stored locally. Any chance you could share that?

Thanks.

9

That's actually the OP's HTML (and CSS), not mine. All I did here is document the JS required to dump a KM variable in the Custom HTML prompt.

10

@JMichaelTX, this is more or less what I was aiming for.
Hopefully it might be useful to others.

Return Links (final).kmmacros (54 KB)

Keyboard Maestro Export
Keyboard Maestro Export615×2672 388 KB

1 Like
11

Thanks for sharing. I'm sure it will be.

Would it be possible for you provide the output of your AppleScript that sets the KM Variable "theHTMLBody", so we could see what is created and test the macro?

Many of us do not have the DevonThink app, and even if we did, not likely to have the data you have in it.

Thanks.

12

Just de-activate the script and activate theDummyHTMLBody.