Create model and view folders

.eslintrc.json

@@ -1,3 +1,14 @@
 {
-  "extends": ["eslint-config-node-roboleary"]
+  "extends": ["eslint-config-node-roboleary"],
+	"env": {
+		"mocha": true
+	},
+	"settings": {
+		"import/core-modules": [ "vscode" ]
+	},
+	"rules": {
+		"node/no-missing-require": ["error", {
+				"allowModules": [ "vscode"]
+		}]
+	}
 }

src/environment.js

@@ -3,7 +3,7 @@ const fs = require("fs");
 // eslint-disable-next-line import/no-unresolved
 const vscode = require("vscode");
 const glob = require("glob");
-const ExtensionSnippets = require("./extension-snippets-collection");
+const ExtensionCollection = require("./model/extension-collection");
 
 /**
  * Environment information.
@@ -136,7 +136,7 @@ class Environment {
         packageJSON.contributes &&
         packageJSON.contributes.snippets
       ) {
-        let extensionSnippets = new ExtensionSnippets(
+        let extensionSnippets = new ExtensionCollection(
           packageJSON.name,
           packageJSON.displayName,
           packageJSON.publisher

src/extension.js

@@ -1,12 +1,12 @@
 // @ts-nocheck
 /* eslint-disable import/no-unresolved, import/no-useless-path-segments, no-template-curly-in-string, no-unused-vars */
 const vscode = require("vscode");
-const View = require("./view");
-const Snippet = require("./snippet");
+const View = require("./view/view");
+const Snippet = require("./model/snippet");
 const SnippetsEditor = require("./snippets-editor");
 
 // this is included for webpack, so that it picks up the CSS file
