first commit

Color.js

@@ -0,0 +1,21 @@
+//Color.js
+//Written by Brandon Poythress
+//14MAY2018
+//Description: 
+//This class and global functions manage color in the program.
+
+//Color class
+function Color(rIn,gIn,bIn,aIn){
+	this.type = "Color";
+	this.r = rIn;
+	this.g = gIn;
+	this.b = bIn;
+	this.a = aIn;
+}
+
+//Basic colors are listed below. RGBA format 
+var RED = new Color(1.0, 0.0, 0.0, 1.0);
+var GREEN = new Color(0.0, 1.0, 0.0, 1.0);
+var BLUE = new Color(0.0, 0.0, 1.0, 1.0);
+var BLACK = new Color(0.0, 0.0, 0.0, 1.0);
+var WHITE = new Color(1.0, 1.0, 1.0, 1.0);

DrawableObject.js

@@ -0,0 +1,18 @@
+//DrawableObject.js
+//Written by Brandon Poythress
+//01MAY2018
+
+function DrawableObject(colorIn){
+	this.graphicsMemoryAddress = null;
+	this.killMe = false;
+
+	this.color = new Color(colorIn.r, colorIn.g, colorIn.b, colorIn.a);
+}
+
+//setter to change the color
+DrawableObject.prototype.setColorByObject = function(colorIn){
+	this.color.r = colorIn.r;
+	this.color.g = colorIn.g;
+	this.color.b = colorIn.b;
+	this.color.a = colorIn.a;	
+};

EventHandler.js

@@ -0,0 +1,116 @@
+//EventHandler.js
+//Written by Brandon Poythress
+//25APR2018
+//Description: 
+//This class handles all events
+
+function EventHandler(canvasIn, rendererIn, currentStateIn){
+
+	this.canvas = canvasIn;
+	this.renderer = rendererIn;
+	this.currentState = currentStateIn;
+
+	//The EventHandler will hold on to a variable that contains the inverse perspective matrix
+	//of the renderer.  The EventHandler will use this to give the currentState ray information
+	//that it can use to figure out what was clicked or hovered over.
+	this.inverseProjMatrix = new Matrix4();
+
+	//ray after normalizing
+	this.normalizedRay = new Vector4();
+
+	//ray after applying the inverse perspective matrix
+	this.eyeRay = new Vector4();
+
+	//event handlers----------------------------------------------------------------------
+
+	//window resize event
+	window.addEventListener('resize', function(){
+										this.renderer.resizeCanvas(this.canvas);}.bind(this), 
+										false);
+
+	//mouse down event
+	this.canvas.addEventListener('mousedown', function(evt){
+												this.handleMouseDown(evt);
+											}.bind(this), false);
+
+	this.canvas.addEventListener('mouseup', function(evt){
+												this.handleMouseUp(evt);}.bind(this), false);
+
+	//keydown event
+	document.addEventListener('keydown', function(evt){
+											this.handleKeyDown(evt);
+										}.bind(this), false);
+
+	//keyup event
+	document.addEventListener('keyup', function(evt){
+											this.handleKeyUp(evt);
+										}.bind(this), false);
+
+
+}
+
+//Implementing mouseDown
+EventHandler.prototype.handleMouseDown = function(evt){
+
+
+};
+
+//Implementing mouseUp
+EventHandler.prototype.handleMouseUp = function(evt){
+
+	//update the eyeRay variable so that it is ready to pass to the currentState
+	this.updateEyeRay(evt);
+	this.currentState.onMouseUp(evt, this.eyeRay);
+
+};
+
+//Implementing keyDown
+EventHandler.prototype.handleKeyDown = function(evt){
+	this.currentState.onKeyDown(evt);
+};
+
+//Implementing keyUp
+EventHandler.prototype.handleKeyUp = function(evt){
+	this.currentState.onKeyUp(evt);
+};
+
+EventHandler.prototype.updateEyeRay = function(evt){
+	//steps to create a ray
+
+	//step 0: 2d viewpoint coordinates
+	var x = evt.x;
+	var y = evt.y;
+	var z = null;
+	var w = null;
+
+	//Step 1 and 2: Make normalized Device Coordinates.  x, y, and z
+	//now define a vector looking in the negative z direction
+	x = ((2.0 * x) / this.canvas.width) - 1.0;
+	y = 1.0 - ((2.0 * y) / this.canvas.height);
+	z = -1.0;
+	w = 1.0;
+
+	this.normalizedRay.elements[0] = x;
+	this.normalizedRay.elements[1] = y;
+	this.normalizedRay.elements[2] = z;
+	this.normalizedRay.elements[3] = w;
+
+	//console.log(this.normalizedRay);
+
+	//Step 3: 4d Eye(Camera) Coordinates
+	this.inverseProjMatrix.setInverseOf(this.renderer.projMatrix);
+
+	//console.log(this.inverseProjMatrix);
+
+
+	this.eyeRay = this.inverseProjMatrix.multiplyVector4(this.normalizedRay);
+	this.eyeRay.elements[2] = -1.0
+	this.eyeRay.elements[3] = 0.0;
+
+	//console.log(this.eyeRay);
+
+
+};
+
+
+

