From f3dfc3b3684aa9c498a67472c1ef10203695dcdb Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 15:46:40 +0200 Subject: [PATCH 01/10] Set up Basic AngularDart Structure --- lib/app_component.dart | 21 +++++++ pubspec.yaml | 8 ++- test/app_test.dart | 32 +++++++++++ web/favicon.png | Bin 0 -> 2566 bytes web/index.html | 39 +++++++------ web/main.dart | 4 ++ web/styles.css | 121 ++++++++++++++++++++++++++++++++++++++--- 7 files changed, 193 insertions(+), 32 deletions(-) create mode 100644 lib/app_component.dart create mode 100644 test/app_test.dart create mode 100644 web/favicon.png diff --git a/lib/app_component.dart b/lib/app_component.dart new file mode 100644 index 0000000..c5d72e2 --- /dev/null +++ b/lib/app_component.dart @@ -0,0 +1,21 @@ +import 'package:angular/angular.dart'; + +@Component( + selector: 'my-app', + template: ''' +

Hello {{name}}

+
+ +
+
+ + + + + +
+ ''', +) +class AppComponent { + var name = 'Darth Marty'; +} diff --git a/pubspec.yaml b/pubspec.yaml index 2fe07bc..9dc2faa 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -7,10 +7,12 @@ homepage: https://www.martyoehme.org/ environment: sdk: '>=2.0.0-dev.66.0 <2.0.0' -#dependencies: -# path: ^1.4.1 +dependencies: + angular: ^5.0.0-beta dev_dependencies: + angular_test: ^2.0.0-beta build_runner: ^0.9.0 + build_test: ^0.10.2 build_web_compilers: ^0.4.0 - test: ^1.2.0 + test: ^1.0.0 diff --git a/test/app_test.dart b/test/app_test.dart new file mode 100644 index 0000000..3e0614e --- /dev/null +++ b/test/app_test.dart @@ -0,0 +1,32 @@ +@TestOn('browser') + +import 'package:rules_of_living/app_component.dart'; +import 'package:rules_of_living/app_component.template.dart' as ng; +import 'package:angular_test/angular_test.dart'; +import 'package:test/test.dart'; + +void main() { + final testBed = + NgTestBed.forComponent(ng.AppComponentNgFactory); + NgTestFixture fixture; + + setUp(() async { + fixture = await testBed.create(); + }); + + tearDown(disposeAnyRunningTest); + + test('Default greeting', () { + expect(fixture.text, 'Hello Angular'); + }); + + test('Greet world', () async { + await fixture.update((c) => c.name = 'World'); + expect(fixture.text, 'Hello World'); + }); + + test('Greet world HTML', () { + final html = fixture.rootElement.innerHtml; + expect(html, '

Hello Angular

