turnersr/dart.html

## dart.html
 <!DOCTYPE html>
       <html>
         <head>
           <meta charset="utf-8" />
           <title>My First Canvas Example</title>
         </head>
           <body style="margin:0px">
             <Canvas id="my_canvas"> </Canvas>

             <script type="application/dart" src="dots.dart"></script>
           <script src="packages/browser/dart.js"></script>

         </body>
</html>


## dots.dart
import 'dart:html';
import 'dart:async';
import 'dart:math';

void main() {
  init_circles();
}

void init_circles() {
  var timer = new Timer.periodic(const Duration(seconds: 1), update_canvas);
}


void update_canvas(Timer timer) {
  final CanvasRenderingContext2D context =
      (querySelector("#my_canvas") as CanvasElement).context2D;

  var a_colors = ["#6989cd", "#74d1c2", "#8ed9a9", "#b288d7", "#bc3f98", "#6fce6d"];
  var background_color = "#ffffff";

  var width = window.innerWidth;
  var height =  window.innerHeight;
  var my_canvas = querySelector("#my_canvas");
  my_canvas.width = width;
  my_canvas.height = height;

  context.clearRect(0,0,width,height);
  context.fillStyle = background_color;
  context.fillRect(0,0,width,height);


  var circle_size = 3;
  var gaps = circle_size + 3;
  var width_count = width/gaps;
  var heigh_count = height/gaps;

  var rng = new Random();
  var a_colors_length = a_colors.length;

  for(var x=0; x < width_count; x++){
    for(var y = 0; y < heigh_count; y++){
      context.fillStyle = a_colors[rng.nextInt(a_colors_length)];
      context.beginPath();
      context.arc(circle_size+gaps*x,circle_size+gaps*y,circle_size, 0, PI*2, true);
      context.closePath();
      context.fill();
    }
  }

}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>My First Canvas Example</title>
	</head>
	<body style="margin:0px">
	<Canvas id="my_canvas"> </Canvas>

	<script type="application/dart" src="dots.dart"></script>
	<script src="packages/browser/dart.js"></script>

	</body>
	</html>
	import 'dart:html';
	import 'dart:async';
	import 'dart:math';

	void main() {
	init_circles();
	}

	void init_circles() {
	var timer = new Timer.periodic(const Duration(seconds: 1), update_canvas);
	}


	void update_canvas(Timer timer) {
	final CanvasRenderingContext2D context =
	(querySelector("#my_canvas") as CanvasElement).context2D;

	var a_colors = ["#6989cd", "#74d1c2", "#8ed9a9", "#b288d7", "#bc3f98", "#6fce6d"];
	var background_color = "#ffffff";

	var width = window.innerWidth;
	var height = window.innerHeight;
	var my_canvas = querySelector("#my_canvas");
	my_canvas.width = width;
	my_canvas.height = height;

	context.clearRect(0,0,width,height);
	context.fillStyle = background_color;
	context.fillRect(0,0,width,height);


	var circle_size = 3;
	var gaps = circle_size + 3;
	var width_count = width/gaps;
	var heigh_count = height/gaps;

	var rng = new Random();
	var a_colors_length = a_colors.length;

	for(var x=0; x < width_count; x++){
	for(var y = 0; y < heigh_count; y++){
	context.fillStyle = a_colors[rng.nextInt(a_colors_length)];
	context.beginPath();
	context.arc(circle_size+gapsx,circle_size+gapsy,circle_size, 0, PI*2, true);
	context.closePath();
	context.fill();
	}
	}

	}