kenwilcox/Roy-G.-Biv.markdown

## index.html
<html>
  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
  </head>
  <body>
    <div id="canvas">
      <canvas id="myCanvas"></canvas>
    </div>
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"></script>

  </body>
</html>

## Roy-G.-Biv.markdown

      
    Raw
  

              Roy-G.-Biv.markdown
            
          
    Roy G. Biv

Playing with bubbles.js on codecademy.com, thought it would be fun to use the whole rainbow.
A Pen by kenwilcox on CodePen.
License.

  
## script.js
function updateCanvasDimensions() {
  canvas.attr({
    height: 200,
    width: 1000
  });
  canvasWidth = canvas.width();
  canvasHeight = canvas.height();
  draw();
}

var myName = "Roy G Biv";

// Colors are in HSL not RGB
var red = [0, 100, 63];
var orange = [40, 100, 60];
var yellow = [55, 100, 50];
var green = [75, 100, 40];
var blue = [196, 77, 55];
var indigo = [255, 100, 63];
var violet = [280, 50, 60];

var letterColors = [red, orange, yellow, green, blue, indigo, violet];

drawName(myName, letterColors);

bubbleShape = 'square';
//bubbleShape = 'circle';


//bounceName();
bounceBubbles();
	<html>
	<head>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
	</head>
	<body>
	<div id="canvas">
	<canvas id="myCanvas"></canvas>
	</div>
	<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"></script>

	</body>
	</html>
	function updateCanvasDimensions() {
	canvas.attr({
	height: 200,
	width: 1000
	});
	canvasWidth = canvas.width();
	canvasHeight = canvas.height();
	draw();
	}

	var myName = "Roy G Biv";

	// Colors are in HSL not RGB
	var red = [0, 100, 63];
	var orange = [40, 100, 60];
	var yellow = [55, 100, 50];
	var green = [75, 100, 40];
	var blue = [196, 77, 55];
	var indigo = [255, 100, 63];
	var violet = [280, 50, 60];

	var letterColors = [red, orange, yellow, green, blue, indigo, violet];

	drawName(myName, letterColors);

	bubbleShape = 'square';
	//bubbleShape = 'circle';


	//bounceName();
	bounceBubbles();