diff --git a/templates/web-demo/demo.mk b/templates/web-demo/demo.mk
new file mode 100644
index 0000000..d818a91
--- /dev/null
+++ b/templates/web-demo/demo.mk
@@ -0,0 +1,4 @@
+ALL += build/index.html
+
+build/index.html: src/index.html | build
+ cp $^ $@
diff --git a/templates/web-demo/src/index.html b/templates/web-demo/src/index.html
new file mode 100644
index 0000000..f950156
--- /dev/null
+++ b/templates/web-demo/src/index.html
@@ -0,0 +1,16 @@
+
+
+
+ {{=it.product.name}}
+
+
+
+
+ {{=it.product.name}}
+
+
+
diff --git a/templates/web-demo/tibia-index.js b/templates/web-demo/tibia-index.js
new file mode 100644
index 0000000..4d9bb3f
--- /dev/null
+++ b/templates/web-demo/tibia-index.js
@@ -0,0 +1,7 @@
+var path = require("path");
+var sep = path.sep;
+
+module.exports = function (data, api) {
+ api.generateFileFromTemplateFile(`src${sep}index.html`, `src${sep}index.html`, data);
+ api.copyFile(`demo.mk`, `demo.mk`);
+};
diff --git a/templates/web-make/Makefile b/templates/web-make/Makefile
index c918f25..9379f41 100644
--- a/templates/web-make/Makefile
+++ b/templates/web-make/Makefile
@@ -18,7 +18,13 @@ LDFLAGS = \
-Wl,-z,stack-size=$$((8*1024*1024)) \
-nostdlib
-all: build/${BUNDLE_NAME}.wasm build/${BUNDLE_NAME}_processor.js
+ALL = build/${BUNDLE_NAME}.wasm build/${BUNDLE_NAME}_processor.js build/${BUNDLE_NAME}.js
+
+default: all
+
+-include demo.mk
+
+all: ${ALL}
build/${BUNDLE_NAME}.wasm: src/data.h src/memset.h src/plugin.h src/walloc.h src/processor.c | build
${CC} src/processor.c -o $@ ${CFLAGS} ${LDFLAGS} ${CFLAGS_EXTRA} ${LIBS_EXTRA}
@@ -26,6 +32,9 @@ build/${BUNDLE_NAME}.wasm: src/data.h src/memset.h src/plugin.h src/walloc.h src
build/${BUNDLE_NAME}_processor.js: src/processor.js | build
cp $^ $@
+build/${BUNDLE_NAME}.js: src/module.js | build
+ cp $^ $@
+
build:
mkdir -p $@
diff --git a/templates/web/src/module.js b/templates/web/src/module.js
new file mode 100644
index 0000000..122748a
--- /dev/null
+++ b/templates/web/src/module.js
@@ -0,0 +1,33 @@
+const data = {{=JSON.stringify(it, null, 2)}};
+
+export class Module {
+ static get data() { return data; }
+
+ async init(context, processorJsPath, wasmPath) {
+ var wasmBytes = await fetch(wasmPath)
+ .then(response => response.arrayBuffer())
+ .then(bytes => bytes);
+ if (!wasmBytes.byteLength)
+ throw "Could not fetch WebAssembly module";
+
+ await context.audioWorklet.addModule(processorJsPath);
+
+ this.context = context;
+ this.wasmBytes = wasmBytes;
+ }
+
+ context = null;
+ wasmBytes = null;
+}
+
+export class Node extends AudioWorkletNode {
+ constructor(module) {
+ super(module.context, data.product.bundleName,
+ {
+ numberOfInputs: data.product.buses.filter(b => b.type == "audio" && b.direction == "input").length,
+ numberOfOutputs: data.product.buses.filter(b => b.type == "audio" && b.direction == "output").length,
+ outputChannelCount: data.product.buses.filter(b => b.type == "audio" && b.direction == "output").map(b => b.channels == "mono" ? 1 : 2),
+ processorOptions: { wasmBytes: module.wasmBytes }
+ });
+ }
+}
diff --git a/templates/web/tibia-index.js b/templates/web/tibia-index.js
index ccad3af..1ab6f0c 100644
--- a/templates/web/tibia-index.js
+++ b/templates/web/tibia-index.js
@@ -7,4 +7,5 @@ module.exports = function (data, api) {
api.copyFile(`src${sep}processor.c`, `src${sep}processor.c`);
api.generateFileFromTemplateFile(`src${sep}data.h`, `src${sep}data.h`, data);
api.generateFileFromTemplateFile(`src${sep}processor.js`, `src${sep}processor.js`, data);
+ api.generateFileFromTemplateFile(`src${sep}module.js`, `src${sep}module.js`, data);
};
diff --git a/test/run.sh b/test/run.sh
index c1350e2..539d929 100755
--- a/test/run.sh
+++ b/test/run.sh
@@ -11,4 +11,5 @@ cp $dir/plugin.h $dir/../out/lv2/src
$dir/../tibia $dir/product.json,$dir/company.json $dir/../templates/web $dir/../out/web
$dir/../tibia $dir/product.json,$dir/company.json $dir/../templates/web-make $dir/../out/web
+$dir/../tibia $dir/product.json,$dir/company.json $dir/../templates/web-demo $dir/../out/web
cp $dir/plugin.h $dir/../out/web/src