sabha · February 21, 2018 22:08 · sabha · Mar 28, 2018
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
 <body>

 <canvas id="myCanvas" width="640" height="640" style="border:1px solid #d3d3d3; background: black;">
 Your browser does not support the HTML5 canvas tag.</canvas>

 <script>

 var c = document.getElementById("myCanvas");
 var ctx = c.getContext("2d");

 var r = 250;
 var px = c.width/2;
 var py = c.height/2;
 var cr = 50;
 var color = getRandomColor();
 function toDegrees (angle) {
  return angle * (180 / Math.PI);
 }

 function toRadians (angle) {
  return angle * (Math.PI / 180);
 }

 function getRandomColor() {
 	return "#"+((1<<24)*Math.random()|0).toString(16);
  var letters = '0123456789ABCDEF';
  var color = '#';
  for (var i = 0; i < 6; i++) {
    color += letters[Math.floor(Math.random() * 16)];
  }
  return color;
 }

 var i = 0;
 function renderCircle(){
 	var x = r * Math.cos(toRadians(i)) + px;
    var y = r * Math.sin(toRadians(i)) + py
 	ctx.beginPath();
    ctx.arc(x, y, cr, 0, 2 * Math.PI);
    ctx.fillStyle = color;
    ctx.fill();
    
    i++;
    if(i%30 === 0) {
    	color = getRandomColor();
        r -= 5;
    }
    if(i%50 === 0)  r += 5;
    if(i === 360) {
    	r -= 50;
        i = 0;
        cr -= 5;
    	if(r <= 5)clearInterval(loop);
    }
 }
 var loop = setInterval(renderCircle, 1);

 </script> 

 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<body>

	<canvas id="myCanvas" width="640" height="640" style="border:1px solid #d3d3d3; background: black;">
	Your browser does not support the HTML5 canvas tag.</canvas>

	<script>

	var c = document.getElementById("myCanvas");
	var ctx = c.getContext("2d");

	var r = 250;
	var px = c.width/2;
	var py = c.height/2;
	var cr = 50;
	var color = getRandomColor();
	function toDegrees (angle) {
	return angle * (180 / Math.PI);
	}

	function toRadians (angle) {
	return angle * (Math.PI / 180);
	}

	function getRandomColor() {
	return "#"+((1<<24)*Math.random()\|0).toString(16);
	var letters = '0123456789ABCDEF';
	var color = '#';
	for (var i = 0; i < 6; i++) {
	color += letters[Math.floor(Math.random() * 16)];
	}
	return color;
	}

	var i = 0;
	function renderCircle(){
	var x = r * Math.cos(toRadians(i)) + px;
	var y = r * Math.sin(toRadians(i)) + py
	ctx.beginPath();
	ctx.arc(x, y, cr, 0, 2 * Math.PI);
	ctx.fillStyle = color;
	ctx.fill();

	i++;
	if(i%30 === 0) {
	color = getRandomColor();
	r -= 5;
	}
	if(i%50 === 0) r += 5;
	if(i === 360) {
	r -= 50;
	i = 0;
	cr -= 5;
	if(r <= 5)clearInterval(loop);
	}
	}
	var loop = setInterval(renderCircle, 1);

	</script>

	</body>
	</html>