Dart streams - Flutter BLoC talk example

index.html

<!-- Copyright 2011 the Dart project authors. All rights reserved.
     Use of this source code is governed by a BSD-style license
     that can be found in the LICENSE file. -->

<h2>Dart streams!</h2>

<div>
  <canvas id="canvas" width="300" height="300"></canvas>
</div>

<div>
  <label>0</label>
  <input id="slider" type="range" max="1000" value="500" />
  <label>1000</label>
</div>

main.dart

import "dart:async";

void generate(StreamSink sink) async {
  print("Someone is listening. Generating numbers!");
  for (int i = 0; i <= 10; i++) {
    await Future.delayed(Duration(seconds: 1));
    sink.add(i);
  }
  sink.close();
}

void main() async {
  StreamController<int> myStreamController = StreamController<int>.broadcast();
  myStreamController.onListen = () => generate(myStreamController.sink);
  StreamSubscription subscription =
      myStreamController.stream.listen((value) => print("Value: $value"));

  await for (int value
      in myStreamController.stream.map((value) => value * value)) {
    print("Squared value: $value");
  }

  print("Job completed, clenaing up...");

  subscription.cancel();
  myStreamController.close();

  print("Bye!");
}

styles.css

h2 {
  margin-bottom: 0;
  text-align: center;
}

div {
  text-align: center;
}