From a5ebd95918878588dc941e3179b962f42eec94bf Mon Sep 17 00:00:00 2001 From: Emile Date: Fri, 14 Jan 2022 19:19:26 +0100 Subject: [PATCH] feat: Juggl view showing hierarchy on top of note --- src/BreadcrumbsSettingTab.ts | 14 ++++++- src/Visualisations/CBJuggl.ts | 70 ++++++++++++++++++++++------------- src/constants.ts | 8 ++++ src/interfaces.ts | 1 + src/main.ts | 8 +++- 5 files changed, 71 insertions(+), 30 deletions(-) diff --git a/src/BreadcrumbsSettingTab.ts b/src/BreadcrumbsSettingTab.ts index a472a461..77e57f3f 100644 --- a/src/BreadcrumbsSettingTab.ts +++ b/src/BreadcrumbsSettingTab.ts @@ -426,7 +426,7 @@ export class BCSettingTab extends PluginSettingTab { }) ); - const trailDetails = subDetails("Trail/Grid", viewDetails); + const trailDetails = subDetails("Trail/Grid/Juggl", viewDetails); new Setting(trailDetails) .setName("Show Breadcrumbs") @@ -473,7 +473,7 @@ export class BCSettingTab extends PluginSettingTab { new Setting(trailDetails) .setName("Views to show") .setDesc( - "Choose which of the views to show at the top of the note.\nTrail, Grid, and/or the Next-Previous view." + "Choose which of the views to show at the top of the note.\nTrail, Grid, Juggl graph and/or the Next-Previous view." ) .addToggle((toggle) => { toggle @@ -495,6 +495,16 @@ export class BCSettingTab extends PluginSettingTab { await plugin.drawTrail(); }); }) + .addToggle((toggle) => { + toggle + .setTooltip("Show Juggl view") + .setValue(settings.showJuggl) + .onChange(async (value) => { + settings.showJuggl = value; + await plugin.saveSettings(); + await plugin.drawTrail(); + }); + }) .addToggle((toggle) => { toggle .setTooltip("Show Next/Previous view") diff --git a/src/Visualisations/CBJuggl.ts b/src/Visualisations/CBJuggl.ts index 5f9789c3..890df7d6 100644 --- a/src/Visualisations/CBJuggl.ts +++ b/src/Visualisations/CBJuggl.ts @@ -6,7 +6,7 @@ import { ICoreDataStore, IDataStore, IJuggl, - IJugglPlugin, IJugglStores, + IJugglPlugin, IJugglSettings, IJugglStores, nodeDangling, nodeFromFile, VizId } from 'juggl-api'; @@ -48,13 +48,7 @@ class BCStore extends Component implements ICoreDataStore { asString(node: NodeSingular): string { const id = VizId.fromNode(node); - if (id.storeId === STORE_ID) { - const file = this.cache.getFirstLinkpathDest(id.id, ''); - if (file) { - return id.id.slice(0, -3); - } - } - return + return id.id.slice(0, -3); } getFile(nodeId: VizId): TFile { @@ -67,6 +61,7 @@ class BCStore extends Component implements ICoreDataStore { .map((node) => this.asString(node)) .filter((s) => s)); newNodes.forEach((node) => { + console.log({node}) this.graph.forEachOutEdge(this.asString(node), (key, attr, source, target) => { if (nodesListS.has(target)) { edges.push({ @@ -105,26 +100,21 @@ class BCStore extends Component implements ICoreDataStore { get(nodeId: VizId): Promise { const file = this.getFile(nodeId); if (file === null) { - return null; + const dangling = nodeDangling(nodeId.id); + console.log({dangling}); + return Promise.resolve(nodeDangling(nodeId.id)); } const cache = this.cache.getFileCache(file); if (cache === null) { console.log('returning empty cache', nodeId); - return null; + return Promise.resolve(nodeDangling(nodeId.id)); } return Promise.resolve(nodeFromFile(file, this.plugin, nodeId.toId())); } } -export function createdJugglCB(plugin: BCPlugin, - target: HTMLElement, - args: ParsedCodeblock, - lines: [string, string][], - froms: string[], - source: string, - min: number, - max: number) { +function createJuggl(plugin: BCPlugin, target: HTMLElement, initialNodes: string[], args: IJugglSettings) { try { const jugglPlugin = getPlugin(plugin.app); if (!jugglPlugin) { @@ -136,12 +126,7 @@ export function createdJugglCB(plugin: BCPlugin, args[key] = JUGGL_CB_DEFAULTS[key]; } } - const nodes = lines - .filter(([indent, node]) => meetsConditions(indent, node, froms, min, max)) - .map(([_, node]) => node + ".md"); - if (min <= 0) { - nodes.push(source + ".md"); - } + const bcStore = new BCStore(plugin.mainG, plugin.app.metadataCache, jugglPlugin); const stores: IJugglStores = { @@ -149,8 +134,8 @@ export function createdJugglCB(plugin: BCPlugin, dataStores: [bcStore] } - console.log({args}); - const juggl = jugglPlugin.createJuggl(target, args, stores, nodes) + console.log({args}, {initialNodes}); + const juggl = jugglPlugin.createJuggl(target, args, stores, initialNodes) plugin.addChild(juggl); juggl.load(); console.log({juggl}); @@ -158,4 +143,37 @@ export function createdJugglCB(plugin: BCPlugin, catch (error) { console.log({error}); } +} + +export function createJugglTrail(plugin: BCPlugin, + target: HTMLElement, + paths: string[][], + source: string, + args: IJugglSettings) { + let nodes = Array.from( + new Set( + paths.reduce((prev, curr) => prev.concat(curr), []) + )); + nodes.push(source) + nodes = nodes.map(s => s + ".md"); + createJuggl(plugin, target, nodes, args); +} + +export function createdJugglCB(plugin: BCPlugin, + target: HTMLElement, + args: ParsedCodeblock, + lines: [string, string][], + froms: string[], + source: string, + min: number, + max: number) { + const nodes = lines + .filter(([indent, node]) => meetsConditions(indent, node, froms, min, max)) + .map(([_, node]) => node + ".md"); + if (min <= 0) { + nodes.push(source + ".md"); + } + console.log({lines, nodes}) + createJuggl(plugin, target, nodes, args); + } \ No newline at end of file diff --git a/src/constants.ts b/src/constants.ts index b34b78f1..43c5664f 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -85,6 +85,13 @@ export const JUGGL_CB_DEFAULTS: IJugglSettings = { width: '100%', zoomSpeed: 1, }; + +export const JUGGL_TRAIL_DEFAULTS: IJugglSettings = Object.assign( JUGGL_CB_DEFAULTS, { + autoZoom: true, + fdgdLayout: 'd3-force', + height: '400px', + toolbar: false, +}); CODEBLOCK_FIELDS.push(...Object.keys(JUGGL_CB_DEFAULTS)); export const blankUserHier = (): UserHier => { @@ -257,6 +264,7 @@ export const DEFAULT_SETTINGS: BCSettings = { showImpliedRelations: true, showTrail: true, showGrid: true, + showJuggl: false, showPrevNext: true, sortByNameShowAlias: false, squareDirectionsOrder: [0, 1, 2, 3, 4], diff --git a/src/interfaces.ts b/src/interfaces.ts index 92f5b99a..36b71180 100644 --- a/src/interfaces.ts +++ b/src/interfaces.ts @@ -67,6 +67,7 @@ export interface BCSettings { showAll: boolean; showGrid: boolean; showImpliedRelations: boolean; + showJuggl: boolean; showPrevNext: boolean; showRefreshNotice: boolean; showTrail: boolean; diff --git a/src/main.ts b/src/main.ts index 449aa2b0..a30ad70e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -48,7 +48,7 @@ import { dropHeaderOrAlias, DUCK_ICON, DUCK_ICON_SVG, - DUCK_VIEW, + DUCK_VIEW, JUGGL_TRAIL_DEFAULTS, MATRIX_VIEW, splitLinksRegex, STATS_VIEW, @@ -105,7 +105,7 @@ import { import StatsView from "./StatsView"; import TreeView from "./TreeView"; import { VisModal } from "./VisModal"; -import {createdJugglCB} from "./Visualisations/CBJuggl"; +import {createdJugglCB, createJugglTrail} from "./Visualisations/CBJuggl"; export default class BCPlugin extends Plugin { settings: BCSettings; @@ -1959,6 +1959,7 @@ export default class BCPlugin extends Plugin { respectReadableLineLength, showTrail, showGrid, + showJuggl, showPrevNext, showBCsInEditLPMode, } = settings; @@ -2107,6 +2108,9 @@ export default class BCPlugin extends Plugin { props: { app: this.app, plugin: this, next, prev }, }); } + if (showJuggl && sortedTrails.length) { + createJugglTrail(this, trailDiv, props.sortedTrails, basename, JUGGL_TRAIL_DEFAULTS); + } db.end2G(); } catch (err) { error(err);