Proof of concept with basic demo complete.

2022-03-20 19:00:14 -05:00
parent 8ff106f1f5
commit 4dc5e64fa3
7 changed files with 119 additions and 0 deletions
--- a/tests/Elektronomia
+++ b/tests/Elektronomia
--- a/tests/index.html
+++ b/tests/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset='utf-8'>
+    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
+    <title>AudioShowKit visual test</title>
+    <meta name='viewport' content='width=device-width, initial-scale=1'>
+    <link rel='stylesheet' type='text/css' media='screen' href='main.css'>
+    <script defer type="module" src='script.js'></script>
+</head>
+
+<body>
+    <button id="startbtn">Start.</button>
+</body>
+
+</html>
--- a/tests/main.css
+++ b/tests/main.css
--- a/tests/script.js
+++ b/tests/script.js
@@ -0,0 +1,24 @@
+"use strict";
+
+import bindHorizontalBar from "../src/patterns/HorizontalBar.js";
+import VisualizerCore from "../src/VisualizerCore.js";
+
+// We will see if the visualizers core and event systems are working correctly.
+let startBtn = document.getElementById("startbtn");
+startBtn.addEventListener("click", async (ev) => {
+    let mediaStream = new Audio("../tests/Elektronomia - Collide.mp3");
+    mediaStream.addEventListener("canplaythrough", (ev) => {
+        let visCore = new VisualizerCore(mediaStream, 128);
+        let coreAndEventCanvas = document.createElement("canvas");
+        coreAndEventCanvas.width = 640;
+        coreAndEventCanvas.height = 200;
+
+        console.log("starting playthrough.");
+        mediaStream.play();
+        visCore.analyze();
+        document.body.appendChild(coreAndEventCanvas);
+
+        bindHorizontalBar(coreAndEventCanvas, visCore);
+    });
+
+});