| Index: third_party/pkg/angular/demo/bouncing_balls/web/bouncy_balls.dart
|
| diff --git a/third_party/pkg/angular/demo/bouncing_balls/bouncy_balls.dart b/third_party/pkg/angular/demo/bouncing_balls/web/bouncy_balls.dart
|
| similarity index 61%
|
| rename from third_party/pkg/angular/demo/bouncing_balls/bouncy_balls.dart
|
| rename to third_party/pkg/angular/demo/bouncing_balls/web/bouncy_balls.dart
|
| index a1734d203720483073ba1f1f55c2185b3be18913..783769740af66a8a43784333c44a4483f594f228 100644
|
| --- a/third_party/pkg/angular/demo/bouncing_balls/bouncy_balls.dart
|
| +++ b/third_party/pkg/angular/demo/bouncing_balls/web/bouncy_balls.dart
|
| @@ -17,7 +17,7 @@ class BallModel {
|
|
|
| static _color() {
|
| var color = '#';
|
| - for(var i=0; i < 6; i++) {
|
| + for(var i = 0; i < 6; i++) {
|
| color += (16 * random.nextDouble()).floor().toRadixString(16);
|
| }
|
| return color;
|
| @@ -27,58 +27,59 @@ class BallModel {
|
|
|
| @NgController(
|
| selector: '[bounce-controller]',
|
| - publishAs: 'bounce'
|
| -)
|
| + publishAs: 'bounce')
|
| class BounceController {
|
| var lastTime = window.performance.now();
|
| var run = true;
|
| var fps = 0;
|
| var digestTime = 0;
|
| + var currentDigestTime = 0;
|
| var balls = [];
|
| - var zone;
|
| - var scope;
|
| + final NgZone zone;
|
| + final Scope scope;
|
| var ballClassName = 'ball';
|
|
|
| - BounceController(NgZone this.zone, Scope this.scope) {
|
| + BounceController(this.zone, this.scope) {
|
| changeCount(100);
|
| tick();
|
| }
|
|
|
| - toggleCSS() {
|
| + void toggleCSS() {
|
| ballClassName = ballClassName == '' ? 'ball' : '';
|
| }
|
|
|
| - playPause() {
|
| + void playPause() {
|
| run = !run;
|
| if (run) requestAnimationFrame(tick);
|
| }
|
|
|
| - requestAnimationFrame(fn) {
|
| + void requestAnimationFrame(fn) {
|
| window.requestAnimationFrame((_) => zone.run(fn));
|
| }
|
|
|
| - changeCount(count) {
|
| + void changeCount(count) {
|
| while(count > 0) {
|
| balls.add(new BallModel());
|
| count--;
|
| }
|
| - while(count < 0) {
|
| + while(count < 0 && balls.isNotEmpty) {
|
| balls.removeAt(0);
|
| count++;
|
| }
|
| - tick();
|
| + //tick();
|
| }
|
|
|
| - timeDigest() {
|
| + void timeDigest() {
|
| var start = window.performance.now();
|
| - scope.$evalAsync(() {
|
| - digestTime = (window.performance.now() - start).round();
|
| - }, outsideDigest: true);
|
| + digestTime = currentDigestTime;
|
| + scope.rootScope.domRead(() {
|
| + currentDigestTime = window.performance.now() - start;
|
| + });
|
| }
|
|
|
| - tick() {
|
| - var now = window.performance.now(),
|
| - delay = now - lastTime;
|
| + void tick() {
|
| + var now = window.performance.now();
|
| + var delay = now - lastTime;
|
|
|
| fps = (1000/delay).round();
|
| for(var i=0, ii=balls.length; i<ii; i++) {
|
| @@ -99,20 +100,17 @@ class BounceController {
|
| @NgDirective(
|
| selector: '[ball-position]',
|
| map: const {
|
| - "ballPosition": '=>position'
|
| - }
|
| -)
|
| + "ball-position": '=>position'})
|
| class BallPositionDirective {
|
| - Element element;
|
| - Scope scope;
|
| - BallPositionDirective(Element this.element, Scope this.scope);
|
| + final Element element;
|
| + final Scope scope;
|
| + BallPositionDirective(this.element, this.scope);
|
|
|
| set position(BallModel model) {
|
| element.style.backgroundColor = model.color;
|
| - scope.$watch(() {
|
| - element.style.left = '${model.x + 10}px';
|
| - element.style.top = '${model.y + 10}px';
|
| - });
|
| + scope
|
| + ..watch('x', (x, _) => element.style.left = '${x + 10}px', context: model, readOnly: true)
|
| + ..watch('y', (y, _) => element.style.top = '${y + 10}px', context: model, readOnly: true);
|
| }
|
| }
|
|
|
| @@ -120,6 +118,17 @@ class MyModule extends Module {
|
| MyModule() {
|
| type(BounceController);
|
| type(BallPositionDirective);
|
| + value(GetterCache, new GetterCache({
|
| + 'x': (o) => o.x,
|
| + 'y': (o) => o.y,
|
| + 'bounce': (o) => o.bounce,
|
| + 'fps': (o) => o.fps,
|
| + 'balls': (o) => o.balls,
|
| + 'length': (o) => o.length,
|
| + 'digestTime': (o) => o.digestTime,
|
| + 'ballClassName': (o) => o.ballClassName
|
| + }));
|
| + value(ScopeStats, new ScopeStats(report: true));
|
| }
|
| }
|
|
|
|
|