-const styles = require("../src/css/styles.css");
+const styles = require("../src/view/styles.css");
 
 function activate(context) {
   context.subscriptions.push(

src/snippets-collection.js → src/model/collection.js

@@ -1,7 +1,7 @@
 /**
  * Snippets for a particular programming language.
  */
-class SnippetsCollection {
+class Collection {
   constructor(path, type, scoped, snippets, language = "" ) {
     this.path = path;
     this.type = type;
@@ -11,4 +11,4 @@ class SnippetsCollection {
   }
 }
 
-module.exports = SnippetsCollection;
+module.exports = Collection;

src/extension-snippets-collection.js → src/model/extension-collection.js

@@ -2,7 +2,7 @@
  * Snippets for a particular extension. An Extension can have snippets declared in
  * different files. One snippet file can be associated with 1 or more languages.
  */
-class ExtensionSnippetsCollection {
+class ExtensionCollection {
   constructor(name, displayName, publisher) {
     this.name = name;
     this.displayName = displayName;
@@ -33,4 +33,4 @@ class ExtensionSnippetsCollection {
   }
 }
 
-module.exports = ExtensionSnippetsCollection;
+module.exports = ExtensionCollection;

src/snippet.js → src/model/snippet.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-underscore-dangle */
-const formatter = require("./formatter");
+const formatter = require("../formatter");
 
 /**
  * VS Code Snippet.

src/snippets-fetcher.js

@@ -1,8 +1,8 @@
 const fs = require("fs");
 const jsonc = require("jsonc-parser");
 const Environment = require("./environment");
-const SnippetsCollection = require("./snippets-collection");
-const Snippet = require("./snippet");
+const Collection = require("./model/collection");
+const Snippet = require("./model/snippet");
 
 /**
  * Fetch the Snippets from the file system.
@@ -29,7 +29,7 @@ class SnippetsFetcher {
         let language = Environment.getFilename(filepaths[index]);
 				let scoped = hasScopeField(flatSnippets);
 
-        let snippetsCollection = new SnippetsCollection(
+        let snippetsCollection = new Collection(
           filepaths[index],
           type,
 					scoped,

src/util.js

@@ -1,4 +1,3 @@
-// eslint-disable-next-line import/no-unresolved
 const vscode = require("vscode");
 const fs = require("fs");
 

src/view/table-of-contents.js

@@ -0,0 +1,44 @@
+/**
+ * A HTML Table of Contents created from data.
+ */
+class TableOfContents {
+  constructor(data) {
+    this.data = data;
+  }
+
+  /**
+   * Get the Table of Contents as HTML.
+   */
+  getTableOfContents() {
+    let html = `<div id="toc">
+		<h2>Table of Contents</h2>
+		<ul>
+		<li><a href="#project">Project Snippets</a></li>`;
+		html += this.createTableOfContentsEntry(this.projectIDs);
+		html += `<li><a href="#user">User Snippets</a></li>`;
+		html += this.createTableOfContentsEntry(this.userIDs);
+    html += `<li><a href="#extension">Extension Snippets</a></li>`;
+    html += this.createTableOfContentsEntry(this.extensionIDs);
+    html += `<li><a href="#app">VS Code Snippets</a></li>`;
+    html += this.createTableOfContentsEntry(this.appIDs);
+    html += `</ul></div>`;
+    return html;
+  }
+
+  /**
+   * Get the Table of Contents entry for Extension snippets as HTML.
+   */
+  createTableOfContentsEntry(array) {
+    let html = "<ul>";
+
+    array.forEach((obj) => {
+      html += `<li><a href=#${obj.id}>${obj.name}</a>`;
+    });
+
+    html += "</ul>";
+
+    return html;
+  }
+}
+
+module.exports = TableOfContents;

src/view.js → src/view/view.js

@@ -1,13 +1,11 @@
-/* eslint-disable class-methods-use-this */
-// @ts-nocheck
-// eslint-disable-next-line import/no-unresolved
 const vscode = require("vscode");
 const { basename } = require("path");
 const path = require("path");
-const SnippetsFetcher = require("./snippets-fetcher");
-const Formatter = require("./formatter");
-const Window = require("./window");
-const SnippetsEditor = require("./snippets-editor");
+const SnippetsFetcher = require("../snippets-fetcher");
+const Formatter = require("../formatter");
+const Window = require("../window");
+const SnippetsEditor = require("../snippets-editor");
+const Collection = require("../model/collection");
 
 const notFoundHTML = `<p class="empty">Oucho Gaucho! 🌵 Nothing to round up! 🤠</p>`;
 
@@ -137,7 +135,7 @@ class View {
   /**
    * Creates the HTML output for the section for a snippets set associated with a language. 
 	 * It has a title and a table listing all of the snippets.
-   * @param {LanguageSnippets} languageSnippets The LanguageSnippets you want the section for
+   * @param {Collection} languageSnippets The collection you want the section for
    * @param {String} type The type of snippets. Values can be "user" or "app".
    */
   createLanguageSection(languageSnippets, type) {

test/suite/snippet.test.js

@@ -1,5 +1,5 @@
 const assert = require("assert");
-const Snippet = require("../../src/snippet");
+const Snippet = require("../../src/model/snippet");
 
 describe("Snippet", () => {
   it("should create an empty object if no arguments given to constructor", () => {

test/view-contrast.html

@@ -460,7 +460,7 @@
   "
 >
   <head>
-    <link rel="stylesheet" href="../src/css/styles.css" />
+    <link rel="stylesheet" href="../src/view/styles.css" />
   </head>
   <body
     class="vscode-high-contrast"

test/view-dark.html

@@ -447,7 +447,7 @@
   "
 >
   <head>
-    <link rel="stylesheet" href="../src/css/styles.css" />
+    <link rel="stylesheet" href="../src/view/styles.css" />
   </head>
   <body
     class="vscode-dark"

test/view-light.html

@@ -460,7 +460,7 @@
   "
 >
   <head>
-    <link rel="stylesheet" href="../src/css/styles.css" />
+    <link rel="stylesheet" href="../src/view/styles.css" />
   </head>
   <body
     class="vscode-light"

todo.md

@@ -1,5 +1,6 @@
 # To Do
 
+1. Test multi-root workspace for workspace snippets.
 1. Add formatting of `scope` content to ensure consistent formatting. If no spaces between words values, add one after the comma.
 1. Is the `scope` field ever in a snippets file in an extension?
 1. Refactor `language` field in *snippet-collection.js*. It only applies to user snippets if I remember correctly.