KM & Quiver by HappenApps: Is it possible to open or trigger a Macro by using vanilla JavaScript from a html formatted Note?

Questions & Suggestions
,
1

Hello Folks :wave:

Since I’m learning HTML, CSS & JavaScript (as preparation for my Journey with the Custom HTML Prompt) I am writing a lot of new Notes in Quiver by HappenApps and use my new programming skills to reformat the one or another from my older Notes from the past into HTML - which is - thanks to the embedded WebView in Quiver no problem when using the Markdown Cell Type.

Here is the scenario - I want to trigger or open macros by using the document.onclick() from JS for a button implemented into the Quiver Note to trigger Keyboard Maestro Macros whose will act based on a specific Note in Quiver.

You‘ve probably guessed it - I want it to work with parameters as input for %TriggerValue% - it would also be great if I could use some JS code to detect wether I am using Modifier Keys and also pass them as parameters for %TriggerValue%

The input is always the Quiver Note URL and a specific source (another Note URL in another Library, the link to a webpage, the URL to a MacroTriggerFile or the UUID of a Macro or MacroGroup …)

Here is a sample HTML source from one of my Quiver Notes with a picture that shows how the Code looks when its rendered - It shows one of my ASObjC Scripts I've already shared here - in a Bordered box with a silver colored border of 2 px, a light-blue background, the script text formatted using the standard syntax setting of Script Debugger and a Button in the upper right corner.

Clicking the button opens Script Debugger (since this is my Default Script-Editor), makes a new Script Document and pastes in the Script Source uncompiled.

HTML-Code:


<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<title>Script in Clipboard</title>
	<style type="text/css" media="screen"><!--
.uncompiled {
	font-family : Menlo-Regular;
	color : #7F007F;
}
.normal {
	font-family : Verdana;
	color : #000000;
}
.langKeyword {
	font-family : Verdana-Bold;
	color : #000000;
}
.appKeyword {
	font-family : Verdana;
	color : #0000FF;
}
.comment {
	font-family : Verdana;
	color : #4C4E4E;
}
.literal {
	font-family : Verdana;
	color : #000000;
}
.userDefine {
	font-family : Verdana;
	color : #407F00;
}
.stringLiteral {
	font-family : Verdana;
	color : #000000;
}
.commandName {
	font-family : Verdana-Bold;
	color : #0000FF;
}
.parameterName {
	font-family : Verdana;
	color : #0000FF;
}
.className {
	font-family : Verdana-Italic;
	color : #0000FF;
}
.propertyName {
	font-family : Verdana;
	color : #6C05D3;
}
.enumeratedValues {
	font-family : Verdana-Italic;
	color : #6C05D3;
}
.additionCommandName {
	font-family : Verdana-Bold;
	color : #0016A0;
}
.additionParameterName {
	font-family : Verdana;
	color : #0016A0;
}
.additionClass {
	font-family : Verdana-Italic;
	color : #0016A0;
}
.additionProperty {
	font-family : Verdana;
	color : #4415A0;
}
.additionEnumeratedValue {
	font-family : Verdana-Italic;
	color : #4415A0;
}
.sourceCode  {
	font-family: sans-serif;
	margin: 0.5ex 2em;
	padding: 1ex;
    border: solid 2px silver;
    background: lightblue;
    }
.scriptButton {
    float:right;
    
    }
--></style>
</head>

