gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-03-01 14:22:32 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated Custom Widget (markdown)

zadam 2021-01-19 15:26:37 +01:00
parent 93784c0e4a
commit 654474f74c
1 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
Custom-Widget.md

@ -8,7 +8,7 @@ Positions are:
## Example - word count widget ## Example - word count widget
Create a code note of type JS frontend and give it `widget` label. Create a code note of type JS frontend and **give it a `widget` label**.
```javascript ```javascript
/* /*
@ -29,55 +29,55 @@ const TPL = `<div style="contain: none; padding: 10px; border-top: 1px solid var
class WordCountWidget extends api.TabAwareWidget { class WordCountWidget extends api.TabAwareWidget {
get position() { return 100; } // higher value means position towards the bottom/right get position() { return 100; } // higher value means position towards the bottom/right
get parentWidget() { return 'center-pane'; } get parentWidget() { return 'center-pane'; }
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
this.$wordCount = this.$widget.find('.word-count'); this.$wordCount = this.$widget.find('.word-count');
this.$characterCount = this.$widget.find('.character-count'); this.$characterCount = this.$widget.find('.character-count');
return this.$widget; return this.$widget;
} }
async refreshWithNote(note) { async refreshWithNote(note) {
if (note.type !== 'text' || !note.hasLabel('wordCount')) { if (note.type !== 'text' || !note.hasLabel('wordCount')) {
// show widget only on text notes and when marked with 'wordCount' label // show widget only on text notes and when marked with 'wordCount' label
this.toggleInt(false); // hide this.toggleInt(false); // hide
return; return;
} }
this.toggleInt(true); // display this.toggleInt(true); // display
const {content} = await note.getNoteComplement(); const {content} = await note.getNoteComplement();
const text = $(content).text(); // get plain text only const text = $(content).text(); // get plain text only
const counts = this.getCounts(text); const counts = this.getCounts(text);
this.$wordCount.text(counts.words); this.$wordCount.text(counts.words);
this.$characterCount.text(counts.characters); this.$characterCount.text(counts.characters);
} }
getCounts(text) { getCounts(text) {
const chunks = text const chunks = text
.split(/[\s-+:,/\\]+/) .split(/[\s-+:,/\\]+/)
.filter(chunk => chunk !== ''); .filter(chunk => chunk !== '');
let words; let words;
if (chunks.length === 1 && chunks[0] === '') { if (chunks.length === 1 && chunks[0] === '') {
words = 0; words = 0;
} }
else { else {
words = chunks.length; words = chunks.length;
} }
const characters = chunks.join('').length; const characters = chunks.join('').length;
return {words, characters}; return {words, characters};
} }
async entitiesReloadedEvent({loadResults}) { async entitiesReloadedEvent({loadResults}) {
if (loadResults.isNoteContentReloaded(this.noteId)) { if (loadResults.isNoteContentReloaded(this.noteId)) {
this.refresh(); this.refresh();