split tutorial into several files

app.py

@@ -1,59 +1,6 @@
-from interactive_pipe import interactive_pipeline, interactive
-from interactive_pipe import Curve, SingleCurve
+# Interactive code
 import argparse
-import numpy as np
-
-
-@interactive(frequency=(80, [1, 100]), isotropy=(0.8, [0.1, 1.]))
-def gen_color(frequency=0, isotropy=0.):
-    lin_coord = np.linspace(0, 1., 256)
-    X, Y = np.meshgrid(lin_coord, isotropy*lin_coord)
-    radius = 0.5+0.5*np.cos(frequency*np.sqrt(X**2 + Y**2))
-    return np.stack([np.abs(X), np.abs(Y), radius], axis=-1).clip(0, 1)
-
-
-@interactive(effect=("flip", ["flip", "mirror", "flip+mirror", "identity"]))
-def modify_geometry(img, effect="flip"):
-    img = img[::-1] if "flip" in effect else img
-    img = img[:, ::-1] if "mirror" in effect else img
-    return img
-
-
-@interactive(bnw=(True, "Black and White"))
-def change_color(img, bnw=True):
-    if bnw:
-        return np.mean(img, axis=-1, keepdims=True).repeat(3, axis=-1)
-    return img
-
-
-@interactive(ratio=(0.5, [0., 1.], "Side by Side comparison"))
-def split(img_1, img_2, ratio=0.5):
-    out = np.zeros_like(img_1)
-    split = int(ratio*img_1.shape[1])
-    out[:, :split] = img_2[:, :split]
-    out[:, split+5:] = img_1[:, split+5:]
-    return out
-
-
-def profile(img):
-    luma = img.mean(axis=-1)
-    h_profile = SingleCurve(y=luma[0, :], label="H profile")
-    v_profile = SingleCurve(y=luma[:, 0], label="V profile")
-    return Curve(
-        [h_profile, v_profile],
-        xlabel="Position", ylabel="Luminance",
-        grid=True
-    )
-
-
-def tutorial_pipeline():
-    inp = gen_color()
-    out_geometry = modify_geometry(inp)
-    out_bnw = change_color(inp)
-    out_image = split(out_geometry, out_bnw)
-    out_profile = profile(out_image)
-    return [[inp, out_geometry], [out_profile, out_image]]
-
+from interactivity import run_interactive_pipeline
 
 if __name__ == "__main__":
     BACKEND_OPTIONS = ["gradio", "qt"]
@@ -61,11 +8,14 @@ if __name__ == "__main__":
     parser.add_argument("-b", "--backend", type=str,
                         choices=BACKEND_OPTIONS, default=BACKEND_OPTIONS[0])
     args = parser.parse_args()
-    markdown_description = "# Source code \n"
-    markdown_description += "```python\n"+open(__file__, 'r').read()+"```"
-    playable_tutorial_pipeline = interactive_pipeline(
-        gui=args.backend,
-        cache=True,
-        markdown_description=markdown_description
-    )(tutorial_pipeline)
-    playable_tutorial_pipeline()
+    backend = args.backend
+    extra_markdown = open("tutorial.md", 'r').read()
+    markdown_description = "# 🔍 READ TUTORIAL HERE \n"
+    markdown_description += "# Source code for this tutorial \n"
+    markdown_description += "## Processing blocks & pipeline (~ production code, no interactivity) \n"
+    markdown_description += "```python\n"+open("library.py", 'r').read()+"```\n"
+    markdown_description += "## Add interactivity \n"
+    markdown_description += "```python\n"+open("interactivity.py", 'r').read()+"```\n"
+    markdown_description += "\n"+extra_markdown
+    run_interactive_pipeline(
+        backend=backend, markdown_description=markdown_description)

interactivity.py