<body>
	<div class="sourceCode">
        <div class="scriptButton">
            <input type="button" value="Open in Script Editor" onclick="document.location = this.src" src="applescript://com.apple.scripteditor?action=new&amp;script=use%20AppleScript%20version%20%222.3%22%20--%20Mavericks%20(10.9)%20or%20later%0Duse%20scripting%20additions%0Duse%20framework%20%22Foundation%22%0Duse%20framework%20%22AppKit%22%20--%20for%20NSEvent%0D%0D%0D--%20Defining%20the%20output%20Strings%20for%20each%20Modifier%0Dset%20fnKeyStr%20to%20%22Function-Key%20down%20:%20%22%0Dset%20shiftKeyStr%20to%20%22Shift-Key%20down%20:%20%22%0Dset%20ctrlKeyStr%20to%20%22Control-Key%20down%20:%20%22%0Dset%20optionKeyStr%20to%20%22Option-Key%20down%20:%20%22%0Dset%20cmdKeyStr%20to%20%22Command-Key%20down%20:%20%22%0D%0D%0D--%20Function-Key%0Dset%20fnKeyStat%20to%20(((current%20application%27s%20NSEvent%27s%20modifierFlags())%20div%20%C2%AC%0D%09(current%20application%27s%20NSFunctionKeyMask%20as%20integer))%20mod%202)%20%3E%200%0D%0D--%20Shift-Key%0Dset%20shiftKeyStat%20to%20(((current%20application%27s%20NSEvent%27s%20modifierFlags())%20div%20%C2%AC%0D%09(current%20application%27s%20NSShiftKeyMask%20as%20integer))%20mod%202)%20%3E%200%0D%0D--%20Control-Key%0Dset%20ctrlKeyStat%20to%20(((current%20application%27s%20NSEvent%27s%20modifierFlags())%20div%20%C2%AC%0D%09(current%20application%27s%20NSControlKeyMask%20as%20integer))%20mod%202)%20%3E%200%0D%0D--%20Option-Key%0Dset%20optionKeyStat%20to%20(((current%20application%27s%20NSEvent%27s%20modifierFlags())%20div%20%C2%AC%0D%09(current%20application%27s%20NSAlternateKeyMask%20as%20integer))%20mod%202)%20%3E%200%0D%0D--%20Command-Key%0Dset%20cmdKeyStat%20to%20(((current%20application%27s%20NSEvent%27s%20modifierFlags())%20div%20%C2%AC%0D%09(current%20application%27s%20NSCommandKeyMask%20as%20integer))%20mod%202)%20%3E%200%0D%0D%0D--%20Generate%20the%20current%20Output%20as%20List%0Dset%20modifierKeyStat%20to%20fnKeyStr%20%26%20fnKeyStat%20%26%20return%20%C2%AC%0D%09%26%20shiftKeyStr%20%26%20shiftKeyStat%20%26%20return%20%C2%AC%0D%09%26%20ctrlKeyStr%20%26%20ctrlKeyStat%20%26%20return%20%C2%AC%0D%09%26%20optionKeyStr%20%26%20optionKeyStat%20%26%20return%20%C2%AC%0D%09%26%20cmdKeyStr%20%26%20cmdKeyStat%0D%0D--%20Show%20the%20List%20with%20the%20current%20List%0Dreturn%20modifierKeyStat" />
        </div>
        <div>
