update the Stairs.html example to use Promise mapping, scanning and chaining with lazy consumption. No more need for Scheduler in this case.

Author: Dierk Koenig

src/examples/sequence/Stairs.html

@@ -35,9 +35,10 @@ <h2>Simple SVG Graphics: Stairs</h2>
 
 <script type="module">
     import { forever }   from "../../kolibri/sequence/util/helpers.js";
-    import { Scheduler } from "../../kolibri/dataflow/dataflow.js";
     import { Sequence }  from "../../kolibri/sequence/constructors/sequence/Sequence.js";
     import { dom }       from "../../kolibri/util/dom.js";
+    import { Seq }       from "../../kolibri/sequence/constructors/seq/seq.js";
+    import { id }        from "../../kolibri/stdlib.js";
 
     const svgWidth = 500;
     const [svg] = dom(`<svg id="svg" viewBox="${-svgWidth/2} ${-svgWidth/2} ${svgWidth} ${svgWidth}" > </svg> `);
@@ -49,7 +50,7 @@ <h2>Simple SVG Graphics: Stairs</h2>
         [-10  , 10  ],
         [-10  ,-10  ],
     ];
-    const nextAfter = ([ [firstX, firstY],  second, third,  [lastX, lastY] ]) =>
+    const nextAfter = ([ [firstX, firstY],  second, third,  [lastX, lastY] ]) => // pure
      [
          second,
          third,
@@ -58,22 +59,25 @@ <h2>Simple SVG Graphics: Stairs</h2>
           firstY + (firstY - lastY) * 0.05]
     ];
 
-    const lineFor = ([_f, _s, [x1, y1], [x2, y2] ]) =>
+    const lineFor = ([_f, _s, [x1, y1], [x2, y2] ]) =>                          // pure
         `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}"></line>`;
 
-    const allTrails = Sequence(trail, forever, nextAfter);
+    const allTrails  = Sequence(trail, forever, nextAfter);                     // pure, lazy
+    const renderLine = line => svg.innerHTML += line;                           // impure side effect
+    const wait       = ms   => ok => setTimeout( ok, ms);                       // impure async
+    const immediate  = f    => ok => { f(); ok() };                             // ready for promise ctor
 
-    const scheduler = Scheduler();
+    const lazyLines = allTrails
+        .map( lineFor )
+        .map( line => () => renderLine(line))       // map to a sequence of _functions_ that can be called as f()
+        .map( immediate )                           // make each function Promise-ready
+        .and( f => Seq(f, wait(50)))                // intersperse with monads FTW
+        .scan( (acc, cur) => acc.then(() => new Promise(cur)), Promise.resolve(undefined));
+
+    lazyLines
+        .take(255 * 2)          // late "pruning" thanks to laziness
+        .reduce$(id,undefined); // start the promises, trigger the painting
 
-    allTrails
-        .take(255)
-        .map(lineFor)
-        .forEach$( line =>
-            scheduler.add( ok => setTimeout( _=> {
-                svg.innerHTML += line;
-                ok();
-            }, 50))
-        );
 
 </script>
 </body>