WIP move to tree-finder, fixes #221

js/package.json

@@ -54,6 +54,7 @@
     "@jupyterlab/mainmenu": "^4.0.7",
     "@jupyterlab/notebook": "^4.0.7",
     "@lumino/disposable": "^2.1.2",
+    "@tree-finder/base": "^0.1.0",
     "requests-helper": "^0.1.5"
   },
   "devDependencies": {

js/src/execute.js

@@ -0,0 +1,63 @@
+/******************************************************************************
+ *
+ * Copyright (c) 2020, the jupyterlab_templates authors.
+ *
+ * This file is part of the jupyterlab_templates library, distributed under the terms of
+ * the Apache License 2.0.  The full license can be found in the LICENSE file.
+ *
+ */
+import {Dialog, showDialog} from "@jupyterlab/apputils";
+import {PageConfig} from "@jupyterlab/coreutils";
+import {request} from "requests-helper";
+import {OpenTemplateWidget} from "./widget";
+
+export const execute = (templates, app, browser) => {
+  showDialog({
+    body: new OpenTemplateWidget(templates),
+    buttons: [Dialog.cancelButton(), Dialog.okButton({label: "GO"})],
+    focusNodeSelector: "input",
+    title: "Template",
+  }).then((result) => {
+    if (result.button.label === "Cancel") {
+      return;
+    }
+    if (result.value) {
+      request("get", `${PageConfig.getBaseUrl()}templates/get`, {
+        template: result.value,
+      }).then((res2) => {
+        const data = res2.json();
+        const {path} = browser.tracker.currentWidget.model;
+
+        return new Promise((resolve) => {
+          const ext = data.filename.split(".").pop().toLowerCase();
+          const isNotebook = ext === "ipynb";
+          app.commands
+            .execute("docmanager:new-untitled", {
+              ext,
+              path,
+              type: isNotebook ? "notebook" : "file",
+            })
+            .then((model) => {
+              app.commands
+                .execute("docmanager:open", {
+                  factory: isNotebook ? "Notebook" : null,
+                  path: model.path,
+                })
+                .then((widget) => {
+                  // eslint-disable-next-line no-param-reassign
+                  widget.isUntitled = true;
+                  widget.context.ready.then(() => {
+                    if (isNotebook) {
+                      widget.model.fromString(data.content);
+                    } else {
+                      widget.content.editor._editor.setValue(data.content);
+                    }
+                    resolve(widget);
+                  });
+                });
+            });
+        });
+      });
+    }
+  });
+};

js/src/widget.js

@@ -0,0 +1,198 @@
+/******************************************************************************
+ *
+ * Copyright (c) 2020, the jupyterlab_templates authors.
+ *
+ * This file is part of the jupyterlab_templates library, distributed under the terms of
+ * the Apache License 2.0.  The full license can be found in the LICENSE file.
+ *
+ */
+import {Widget} from "@lumino/widgets";
+import {IContentRow, Path} from "@tree-finder/base";
+import "@tree-finder/base/dist/tree-finder.css";
+import "@tree-finder/base/style/theme/material.css";
+
+export function bool() {
+  return Math.random() < 0.5;
+}
+
+// randomize array in-place using Durstenfeld shuffle algorithm
+// ref: https://stackoverflow.com/a/12646864
+export function shuffle(arr, inPlace = false) {
+  arr = inPlace ? arr : [...arr];
+
+  for (let i = arr.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [arr[i], arr[j]] = [arr[j], arr[i]];
+  }
+
+  return arr;
+}
+export const ALLIED_PHONETIC = [
+  "able",
+  "baker",
+  "charlie",
+  "dog",
+  "easy",
+  "fox",
+  "george",
+  "how",
+  "item",
+  "jig",
+  "king",
+  "love",
+  "mike",
+  "nan",
+  "oboe",
+  "peter",
+  "queen",
+  "roger",
+  "sugar",
+  "tare",
+  "uncle",
+  "victor",
+  "william",
+  "xray",
+  "yoke",
+  "zebra",
+];
+
+const _mockCache = {};
+let mockFileIx = 0;
+let modDaysIx = -1;
+
+function mockContent(props) {
+  // infinite recursive mock contents
+  const {path, kind, modDays = modDaysIx++, nchildren = 100, ndirectories = 10, randomize = false} = props;
+  const modified = new Date(modDays * 24 * 60 * 60 * 1000);
+  const writable = randomize && bool();
+
+  if (kind === "dir") {
+    // is a dir
+    return {
+      kind,
+      path,
+      modified,
+      writable,
+      getChildren: async () => {
+        const pathstr = path.join("/");
+
+        if (pathstr in _mockCache) {
+          return _mockCache[pathstr];
+        }
+
+        const children = [];
+        const dirNames = randomize ? shuffle(ALLIED_PHONETIC) : ALLIED_PHONETIC;
+
+        for (let i = 0; i < nchildren; i++) {
+          children.push(
+            mockContent({
+              kind: i < ndirectories ? "dir" : "text",
+              path: [...path, i < ndirectories ? `${dirNames[i]}` : `file_${`${mockFileIx++}`.padStart(7, "0")}.txt`],
+              nchildren,
+              ndirectories,
+              randomize,
+            }),
+          );
+        }
+
+        _mockCache[pathstr] = children;
+        return children;
+      },
+    };
+  }
+  // is a file
+  return {
+    kind,
+    path,
+    modified,
+    writable,
+  };
+}
+
+const root = mockContent({
+  kind: "dir",
+  path: [],
+  randomize: true,
+});
+
+export class OpenTemplateWidget extends Widget {
+  constructor(templates) {
+    const body = document.createElement("div");
+    body.classList.add("jp-Template-Browser");
+
+    const label = document.createElement("label");
+    label.textContent = "Template:";
+
+    // const package_input = document.createElement("select");
+    // const notebook_input = document.createElement("select");
+
+    // Object.keys(templates).forEach((package_name) => {
+    //   const package_option = document.createElement("option");
+    //   package_option.label = package_name;
+    //   package_option.text = package_name;
+    //   package_option.value = package_name;
+    //   package_input.appendChild(package_option);
+    // });
+
+    // const fill = (package_name) => {
+    //   while (notebook_input.lastChild) {
+    //     notebook_input.removeChild(notebook_input.lastChild);
+    //   }
+
+    //   templates[package_name].forEach((notebook) => {
+    //     const notebook_option = document.createElement("option");
+    //     notebook_option.label = notebook.name;
+    //     notebook_option.text = notebook.name;
+    //     notebook_option.value = notebook.name;
+    //     notebook_input.appendChild(notebook_option);
+    //   });
+    // };
+
+    // package_input.addEventListener("change", (event) => {
+    //   const package_name = event.target.value;
+    //   fill(package_name);
+    // });
+
+    // if (Object.keys(templates).length > 0) {
+    //   fill(Object.keys(templates)[0]);
+    // }
+
+    // body.appendChild(label);
+    // body.appendChild(package_input);
+    // body.appendChild(notebook_input);
+    super({node: body});
+  }
+
+  onAfterAttach(msg) {
+    super.onAfterAttach(msg);
+    this.setButtonDisabled();
+    this.treeFinder = document.createElement("tree-finder-panel");
+    this.treeFinder.classList.add("jp-Template-Browser");
+    this.node.appendChild(this.treeFinder);
+    this.init();
+  }
+
+  getButton = () => this.node.parentNode.querySelectorAll("button")[1];
+
+  setButtonDisabled = () => {
+    const button = this.getButton();
+    button.style.display = "none";
+  };
+
+  setButtonEnabled = () => {
+    const button = this.getButton();
+    button.style.display = "";
+  };
+
+  init = async () => {
+    await this.treeFinder.init({
+      root,
+      gridOptions: {
+        doWindowResize: true,
+        showFilter: true,
+      },
+    });
+  };
+
+  getValue = () => this.node.getElementsByTagName("select")[1].value;
+}

js/yarn.lock

@@ -2880,6 +2880,14 @@
   resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
   integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
 
+"@tree-finder/base@^0.1.0":
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/@tree-finder/base/-/base-0.1.0.tgz#2810b5820ad91e55c3c45cd407617c78c4886341"
+  integrity sha512-AyLgHvvGn3ikZmSKGamcRhhL0i2uzv5sEqxLDTv13H4A+dZ/PSTimyjQ/q1Iymso7bbnVqQW15jq4lnQIGxgUQ==
+  dependencies:
+    regular-table "^0.5.6"
+    rxjs "^7.8.1"
+
 "@types/babel__core@^7.1.14":
   version "7.1.20"
   resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.20.tgz#e168cdd612c92a2d335029ed62ac94c95b362359"
@@ -7224,6 +7232,11 @@ regjsparser@^0.9.1:
   dependencies:
     jsesc "~0.5.0"
 
+regular-table@^0.5.6:
+  version "0.5.9"
+  resolved "https://registry.yarnpkg.com/regular-table/-/regular-table-0.5.9.tgz#a5bfeeb67e3bcc9ab4e9f11cd9c3a40777267aa9"
+  integrity sha512-Ck5HYNS7lzsxsDWDBYzrCpwM1wsp5fMY42Ks730Otwq2U+XAlARJMg2tRexy+V8bLy9wiq+SH8EMC/yKqccLCA==
+
 requests-helper@^0.1.0, requests-helper@^0.1.5:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/requests-helper/-/requests-helper-0.1.5.tgz#9b0ed91384c1f79e3dccdb1f2a735f0e7e051b18"
@@ -7332,6 +7345,13 @@ run-parallel@^1.1.9:
   dependencies:
     queue-microtask "^1.2.2"
 
+rxjs@^7.8.1:
+  version "7.8.1"
+  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.8.1.tgz#6f6f3d99ea8044291efd92e7c7fcf562c4057543"
+  integrity sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==
+  dependencies:
+    tslib "^2.1.0"
+
 safe-array-concat@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.0.1.tgz#91686a63ce3adbea14d61b14c99572a8ff84754c"
@@ -7934,6 +7954,11 @@ tslib@^1.8.1:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
+tslib@^2.1.0:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
+  integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
+
 tslib@^2.5.0, tslib@^2.6.0:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.0.tgz#b295854684dbda164e181d259a22cd779dcd7bc3"