<span class="langKeyword">use</span> <span class="propertyName">AppleScript</span> <span class="appKeyword">version</span> <span class="normal">&quot;2.3&quot;</span> <span class="comment">-- Mavericks (10.9) or later</span>
</div>
<div>
<span class="langKeyword">use</span> <span class="className">scripting additions</span>
</div>
<div>
<span class="langKeyword">use</span> <span class="className">framework</span> <span class="normal">&quot;Foundation&quot;</span>
</div>
<div>
<span class="langKeyword">use</span> <span class="className">framework</span> <span class="normal">&quot;AppKit&quot;</span> <span class="comment">-- for NSEvent</span>
</div>
<br /><br />
<div>
<span class="comment">-- Defining the output Strings for each Modifier</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">fnKeyStr</span> <span class="langKeyword">to</span> <span class="normal">&quot;Function-Key down : &quot;</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">shiftKeyStr</span> <span class="langKeyword">to</span> <span class="normal">&quot;Shift-Key down : &quot;</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">ctrlKeyStr</span> <span class="langKeyword">to</span> <span class="normal">&quot;Control-Key down : &quot;</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">optionKeyStr</span> <span class="langKeyword">to</span> <span class="normal">&quot;Option-Key down : &quot;</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">cmdKeyStr</span> <span class="langKeyword">to</span> <span class="normal">&quot;Command-Key down : &quot;</span>
</div>
<br /><br />
<div>
<span class="comment">-- Function-Key</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">fnKeyStat</span> <span class="langKeyword">to</span><span class="normal"> (((</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSEvent's</span> <span class="userDefine">modifierFlags</span><span class="normal">()) </span><span class="langKeyword">div</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">(</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSFunctionKeyMask</span> <span class="langKeyword">as</span> <span class="className">integer</span><span class="normal">)) </span><span class="langKeyword">mod</span> <span class="normal">2</span><span class="normal">) &gt; </span><span class="normal">0</span>
</div>
<br />
<div>
<span class="comment">-- Shift-Key</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">shiftKeyStat</span> <span class="langKeyword">to</span><span class="normal"> (((</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSEvent's</span> <span class="userDefine">modifierFlags</span><span class="normal">()) </span><span class="langKeyword">div</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">(</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSShiftKeyMask</span> <span class="langKeyword">as</span> <span class="className">integer</span><span class="normal">)) </span><span class="langKeyword">mod</span> <span class="normal">2</span><span class="normal">) &gt; </span><span class="normal">0</span>
</div>
<br />
<div>
<span class="comment">-- Control-Key</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">ctrlKeyStat</span> <span class="langKeyword">to</span><span class="normal"> (((</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSEvent's</span> <span class="userDefine">modifierFlags</span><span class="normal">()) </span><span class="langKeyword">div</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">(</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSControlKeyMask</span> <span class="langKeyword">as</span> <span class="className">integer</span><span class="normal">)) </span><span class="langKeyword">mod</span> <span class="normal">2</span><span class="normal">) &gt; </span><span class="normal">0</span>
</div>
<br />
<div>
<span class="comment">-- Option-Key</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">optionKeyStat</span> <span class="langKeyword">to</span><span class="normal"> (((</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSEvent's</span> <span class="userDefine">modifierFlags</span><span class="normal">()) </span><span class="langKeyword">div</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">(</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSAlternateKeyMask</span> <span class="langKeyword">as</span> <span class="className">integer</span><span class="normal">)) </span><span class="langKeyword">mod</span> <span class="normal">2</span><span class="normal">) &gt; </span><span class="normal">0</span>
</div>
<br />
<div>
<span class="comment">-- Command-Key</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">cmdKeyStat</span> <span class="langKeyword">to</span><span class="normal"> (((</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSEvent's</span> <span class="userDefine">modifierFlags</span><span class="normal">()) </span><span class="langKeyword">div</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">(</span><span class="enumeratedValues">current application's</span> <span class="userDefine">NSCommandKeyMask</span> <span class="langKeyword">as</span> <span class="className">integer</span><span class="normal">)) </span><span class="langKeyword">mod</span> <span class="normal">2</span><span class="normal">) &gt; </span><span class="normal">0</span>
</div>
<br /><br />
<div>
<span class="comment">-- Generate the current Output as List</span>
</div>
<div>
<span class="langKeyword">set</span> <span class="userDefine">modifierKeyStat</span> <span class="langKeyword">to</span> <span class="userDefine">fnKeyStr</span><span class="normal"> &amp; </span><span class="userDefine">fnKeyStat</span><span class="normal"> &amp; </span><span class="propertyName">return</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">&amp; </span><span class="userDefine">shiftKeyStr</span><span class="normal"> &amp; </span><span class="userDefine">shiftKeyStat</span><span class="normal"> &amp; </span><span class="propertyName">return</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">&amp; </span><span class="userDefine">ctrlKeyStr</span><span class="normal"> &amp; </span><span class="userDefine">ctrlKeyStat</span><span class="normal"> &amp; </span><span class="propertyName">return</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">&amp; </span><span class="userDefine">optionKeyStr</span><span class="normal"> &amp; </span><span class="userDefine">optionKeyStat</span><span class="normal"> &amp; </span><span class="propertyName">return</span><span class="normal"> ¬</span>
</div>
<div style="text-indent:4ex;">
<span class="normal">&amp; </span><span class="userDefine">cmdKeyStr</span><span class="normal"> &amp; </span><span class="userDefine">cmdKeyStat</span>
</div>
<br />
<div>
<span class="comment">-- Show the List with the current List</span>
</div>
<div>
<span class="langKeyword">return</span> <span class="userDefine">modifierKeyStat</span>
</div>
	</div>
</body>

Bildschirmfoto 2023-09-12 um 13.34.22
Bildschirmfoto 2023-09-12 um 13.34.221920×1816 173 KB

Is this possible?

Could you give me some examples ?

Many thanks for the help :pray:

Greetings from Germany

Tobias

2

Generally web page JavaScript is designed specifically to not allow you to get out of it.

But if Quiver allows you to run ASObjC /JavaScript in Automation then you could likely use that to control the Keyboard Maestro Engine.

But it would surprise me if a web page is allowed to do that. Basically just

tell app "Keyboard Maestro Engine" to do script "Macro Name or UID" with parameter "whatever"
3

Hello Peter (@peternlewis) thanks for your answer…

What if I would embed a Macro trigger file into the Note Resources or an executable? :thinking:

Could this be the way that will work? With either of these options I would be able to use any language that is compatible with the Scripting Bridge of macOS …

Greetings from Germany

4

I don't really know what is possible in Quiver.

5

Hello Peter (@peternlewis) :wave:

I nearly almost forgot about a nifty little but very useful feature that you’ve already put into Keyboard Maestro a long time ago … the URL Scheme …

It bumped into my head when I was in the mood about going to bed yesterday…. How the heck could I forget about that feature ?! I am using automations using these URL Schemes nearly every day when I am in front of my macs !!

This would be something that could work… I just have to comment on everything in my html code about the linked macros and have to put a Comment Action into every Macro that is linked to any Quiver Note with the information about wich Note the Macro is linked to …

We‘ll see … I will look into this…

Now I will only need to know about the JavaScript part …

Have a great Sunday

Greetings from Germany to Australia :australia:

Tobias

1 Like