Zpět na domů

DataviewJS a Meta Bind pro úkoly Obsidian podle data

Článek popisuje realizaci interaktivní stránky v Obsidian pro zobrazení úkolů na vybrané datum s pomocí Meta Bind a DataviewJS. Rozbor kódu, instalace pluginů a nuancí práce. Vhodné pro middle/senior vývojáře používající Obsidian.

Dynamické úkoly Obsidian: datum kliknutím s Meta Bind
Advertisement 728x90

Interaktivní zobrazení úkolů v Obsidianu podle vybraného data s Meta Bind a DataviewJS

Meta Bind a DataviewJS umožňují vytvořit stránku s interaktivním výběrem data pro zobrazení úkolů. Uživatel klikne na kalendář v režimu čtení, vybere datum – seznam se automaticky aktualizuje. Řešení využívá YAML vlastnosti jako mezilehlé úložiště mezi vstupním widgetem a výstupním skriptem.

Tím se eliminuje ruční úprava dotazů Tasks nebo Dataview, kde se datum pokaždé mění v kódu.

Příprava: instalace pluginů a YAML bloku

Nainstalujte pluginy Meta Bind a Dataview v nastavení Obsidianu. V Dataview povolte JavaScript Queries.

Google AdInline article slot

Vytvořte soubor, například DynamicTasks.md, s YAML blokem:

---
selected-date: 2025-12-30
---

Počáteční hodnota bude přepsána widgetem.

Widget Meta Bind pro výběr data

Pod YAML vložte:

Google AdInline article slot

INPUT[datePicker: selected-date]

V režimu čtení se objeví kalendář. Kliknutí otevře výběr data, hodnota se uloží do selected-date.

DataviewJS skript: filtrování a vykreslení úkolů

Po widgetu přidejte skript pro vyhledávání úkolů:

Google AdInline article slot

const targetDate = dv.current().file.frontmatter["selected-date"];

const pages = dv.pages('"Work"')

.where(p => p.file.tasks

.where(t => !t.completed && t.due && t.due.toISODate() === targetDate)

.length > 0);

for (let page of pages) {

dv.el("div", dv.fileLink(page.file.path, false), {

attr: {

style: "display:inline-block; margin:8px 0 4px 0; padding:3px 8px; border-radius:6px; background:#e0f0ff; color:#0366d6; font-weight:500;"

}

});

dv.taskList(

page.file.tasks

.where(t => !t.completed && t.due && t.due.toISODate() === targetDate),

false

);

}

Rozbor skriptu

  • Čtení data: dv.current().file.frontmatter["selected-date"] vrací řetězec YYYY-MM-DD.
  • Hledání souborů: dv.pages('"Work"') prohledá složku. Filtr kontroluje přítomnost nedokončených úkolů s due na targetDate přes .toISODate().
  • Vykreslení: Pro každý soubor – odkaz s CSS stylem a dv.taskList bez seskupení (false). Nahraďte "Work" vaší složkou.

Integrace do Canvas dashboardu

Přetáhněte soubor na Canvas – Obsidian vytvoří interaktivní kartu. Nastavte velikost. Pracujte přímo na dashboardu nebo klikněte pro přechod.

Požadavky a specifika

  • Tasks syntax: Použijte emoji 📅 YYYY-MM-DD pro due. Běžné zaškrtávací políčka bez data jsou ignorovány.
  • Aktualizace: DataviewJS se restartuje se zpožděním ~1 sekunda po změně data.

Co je důležité

  • Interaktivní datePicker od Meta Bind aktualizuje YAML bez úprav.
  • DataviewJS filtruje úkoly podle přesné shody due.toISODate() === targetDate.
  • Seskupení podle souborů s vlastními odznaky pro kontrolu UI.
  • Automatické vykreslení v Canvas bez dalších pluginů.
  • Vhodné pro kontrolu zátěže na budoucí data (dovolená, jednání).

Výhody oproti statickým dotazům

| Přístup | Změna data | Režim čtení | Automatická aktualizace |

|--------|---------------|--------------|---------------|

| Tasks due on DATE | Ruční v kódu | Ne | Ne |

| Dataview due = date() | Ruční v kódu | Ne | Ne |

| YAML + Meta Bind + DataviewJS | Kliknutí na kalendář | Ano | Ano |

Řešení je škálovatelné: přidejte filtry podle tagů nebo stavů v .where().

— Editorial Team

Advertisement 728x90

Číst dál