@grame/faust-web-component 0.3.9 → 0.4.0

package/dist/faust-web-component.js

@@ -13443,7 +13443,6 @@ const dependencies = {
   let compiler;
   let svgDiagrams;
   const default_generator = new FaustMonoDspGenerator();
-  const get_mono_generator = () => new FaustMonoDspGenerator();
   const get_poly_generator = () => new FaustPolyDspGenerator();
   async function loadFaust() {
     const module = await instantiateFaustModuleFromFile_default(jsURL, dataURL, wasmURL);
@@ -36386,12 +36385,12 @@ const dependencies = {
         const code22 = editor.state.doc.toString();
         let generator = null;
         try {
-          await default_generator.compile(compiler, "main", code22, "");
+          await default_generator.compile(compiler, "main", code22, "-ftz 2");
           const json = default_generator.getMeta();
           let { midi, nvoices } = extractMidiAndNvoices(json);
           gmidi = midi;
           gnvoices = nvoices;
-          generator = nvoices > 0 ? get_poly_generator() : get_mono_generator();
+          generator = nvoices > 0 ? get_poly_generator() : default_generator;
           await generator.compile(compiler, "main", code22, "-ftz 2");
         } catch (e) {
           setError(editor, e);
@@ -36442,7 +36441,6 @@ const dependencies = {
         const faustUI = new distExports.FaustUI({ ui, root: faustUIRoot });
         faustUI.paramChangeByUI = (path, value) => node == null ? void 0 : node.setParamValue(path, value);
         node.setOutputParamHandler((path, value) => faustUI.paramChangeByDSP(path, value));
-        setSVG(svgDiagrams.from("main", code22, "")["process.svg"]);
         editorEl.style.height = `${Math.max(125, faustUI.minHeight)}px`;
         faustUIRoot.style.width = faustUI.minWidth * 1.25 + "px";
         faustUIRoot.style.height = faustUI.minHeight * 1.25 + "px";
@@ -36481,7 +36479,14 @@ const dependencies = {
             tabContents[j].classList.remove("active");
           }
         }
-        if (i2 === 2) {
+        if (i2 === 1) {
+          if (faustDiagram.innerHTML.trim() === "") {
+            faustDiagram.innerHTML = "<p><center>Computing SVG...</center></p>";
+            setTimeout(() => {
+              setSVG(svgDiagrams.from("main", code2, "")["process.svg"]);
+            }, 0);
+          }
+        } else if (i2 === 2) {
           scope.onResize();
           if (animPlot !== void 0) cancelAnimationFrame(animPlot);
           animPlot = requestAnimationFrame(drawScope);
@@ -36663,12 +36668,12 @@ const dependencies = {
       let sourceNode = void 0;
       const setup = async () => {
         await faustPromise;
-        await default_generator.compile(compiler, "main", code2, "");
+        await default_generator.compile(compiler, "main", code2, "-ftz 2");
         const json = default_generator.getMeta();
         let { midi, nvoices } = extractMidiAndNvoices(json);
         gmidi = midi;
         gnvoices = nvoices;
-        generator = nvoices > 0 ? get_poly_generator() : get_mono_generator();
+        generator = nvoices > 0 ? get_poly_generator() : default_generator;
         await generator.compile(compiler, "main", code2, "-ftz 2");
         const ui = generator.getUI();
         faustUI = new distExports.FaustUI({ ui, root: faustUIRoot });
@@ -36766,7 +36771,10 @@ const dependencies = {
         }
       };
       audioInputSelector.onchange = connectInput;
-      setup();
+      setTimeout(() => {
+        faustUIRoot.innerHTML = "<p><center>Compiling...</center></p>";
+        setup();
+      }, 0);
     }
   }
   customElements.define("faust-editor", FaustEditor);

package/index.html

@@ -8,11 +8,14 @@
 
     <faust-editor>
         <!--
+declare name "Vocal FOF MIDI";
+declare description "MIDI-controllable FOF vocal synthesizer.";
+declare license "MIT";
+declare copyright "(c)Mike Olsen, CCRMA (Stanford University)";
+
 import("stdfaust.lib");
-ctFreq = hslider("cutoffFrequency",500,50,10000,0.01);
-q = hslider("q",5,1,30,0.1);
-gain = hslider("gain",1,0,1,0.01);
-process = no.noise : fi.resonlp(ctFreq,q,gain);
+
+process = pm.SFFormantModelFofSmooth_ui_MIDI <: _,_;
 -->
     </faust-editor>
     <center>

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@grame/faust-web-component",
     "description": "Web component embedding the Faust Compiler",
-    "version": "0.3.9",
+    "version": "0.4.0",
     "module": "dist/faust-web-component.js",
     "files": [
         "src/",

package/src/faust-editor.ts

@@ -279,14 +279,14 @@ export default class FaustEditor extends HTMLElement {
             let generator = null
             try {
                 // Compile Faust code to access JSON metadata
-                await default_generator.compile(compiler, "main", code, "")
+                await default_generator.compile(compiler, "main", code, "-ftz 2")
                 const json = default_generator.getMeta()
                 let { midi, nvoices } = extractMidiAndNvoices(json);
                 gmidi = midi;
                 gnvoices = nvoices;
 
-                // Build the generator
-                generator = nvoices > 0 ? get_poly_generator() : get_mono_generator();
+                // Build the generator (possibly reusing default_generator which is a FaustMonoDspGenerator) 
+                generator = nvoices > 0 ? get_poly_generator() : default_generator;
                 await generator.compile(compiler, "main", code, "-ftz 2");
 
             } catch (e: any) {
@@ -350,9 +350,6 @@ export default class FaustEditor extends HTMLElement {
             faustUI.paramChangeByUI = (path, value) => node?.setParamValue(path, value)
             node.setOutputParamHandler((path, value) => faustUI.paramChangeByDSP(path, value))
 
-            // Create SVG block diagram
-            setSVG(svgDiagrams.from("main", code, "")["process.svg"])
-
             // Set editor size to fit UI size
             editorEl.style.height = `${Math.max(125, faustUI.minHeight)}px`;
             faustUIRoot.style.width = faustUI.minWidth * 1.25 + "px"
@@ -373,6 +370,7 @@ export default class FaustEditor extends HTMLElement {
         }
 
         let animPlot: number | undefined
+
         const drawScope = () => {
             scope!.renderScope([{
                 analyser: analyser!,
@@ -397,7 +395,20 @@ export default class FaustEditor extends HTMLElement {
                     tabContents[j].classList.remove("active")
                 }
             }
-            if (i === 2) {
+            // Check if the clicked tab is the "Block Diagram" tab (index 1)
+            if (i === 1) {
+                // Only set the SVG if it hasn't been set before (avoiding multiple loads)
+                if (faustDiagram.innerHTML.trim() === "") {
+
+                    // Display a "Computing SVG..." message while the SVG is being generated
+                    faustDiagram.innerHTML = "<p><center>Computing SVG...</center></p>";
+
+                    // Use setTimeout to defer the SVG rendering to a separate task
+                    setTimeout(() => {
+                        setSVG(svgDiagrams.from("main", code, "")["process.svg"]);
+                    }, 0);
+                }
+            } else if (i === 2) {
                 scope!.onResize()
                 if (animPlot !== undefined) cancelAnimationFrame(animPlot)
                 animPlot = requestAnimationFrame(drawScope)

package/src/faust-widget.ts

@@ -121,15 +121,16 @@ export default class FaustWidget extends HTMLElement {
 
         const setup = async () => {
             await faustPromise
-            // Compile Faust code to access JSON metadata
-            await default_generator.compile(compiler, "main", code, "")
+            // Compile Faust code to access JSON metadata 
+            await default_generator.compile(compiler, "main", code, "-ftz 2")
             const json = default_generator.getMeta()
             let { midi, nvoices } = extractMidiAndNvoices(json);
             gmidi = midi;
             gnvoices = nvoices;
 
-            // Build the generator and generate UI
-            generator = nvoices > 0 ? get_poly_generator() : get_mono_generator();
+            // Build the generator (possibly reusing default_generator which is a FaustMonoDspGenerator) 
+            // and generate UI
+            generator = nvoices > 0 ? get_poly_generator() : default_generator;
             await generator.compile(compiler, "main", code, "-ftz 2");
             const ui = generator.getUI();
 
@@ -249,7 +250,12 @@ export default class FaustWidget extends HTMLElement {
 
         audioInputSelector.onchange = connectInput
 
-        setup()
+        setTimeout(() => {
+            // Display a "Compiling..." message while Faust is compiling
+            faustUIRoot.innerHTML = "<p><center>Compiling...</center></p>";
+            setup();
+        }, 0);
+
     }
 }