'); + }); +} diff --git a/web/favicon.png b/web/favicon.png new file mode 100644 index 0000000000000000000000000000000000000000..dd18702e27c282e8985a72f5e16590523efff14d GIT binary patch literal 2566 zcmV+h3i7L?5QUz~|@ zI4{JP)W$2F{vX4K@-g*TDKDcH1%M=F7Ww{~<)6Yu+C%gOkEX5sN{rS&h3UFdOsh+K z+HkS}@TF?JaSVt}`tYZ=^WLiKxuDri+eXnm=37M*l@C(px(q zgb%Cgcedz4sD97(X=EdLfcP|YMmvwbVBVsm{lfo9zKg#Tx`zE;biH2*S%$JFn40@z z8vlfJMoZA2PV#GkEBsXE^LAgo#3CO6l2o&1hamMvRU)!FFsty`mVT%g=a6^>GeKTM znJuO!v6vpZN)@9eX;Dj)F%13;K0FXFz)_SR@w~5=4V_%L-$y$Y#r^p`r-HE$%C3nkX5{;t92dDI8tFGDBS_uH%?m)9Y!!A*k98G&5@ z5Me+!<3H+|wx`+9R5Ac34R|X`3+M;Hr+0|ko)PJsTZ6g)z{!Jd#*ev~l?_<1+tqK_ zhMQ+M(+>b`)}Ea?t75wXV15wY00;;#yA0~O4}iylGckN)`T>CG1eh1-`;6@Z023>^ z7(et{Mmj(t;bN}0I~8R_BLFT19pw@f%Q}aATFY21e_^90H_)iF_(I?GW%YC zh7$mLU#b{y?2>H(M&ma$tKqI)?Rfl;qgqg;?dvxqckqe1I03N8qY41Q5#qH13`_ceWcE zDukd9+y>hTO!KK(hQRQ1gY-)rU!JL=Z%~AKaSn=?Gs|%Tpkho`0G65yPXHhMhQ&A3 z9DuVVp9ze~$QfEbiGD#58Xl@4=Bro}JP}mfi);XtIJ7K+kpzamQw58Gjbs4EC+?j8 z2a7&I5uBoE7VSV5ty#bP{YpdyTS@>te<2G1NtU&ta6W!x9LjE0gXr!b3%3y-EX|ll{h)}M zQhKWk2XC0Pd%}dIsa@13*s)MZNC1%t^LsdLd%~ zBDTrfc*~gu6M;3PZS_=8q;Q}Paq5Hw(N0pjB=V*pHi!u)+mI55LyX^ zUcei_&YrvP8aIfzR_fLtZ6WaGk-UQ<;UPDLC&zWj7yzx|vIbzg+1<$?n|K2UXY=j=hT;G~V%8c) z_afibGjua&rdU;1)&Qu=Y+c)+8@w=}PP}pZQ_AhY3-T<9I#j{+C`lzxP}F$?NKZ~H zW1dRA&TZvr@p=$K9DwnDIi6r5c>oyg?&g~CgW`iCjV8y{u|XdMa$XLV>_oWn2I;(x z4hSm;y$*sY_#0K=*0=@kBk!8HilcQ$o5K_r6losc&f=QX#>g3f{bocP{#|TAJ+PHx z=o=}l1iQ%#z;e&9`8+B9K52s@<`VDznZ0r+${7HA!dt>pMbDj}ofJb~1TSBjp-+~qUseF6lweTeVeOy;<%gvuy}*F(G$2i#b6Tg#spq0*8$I|vnez@DJ8zdqUVDm zWMQCt;g8N$at46ai2DMES_u;*LwHrSVLjY{U&m|ZSc3`F0bo>_n`VL*gefdhQPp7l zy6|>LaT=EZ0Oi4(1e3oXC}#llqUf?hhHgusPz&}t(HJA+9$FRK$GmfMXo3;|1s(gY z^J1j8iyP4yY%9@#5epT(JJ_gm!zlNT5&$_Zdf4b@lw$JyZ%9LMnjqMcLGrEPW@|8g z6s81#;LV=t8}7utZ;wIt?)NKNzIHQ3*T<`rVY=8t2|zbL&ei+-^ z{JnQ2$l?8EMMbE@a1w+=g^0J5OpL z3>+~%{|}-7Xg=C;HZ`t#EUF%2E@YUMC_77OASSqBTEdV70Ha~EPvVKU*O2I-NqjXM c5#9UpA7FxigQe%7E&u=k07*qoM6N<$g5h4tSO5S3 literal 0 HcmV?d00001 diff --git a/web/index.html b/web/index.html index 6b86c2d..36f2b5a 100644 --- a/web/index.html +++ b/web/index.html @@ -1,29 +1,28 @@ - + - - - - - rules_of_living - - - + + + Hello Angular + + + + + + - -
- -
-
- - - - - -
+ Loading... + diff --git a/web/main.dart b/web/main.dart index 8d236aa..149766a 100644 --- a/web/main.dart +++ b/web/main.dart @@ -2,11 +2,15 @@ import 'dart:html' as html; import 'package:rules_of_living/App.dart'; +import 'package:angular/angular.dart'; +import 'package:rules_of_living/app_component.template.dart' as ng; html.CanvasElement el; App engine; void main() { + runApp(ng.AppComponentNgFactory); + el = new html.CanvasElement(width: 500, height: 500); html.querySelector('#output').append(el); engine = new App(el); diff --git a/web/styles.css b/web/styles.css index cc035c9..ef7a186 100644 --- a/web/styles.css +++ b/web/styles.css @@ -1,14 +1,117 @@ @import url(https://fonts.googleapis.com/css?family=Roboto); +@import url(https://fonts.googleapis.com/css?family=Material+Icons); -html, body { - width: 100%; - height: 100%; - margin: 0; +/* Master Styles */ +h1 { + color: #369; + font-family: Arial, Helvetica, sans-serif; + font-size: 250%; +} +h2, h3 { + color: #444; + font-family: Arial, Helvetica, sans-serif; + font-weight: lighter; +} +body { + margin: 2em; +} +body, input[text], button { + color: #888; + font-family: Cambria, Georgia; +} +a { + cursor: pointer; + cursor: hand; +} +button { + font-family: Arial; + background-color: #eee; + border: none; + padding: 5px 10px; + border-radius: 4px; + cursor: pointer; + cursor: hand; +} +button:hover { + background-color: #cfd8dc; +} +button:disabled { + background-color: #eee; + color: #aaa; + cursor: auto; +} +label { + padding-right: 0.5em; +} +/* Navigation link styles */ +nav a { + padding: 5px 10px; + text-decoration: none; + margin-right: 10px; + margin-top: 10px; + display: inline-block; + background-color: #eee; + border-radius: 4px; +} +nav a:visited, a:link { + color: #607D8B; +} +nav a:hover { + color: #039be5; + background-color: #CFD8DC; +} +nav a.active { + color: #039be5; +} + +/* items class */ +.items { + margin: 0 0 2em 0; + list-style-type: none; padding: 0; - font-family: 'Roboto', sans-serif; + width: 24em; } - -#output { - padding: 20px; - text-align: center; +.items li { + cursor: pointer; + position: relative; + left: 0; + background-color: #EEE; + margin: .5em; + padding: .3em 0; + height: 1.6em; + border-radius: 4px; +} +.items li:hover { + color: #607D8B; + background-color: #DDD; + left: .1em; +} +.items li.selected { + background-color: #CFD8DC; + color: white; +} +.items li.selected:hover { + background-color: #BBD8DC; +} +.items .text { + position: relative; + top: -3px; +} +.items .badge { + display: inline-block; + font-size: small; + color: white; + padding: 0.8em 0.7em 0 0.7em; + background-color: #607D8B; + line-height: 1em; + position: relative; + left: -1px; + top: -4px; + height: 1.8em; + margin-right: .8em; + border-radius: 4px 0 0 4px; +} +/* everywhere else */ +* { + font-family: Arial, Helvetica, sans-serif; } From 827ab83b88c9d71b45e4bce9f042fb09506792d8 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 16:42:30 +0200 Subject: [PATCH 02/10] Refactor Directories Move Engine Files to /src Directory --- lib/{ => src}/App.dart | 4 ++-- lib/{ => src}/Cell.dart | 2 +- lib/{ => src}/Grid.dart | 4 ++-- lib/{ => src}/Rule.dart | 0 4 files changed, 5 insertions(+), 5 deletions(-) rename lib/{ => src}/App.dart (94%) rename lib/{ => src}/Cell.dart (92%) rename lib/{ => src}/Grid.dart (97%) rename lib/{ => src}/Rule.dart (100%) diff --git a/lib/App.dart b/lib/src/App.dart similarity index 94% rename from lib/App.dart rename to lib/src/App.dart index f77ab15..aa53e04 100644 --- a/lib/App.dart +++ b/lib/src/App.dart @@ -1,7 +1,7 @@ import 'dart:html' as html; -import 'package:rules_of_living/Cell.dart'; -import 'package:rules_of_living/Grid.dart'; +import 'package:rules_of_living/src/Cell.dart'; +import 'package:rules_of_living/src/Grid.dart'; class App { // Elapsed Time Counter - useful for Safety Timeout diff --git a/lib/Cell.dart b/lib/src/Cell.dart similarity index 92% rename from lib/Cell.dart rename to lib/src/Cell.dart index d9344ff..3111708 100644 --- a/lib/Cell.dart +++ b/lib/src/Cell.dart @@ -1,4 +1,4 @@ -import 'package:rules_of_living/Rule.dart'; +import 'package:rules_of_living/src/Rule.dart'; class Cell { bool state; diff --git a/lib/Grid.dart b/lib/src/Grid.dart similarity index 97% rename from lib/Grid.dart rename to lib/src/Grid.dart index 52e0fea..154283e 100644 --- a/lib/Grid.dart +++ b/lib/src/Grid.dart @@ -1,7 +1,7 @@ import 'dart:html' as html; -import 'Cell.dart'; -import 'Rule.dart'; +import 'package:rules_of_living/src/Cell.dart'; +import 'package:rules_of_living/src/Rule.dart'; class Grid { final int w; diff --git a/lib/Rule.dart b/lib/src/Rule.dart similarity index 100% rename from lib/Rule.dart rename to lib/src/Rule.dart From 3780e61453a6d0248c48e6ff0ec6a0f707538842 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 16:44:27 +0200 Subject: [PATCH 03/10] Implement Canvas as Angular Component --- lib/app_component.dart | 29 +++++++++++++++++++++++++---- web/main.dart | 16 ---------------- 2 files changed, 25 insertions(+), 20 deletions(-) diff --git a/lib/app_component.dart b/lib/app_component.dart index c5d72e2..2ea152e 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -1,11 +1,14 @@ import 'package:angular/angular.dart'; +import 'dart:html' as html; +import 'package:rules_of_living/src/App.dart'; + @Component( selector: 'my-app', template: ''' -

Hello {{name}}

+

Cellular Automata - The Rules of Life

- +
@@ -16,6 +19,24 @@ import 'package:angular/angular.dart';
''', ) -class AppComponent { - var name = 'Darth Marty'; +class AppComponent implements OnInit { + var name = "World"; + + App engine; + + @ViewChild("caCanvas") + html.CanvasElement canvas; + + @override + void ngOnInit() { + canvas.context2D.setFillColorRgb(255, 0, 0); + canvas.context2D.fillRect(0, 0, 200, 150); + engine = new App(canvas); + html.window.animationFrame.then(animFrame); + } + + void animFrame(num now) { + engine.process(now); + html.window.animationFrame.then(animFrame); + } } diff --git a/web/main.dart b/web/main.dart index 149766a..3415d86 100644 --- a/web/main.dart +++ b/web/main.dart @@ -1,23 +1,7 @@ -import 'dart:html' as html; - -import 'package:rules_of_living/App.dart'; - import 'package:angular/angular.dart'; import 'package:rules_of_living/app_component.template.dart' as ng; -html.CanvasElement el; -App engine; void main() { runApp(ng.AppComponentNgFactory); - - el = new html.CanvasElement(width: 500, height: 500); - html.querySelector('#output').append(el); - engine = new App(el); - html.window.animationFrame.then(animFrame); -} - -void animFrame(num now) { - engine.process(now); - html.window.animationFrame.then(animFrame); } From 843dad6cbb4c506133395e48b7a91ded461ef5dc Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 17:47:21 +0200 Subject: [PATCH 04/10] Move App HTML into Separate Template --- lib/app_component.dart | 13 ------------- lib/app_component.html | 14 ++++++++++++++ lib/src/App.dart | 1 - 3 files changed, 14 insertions(+), 14 deletions(-) create mode 100644 lib/app_component.html diff --git a/lib/app_component.dart b/lib/app_component.dart index 2ea152e..cf77c3c 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -5,19 +5,6 @@ import 'package:rules_of_living/src/App.dart'; @Component( selector: 'my-app', - template: ''' -

Cellular Automata - The Rules of Life

-
- -
-
- - - - - -
- ''', ) class AppComponent implements OnInit { var name = "World"; diff --git a/lib/app_component.html b/lib/app_component.html new file mode 100644 index 0000000..95d1c96 --- /dev/null +++ b/lib/app_component.html @@ -0,0 +1,14 @@ +

Cellular Automata - The Rules of Life

+
+ Ruleset: +
+
+ +
+
+ + + + + Speed: +
\ No newline at end of file diff --git a/lib/src/App.dart b/lib/src/App.dart index aa53e04..10e590d 100644 --- a/lib/src/App.dart +++ b/lib/src/App.dart @@ -1,6 +1,5 @@ import 'dart:html' as html; -import 'package:rules_of_living/src/Cell.dart'; import 'package:rules_of_living/src/Grid.dart'; class App { From 96a5bd0cec79f95ae2e2e1d859fcc1180b56edc2 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 17:47:37 +0200 Subject: [PATCH 05/10] Connect Start Button through Angular --- lib/app_component.dart | 12 ++++++++++++ lib/app_component.html | 2 +- lib/src/App.dart | 8 +------- 3 files changed, 14 insertions(+), 8 deletions(-) diff --git a/lib/app_component.dart b/lib/app_component.dart index cf77c3c..637c8cf 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -5,11 +5,13 @@ import 'package:rules_of_living/src/App.dart'; @Component( selector: 'my-app', + templateUrl: "app_component.html" ) class AppComponent implements OnInit { var name = "World"; App engine; + String buttonRunText = "Start"; @ViewChild("caCanvas") html.CanvasElement canvas; @@ -26,4 +28,14 @@ class AppComponent implements OnInit { engine.process(now); html.window.animationFrame.then(animFrame); } + + void onStartClicked() { + bool isRunning = !engine.running; + engine.running = isRunning; + + switch (isRunning) { + case true: buttonRunText = "Stop"; break; + case false: buttonRunText = "Start"; break; + } + } } diff --git a/lib/app_component.html b/lib/app_component.html index 95d1c96..b0f6234 100644 --- a/lib/app_component.html +++ b/lib/app_component.html @@ -6,7 +6,7 @@
- + diff --git a/lib/src/App.dart b/lib/src/App.dart index 10e590d..64b9217 100644 --- a/lib/src/App.dart +++ b/lib/src/App.dart @@ -25,12 +25,6 @@ class App { App(this.canvas) { _elapsed.start(); - var runBtn = html.querySelector("#run"); - runBtn.onClick.forEach((html.MouseEvent mouse) { - running = !running; - if(running) runBtn.innerHtml = "Stop"; - if(!running) runBtn.innerHtml = "Start"; - }); } void process(num now) { @@ -56,7 +50,7 @@ class App { void update() { // print("updating"); - if (running) grid.update(); + if (running == true) grid.update(); } From 69b680e5541db4b72d6dfef9e85de77a0bcc5e51 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 19:05:56 +0200 Subject: [PATCH 06/10] Add FontAwesome Icons to Buttons --- lib/app_component.dart | 10 +++++++++- lib/app_component.html | 16 +++++++++++----- web/index.html | 3 +++ 3 files changed, 23 insertions(+), 6 deletions(-) diff --git a/lib/app_component.dart b/lib/app_component.dart index 637c8cf..8239568 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -5,7 +5,8 @@ import 'package:rules_of_living/src/App.dart'; @Component( selector: 'my-app', - templateUrl: "app_component.html" + templateUrl: "app_component.html", + directives: [coreDirectives] ) class AppComponent implements OnInit { var name = "World"; @@ -32,10 +33,17 @@ class AppComponent implements OnInit { void onStartClicked() { bool isRunning = !engine.running; engine.running = isRunning; + } switch (isRunning) { case true: buttonRunText = "Stop"; break; case false: buttonRunText = "Start"; break; } + void onStepClicked() { } + + void onResetClicked() { + } + + void onRandomClicked() {} } diff --git a/lib/app_component.html b/lib/app_component.html index b0f6234..366ce7b 100644 --- a/lib/app_component.html +++ b/lib/app_component.html @@ -1,14 +1,20 @@

Cellular Automata - The Rules of Life

Ruleset: +
- - - - - Speed: + + + + + Speed:
\ No newline at end of file diff --git a/web/index.html b/web/index.html index 36f2b5a..35bd3cb 100644 --- a/web/index.html +++ b/web/index.html @@ -17,6 +17,9 @@ + + + From 020bb6b9181d48860eadc8eba57c6d9a1c5850b1 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 19:07:07 +0200 Subject: [PATCH 07/10] Remove Local isRunning Variable in Component --- lib/app_component.dart | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/lib/app_component.dart b/lib/app_component.dart index 8239568..d00d4e9 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -12,7 +12,6 @@ class AppComponent implements OnInit { var name = "World"; App engine; - String buttonRunText = "Start"; @ViewChild("caCanvas") html.CanvasElement canvas; @@ -22,6 +21,7 @@ class AppComponent implements OnInit { canvas.context2D.setFillColorRgb(255, 0, 0); canvas.context2D.fillRect(0, 0, 200, 150); engine = new App(canvas); + html.window.animationFrame.then(animFrame); } @@ -31,14 +31,9 @@ class AppComponent implements OnInit { } void onStartClicked() { - bool isRunning = !engine.running; - engine.running = isRunning; + engine.running = !engine.running; } - switch (isRunning) { - case true: buttonRunText = "Stop"; break; - case false: buttonRunText = "Start"; break; - } void onStepClicked() { } From 5a10c0e1f72f838995ce61a48f45b5d6db8ade6f Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 19:07:30 +0200 Subject: [PATCH 08/10] Prepare Engine for Button responses --- lib/src/App.dart | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/lib/src/App.dart b/lib/src/App.dart index 64b9217..a571dba 100644 --- a/lib/src/App.dart +++ b/lib/src/App.dart @@ -27,6 +27,11 @@ class App { _elapsed.start(); } + void reset () { + grid = new Grid(100, 100); + running = false; + } + void process(num now) { _drawLag+= _elapsed.elapsedMilliseconds; _updateLag += _elapsed.elapsedMilliseconds; @@ -38,7 +43,7 @@ class App { print("ERROR STUCK IN UPDATE LOOP"); break; } - update(); + if (running == true) update(); _updateLag -= _MS_PER_STEP; } @@ -50,7 +55,7 @@ class App { void update() { // print("updating"); - if (running == true) grid.update(); + grid.update(); } From 70e33fe135e393d32aab6fe9a69aadb99d67e862 Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 19:08:26 +0200 Subject: [PATCH 09/10] Fix Rendering when no Changes occured Rendering checks a dirty flag which gets set whenever a cell updates by changing their state. --- lib/src/Cell.dart | 5 +++++ lib/src/Grid.dart | 8 ++++++++ 2 files changed, 13 insertions(+) diff --git a/lib/src/Cell.dart b/lib/src/Cell.dart index 3111708..5301fb6 100644 --- a/lib/src/Cell.dart +++ b/lib/src/Cell.dart @@ -6,11 +6,16 @@ class Cell { List surviveRules = new List(); List birthRules = new List(); + /// For determining if render updates are necessary in [Grid].render() function + bool dirty = false; + Cell([bool state = false]) : this.state = state; void advanceState() { this.state = this.nextState; this.nextState = false; + + this.dirty = true; } void update(int neighbors) { diff --git a/lib/src/Grid.dart b/lib/src/Grid.dart index 154283e..b0d7e9f 100644 --- a/lib/src/Grid.dart +++ b/lib/src/Grid.dart @@ -8,6 +8,8 @@ class Grid { final int h; final List> map; + bool _dirty = true; + Grid(int w, int h) : this.w = w, this.h = h, @@ -82,6 +84,7 @@ class Grid { for (int x = 0; x < w; x++) { // DEFAULTS TO CONWAY GAME OF LIFE RANGE OF ONE map[y][x].update(getSurroundingNeighbors(x, y, 1)); + if (!_dirty && map[y][x].dirty) _dirty = true; } } for (int y = 0; y < h; y++) { @@ -110,6 +113,9 @@ class Grid { } void render(html.CanvasElement canvas, [num interp]) { + // only renders if any cells changed between renders + if (!_dirty) return; + html.CanvasRenderingContext2D ctx = canvas.getContext('2d'); int brickW = (canvas.width ~/ map[0].length); int brickH = (canvas.height ~/ map.length); @@ -124,5 +130,7 @@ class Grid { ctx.fillRect(x * brickW, y * brickH, brickW, brickH); } } + + _dirty = false; } } From a19aac6a6e27ea6b470f6585d1f244b602147fde Mon Sep 17 00:00:00 2001 From: Marty Oehme Date: Sat, 7 Jul 2018 19:08:49 +0200 Subject: [PATCH 10/10] Add Buttons Step & Reset Wired up into engine --- lib/app_component.dart | 3 +++ 1 file changed, 3 insertions(+) diff --git a/lib/app_component.dart b/lib/app_component.dart index d00d4e9..e5ece87 100644 --- a/lib/app_component.dart +++ b/lib/app_component.dart @@ -35,9 +35,12 @@ class AppComponent implements OnInit { } void onStepClicked() { + engine.running = false; + engine.update(); } void onResetClicked() { + engine.reset(); } void onRandomClicked() {}