Completed typescript conversion and started basic intro

ISNIT0 · ISNIT0 · commit ad34a0a89e59 · 2018-09-13T11:01:08.000+01:00
diff --git a/dist/bundle.js b/dist/bundle.js
diff --git a/dist/entry.js b/dist/entry.js
@@ -38,6 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+var intro_js_1 = __importDefault(require("intro.js"));
 var nimble_1 = require("nimble");
 window.h = nimble_1.h;
 var defaultGraph_1 = __importDefault(require("./defaultGraph"));
@@ -50,6 +51,7 @@ function makeArrow(state, affect, index, direction) {
         height: 135,
         viewBox: "0 0 38 135",
         fill: 'none',
+        'data-intro': 'Hello step one!',
         style: {
             width: '100%',
             height: '30px',
@@ -123,6 +125,7 @@ function renderNode(state, affect, node, index) {
     return nimble_1.h('div.node-cont', [
         nimble_1.h('div.node-centraliser', [
             nimble_1.h("div.node." + node.kind, {
+                'data-intro': 'Hello step two!',
                 onclick: function (ev) {
                     var isValidEv = ev.target.classList.contains('node') || ev.target.parentElement.classList.contains('node');
                     if (isValidEv) {
@@ -256,3 +259,8 @@ function initGraph(audioCtx, graph) {
     });
     return graph;
 }
+if (!localStorage.getItem('completedIntro')) {
+    intro_js_1.default()
+        .onexit(function () { return localStorage.setItem('completedIntro', 'true'); })
+        .start();
+}
diff --git a/dist/nodes/modifiers/customWorklet.js b/dist/nodes/modifiers/customWorklet.js
@@ -106,18 +106,22 @@ function makeProcessorsFile(id, parsedBinary) {
 }
 function makeWorkletPromise(audioCtx, ts) {
     var id = '' + Date.now(); //TODO: better ID
-    return $.ajax("/makeWorkletBinary/" + id, {
-        data: JSON.stringify({
-            ts: ts
-        }),
-        contentType: 'application/JSON',
-        type: 'POST'
-    }).then(function (binary) {
-        var parsedBin = intArrayFromBase64(binary);
-        var fileContent = makeProcessorsFile(id, parsedBin);
-        latestParsedBin = parsedBin; //More bad things
-        return audioCtx.audioWorklet.addModule("data:application/javascript;base64," + btoa(fileContent)).then(function () {
-            return new AudioWorkletNode(audioCtx, id);
-        });
+    return new Promise(function (resolve, reject) {
+        $.ajax("/makeWorkletBinary/" + id, {
+            data: JSON.stringify({
+                ts: ts
+            }),
+            contentType: 'application/JSON',
+            type: 'POST'
+        }).then(function (binary) {
+            var parsedBin = intArrayFromBase64(binary);
+            var fileContent = makeProcessorsFile(id, parsedBin);
+            latestParsedBin = parsedBin; //More bad things
+            return audioCtx.audioWorklet.addModule("data:application/javascript;base64," + btoa(fileContent)).then(function () {
+                return new AudioWorkletNode(audioCtx, id);
+            });
+        })
+            .then(resolve)
+            .catch(reject);
     });
 }
diff --git a/index.html b/index.html
@@ -8,6 +8,7 @@
     <script src="https://tonejs.github.io/build/Tone.js"></script>
     <link rel="stylesheet" href="dist/style.css">
     <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Mono" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intro.js@2.9.3/introjs.css">
 </head>
 
 <body>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,13 +9,12 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@types/es6-shim": "^0.31.37",
     "@types/jquery": "^3.3.6",
     "@types/node": "^10.9.4",
-    "@types/webaudioapi": "0.0.27",
     "assemblyscript": "github:AssemblyScript/assemblyscript",
     "body-parser": "1.18.3",
     "express": "4.16.3",
+    "intro.js": "^2.9.3",
     "nimble": "git+https://github.com/ISNIT0/nimble-js.git",
     "tone": "^0.12.80",
     "webmidi": "^2.2.0"
diff --git a/src/entry.ts b/src/entry.ts
@@ -1,3 +1,4 @@
+import introJs from 'intro.js';
 import {
     makeRenderLoop,
     h
@@ -15,6 +16,7 @@ function makeArrow(state: State, affect: Affect, index: number, direction = 'dow
         height: 135,
         viewBox: "0 0 38 135",
         fill: 'none',
+        'data-intro': 'Hello step one!',
         style: {
             width: '100%',
             height: '30px',
@@ -91,6 +93,7 @@ function renderNode(state: State, affect: Affect, node: NodeDef, index: number)
     return h('div.node-cont', [
         h('div.node-centraliser', [
             h(`div.node.${node.kind}`, {
+                'data-intro': 'Hello step two!',
                 onclick(ev: any) {
                     const isValidEv = ev.target.classList.contains('node') || ev.target.parentElement.classList.contains('node');
                     if (isValidEv) {
@@ -141,7 +144,7 @@ function renderNode(state: State, affect: Affect, node: NodeDef, index: number)
     ]);
 }
 
-var audioCtx = new (window.AudioContext || (<any>window).webkitAudioContext)();
+var audioCtx:AudioContext = new ((<any>window).AudioContext || (<any>window).webkitAudioContext)();
 
 const initState: State = {
     graph: initGraph(audioCtx, defaultGraph),
@@ -221,4 +224,10 @@ function initGraph(audioCtx: AudioContext, graph: NodeGraph) {
     });
 
     return graph;
+}
+
+if (!localStorage.getItem('completedIntro')) {
+    introJs()
+        .onexit(() => localStorage.setItem('completedIntro', 'true'))
+        .start();
 }
diff --git a/src/nodes/modifiers/customWorklet.ts b/src/nodes/modifiers/customWorklet.ts
@@ -169,20 +169,25 @@ registerProcessor('${id}', MyWorkletProcessor);
 
 
 
-function makeWorkletPromise(audioCtx: BaseAudioContext, ts: string) {
+function makeWorkletPromise(audioCtx: BaseAudioContext, ts: string): Promise<AudioWorkletNode> {
     const id = '' + Date.now(); //TODO: better ID
-    return $.ajax(`/makeWorkletBinary/${id}`, {
-        data: JSON.stringify({
-            ts
-        }),
-        contentType: 'application/JSON',
-        type: 'POST'
-    }).then((binary: string) => {
-        const parsedBin = intArrayFromBase64(binary);
-        const fileContent = makeProcessorsFile(id, parsedBin);
-        latestParsedBin = parsedBin; //More bad things
-        return audioCtx.audioWorklet.addModule(`data:application/javascript;base64,${btoa(fileContent)}`).then(() => {
-            return new AudioWorkletNode(audioCtx, id);
-        });
+
+    return new Promise((resolve, reject) => {
+        $.ajax(`/makeWorkletBinary/${id}`, {
+            data: JSON.stringify({
+                ts
+            }),
+            contentType: 'application/JSON',
+            type: 'POST'
+        }).then((binary: string) => {
+            const parsedBin = intArrayFromBase64(binary);
+            const fileContent = makeProcessorsFile(id, parsedBin);
+            latestParsedBin = parsedBin; //More bad things
+            return audioCtx.audioWorklet.addModule(`data:application/javascript;base64,${btoa(fileContent)}`).then(() => {
+                return new AudioWorkletNode(audioCtx, id);
+            });
+        })
+        .then(resolve)
+        .catch(reject);
     });
 }
diff --git a/src/nodes/outputs/speaker.ts b/src/nodes/outputs/speaker.ts
@@ -1,5 +1,3 @@
-import { h } from 'nimble';
-
 export default class SpeakerOutputNode implements WAGenNode {
     getDefaultNode() {
         return <any>{};
diff --git a/src/types.d.ts b/src/types.d.ts
@@ -27,4 +27,5 @@ type State = {
 };
 
 declare module 'tone';
-declare module 'webmidi';
+declare module 'webmidi';
+declare module 'intro.js';
diff --git a/tsconfig.json b/tsconfig.json
@@ -3,7 +3,7 @@
     /* Basic Options */
     "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
     "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
-    // "lib": [],                             /* Specify library files to be included in the compilation. */
+    "lib": ["es2015", "dom"],                             /* Specify library files to be included in the compilation. */
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     // "jsx": "preserve",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
@@ -55,5 +55,8 @@
     /* Experimental Options */
     // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
     // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
-  }
+  },
+  "exclude": [
+    "node_modules"
+  ]
 }

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,3 @@`
`1`		`-import { h } from 'nimble';`
`2`		`-`
`3`	`1`	`export default class SpeakerOutputNode implements WAGenNode {`
`4`	`2`	`getDefaultNode() {`
`5`	`3`	`return <any>{};`