mirror of
https://github.com/zadam/trilium.git
synced 2025-06-06 18:08:33 +02:00
links to code notes
parent
1353389870
commit
f646a08b3f
@ -11,7 +11,7 @@ This can be useful for few things:
|
||||
|
||||
## Extra languages
|
||||
|
||||
Trilium supports syntax highlighting for many languages, but by default displays only some of them (to reduce number of items). If you want to add some unlisted supported language, you can use [[Script API]]:
|
||||
Trilium supports syntax highlighting for many languages, but by default displays only some of them (to reduce number of items). If you want to add some unlisted supported language, you can add them by creating new frontend JavaScript code note and using [[Script API]]:
|
||||
|
||||
```javascript
|
||||
const codeMimeTypes = api.getDefaultCodeMimeTypes();
|
||||
|
@ -15,4 +15,4 @@ This `Person template` defines multiple [[promoted attributes]], some of which (
|
||||
|
||||
Using these promoted attributes, user can define the whole family tree.
|
||||
|
||||
JS code note then uses [[Script API]] to pick up all the notes from Members note (pointing to it via `familyContainer` relation), constructs the graph in memory and renders it via 3rd party [Dagre](https://github.com/dagrejs/dagre) JavaScript library which is uploaded (together with its [D3](https://d3js.org/) dependency) as an attachment.
|
||||
JS [[code note|code notes]] then uses [[Script API]] to pick up all the notes from Members note (pointing to it via `familyContainer` relation), constructs the graph in memory and renders it via 3rd party [Dagre](https://github.com/dagrejs/dagre) JavaScript library which is uploaded (together with its [D3](https://d3js.org/) dependency) as an attachment.
|
@ -8,7 +8,7 @@ See [[Themes]].
|
||||
|
||||
[[images/code-note.png]]
|
||||
|
||||
This shows code note editor.
|
||||
This shows [[code note|code notes]] editor.
|
||||
|
||||
[[images/day-notes.png]]
|
||||
|
||||
|
@ -7,7 +7,7 @@ To go further I must explain basic architecture of Trilium - in its essence it i
|
||||
* frontend running in the browser (using HTML, CSS, JavaScript) - this is mainly used to interact with the user, display notes etc.
|
||||
* backend running JavaScript code in node.js runtime - this is responsible for e.g. storing notes, encrypting them etc.
|
||||
|
||||
So we have frontend and backend, each with their own set of responsibilities, but their common feature is that they both run JavaScript code. Add to this the fact, that we're able to create JavaScript code notes and we're onto something.
|
||||
So we have frontend and backend, each with their own set of responsibilities, but their common feature is that they both run JavaScript code. Add to this the fact, that we're able to create JavaScript [[code notes]] and we're onto something.
|
||||
|
||||
## Button use case
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
Trilium supports searching in notes. In essence it consists of
|
||||
|
||||
* [[attribute|Attributes]] search - you can e.g. search for notes having certain label - see *Attribute query syntax* below.
|
||||
* full text search - search in text and code note content. Since this is implemented as a database search, this works only for not protected notes (doesn't matter if you're in protected session or not)
|
||||
* full text search - search in text and [[code note|code notes]] content. Since this is implemented as a database search, this works only for not protected notes (doesn't matter if you're in protected session or not)
|
||||
|
||||
You can activate search by clicking on magnifier icon on the left or pressing `CTRL-S` keyboard [[shortcut|keyboard shortcuts]].
|
||||
|
||||
|
@ -44,7 +44,7 @@ api.addButtonToToolbar({
|
||||
|
||||
In the demo screenshot above you may notice that TODO tasks are in red color and DONE tasks are green.
|
||||
|
||||
This is done by having this CSS code note which defines extra CSS classes:
|
||||
This is done by having this CSS [[code note|code notes]] which defines extra CSS classes:
|
||||
|
||||
```CSS
|
||||
span.fancytree-node.todo .fancytree-title {
|
||||
@ -56,6 +56,6 @@ span.fancytree-node.done .fancytree-title {
|
||||
}
|
||||
```
|
||||
|
||||
This code note has `appCss` [[label|attributes]] which is recognized by Trilium on startup and loaded as CSS into the application.
|
||||
This [[code note|code notes]] has `appCss` [[label|attributes]] which is recognized by Trilium on startup and loaded as CSS into the application.
|
||||
|
||||
Second part of this functionality is based in event handler described above which assigns `cssClass` label to the task to either "done" or "todo" based on the task status.
|
@ -10,7 +10,7 @@ Trilium allows you to create custom CSS which is attached to the main HTML page.
|
||||
|
||||
This is also useful in the context of [[scripting|scripts]] where you may want to e.g. change colors of notes in the tree (as used in [[Task manager]]).
|
||||
|
||||
To do this, just create a code note with CSS type, put your custom CSS code into the note's content and create "appCss" [[label|Attributes]]. When Trilium frontend starts, all notes with "appCss" label are appended in the style element of the Trilium HTML page.
|
||||
To do this, just create a [[code note|code notes]] with CSS type, put your custom CSS code into the note's content and create "appCss" [[label|Attributes]]. When Trilium frontend starts, all notes with "appCss" label are appended in the style element of the Trilium HTML page.
|
||||
|
||||
Once you made your changes, you can reload the Trilium frontend by pressing CTRL-R after which the changes will take effect.
|
||||
|
||||
|
@ -9,7 +9,7 @@ Weight Tracker is a [[Script API]] showcase present in the [[demo document|Docum
|
||||
|
||||
Note "Weight Tracker" in the screenshot above is of type "Render HTML note". Such note doesn't have any useful content itself, the only purpose of it is to provide a place where some [[script|scripts]] can render some output. This script is defined in [[relation|attributes]] `renderNote` - coincidentally it's the Weight Tracker's child `Implementation`.
|
||||
|
||||
This Implementation code note then contains some HTML and JavaScript which loads all the notes with "weight" attribute and displays them in a chart. To actually render chart we're using third party library [chart.js](https://www.chartjs.org/) which is imported as an attachment (it's not built-in into Trilium).
|
||||
This Implementation [[code note|code notes]] then contains some HTML and JavaScript which loads all the notes with "weight" attribute and displays them in a chart. To actually render chart we're using third party library [chart.js](https://www.chartjs.org/) which is imported as an attachment (it's not built-in into Trilium).
|
||||
|
||||
### JS code
|
||||
To get an idea of the script, here's the "JS code" note content:
|
||||
|
Loading…
x
Reference in New Issue
Block a user