JS Engine - chrisgurney/obsidian-note-toolbar GitHub Wiki
Install and enable the JS Engine plugin ↗ to execute JavaScript from Note Toolbar.
Note Toolbar's Scripting option must be enabled in order to use this feature.
[!tip] Example scripts that work with Note Toolbar can be found in this folder ↗
Use JavaScript expressions in any toolbar item
Use JavaScript expressions in labels, tooltips, and URIs, to create dynamic toolbars.
For example, set your label to {{js: return new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' })}}
to show today's date, right in your toolbar.
Functions available
After creating a new JS Engine
toolbar item, select from one of the below functions.
Evaluate JavaScript
- Interprets the provided JavaScript expression (which can be multiple lines) and returns the result.
Expression example:
console.log("👋 Hello console!");
new Notice("👋 Hello notice!");
Execute JavaScript file
- Executes the provided script, optionally putting output in the provided Output callout. File path should be relative to your vault's root.
- Uses the
internal.executeFile
API method.
JavaScript file example:
console.log("👋 Hello console!");
new Notice("👋 Hello notice!");
return "👋 Hello note!";
JavaScript file with markdown rendering:
return engine.markdown.create('*test*'); // must use Output callout ID for this to render into
The JS Engine Markdown Builder works as well. See the JS Engine documentation ↗
Input parameters
If input parameters are passed to the script, such as:
param1: "value1", param2: 123
...they can be accessed within the script like so:
if (input) {
({param1, param2} = input)
console.log(param1); // "value1"
}
Import and execute
- Imports the provided JavaScript file, then executes a function within it. File path should be relative to your vault's root.
- Parameters can be passed in JSON format, e.g.,
{ "name": "Chris" }
. See above for how to use them. - ⚠️ Note that the JavaScript file is only imported once. You may have to restart Obsidian in order to pick up changes.
- Uses the
importJs
API method.
JavaScript file with function and arguments example:
export function Hello(engine, args) {
console.log(`👋 Hello ${args['name']}`);
new Notice(`👋 Hello ${args['name']}`);
}
Note Toolbar Callout support
For Note Toolbar Callouts, use these data attributes:
Function | data-js-engine |
data-src |
data-expr |
data-func |
data-args |
data-callout |
---|---|---|---|---|---|---|
Evaluate JavaScript | evaluate |
n/a | expression | n/a | n/a | callout ID (optional) |
Execute JavaScript | exec |
JavaScript filename | n/a | n/a | n/a | callout ID (optional) |
Import and execute JavaScript | importExec |
JavaScript filename | n/a | function name (optional) | arguments (optional) | n/a |
Example:
> [!note-toolbar] JS Engine Toolbar
> - [Hello World with JS Engine]()<data data-js-engine="exec" data-src="Scripts/JsEngine/HelloWorld.js"/>
Where does output go, and where are errors reported?
For how output and errors are handled, see Executing scripts.