From f7f2eebfa41c3bdec4b4e0adf42afcbd569f100f Mon Sep 17 00:00:00 2001
From: Gordon <gordonlarrigan@gmail.com>
Date: Thu, 15 Apr 2021 01:11:20 +0100
Subject: [PATCH] Add burndown panel

---
 .gitignore                    |   1 -
 ext-src/KanbnBurndownPanel.ts | 168 ++++++++++++++++++++++++++++++++++
 resources/burndown_dark.svg   |   1 +
 resources/burndown_light.svg  |   1 +
 resources/kanbn.png           | Bin 0 -> 6967 bytes
 resources/project_dark.svg    |   1 +
 resources/project_light.svg   |   1 +
 resources/task_dark.svg       |  13 +++
 resources/task_light.svg      |  13 +++
 src/App.tsx                   |   6 ++
 src/Burndown.tsx              |   9 ++
 11 files changed, 213 insertions(+), 1 deletion(-)
 create mode 100644 ext-src/KanbnBurndownPanel.ts
 create mode 100644 resources/burndown_dark.svg
 create mode 100644 resources/burndown_light.svg
 create mode 100644 resources/kanbn.png
 create mode 100644 resources/project_dark.svg
 create mode 100644 resources/project_light.svg
 create mode 100644 resources/task_dark.svg
 create mode 100644 resources/task_light.svg
 create mode 100644 src/Burndown.tsx

diff --git a/.gitignore b/.gitignore
index 7656ccd..d30f40e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,7 +10,6 @@
 /build
 
 # misc
-/resources
 .DS_Store
 .env.local
 .env.development.local
