Electicity.js

var WIDTH = 500;
var HEIGHT = 600;

var dots = [];
var numDots = 50;
var circleWidth = 300;
var radius = circleWidth/2;

var r = 134;
var g = 240;
var b = 255;

function setup() {
	createCanvas(WIDTH,HEIGHT);
	for (var i = 0; i < numDots; i++) {
		var x = random(0,WIDTH);
		var y = random(0, HEIGHT);
		var connections = random(1,5);
		var vx = random(-1,1);
		var vy = random(-1,1);
		dots.push(new Dot(x,y,connections,vx,vy));
	}
}

function draw() {
	background(0);
	for (var i = 0; i < numDots; i++){
		if (inRadius(dots[i].getX(),dots[i].getY())){
			dots[i].setFill(r,g,b,true);
		} else {
			dots[i].setFill(255,255,255,false);
		}
		dots[i].move();
		dots[i].connect();
	}
	stroke(r,g,b);
	strokeWeight(3);
	noFill();
	ellipse(WIDTH/2, HEIGHT/2, circleWidth);
}

function inRadius(x,y) {
	var distance = sqrt(sq(WIDTH/2-x)+sq(HEIGHT/2-y));
	if (distance > radius){
		return false;
	} else {
		return true;
	}
}

function Dot(x,y,numConnections,vx,vy) {
	this.x = x;
	this.y = y;
	this.numConnections = numConnections;
	this.vx = vx;
	this.vy = vy;
	this.connections = [];
	this.r = 255;
	this.g = 255;
	this.b = 255;
	this.status = false;

	this.getX = function() {
		return this.x;
	}

	this.getY = function() {
		return this.y;
	}

	this.setFill = function(r,g,b,status){
		this.r = r;
		this.g = g;
		this.b = b;
		this.status = status;
	}

	this.move = function() {
		var newX = this.x + this.vx;
		var newY = this.y + this.vy;
		if (newX > WIDTH || newX < 0){
			this.vx *= -1;
		}
		if (newY > HEIGHT || newY < 0){
			this.vy *= -1;
		}
		this.x += this.vx;
		this.y += this.vy;
		fill(this.r,this.g,this.b);
		strokeWeight(0);
		// debug line
		// if(this.r == 134){
		// 	line(this.x-5,this.y, this.x + 5,this.y);
		// }
		ellipse(this.x,this.y,6);
	};

	// if Dot is within electric boundary, then find nearest points to connect with.
	// TODO: The farther the dot is from the center, the less connections it can make.
	this.connect = function() {
		this.connections = [];
		if (this.status){
			for (var i = 0; i < numDots; i++){
				var pointX = dots[i].getX();
				var pointY = dots[i].getY();
				var distance = sqrt(sq(pointX-this.x)+sq(pointY-this.y));
				var pointData = {
					"point": dots[i],
					"distance": distance
				}
				this.connections.push(pointData);

			}
			this.connections.sort(function(a, b) {
			    return parseFloat(a.distance) - parseFloat(b.distance);
			});
			// this.connections[0] is itself
			strokeWeight(1);
			for (var i = 1; i <= this.numConnections; i++){
				this.connections[i].point.setFill(this.r,this.g,this.b);
				line(this.x, this.y, this.connections[i].point.getX(), this.connections[i].point.getY())
			}
		}
	};
}