Freedom.js

@@ -0,0 +1,57 @@
+//Freedom.js
+//Written by Brandon Poythress
+//25APR2018
+//Description: 
+//This file is the main game loop
+
+//if there are textures you have to run a local server with the command:
+// If Python version is 3.X
+// python -m http.server
+// If Python version is 2.X
+// python -m SimpleHTTPServer
+
+debugging = true;
+
+function main(){
+	//retrieve the canvas from the html file
+	var canvas = document.getElementById('webgl');
+	if(!canvas){
+		console.log('Failed to retrieve the <canvas> element');
+		return;
+	}
+
+	//create the renderer instance
+	var renderer = new Renderer(canvas);
+
+	//load state
+	var currentState = new ModelState();
+
+	//event handler
+	var eventHandler = new EventHandler(canvas, renderer, currentState);
+
+	//size the canvase based on the current browser window size
+	renderer.resizeCanvas(canvas);
+
+	//There will probably be a function call somewhere around here that loads
+	//existing saved data if there is any.
+
+	//holds the time of last view update
+	var lastUpdate = Date.now();
+	var currentTime = Date.now();
+	var delta;
+
+	//define the game Loop
+	var gameLoop = function(){
+			currentTime = Date.now();
+			delta = currentTime - lastUpdate;
+			lastUpdate = currentTime;
+			currentState.update(delta);
+			renderer.render(currentState, canvas);
+			requestAnimationFrame(gameLoop);
+	};
+
+	//starting the main game loop
+	gameLoop();
+}	
+
+

GPUMemManager.js

