tongong.net

commit 547737ad9c0e7822a2e89d62f9b5c58c4dfdc223
parent d0c5e38c48f589a080cc503f5b627d17629aab44
Author: tongong <tongong@gmx.net>
Date:   Mon, 19 Dec 2022 17:36:11 +0100

[zoom-interference] bugfix: image loading

Diffstat:
M
content/writing/zoom-interference/src/main.js
 | 
17
+++++++++++------

1 file changed, 11 insertions(+), 6 deletions(-)
diff --git a/content/writing/zoom-interference/src/main.js b/content/writing/zoom-interference/src/main.js
@@ -6,12 +6,17 @@ const custom_file_upload = require("./custom_file.js");
 const example_graydata = require("data/data.js").example_grayscale;
 const example_colordata = require("data/data.js").example_color;
 
-function base64_to_img(txt) {
-    const img = new Image();
-    img.src = "data:;base64," + txt;
-    return img;
+async function base64_to_img(txt) {
+    return new Promise((res, rej) => {
+        const img = new Image();
+        img.src = "data:;base64," + txt;
+        img.addEventListener("load", () => res(img));
+    });
 }
 
+const img_color = await base64_to_img(example_colordata);
+const img_gray = await base64_to_img(example_graydata);
+
 // store all update streams in a container to avoid having a pile of local
 // variables
 const stream_container = {};
@@ -136,7 +141,7 @@ const components = [
         //     if (x < 0.5) return 0.3 <= x && 0.3 <= y && y < 0.7;
         //     return 1 - y;
         // },
-        image: base64_to_img(example_graydata),
+        image: img_gray,
         noise: (x, y, val) => {
             val = val[0] / 256;
             // val: input color; 0 <= val < 1
@@ -171,7 +176,7 @@ const components = [
     {view: (vnode) => m(custom_file_upload, {color: false})},
     {view: (vnode) => m(zimg, {
         size: 601,
-        image: base64_to_img(example_colordata),
+        image: img_color,
         noise: (x, y, val) => {
             return val.map(valc => {
                 valc = valc / 256;