OLD | NEW |
1 // Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 library sunflower; | 5 library sunflower; |
6 | 6 |
7 import 'dart:math'; | 7 import 'dart:math'; |
8 import 'dom.dart'; | 8 import 'dom.dart'; |
9 | 9 |
10 const String ORANGE = "orange"; | 10 const String ORANGE = "orange"; |
11 const int SEED_RADIUS = 2; | 11 const int SEED_RADIUS = 2; |
12 const int SCALE_FACTOR = 4; | 12 const int SCALE_FACTOR = 4; |
13 const num TAU = PI * 2; | 13 const num TAU = PI * 2; |
14 const int MAX_D = 300; | 14 const int MAX_D = 300; |
15 const num centerX = MAX_D / 2; | 15 const num centerX = MAX_D / 2; |
16 const num centerY = centerX; | 16 const num centerY = centerX; |
17 | 17 |
18 Element querySelector(String selector) => document.querySelector(selector); | 18 Element querySelector(String selector) => document.querySelector(selector); |
19 | 19 |
20 final InputElement slider = querySelector("#slider"); | 20 final InputElement slider = querySelector("#slider"); |
21 final Element notes = querySelector("#notes"); | 21 final Element notes = querySelector("#notes"); |
22 final num PHI = (sqrt(5) + 1) / 2; | 22 final num PHI = (sqrt(5) + 1) / 2; |
23 int seeds = 0; | 23 int seeds = 0; |
24 final CanvasRenderingContext2D context = | 24 final CanvasRenderingContext2D context = |
25 (querySelector("#canvas") as CanvasElement).getContext('2d'); | 25 (querySelector("#canvas") as CanvasElement).getContext('2d'); |
26 | 26 |
27 // TODO(jmesserly): modified this example to use classes and mixins. | 27 void main() { |
28 class Circle { | 28 slider.addEventListener('change', (e) => draw()); |
29 final num x, y, radius; | 29 draw(); |
| 30 } |
30 | 31 |
31 Circle(this.x, this.y, this.radius); | 32 /// Draw the complete figure for the current number of seeds. |
| 33 void draw() { |
| 34 seeds = int.parse(slider.value); |
| 35 context.clearRect(0, 0, MAX_D, MAX_D); |
| 36 for (var i = 0; i < seeds; i++) { |
| 37 final num theta = i * TAU / PHI; |
| 38 final num r = sqrt(i) * SCALE_FACTOR; |
| 39 final num x = centerX + r * cos(theta); |
| 40 final num y = centerY - r * sin(theta); |
| 41 new SunflowerSeed(x, y, SEED_RADIUS).draw(); |
| 42 } |
| 43 notes.textContent = "$seeds seeds"; |
| 44 } |
| 45 |
| 46 // This example was modified to use classes and mixins. |
| 47 class SunflowerSeed extends Circle with CirclePainter { |
| 48 SunflowerSeed(num x, num y, num radius, [String color]) |
| 49 : super(x, y, radius) { |
| 50 if (color != null) this.color = color; |
| 51 } |
32 } | 52 } |
33 | 53 |
34 abstract class CirclePainter implements Circle { | 54 abstract class CirclePainter implements Circle { |
35 // This demonstrates a field in a mixin. | 55 // This demonstrates a field in a mixin. |
36 String color = ORANGE; | 56 String color = ORANGE; |
37 | 57 |
38 /// Draw a small circle representing a seed centered at (x,y). | 58 /// Draw a small circle representing a seed centered at (x,y). |
39 void draw() { | 59 void draw() { |
40 context | 60 context |
41 ..beginPath() | 61 ..beginPath() |
42 ..lineWidth = 2 | 62 ..lineWidth = 2 |
43 ..fillStyle = color | 63 ..fillStyle = color |
44 ..strokeStyle = color | 64 ..strokeStyle = color |
45 ..arc(x, y, radius, 0, TAU, false) | 65 ..arc(x, y, radius, 0, TAU, false) |
46 ..fill() | 66 ..fill() |
47 ..closePath() | 67 ..closePath() |
48 ..stroke(); | 68 ..stroke(); |
49 } | 69 } |
50 } | 70 } |
51 | 71 |
52 class SunflowerSeed extends Circle with CirclePainter { | 72 class Circle { |
53 SunflowerSeed(num x, num y, num radius, [String color]) | 73 final num x, y, radius; |
54 : super(x, y, radius) { | 74 |
55 if (color != null) this.color = color; | 75 Circle(this.x, this.y, this.radius); |
56 } | |
57 } | 76 } |
58 | |
59 void main() { | |
60 slider.addEventListener('change', (e) => draw()); | |
61 draw(); | |
62 } | |
63 | |
64 /// Draw the complete figure for the current number of seeds. | |
65 void draw() { | |
66 seeds = int.parse(slider.value); | |
67 context.clearRect(0, 0, MAX_D, MAX_D); | |
68 for (var i = 0; i < seeds; i++) { | |
69 final num theta = i * TAU / PHI; | |
70 final num r = sqrt(i) * SCALE_FACTOR; | |
71 final num x = centerX + r * cos(theta); | |
72 final num y = centerY - r * sin(theta); | |
73 new SunflowerSeed(x, y, SEED_RADIUS).draw(); | |
74 } | |
75 notes.textContent = "$seeds seeds"; | |
76 } | |
OLD | NEW |