@@ -0,0 +1,154 @@
+//GPUMemManager.js
+//Written by Brandon Poythress 4/17/18
+//Description: 
+//There needs to be a lot of thought put into this memory manager.  right now it
+//is good enough for development.  once the program is working pretty well more 
+//attention should be given to this because the performance effects are significant.
+
+function GPUMemManager(gl){
+	//set the current buffer size in bytes
+	this.INITIAL_BUFFER_SIZE = 1024;
+	this.BUFFER_GROW_SIZE = 1024;
+
+	//the first block of memory takes up the entire buffer and is empty
+	//starting at address 0.
+	initialBlock = new MemoryBlock(0, this.INITIAL_BUFFER_SIZE);
+	initialBlock.isAvailable = true;
+
+	//list of all memory blocks
+	this.blockList = [];
+
+	//add the big empty block to the blockList
+	this.blockList.push(initialBlock);
+
+	//create an empty buffer
+	this.graphicsBuffer = gl.createBuffer();
+	if(!this.graphicsBuffer){
+		console.log('Failed to create buffer object');
+		return -1;
+	}
+
+	//Bind the buffer object to the target
+	gl.bindBuffer(gl.ARRAY_BUFFER, this.graphicsBuffer);
+
+	//Expand the buffer to its inital size in bytes
+	gl.bufferData(gl.ARRAY_BUFFER, this.INITIAL_BUFFER_SIZE, gl.DYNAMIC_DRAW);
+
+	// Unbind the buffer object
+	gl.bindBuffer(gl.ARRAY_BUFFER, null);
+}
+
+GPUMemManager.prototype.allocate = function(gl, vertexArray){
+	//determine the size of the vertexArray in bytes
+	var vertArraySize = vertexArray.length * vertexArray.BYTES_PER_ELEMENT;
+
+	//set the index of the new memory to an error value.
+	//this will only be corrected if memory is successfully allocated
+	var indexOfNewMemory = -1;
+
+	//find a empty block of memory
+	for (var i=0; i<this.blockList.length; i++){
+		if (this.blockList[i].isAvailable && this.blockList[i].size>=vertArraySize){
+
+			//store the original size of the available block
+			var sizeOfOldBlock = this.blockList[i].size;
+
+			//if the required amount of memory is less than what is available
+			//in the block, then break up the block into two
+			if(this.blockList[i].size != vertArraySize){
+
+				//use the current unused block as the new block
+				this.blockList[i].size = vertArraySize;
+				this.blockList[i].isAvailable = false;
+
+				//calculate the new location and size of the empty block
+				freeLocation = this.blockList[i].location + vertArraySize;
+				freeSize = sizeOfOldBlock - vertArraySize;
+
+				//create the empty block
+				freeBlock = new MemoryBlock(freeLocation, freeSize);
+				freeBlock.isAvailable = true;
+
+				//Push the empty block to the end of the stack
+				this.blockList.push(freeBlock);
+
+			} else{
+
+				//if the new and old block are the same size, creation of new
+				//memory blocks is not necessary
+				this.blockList[i].isAvailable = false;
+			}
+
+			//each drawable object will use index number instead of address
+			//to access it's memory block so they do not have to iterate through
+			//the blockList to find it
+			indexOfNewMemory = i; 
+
+			//allocate the memory in the GPU
+			gl.bindBuffer(gl.ARRAY_BUFFER, this.graphicsBuffer);
+			gl.bufferSubData(gl.ARRAY_BUFFER, this.blockList[i].location, vertexArray);
+			gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+			//once memory has been allocated we can break out of the for loop
+			break;
+
+
+		} else if(i == this.blockList.length - 1) {
+			//if you dont break out of the foor loop before getting here, it means
+			//that there was not a block of memory available
+			console.log("Out of memory in the GPUMemoryManager.  Need to expand memory");
+		}
+	}
+
+	return indexOfNewMemory; //if a negative number is returned there is a problem
+};
+
+
+GPUMemManager.prototype.update = function(gl, object, vertexArray){
+
+	//first we must figure out is memory is already allocated or the object is new
+	if(object.graphicsMemoryAddress){
+		//because the object already has a memory address/index, i am going to release it.
+		//each time I modify the vertices an existing object, I free its memory and rebuffer it.
+		//this helps with memory fragmentation.
+		this.blockList[object.graphicsMemoryAddress].isAvailable = true;
+		object.graphicsMemoryAddress = null;
+	}else{
+
+	}
+
+	//then we figure out if the object is requesting deletion.  If so we just return without
+	//allocating any more.
+	if(object.killMe){
+		return;
+	} else {
+		object.graphicsMemoryAddress = this.allocate(gl, vertexArray);
+	}
+
+	if(debugging){
+		console.log("Memory Information:");
+		for (var i=0; i<this.blockList.length; i++){
+			console.log("MemoryBlock Index:");
+			console.log(i);
+			console.log("MemoryBlock Size:");
+			console.log(this.blockList[i].size);
+			console.log("MemoryBlock Location:");
+			console.log(this.blockList[i].location);
+			console.log("-----------------------------");
+		}
+	}
+
+};
+
+
+function MemoryBlock(locationIn, sizeIn){
+	//is the memory block used or available.  Default is used.
+	this.isAvailable = false;
+
+	//location pointer of the memory block
+	this.location = locationIn;
+
+	//size of the memory block in bytes
+	this.size = sizeIn;
+
+}

IdGenerator.js

@@ -0,0 +1,15 @@
+//IdGenerator.js
+//Written by Brandon Poythress
+//25APR2018
+//Description: 
+//This class handles all ID distribution
+
+function IdGenerator(){
+	this.nextId = 1;
+}
+
+IdGenerator.prototype.getId = function(){
+	var idToReturn = this.nextId;
+	this.nextID = this.nextId + 1;
+	return idToReturn;
+};