update tutorial (fix image compression issues on gradio with interactive pipe)

core.py

@@ -68,6 +68,19 @@ def extract_profile(img: np.ndarray, context={}) -> Curve:
         title=f"Luminance profiles\n(global context parameter {init_shared_param})"
     )
 
+
+def create_audio(img, context={}):
+    audio_length_seconds = 0.5
+    time_axis = np.linspace(0, audio_length_seconds,
+                            int(audio_length_seconds*44100))
+    modulation = np.interp(time_axis, np.linspace(
+        0., 1., img.shape[0]), img[:, 0, 0])
+    frequency = 440 * (1 + context.get('freq', 0)/100.)
+    audio_1 = (np.sin(2 * np.pi * frequency * time_axis))
+    audio_2 = (modulation*np.sin(2 * np.pi * 300 * time_axis))
+    return audio_1, audio_2
+
+
 # -------------------
 # Pipeline definition
 # -------------------
@@ -79,7 +92,8 @@ def tutorial_pipeline():
     out_bnw = change_color(inp)
     out_image = compare_by_splitting(out_geometry, out_bnw)
     out_profile = extract_profile(out_image)
-    return [[inp, out_geometry], [out_profile, out_image]]
+    audio_1, audio_2 = create_audio(out_image)
+    return [[inp, out_geometry], [out_profile, out_image], [audio_1, audio_2]]
 
 # -----------------------------------------------------------------------------------------
 # Other layout you can try! None will create an empty space.

requirements.txt

@@ -1 +1 @@
-interactive-pipe>=0.7.6
+interactive-pipe>=0.7.9

tutorial.md

@@ -119,7 +119,6 @@ headless_tutorial_pipeline.graph_representation()
 | Shareable | ➖ No, only 1 local Qt Window | ➕ Share a link with others,  (➕ Optional: standalone hosting on  HF spaces 🤗 ) |
 | Keyboard controls |  ➕ Yes | ➖ No |
 | Full screen |  ➕ Yes | ➖ No |
-| Image compression |  ➕ No image compression | ➖ Some image compression |
 
 
 | 🚀  `Qt` | 🐢 `Gradio` |