diff --git a/ext-src/KanbnBurndownPanel.ts b/ext-src/KanbnBurndownPanel.ts
new file mode 100644
index 0000000..291b68c
--- /dev/null
+++ b/ext-src/KanbnBurndownPanel.ts
@@ -0,0 +1,168 @@
+import * as path from 'path';
+import * as vscode from 'vscode';
+
+export default class KanbnBurndownPanel {
+  public static currentPanel: KanbnBurndownPanel | undefined;
+
+  private static readonly viewType = 'react';
+
+  private readonly _panel: vscode.WebviewPanel;
+  private readonly _extensionPath: string;
+  private readonly _workspacePath: string;
+  private readonly _kanbn: typeof import('@basementuniverse/kanbn/src/main');
+  private _disposables: vscode.Disposable[] = [];
+
+  public static createOrShow(
+    extensionPath: string,
+    workspacePath: string,
+    kanbn: typeof import('@basementuniverse/kanbn/src/main')
+  ) {
+    const column = vscode.window.activeTextEditor ? vscode.window.activeTextEditor.viewColumn : undefined;
+
+    // If we already have a panel, show it, otherwise create a new panel
+    if (KanbnBurndownPanel.currentPanel) {
+      KanbnBurndownPanel.currentPanel._panel.reveal(column);
+    } else {
+      KanbnBurndownPanel.currentPanel = new KanbnBurndownPanel(
+        extensionPath,
+        workspacePath,
+        column || vscode.ViewColumn.One,
+        kanbn
+      );
+    }
+  }
+
+  public static async update() {
+    if (KanbnBurndownPanel.currentPanel) {
+      let index: any;
+      try {
+        index = await KanbnBurndownPanel.currentPanel._kanbn.getIndex();
+      } catch (error) {
+        vscode.window.showErrorMessage(error instanceof Error ? error.message : error);
+        return;
+      }
+      KanbnBurndownPanel.currentPanel._panel.webview.postMessage({
+        type: 'burndown',
+        index,
+        dateFormat: KanbnBurndownPanel.currentPanel._kanbn.getDateFormat(index)
+      });
+    }
+  }
+
+  private constructor(
+    extensionPath: string,
+    workspacePath: string,
+    column: vscode.ViewColumn,
+    kanbn: typeof import('@basementuniverse/kanbn/src/main')
+  ) {
+    this._extensionPath = extensionPath;
+    this._workspacePath = workspacePath;
+    this._kanbn = kanbn;
+
+    // Create and show a new webview panel
+    this._panel = vscode.window.createWebviewPanel(KanbnBurndownPanel.viewType, 'Burndown Chart', column, {
+      // Enable javascript in the webview
+      enableScripts: true,
+
+      // Retain state even when hidden
+      retainContextWhenHidden: true,
+
+      // Restrict the webview to only loading content from allowed paths
+      localResourceRoots: [
+        vscode.Uri.file(path.join(this._extensionPath, 'build')),
+        vscode.Uri.file(path.join(this._workspacePath, this._kanbn.getFolderName())),
+        vscode.Uri.file(path.join(this._extensionPath, 'node_modules', 'vscode-codicons', 'dist'))
+      ]
+    });
+    (this._panel as any).iconPath = {
+      light: vscode.Uri.file(path.join(this._extensionPath, 'resources', 'burndown_light.svg')),
+      dark: vscode.Uri.file(path.join(this._extensionPath, 'resources', 'burndown_dark.svg'))
+    };
+
+    // Set the webview's title to the kanbn project name
+    this._kanbn.getIndex().then(index => {
+      this._panel.title = index.name;
+    });
+
+    // Set the webview's initial html content
+    this._panel.webview.html = this._getHtmlForWebview();
+
+    // Listen for when the panel is disposed
+    // This happens when the user closes the panel or when the panel is closed programatically
+    this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
+
+    // Handle messages from the webview
+    this._panel.webview.onDidReceiveMessage(async message => {
+      switch (message.command) {
+
+        // Display error message
+        case 'error':
+          vscode.window.showErrorMessage(message.text);
+          return;
+      }
+    }, null, this._disposables);
+  }
+
+  public dispose() {
+    KanbnBurndownPanel.currentPanel = undefined;
+
+    // Clean up our resources
+    this._panel.dispose();
+    while (this._disposables.length) {
+      const x = this._disposables.pop();
+      if (x) {
+        x.dispose();
+      }
+    }
+  }
+
+  private _getHtmlForWebview() {
+    const manifest = require(path.join(this._extensionPath, 'build', 'asset-manifest.json'));
+    const mainScript = manifest['main.js'];
+    const mainStyle = manifest['main.css'];
+    const scriptUri = vscode.Uri
+      .file(path.join(this._extensionPath, 'build', mainScript))
+      .with({ scheme: 'vscode-resource' });
+    const styleUri = vscode.Uri
+      .file(path.join(this._extensionPath, 'build', mainStyle))
+      .with({ scheme: 'vscode-resource' });
+    const customStyleUri = vscode.Uri
+      .file(path.join(this._workspacePath, this._kanbn.getFolderName(), 'board.css'))
+      .with({ scheme: 'vscode-resource' });
+    const codiconsUri = vscode.Uri
+      .file(path.join(this._extensionPath, 'node_modules', 'vscode-codicons', 'dist', 'codicon.css'))
+      .with({ scheme: 'vscode-resource' });
+
+    // Use a nonce to whitelist which scripts can be run
+    const nonce = getNonce();
+
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
+<meta name="theme-color" content="#000000">
+<title>Kanbn Board</title>
+<link rel="stylesheet" type="text/css" href="${styleUri}">
+<link rel="stylesheet" type="text/css" href="${customStyleUri}">
+<link rel="stylesheet" type="text/css" href="${codiconsUri}">
+<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}'; font-src vscode-resource:; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
+<base href="${vscode.Uri.file(path.join(this._extensionPath, 'build')).with({ scheme: 'vscode-resource' })}/">
+</head>
+<body>
+<noscript>You need to enable JavaScript to run this app.</noscript>
+<div id="root"></div>
+<script nonce="${nonce}" src="${scriptUri}"></script>
+</body>
+</html>`;
+  }
+}
+
+function getNonce() {
+  let text = "";
+  const possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  for (let i = 0; i < 32; i++) {
+    text += possible.charAt(Math.floor(Math.random() * possible.length));
+  }
+  return text;
+}
diff --git a/resources/burndown_dark.svg b/resources/burndown_dark.svg
new file mode 100644
index 0000000..0fdf507
--- /dev/null
+++ b/resources/burndown_dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16" style="-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);"><g fill="#ffffff"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 14H15v-1H2V0H1v13.5l.5.5zM3 11.5v-8l.5-.5h2l.5.5v8l-.5.5h-2l-.5-.5zm2-.5V4H4v7h1zm6-9.5v10l.5.5h2l.5-.5v-10l-.5-.5h-2l-.5.5zm2 .5v9h-1V2h1zm-6 9.5v-6l.5-.5h2l.5.5v6l-.5.5h-2l-.5-.5zm2-.5V6H8v5h1z"/></g><rect x="0" y="0" width="16" height="16" fill="rgba(0, 0, 0, 0)" /></svg>
\ No newline at end of file
diff --git a/resources/burndown_light.svg b/resources/burndown_light.svg
new file mode 100644
index 0000000..ae9d112
--- /dev/null
+++ b/resources/burndown_light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16" style="-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);"><g fill="#000000"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 14H15v-1H2V0H1v13.5l.5.5zM3 11.5v-8l.5-.5h2l.5.5v8l-.5.5h-2l-.5-.5zm2-.5V4H4v7h1zm6-9.5v10l.5.5h2l.5-.5v-10l-.5-.5h-2l-.5.5zm2 .5v9h-1V2h1zm-6 9.5v-6l.5-.5h2l.5.5v6l-.5.5h-2l-.5-.5zm2-.5V6H8v5h1z"/></g><rect x="0" y="0" width="16" height="16" fill="rgba(0, 0, 0, 0)" /></svg>
\ No newline at end of file
diff --git a/resources/kanbn.png b/resources/kanbn.png
new file mode 100644
index 0000000000000000000000000000000000000000..565fce5f79db1748f688753f5269e27e7f002bc2
GIT binary patch
literal 6967
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
MXzxxqWgD{f-xT|+q5uE@

literal 0
HcmV?d00001

diff --git a/resources/project_dark.svg b/resources/project_dark.svg
new file mode 100644
index 0000000..d0fefd2
--- /dev/null
+++ b/resources/project_dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16" style="-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);"><g fill="#ffffff"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 1h13l.5.5v13l-.5.5h-13l-.5-.5v-13l.5-.5zM2 14h12V2H2v12zM3 3h2v10H3V3zm6 0H7v6h2V3zm2 0h2v8h-2V3z"/></g><rect x="0" y="0" width="16" height="16" fill="rgba(0, 0, 0, 0)" /></svg>
\ No newline at end of file
diff --git a/resources/project_light.svg b/resources/project_light.svg
new file mode 100644
index 0000000..7eff72a
--- /dev/null
+++ b/resources/project_light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16" style="-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);"><g fill="#000000"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 1h13l.5.5v13l-.5.5h-13l-.5-.5v-13l.5-.5zM2 14h12V2H2v12zM3 3h2v10H3V3zm6 0H7v6h2V3zm2 0h2v8h-2V3z"/></g><rect x="0" y="0" width="16" height="16" fill="rgba(0, 0, 0, 0)" /></svg>
\ No newline at end of file
diff --git a/resources/task_dark.svg b/resources/task_dark.svg
new file mode 100644
index 0000000..a37c407
--- /dev/null
+++ b/resources/task_dark.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 23.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+	.st1{fill:none;stroke:#ffffff;stroke-width:2;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<polyline class="st0" points="25,20 21,24 19,22 "/>
+<circle class="st0" cx="22" cy="22" r="7"/>
+<polyline class="st0" points="19,3 19,9 25,9 19,3 7,3 7,29 22,29 "/>
+<line class="st0" x1="25" y1="9" x2="25" y2="15.7"/>
+</svg>
diff --git a/resources/task_light.svg b/resources/task_light.svg
new file mode 100644
index 0000000..dc9c489
--- /dev/null
+++ b/resources/task_light.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 23.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Icons" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+	.st1{fill:none;stroke:#000000;stroke-width:2;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<polyline class="st0" points="25,20 21,24 19,22 "/>
+<circle class="st0" cx="22" cy="22" r="7"/>
+<polyline class="st0" points="19,3 19,9 25,9 19,3 7,3 7,29 22,29 "/>
+<line class="st0" x1="25" y1="9" x2="25" y2="15.7"/>
+</svg>
diff --git a/src/App.tsx b/src/App.tsx
index c919ccb..7709526 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,4 +1,5 @@
 import Board from './Board';
+import Burndown from './Burndown';
 import TaskEditor from './TaskEditor';
 import React, { useState } from "react";
 import VSCodeApi from "./VSCodeApi";
@@ -94,6 +95,11 @@ function App() {
           vscode={vscode}
         />
       }
+      {
+        type === 'burndown' &&
+        <Burndown
+        />
+      }
     </React.Fragment>
   );
 }
diff --git a/src/Burndown.tsx b/src/Burndown.tsx
new file mode 100644
index 0000000..0f98159
--- /dev/null
+++ b/src/Burndown.tsx
@@ -0,0 +1,9 @@
+import React from 'react';
+
+const Burndown = () => {
+  return (
+    <div>burndown chart</div>
+  );
+};
+
+export default Burndown;