Permalink
Browse files

initial

  • Loading branch information...
0 parents commit 01a45af31be187db6d4cd5952f5e59de524785d5 @jlongster committed Nov 15, 2012
Showing with 4,526 additions and 0 deletions.
  1. +8 −0 README.md
  2. +86 −0 camera.js
  3. +181 −0 cube.js
  4. +3,456 −0 gl-matrix.js
  5. +22 −0 lang.txt
  6. +69 −0 mesh-loader.js
  7. +64 −0 mesh.js
  8. +58 −0 object.js
  9. +82 −0 renderer.js
  10. +99 −0 resources.js
  11. +283 −0 scene.js
  12. +82 −0 shaders.js
  13. +36 −0 util.js
@@ -0,0 +1,8 @@
+
+# Shade
+
+Shade is a WebGL 3d graphics engine. Right now it is just an experiment to get to know WebGL and play around with engine architecture. In the future it might grow into something useful for others.
+
+Shades cares deeply about simplicity, so its core philosphy is to keep things straight-forward and simple. You should be able to explore the code and not feel overwhelmed at the complexity. 3d engines tends to be complicated, but it hopes to fight that and still keep good performance.
+
+It offers a scene graph and renderer which optimally sorts and renders 3d objects, and a few other essential items. It hopes to not grow beyond this essentially scope, while offering other rich features in the form of plugins.
@@ -0,0 +1,86 @@
+
+sh.Camera = sh.SceneNode.extend({
+ init: function(pos) {
+ this.parent(pos);
+ // Default position should be looking at a positive Z axis
+ this.yaw = Math.PI;
+ this.pitch = 0.;
+ this._dirty = false;
+ this._dirtyWorld = true;
+ this.useQuat = true;
+
+ var q = quat4.fromAngleAxis(Math.PI, [0, 1, 0]);
+ quat4.toMat4(q, this.transform);
+ },
+
+ update: function(dt) {
+ var moved = false;
+ var mouse = getMouseMoved();
+ this.yaw -= mouse[0] * .25 * dt;
+ this.pitch -= mouse[1] * .25 * dt;
+
+ if(mouse[0] !== 0 || mouse[1] !== 0) {
+ moved = true;
+ }
+
+ if((isDown('LEFT') || isDown('a')) && !isMouseDown()) {
+ this.yaw += 1 * dt;
+ moved = true;
+ }
+
+ if((isDown('RIGHT') || isDown('d')) && !isMouseDown()) {
+ this.yaw -= 1 * dt;
+ moved = true;
+ }
+
+ var globalQuat = quat4.fromAngleAxis(-this.pitch, [1, 0, 0]);
+ quat4.rotateY(globalQuat, -this.yaw);
+ quat4.toMat4(globalQuat, this.transform);
+
+ this.quat = quat4.fromAngleAxis(this.pitch, [1, 0, 0]);
+ quat4.rotateY(this.quat, this.yaw);
+
+ var forward = vec3.create([0, 0, -1]);
+ var left = vec3.create([-1, 0, 0]);
+ quat4.multiplyVec3(this.quat, forward);
+ quat4.multiplyVec3(this.quat, left);
+
+ vec3.scale(forward, 180*dt, forward);
+ vec3.scale(left, 100*dt, left);
+
+ if((isDown('LEFT') || isDown('a')) && isMouseDown()) {
+ vec3.add(this.pos, left);
+ moved = true;
+ }
+
+ if((isDown('RIGHT') || isDown('d')) && isMouseDown()) {
+ vec3.subtract(this.pos, left);
+ moved = true;
+ }
+
+ if(isDown('UP') || isDown('w')) {
+ vec3.add(this.pos, forward);
+ moved = true;
+ }
+
+ if(isDown('DOWN') || isDown('s')) {
+ vec3.subtract(this.pos, forward);
+ moved = true;
+ }
+
+ var x = this.pos[0];
+ var y = this.pos[1];
+ var z = this.pos[2];
+ //this.pos[1] = Terrain.getHeight(x, z, true) + 20.0;
+ mat4.translate(this.transform, [-this.pos[0], -this.pos[1], -this.pos[2]]);
+
+ this._dirtyWorld = moved;
+ this.worldTransform = this.transform;
+ },
+
+ updateMatrices: function() {
+ },
+
+ render: function() {
+ }
+});
@@ -0,0 +1,181 @@
+
+sh.CubeMesh = sh.Obj.extend({
+ create: function() {
+ this.vertexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
+
+ var vertices = [
+ // front
+ 0, 0, 0,
+ 1, 0, 0,
+ 1, 1, 0,
+ 0, 1, 0,
+
+ // left
+ 1, 0, 0,
+ 1, 0, 1,
+ 1, 1, 1,
+ 1, 1, 0,
+
+ // right
+ 0, 0, 1,
+ 0, 0, 0,
+ 0, 1, 0,
+ 0, 1, 1,
+
+ // back
+ 1, 0, 1,
+ 0, 0, 1,
+ 0, 1, 1,
+ 1, 1, 1,
+
+ // top
+ 0, 1, 0,
+ 1, 1, 0,
+ 1, 1, 1,
+ 0, 1, 1,
+
+ // bottom
+ 0, 0, 1,
+ 1, 0, 1,
+ 1, 0, 0,
+ 0, 0, 0
+ ];
+
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+
+ // Normals
+
+ this.normalBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, this.normalBuffer);
+
+ var normals = [
+ // front
+ 0, 0, -1,
+ 0, 0, -1,
+ 0, 0, -1,
+ 0, 0, -1,
+
+ // left
+ 1, 0, 0,
+ 1, 0, 0,
+ 1, 0, 0,
+ 1, 0, 0,
+
+ // right
+ -1, 0, 0,
+ -1, 0, 0,
+ -1, 0, 0,
+ -1, 0, 0,
+
+ // back
+ 0, 0, 1,
+ 0, 0, 1,
+ 0, 0, 1,
+ 0, 0, 1,
+
+ // top
+ 0, 1, 0,
+ 0, 1, 0,
+ 0, 1, 0,
+ 0, 1, 0,
+
+ // bottom
+ 0, -1, 0,
+ 0, -1, 0,
+ 0, -1, 0,
+ 0, -1, 0
+ ];
+
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(normals), gl.STATIC_DRAW);
+
+ // Indices
+
+ this.indexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
+
+ // 6 sides, 2 triangles each, 3 vertices each tri
+ var indices = new Uint16Array(6*2*3);
+ var idx = 0;
+
+ for(var i=0; i<vertices.length; i+=4) {
+ indices[idx++] = i;
+ indices[idx++] = i+2;
+ indices[idx++] = i+1;
+
+ indices[idx++] = i;
+ indices[idx++] = i+3;
+ indices[idx++] = i+2;
+ }
+
+ gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, indices, gl.STATIC_DRAW);
+
+ // Wireframe
+
+ this.wireIndexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.wireIndexBuffer);
+
+ var wireIndices = new Uint16Array(6*8);
+ idx = 0;
+
+ for(var i=0; i<vertices.length; i+=4) {
+ wireIndices[idx++] = i;
+ wireIndices[idx++] = i+1;
+
+ wireIndices[idx++] = i+1;
+ wireIndices[idx++] = i+2;
+
+ wireIndices[idx++] = i+2;
+ wireIndices[idx++] = i+3;
+
+ wireIndices[idx++] = i+3;
+ wireIndices[idx++] = i;
+ }
+
+ gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, wireIndices, gl.STATIC_DRAW);
+ },
+
+ render: function(program, wireframe) {
+ renderer.bindAndEnableBuffer(program, this.vertexBuffer, 'a_position');
+ renderer.bindAndEnableBuffer(program, this.normalBuffer, 'a_normal');
+
+ if(wireframe) {
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.wireIndexBuffer);
+ gl.drawElements(gl.LINES, 6*8, gl.UNSIGNED_SHORT, 0);
+ }
+ else {
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
+ gl.drawElements(gl.TRIANGLES, 6*2*3, gl.UNSIGNED_SHORT, 0);
+ }
+ }
+});
+
+sh.Cube = sh.SceneNode.extend({
+ init: function(pos, rot, scale, opts) {
+ this.parent(pos, rot, scale);
+ this.wireframe = opts && opts.wireframe;
+
+ if(opts && opts.centered) {
+ this.preMatrix = mat4.create();
+ mat4.identity(this.preMatrix);
+ mat4.translate(this.preMatrix, [-.5, -.5, -.5]);
+ }
+ },
+
+ setMaterial: function(program) {
+ if(!sh.Cube.mesh) {
+ sh.Cube.mesh = new sh.CubeMesh();
+ sh.Cube.mesh.create();
+ }
+
+ this.parent(program);
+ },
+
+ render: function() {
+ sh.Cube.mesh.render(this.program, this.wireframe);
+
+ // if(normalLocation != -1) {
+ // gl.disableVertexAttribArray(normalLocation);
+ // }
+ }
+});
Oops, something went wrong.

0 comments on commit 01a45af

Please sign in to comment.