JavaScript - chrisgurney/obsidian-note-toolbar GitHub Wiki

Support for executing JavaScript is built-in to Note Toolbar. (Consider using the JS Engine plugin ↗ for more advanced usage.)

Note Toolbar's Scripting option must be enabled in order to use this feature.

[!tip] Example scripts that work with Note Toolbar's JavaScript support can be found in the JS Engine 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 or tooltip to:

{{js: return new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' }) }} to show today's date.
{{js: return ntb.getProperty('created') }} to show the created property from your note.
{{js: return Math.ceil((new Date(ntb.getProperty('due')) - new Date()) / (1000*60*60*24)).toString() + " day(s)"}} to show the number of days between now and the date in the due property.

[!warning] Expressions using await will not return a value, as it's wrapped in (async () => { ... }) before execution.

After creating a new JavaScript toolbar item, select from one of the below functions.

Interprets the provided JavaScript expression (which can be multiple lines) and returns the result.

Expression example:

console.log("👋 Hello console!");
new Notice("👋 Hello notice!");

Executes the provided script, optionally putting output in the provided Output callout. File path should be relative to your vault's root.

JavaScript file example:

console.log("👋 Hello console!");
new Notice("👋 Hello notice!");
return "👋 Hello note!";

JavaScript file with markdown rendering:

return '*test*'; // must use Output callout ID for this to render into

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"
}

For Note Toolbar Callouts, use these data attributes:

Function	`data-javascript`	`data-src`	`data-expr`	`data-args`	`data-callout`
Evaluate JavaScript	`evaluate`	n/a	expression	n/a	callout ID (optional)
Execute JavaScript	`exec`	JavaScript filename	n/a	n/a	callout ID (optional)

Example:

> [!note-toolbar] JavaScript Toolbar
> - [Hello World with JavaScript]()<data data-javascript="evaluate" data-expr="console.log('Hello World!');"/>

For how output and errors are handled, see Executing scripts.