Create Javascript for KM using ChatGPT

Questions & Suggestions
#1

I am trying to use ChatGPT to create a very simple Javascript example as an initial test.

image
image1440×1524 239 KB

I created this script in Keyboard Maestro using Execute Javascript in Google Chrome:

image
image1994×950 146 KB 

var states = ["Alabama", "Alaska", "Arizona", "Arkansas", "California"];
var capitals = ["Montgomery", "Juneau", "Phoenix", "Little Rock", "Sacramento"];

var table = "<table>";
table += "<tr><th>State</th><th>Capital</th></tr>";

for (var i = 0; i < states.length; i++) {
    table += "<tr><td>" + states[i] + "</td><td>" + capitals[i] + "</td></tr>";
}

table += "</table>";

alert(table);

The result is an alert box which shows the raw generated HTML.

image
image890×522 48.9 KB

How do instead alter the script to open a new tab in Chrome and render the HTML there?

Any idea how to structure the ChatGPT request so ChatGPT proposes a script which runs as-is in the desired fashion?

#2

The easiest way would be to save it as an .html file (you probably need the remainder of the HTML structure) and then open that in Chrome.

#3

chatGPT has a model only of language (a statistical model of what symbols are most likely to come next, given the symbol streams that it has seen).
It contains no other theory, knowledge base, or understanding of computational outcomes.

(This is why it's not even reliable for arithmetic)

So, while it can regurgitate or hallucinate, it can't aim for outcomes.

Getting there by prompt adjustment would be a long, iterative, and time-consuming shot, with only a dice-throw prospect of success.

To quote from a chatGPT3 response this morning – which clearly bears the mark of some "supervised learning" (to deflect potential liabilities):

As a language model, I am designed to generate text that is similar in structure and content to the text that I was trained on. While the text I generate may appear to convey information, it is important to keep in mind that I do not have an understanding of the concepts or ideas that I am expressing. I simply generate text based on patterns and associations that I have learned from the data that I was trained on.

#4

Thanks Peter - can this be done in some programmatic/automated way? I am hoping to use this as a template for more advanced scripts; it would be much more helpful if I can render the HTML at the time the script is run.

#5

Problem Solved:

image
image1616×1160 146 KB

Write JavaScript (using document.write) to work in Keyboard Maestro to show table of 5 state capitals:

document.write("<table>");
document.write("<tr><th>State</th><th>Capital</th></tr>");
document.write("<tr><td>Alabama</td><td>Montgomery</td></tr>");
document.write("<tr><td>Alaska</td><td>Juneau</td></tr>");
document.write("<tr><td>Arizona</td><td>Phoenix</td></tr>");
document.write("<tr><td>Arkansas</td><td>Little Rock</td></tr>");
document.write("<tr><td>California</td><td>Sacramento</td></tr>");
document.write("</table>");
2 Likes
#6

Hey Richard,

You can do it that way, or you can write as a block:

document.write(`<table>
<tr><th>State</th><th>Capital</th></tr>
<tr><td>Alabama</td><td>Montgomery</td></tr>
<tr><td>Alaska</td><td>Juneau</td></tr>
<tr><td>Arizona</td><td>Phoenix</td></tr>
<tr><td>Arkansas</td><td>Little Rock</td></tr>
<tr><td>California</td><td>Sacramento</td></tr>
</table>`);

-Chris

#7

Thanks

Am I correct that when I want to use more modern methods of Javascript output such as those which use the canvas feature, I need to use a Custom HTML Prompt and create the canvas there?

#8

Someone else will have to answer – or you'll have to test. I'm not that far up the HTML-JS food chain.