feat(Codeblock): ✨ Limit depth on type: tree

SkepticMystic · Jan 8, 2022 · 144a33c · 144a33c
1 parent 05bcf6b
commit 144a33c
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 28 deletions.
diff --git a/src/Components/Tree.svelte b/src/Components/Tree.svelte
@@ -1,19 +1,15 @@
 <script lang="ts">
-  import type { MarkdownPostProcessorContext, TFile } from "obsidian";
-  import type BCPlugin from "../main";
+  import { info } from "loglevel";
+  import type { MarkdownPostProcessorContext } from "obsidian";
+  import { isInVault, openOrSwitch } from "obsidian-community-lib/dist/utils";
   import {
     dfsAllPaths,
     getOppDir,
     getReflexiveClosure,
     getSubInDirs,
   } from "../graphUtils";
   import type { Directions } from "../interfaces";
-  import { info } from "loglevel";
-  import {
-    hoverPreview,
-    isInVault,
-    openOrSwitch,
-  } from "obsidian-community-lib/dist/utils";
+  import type BCPlugin from "../main";
   import { dropDendron } from "../sharedFunctions";
 
   export let plugin: BCPlugin;
@@ -22,6 +18,7 @@
   export let dir: Directions;
   export let fields: string[];
   export let title: string;
+  export let depth: string;
 
   const { settings, app, mainG } = plugin;
   const { sourcePath } = ctx;
@@ -30,6 +27,12 @@
   const { basename } = currFile;
   const oppDir = getOppDir(dir);
 
+  let depthAsNum: number = 1000;
+  if (depth !== undefined && depth !== "") {
+    const num = parseInt(depth);
+    if (!isNaN(num)) depthAsNum = num;
+  }
+
   const upnDown = getSubInDirs(mainG, dir, oppDir);
   const closed = getReflexiveClosure(upnDown, userHiers);
   const down = getSubInDirs(closed, dir);
@@ -52,7 +55,7 @@
 {/if}
 <div class="BC-tree">
   {#each lines as line}
-    {#if line.length > 1}
+    {#if line.length > 1 && line[0].length / 2 < depthAsNum}
       <div style={settings.downViewWrap ? "" : "white-space: nowrap;"}>
         <pre class="indent">{line[0] + "-"}</pre>
         <span

diff --git a/src/main.ts b/src/main.ts
@@ -587,8 +587,9 @@ export default class BCPlugin extends Plugin {
     this.registerMarkdownCodeBlockProcessor(
       "breadcrumbs",
       (source, el, ctx) => {
-        const { dir, fields, type, title } = this.parseCodeBlockSource(source);
-        const err = this.codeblockError(dir, fields, type);
+        const { dir, fields, type, title, depth } =
+          this.parseCodeBlockSource(source);
+        const err = this.codeblockError(dir, fields, type, title, depth);
 
         if (err !== "") {
           el.innerHTML = err;
@@ -599,7 +600,7 @@ export default class BCPlugin extends Plugin {
           case "tree":
             new Tree({
               target: el,
-              props: { plugin: this, dir, fields, ctx, el, title },
+              props: { plugin: this, dir, fields, ctx, el, title, depth },
             });
             break;
         }
@@ -611,6 +612,7 @@ export default class BCPlugin extends Plugin {
     dir: Directions;
     fields: string[];
     title: string;
+    depth: string;
     type: CodeblockType;
   } {
     const lines = source.split("\n");
@@ -624,53 +626,65 @@ export default class BCPlugin extends Plugin {
     const title = getItem("title");
     const fields = getItem("fields");
     const type = getItem("type");
+    const depth = getItem("depth");
 
     return {
       dir,
       type,
       title,
+      depth,
       fields: fields ? splitAndTrim(fields) : undefined,
     };
   }
 
-  codeblockError(dir: Directions, fields: string[], type: CodeblockType) {
+  codeblockError(
+    dir: Directions,
+    fields: string[],
+    type: CodeblockType,
+    title: string,
+    depth: string
+  ) {
     const { userHiers } = this.settings;
     let err = "";
 
     if (!CODEBLOCK_TYPES.includes(type))
-      err += `<code>${type}</code> is not a valid type. It must be one of: ${CODEBLOCK_TYPES.map(
+      err += `<code>type: ${type}</code> is not a valid type. It must be one of: ${CODEBLOCK_TYPES.map(
         (type) => `<code>${type}</code>`
       ).join(", ")}.</br>`;
 
     const validDir = DIRECTIONS.includes(dir);
-    if (!validDir) err += `<code>${dir}</code> is not a valid direction.</br>`;
+    if (!validDir)
+      err += `<code>dir: ${dir}</code> is not a valid direction.</br>`;
 
     const allFields = getFields(userHiers);
     fields?.forEach((f) => {
       if (!allFields.includes(f))
-        err += `<code>${f}</code> is not a field in your hierarchies.</br>`;
+        err += `<code>field: ${f}</code> is not a field in your hierarchies.</br>`;
     });
 
+    if (title !== undefined && title !== "false")
+      err += `<code>title: ${title}</code> is not a valid value. It has to be <code>false</code>, or leave the entire line out.</br>`;
+
+    if (depth !== undefined && isNaN(parseInt(depth)))
+      err += `<code>depth: ${depth}</code> is not a valid value. It has to be a number.</br>`;
+
     return err === ""
       ? ""
       : `${err}</br>
     A valid example would be:
     <pre><code>
       type: tree
       dir: ${validDir ? dir : "down"}
-      ${
-        validDir
-          ? `fields: ${
-              allFields
-                .map((f) => {
-                  return { f, dir: getFieldInfo(userHiers, f).fieldDir };
-                })
-                .filter((info) => info.dir === dir)
-                .map((info) => info.f)
-                .join(", ") || "child"
-            }`
-          : ""
+      fields: ${
+        allFields
+          .map((f) => {
+            return { f, dir: getFieldInfo(userHiers, f).fieldDir };
+          })
+          .filter((info) => info.dir === dir)
+          .map((info) => info.f)
+          .join(", ") || "child"
       }
+      depth: 3
       </code></pre>`;
   }