Keith Peters bit101

## trig_01_01.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

var waveCount = 1,
    waveHeight = height / 2 - 10,
    res = 1;

context.translate(0, height / 2);

## flow_fields_2_05.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d");

var points;
var bitmap = Bitmap.create("cat.jpg", onComplete);
var force = 0.007;
var friction = 0.99;

function onComplete() {
  canvas.width = bitmap.width;

## flow_fields_2_04.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

context.lineWidth = 0.1;

var z = 0;
noise.seed(Math.random());
render();

## flow_fields_2_03.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

context.lineWidth = 0.1;

// create points. each aligned to left edge of screen,
// spread out top to bottom.
var points = [];

## flow_fields_2_index.html
<!doctype html>
<html>
<head>
  <title>Flow Fields</title>
  <style type="text/css">
  html, body {
    margin: 0;
    padding: 0;
  }
  canvas {

## flow_fields_2_02.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

noise.seed(Math.random());
var z = 0;
render();

function render() {

## flow_fields_2_01.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

noise.seed(Math.random());
render();

function render() {
  var res = 10;

## flow_fields_06.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

context.lineWidth = 0.1;

// random attractor params
var a = Math.random() * 4 - 2;
var b = Math.random() * 4 - 2;

## flow_fields_05.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

context.lineWidth = 0.5;

// create point
var p = {
  x: Math.random() * width,

## flow_fields_04.js
var canvas = document.getElementById("canvas"),
    context = canvas.getContext("2d"),
    width = canvas.width = window.innerWidth,
    height = canvas.height = window.innerHeight;

var count = 50000;
context.lineWidth = 0.25;

for(var i = 0; i < count; i++) {
  var x = Math.random() * width,
	var canvas = document.getElementById("canvas"),
	context = canvas.getContext("2d"),
	width = canvas.width = window.innerWidth,
	height = canvas.height = window.innerHeight;

	var waveCount = 1,
	waveHeight = height / 2 - 10,
	res = 1;

	context.translate(0, height / 2);
	var canvas = document.getElementById("canvas"),
	context = canvas.getContext("2d");

	var points;
	var bitmap = Bitmap.create("cat.jpg", onComplete);
	var force = 0.007;
	var friction = 0.99;

	function onComplete() {
	canvas.width = bitmap.width;
	<!doctype html>
	<html>
	<head>
	<title>Flow Fields</title>
	<style type="text/css">
	html, body {
	margin: 0;
	padding: 0;
	}
	canvas {