@@ -0,0 +1,32 @@
+from interactive_pipe import interactive_pipeline, interactive
+from library import (gen_color, modify_geometry, change_color,
+                     compare_by_splitting, tutorial_pipeline)
+# --------------------------------------------------------------
+
+
+def add_interactivity():
+    # Depending on the level of control you want,
+    # you can add more or less controls to the pipeline
+    interactive(
+        ratio=(0.5, [0., 1.], "Side by Side comparison")
+    )(compare_by_splitting)
+    interactive(
+        bnw=(True, "Black and White")
+    )(change_color)
+    interactive(
+        effect=("flip", ["flip", "mirror", "flip+mirror", "identity"])
+    )(modify_geometry)
+    interactive(
+        frequency=(80, [1, 100]),
+        isotropy=(0.8, [0.1, 1.])
+    )(gen_color)
+
+
+def run_interactive_pipeline(backend="gradio", markdown_description="# Tutorial"):
+    add_interactivity()
+    playable_tutorial_pipeline = interactive_pipeline(
+        gui=backend,
+        cache=True,
+        markdown_description=markdown_description
+    )(tutorial_pipeline)
+    playable_tutorial_pipeline()

library.py

@@ -0,0 +1,58 @@
+# "Production code"
+import numpy as np
+from interactive_pipe import Curve, SingleCurve
+
+# -----------------
+# Processing blocks
+# -----------------
+
+
+def gen_color(frequency=0, isotropy=0.):
+    lin_coord = np.linspace(0, 1., 256)
+    X, Y = np.meshgrid(lin_coord, isotropy*lin_coord)
+    radius = 0.5+0.5*np.cos(frequency*np.sqrt(X**2 + Y**2))
+    return np.stack([np.abs(X), np.abs(Y), radius], axis=-1).clip(0, 1)
+
+
+def modify_geometry(img, effect="flip"):
+    img = img[::-1] if "flip" in effect else img
+    img = img[:, ::-1] if "mirror" in effect else img
+    return img
+
+
+def change_color(img, bnw=True):
+    if bnw:
+        return np.mean(img, axis=-1, keepdims=True).repeat(3, axis=-1)
+    return img
+
+
+def compare_by_splitting(img_1, img_2, ratio=0.5):
+    out = np.zeros_like(img_1)
+    split = int(ratio*img_1.shape[1])
+    out[:, :split] = img_2[:, :split]
+    out[:, split+5:] = img_1[:, split+5:]
+    return out
+
+
+def extract_profile(img):
+    luma = img.mean(axis=-1)
+    h_profile = SingleCurve(y=luma[0, :], label="H profile")
+    v_profile = SingleCurve(y=luma[:, 0], label="V profile")
+    return Curve(
+        [h_profile, v_profile],
+        xlabel="Position", ylabel="Luminance",
+        grid=True
+    )
+
+# -------------------
+# Pipeline definition
+# -------------------
+
+
+def tutorial_pipeline():
+    inp = gen_color()
+    out_geometry = modify_geometry(inp)
+    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]]

tutorial.md

@@ -0,0 +1,55 @@
+# Tutorial
+
+## Keep separation between "production code" (library / not interactive) & interactivity
+- 💡 One of the strength of interactive pipe is to avoid adding hundreds of lines of code dedicated to GUI (graphical user interfaces). 
+- With interactive pipe, you have the choice to keep this design choice. Each processing block can be defined as a regular function, without even importing the `interactive` decorator. In a separate file, you'll add sliders.
+
+### Several ways to decorate building blocks
+
+
+#### 1.Decorate afterward   🏆 *= Recommended approach*
+- ➖ Less elegant to read (`add_interactivity` may be in a different file)
+- ➕ The decorated function can't be re-used somewhere else.
+- ➕ Possibility to add conditions (`debug` flag)
+ 
+```python
+def gen_color(frequency=0, isotropy=0.):
+    ...
+
+
+def add_interactivity(debug=True):
+    interactive(
+        frequency=(80, [1, 100]),
+        isotropy=(0.8, [0.1, 1.]) if debug else 0.8
+    )(gen_color)
+```
+
+
+#### 2.Decorate using `@`
+
+
+```python
+@interactive(
+    frequency=(80, [1, 100]),
+    isotropy=(0.8, [0.1, 1.])
+)
+def gen_color(frequency=0, isotropy=0.):
+    ...
+```
+- ➕ Easy to read
+- ➖ The decorated function can't be re-used somewhere else.
+- ➖ No possibility to add condition to hide/show slider. To hide the slider, you need to comment!
+
+
+#### 3. Shorter code using `@`
+
+```python
+@interactive()
+def gen_color(
+    frequency=(80, [1, 100]),
+    isotropy=(0.8, [0.1, 1.])
+):
+```
+
+- ➕ Shortest code
+- ➖ The decorated function can't be re-used somewhere else