Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Infinite 3D Runner.
ID	6002211038248960
Created	5 years ago, 1598220014215
Updated	5 years ago, 1602003933033
Code	/ *********** 3D Engine ************* * Hey everyone, I have been researching 3D topics and I have come out with my first rasterizer. * I want to make a tutorial on 3D topics sometime, but I may never get to it. * Once you get into 3D, there are so many different possibilities & techniques you can use to make a rasterizer. While I don't have all that time to make a perfect one, I did enjoy making a decently functional ones. * I really like learning new topics and then teaching others what I have learned, but my time to start coding off KA is getting closer, so we'll see if I have much left to do on KA. * * Happy coding all! :-) * * Press SPACE to jump, and use the ARROW KEYS to move around. / // Protects the 'new' operator from leaking information and slowly decreasing the frame rate var protect = function() { // `applyInstance` function replacement, all credit goes to Phantom Falcon (ProlightHub) // Feel free to copy this around AS LONG AS YOU KEEP THIS COMMENT AND MY CREDIT this[["PJSCodeInjector"]].applyInstance = function(o) { return function() { var object = this.Object.create(o.prototype); o.apply(object, arguments); return object; }; }; this[["KAInfiniteLoopSetTimeout"]](Infinity); }; protect(); var player, floorY; /************* 3D Engine **************/ // { // Vector-Matrix library { // returns the dot product of two 3D vectors: an integer var dot = function(vec1, vec2) { return vec1.x vec2.x + vec1.y * vec2.y + vec1.z * vec2.z; }; // returns the cross product of two 3D vectors: a vector var cross = function(vec1, vec2) { return {x : vec1.y * vec2.z - vec1.z * vec2.y, y : vec1.z * vec2.x - vec1.x * vec2.z, z : vec1.x * vec2.y - vec1.y * vec2.x}; }; // returns the sum of two vectors: a vector var add = function(vec1, vec2) { return {x : vec1.x + vec2.x, y : vec1.y + vec2.y, z : vec1.z + vec2.z}; }; // returns the difference of two vectors (vec1 - vec2): a vector var sub = function(vec1, vec2) { return {x : vec1.x - vec2.x, y : vec1.y - vec2.y, z : vec1.z - vec2.z}; }; // normalizes a vector: a vector var normalize = function(vec) { var m = mag(vec.x, vec.y, vec.z); return {x : vec.x / m, y : vec.y / m, z : vec.z / m}; }; // scales a vector: a vector var scaleV = function(vec, k) { return {x : vec.x * k, y : vec.y * k, z : vec.z * k}; }; // returns a vector multipled by a matrix where "w" is the fourth paramter of the vector var MatrixMultVector = function(vec, mat, w) { return { x : vec.x * mat[0][0] + vec.y * mat[1][0] + vec.z * mat[2][0] + w * mat[3][0], y : vec.x * mat[0][1] + vec.y * mat[1][1] + vec.z * mat[2][1] + w * mat[3][1], z : vec.x * mat[0][2] + vec.y * mat[1][2] + vec.z * mat[2][2] + w * mat[3][2], w : vec.x * mat[0][3] + vec.y * mat[1][3] + vec.z * mat[2][3] + w * mat[3][3] }; }; // uses short cuts to calculate the quick inverse of a matrix var quickInverse = function(m) { var matrix = [ [m[0][0], m[1][0], m[2][0], 0.0], [m[0][1], m[1][1], m[2][1], 0.0], [m[0][2], m[1][2], m[2][2], 0.0], [ -(m[3][0] * m[0][0] + m[3][1] * m[0][1] + m[3][2] * m[0][2]), -(m[3][0] * m[1][0] + m[3][1] * m[1][1] + m[3][2] * m[1][2]), -(m[3][0] * m[2][0] + m[3][1] * m[2][1] + m[3][2] * m[2][2]), 1.0 ] ]; return matrix; }; //} // Interactivity { var input = []; keyPressed = function() { input[key.toString()] = !0; input[keyCode] = !0; }; keyReleased = function() { input[key.toString()] = !1; input[keyCode] = !1; }; //} // Transformation engine { / Storing transformations / var translations = []; var rotations = []; var scalations = []; var matrices = []; / ADDING & REMOVING transformations / var PushMatrix3D = function() { matrices.push([translations.length, rotations.length, scalations.length]); }; var Scale3D = function(x, y, z) { if(y === undefined) { y = x; z = x; } scalations.push([x, y, z]); }; var Translate3D = function(x, y, z) { translations.push([x, y, z]); }; var Rotate3D = function(xTheta, yTheta, zTheta) { rotations.push([xTheta, yTheta, zTheta]); }; var PopMatrix3D = function() { var m = matrices[matrices.length - 1]; if(translations.length > m[0]) { translations.splice(m[0], m.length - m[0]); } if(rotations.length > m[1]) { rotations.splice(m[1], m.length - m[1]); } if(scalations.length > m[2]) { scalations.splice(m[2], m.length - m[2]); } }; / Performing transformations / // 3D transformation: scale a vector; returns a new vector var scaleOperation = function(vec, scaleX, scaleY, scaleZ) { return {x : vec.x * scaleX, y : vec.y * scaleY, z : vec.z * scaleZ}; }; // 3D transformation: rotate a vector around the x axis; returns a new vector var rotateOperationX3D = function(vec, theta) { return {x : vec.x, y : vec.y * cos(theta) - vec.z * sin(theta), z : vec.y * sin(theta) + vec.z * cos(theta)}; }; // 3D transformation: rotate a vector around the y axis; returns a new vector var rotateOperationY3D = function(vec, theta) { return {x : vec.x * cos(theta) - vec.z * sin(theta),y : vec.y, z : vec.x * sin(theta) + vec.z * cos(theta)}; }; // 3D transformation: rotate a vector around the z axis; returns a new vector var rotateOperationZ3D = function(vec, theta) { return {x : vec.x * cos(theta) - vec.y * sin(theta), y : vec.x * sin(theta) + vec.y * cos(theta), z : vec.z}; }; //} // Color & Lighting { var currentFill = color(255, 255, 255); var fill3D = function(c1, c2, c3) { currentFill = color(c1, c2, c3); }; var LIGHT = normalize({x : 0.5, y : 0.5, z : 1}); var shade = color(50, 50, 50); //} // Camera & Perspective ratios { var screenWidth = width, screenHeight = height; // aspect ratio var aspectRatio = screenHeight / screenWidth; // angle of field of view var aFov = 90; // field of view calculated var F = 1 / tan(aFov / 2); // depth of view var zFar = 1000, zNear = 0.1; // simplifying scaling zed var q = zFar / (zFar - zNear); // camera is a vector matrix of position <x, y, z> var Camera = { x : 0, y : 0, z : 0 }; // which direction is the camera looking? var camLook = { x : 0, y : 0, z : 1 }; // rotating the camera var Yaw = 0; // speed of moving var Speed = 3; // axis vectors var vUp = {x : 0, y : 1, z : 0}, vTarget = {x : 0, y : 0, z : 1}; var matProj = [ [aspectRatio * F, 0, 0, 0], [0, F, 0, 0], [0, 0, q, 1], [0, 0, -zNear * q, 0] ]; var matView, updateCamera = function() { Camera.x = player.x; Camera.y = player.y - floorY; // the target vector the cam is looking at vTarget = add(Camera, camLook); // Calculate new forward direction var newForward = sub(vTarget, Camera); newForward = normalize(newForward); // Calculate new Up direction var a = scaleV(newForward, dot(vUp, newForward)); var newUp = sub(vUp, a); newUp = normalize(newUp); // New Right direction is easy, its just cross product var newRight = cross(newUp, newForward); /if (input[UP]) { Camera.y -= 5; } else if (input[DOWN]) { Camera.y += 5; }/ // horizontal vector var moveRight = scaleV(normalize(newRight), Speed); /if (input[LEFT]) { Camera = sub(Camera, moveRight); } else if (input[RIGHT]) { Camera = add(Camera, moveRight); }/ var Forward = scaleV(camLook, Speed); // ROTATING CAMERA VIEW POINT /if (input.a) { Yaw -= 3; } else if (input.d) { Yaw += 3; }/ /if (input.w) { Camera = add(Camera, Forward); } else if (input.s) { Camera = sub(Camera, Forward); }/ // the up axis (y-axis) vUp = {x : 0, y : 1, z : 0}; vTarget = {x : 0, y : 0, z : 1}; var matCameraRot = rotateOperationY3D(vTarget, Yaw); camLook = matCameraRot; LIGHT = normalize(camLook); // Construct Dimensioning and Translation Matrix var pointAt = [ [newRight.x, newRight.y, newRight.z, 0], [newUp.x, newUp.y, newUp.z, 0], [newForward.x, newForward.y, newForward.z, 0], [Camera.x, Camera.y, Camera.z, 1] ]; matView = quickInverse(pointAt); }; //} // Clipping algorithms { var Vector_IntersectPlane = function(plane_p, plane_n, lineStart, lineEnd) { plane_n = normalize(plane_n); var plane_d = -dot(plane_n, plane_p); var ad = dot(lineStart, plane_n); var bd = dot(lineEnd, plane_n); var t = (-plane_d - ad) / (bd - ad); var lineStartToEnd = sub(lineEnd, lineStart); var lineToIntersect = scaleV(lineStartToEnd, t); return add(lineStart, lineToIntersect); }; var Triangle_ClipAgainstPlane = function(plane_p, plane_n, in_tri, out_tris) { // Make sure plane normal is indeed normal plane_n = normalize(plane_n); // Calculates signed distance to play (-) OR (+) var _dist = function(p) { plane_p = normalize(plane_p); return dot(sub(p, plane_p), plane_n) / mag(plane_n.x, plane_n.y, plane_n.z); }; // Separating inside & outside points var inside_points = [], outside_points = []; // Get signed distance of each point in triangle to plane var d0 = _dist(in_tri[0]), d1 = _dist(in_tri[1]), d2 = _dist(in_tri[2]); if (d0 >= 0) { inside_points[inside_points.length] = in_tri[0]; } else { outside_points[outside_points.length] = in_tri[0]; } if (d1 >= 0) { inside_points[inside_points.length] = in_tri[1]; } else { outside_points[outside_points.length] = in_tri[1]; } if (d2 >= 0) { inside_points[inside_points.length] = in_tri[2]; } else { outside_points[outside_points.length] = in_tri[2]; } if (inside_points.length === 0) { } else if (inside_points.length === 3) { out_tris.push(in_tri); } else if (inside_points.length === 1 && outside_points.length === 2) { var out_tri1 = [ inside_points[0], Vector_IntersectPlane(plane_p, plane_n, inside_points[0], outside_points[0]), Vector_IntersectPlane(plane_p, plane_n, inside_points[0], outside_points[1]) ]; out_tris.push(out_tri1); } else if (inside_points.length === 2 && outside_points.length === 1) { var out_tri1 = [ inside_points[0], inside_points[1], Vector_IntersectPlane(plane_p, plane_n, inside_points[0], outside_points[0]) ], out_tri2 = [ Vector_IntersectPlane(plane_p, plane_n, inside_points[1], outside_points[0]), out_tri1[2], inside_points[1] ]; out_tris.push(out_tri1); out_tris.push(out_tri2); } }; //} // Triangle algorithms: from world space to screen space { var transformTri = function(tri) { var newTri = tri.slice(0); // SCALING / DILATING for (var i = 0; i < scalations.length; i++) { var cScale = scalations[i]; newTri[0] = scaleOperation(newTri[0], cScale[0], cScale[1], cScale[2]); newTri[1] = scaleOperation(newTri[0], cScale[0], cScale[1], cScale[2]); newTri[2] = scaleOperation(newTri[0], cScale[0], cScale[1], cScale[2]); } // ROTATING: we break up the 3D rotation into 3 steps; around the x-axis, then y, then z. This way the math is much simpler. for (var i = 0; i < rotations.length; i++) { var r = rotations[i]; newTri[0] = rotateOperationX3D(newTri[0], r[0]); newTri[0] = rotateOperationY3D(newTri[0], r[1]); newTri[0] = rotateOperationZ3D(newTri[0], r[2]); newTri[1] = rotateOperationX3D(newTri[1], r[0]); newTri[1] = rotateOperationY3D(newTri[1], r[1]); newTri[1] = rotateOperationZ3D(newTri[1], r[2]); newTri[2] = rotateOperationX3D(newTri[2], r[0]); newTri[2] = rotateOperationY3D(newTri[2], r[1]); newTri[2] = rotateOperationZ3D(newTri[2], r[2]); } // TRANSLATING: after rotating & scaling for (var i = 0; i < translations.length; i++) { newTri[0].x += translations[i][0]; newTri[0].y += translations[i][1]; newTri[0].z += translations[i][2]; newTri[1].x += translations[i][0]; newTri[1].y += translations[i][1]; newTri[1].z += translations[i][2]; newTri[2].x += translations[i][0]; newTri[2].y += translations[i][1]; newTri[2].z += translations[i][2]; } return newTri; }; var lookAtTri = function(tri) { var newTri = tri.slice(0); newTri[0] = MatrixMultVector(newTri[0], matView, 1); newTri[1] = MatrixMultVector(newTri[1], matView, 1); newTri[2] = MatrixMultVector(newTri[2], matView, 1); return newTri; }; var projectTri = function(tri) { var newTri = tri.slice(0); for (var i = 0; i < newTri.length; i++) { // get the projection by multiplying matrices newTri[i] = MatrixMultVector(newTri[i], matProj, 1); if (newTri[i].w !== 0) { newTri[i].x /= newTri[i].w; newTri[i].y /= newTri[i].w; newTri[i].z /= newTri[i].w; } // right now values are -1 to 1. Add 1 to get them to 0 to 2. newTri[i].x += 1; newTri[i].y += 1; // then we can normalize it (divide by to) to get between 0 & 1, and then multiply by the screen size to get the real vector! newTri[i].x = 0.5 screenWidth; newTri[i].y = 0.5 screenHeight; } return newTri; }; var normalTri = function(tri) { var newTri = tri.slice(0); // origin of the triangle (I'm defining as the first node) var origin = { x: newTri[0].x, y: newTri[0].y, z: newTri[0].z }, // the other two nodes are A & B, and I'm defining them WITH RESPECT to the origin vector A = sub({x: newTri[1].x, y: newTri[1].y, z: newTri[1].z}, origin), B = sub({x:newTri[2].x, y: newTri[2].y, z: newTri[2].z}, origin); // then I cross them to get a normal vector var N = normalize(cross(A, B)); // return normalized normal vector return N; }; var clipTri = function(tri) { // our Que of triangles to clip var Q = tri.slice(0); // new list of triangles after clipping from one plane boundary var newTris = []; // clip triangle against plane var clipped = []; Triangle_ClipAgainstPlane( // point on plane (def. 1 part 1) {x: 0.0, y: 0.0, z: zNear}, // normal to plane (def. 1 part 2) {x: 0.0, y: 0.0, z: 1.0}, // triangle we are clipping Q, // array to add clipped triangles clipped ); // We may end up with multiple triangles form the clip, so project as required for (var n = 0; n < clipped.length; n++) { var newTri = clipped[n]; newTris.push(newTri); } return newTris; }; //} // Creates a 3D shape from triangles { var Shape = function(tris) { this.tris = tris \|\| []; this.color = currentFill \|\| color(255, 0, 0); }; Shape.prototype.display = function() { strokeWeight(1); // FOR EACH triangle for (var i = 0; i < this.tris.length; i++) { // Transform tris into world space var triTransformed = transformTri(this.tris[i]); var normal = normalTri(triTransformed); // Get Ray from triangle to camera var cameraRay = sub(triTransformed[0], Camera); if (dot(normal, cameraRay) > 0) { // Convert World Space --> View Space var triViewed = lookAtTri(triTransformed); // Clip Triangle against plane(s); returns 0 or more triangles var trisClipped = clipTri(triViewed); for (var j = 0; j < trisClipped.length; j++) { var clippedTri = trisClipped[j]; // Project triangles from 3D --> 2D var triProjected = projectTri(clippedTri); // Final 3 Nodes var n1 = triProjected[0], n2 = triProjected[1], n3 = triProjected[2]; // Our perception of the object var ill = max(0.5, dot(LIGHT, normal)); noStroke(); fill(lerpColor(shade, this.color, ill)); stroke(lerpColor(shade, this.color, ill)); triangle(n1.x, n1.y, n2.x, n2.y, n3.x, n3.y); } } } }; //} //} /*************** 3D Shape Creations **************/ // { // creates a triangle in array-object notation var Tri = function(x1, y1, z1, x2, y2, z2, x3, y3, z3) { return [{x: x1, y: y1, z: z1}, {x: x2, y: y2, z: z2}, {x: x3, y: y3, z: z3}]; }; // Creating 3D objects - simple shapes { var RectangularPrism = function(x, y, z, width, height, depth) { this.shape = new Shape([ Tri(x, y + height, z, x, y, z, x + width, y, z), Tri(x + width, y, z, x + width, y + height, z, x, y + height, z), Tri(x + width, y + height, z, x + width, y, z, x + width, y, z + depth), Tri(x + width, y, z + depth, x + width, y + height, z + depth, x + width, y + height, z), Tri(x + width, y + height, z + depth, x + width, y, z + depth, x, y, z + depth), Tri(x, y, z + depth, x, y + height, z + depth, x + width, y + height, z + depth), Tri(x, y + height, z + depth, x, y, z + depth, x, y, z), Tri(x, y, z, x, y + height, z, x, y + height, z + depth), Tri(x, y, z, x, y, z + depth, x + width, y, z + depth), Tri(x + width, y, z + depth, x + width, y, z, x, y, z), Tri(x, y + height, z + depth, x, y + height, z, x + width, y + height, z), Tri(x + width, y + height, z, x + width, y + height, z + depth, x, y + height, z + depth), ]).display(); }; var TriangularPrism = function(x, y, z, width, height, depth) { this.shape = new Shape([ Tri(x, y + height, z, x + width/2, y, z + depth/2, x + width, y + height, z), Tri(x + width, y + height, z + depth, x + width/2, y, z + depth/2, x, y + height, z + depth), Tri(x, y + height, z + depth, x + width/2, y, z + depth/2, x, y + height, z), Tri(x + width, y + height, z, x + width/2, y, z + depth/2, x + width, y + height, z + depth), Tri(x, y + height, z, x + width, y + height, z, x + width, y + height, z + depth), Tri(x + width, y + height, z + depth, x, y + height, z + depth, x, y + height, z) ]).display(); }; var Tetrahedron = function(x, y, z, width, height, depth) { this.shape = new Shape([ Tri(x, y + height, z + depth, x + width/2, y, z + depth/2, x + width/2, y + height, z), Tri(x + width, y + height, z + depth, x + width/2, y, z + depth/2, x, y + height, z + depth), Tri(x + width/2, y + height, z, x + width/2, y, z + depth/2, x + width, y + height, z + depth), Tri(x, y + height, z + depth, x + width/2, y + height, z, x + width, y + height, z + depth), ]).display(); }; var Torus = function(x, y, z, width, height, depth, thickness) { width = width/2; height = height/2; var detail = 30; var tris = []; for (var i = 0; i < 360; i += detail) { // 1 RING OF COORDINATES (OUTER - z) var x0 = x + cos(i) width, y0 = y + sin(i) * height, z0 = z; // 2 RING OF CORDINATES (OUTER - z) var x1 = x + cos((i + detail) % 360) * width, y1 = y + sin((i + detail) % 360) * height, z1 = z; // 1 RING OF COORDINATES (OUTER - z + depth) var x2 = x + cos(i) * width, y2 = y + sin(i) * height, z2 = z + depth; // 2 RING OF CORDINATES (OUTER - z + depth) var x3 = x + cos((i + detail) % 360) * width, y3 = y + sin((i + detail) % 360) * height, z3 = z + depth; // 1 RING OF COORDINATES (INNER - z) var x4 = x + cos(i) * (width - thickness), y4 = y + sin(i) * (height - thickness), z4 = z; // 2 RING OF CORDINATES (INNER - z) var x5 = x + cos((i + detail) % 360) * (width - thickness), y5 = y + sin((i + detail) % 360) * (height - thickness), z5 = z; // 1 RING OF COORDINATES (INNER - z + depth) var x6 = x + cos(i) * (width - thickness), y6 = y + sin(i) * (height - thickness), z6 = z + depth; // 2 RING OF CORDINATES (INNER - z + depth) var x7 = x + cos((i + detail) % 360) * (width - thickness), y7 = y + sin((i + detail) % 360) * (height - thickness), z7 = z + depth; // OUTER TRIS tris.push(Tri(x0, y0, z0, x2, y2, z2, x3, y3, z3)); tris.push(Tri(x3, y3, z3, x1, y1, z1, x0, y0, z0)); // INNER TRIS tris.push(Tri(x7, y7, z7, x6, y6, z6, x4, y4, z4)); tris.push(Tri(x4, y4, z4, x5, y5, z5, x7, y7, z7)); // FRONT SIDE TRIS tris.push(Tri(x4, y4, z4, x0, y0, z0, x1, y1, z1)); tris.push(Tri(x1, y1, z1, x5, y5, z5, x4, y4, z4)); // BACK SIDE TRIS tris.push(Tri(x3, y3, z3, x2, y2, z2, x6, y6, z6)); tris.push(Tri(x6, y6, z6, x7, y7, z7, x3, y3, z3)); } this.shape = new Shape(tris).display(); }; //} //} /*************** GAME LOGIC **************/ // { var gameState = "wait"; var timer = 0, sCount = 0, score = 0; // checks if two cube boundaries are colliding with eachother var boxCollide = function(b1, b2) { return ( b1.x + b1.width > b2.x && b1.x < b2.x + b2.width && b1.y + b1.height > b2.y && b1.y < b2.y + b2.height && b1.z + b1.depth > b2.z && b1.z < b2.z + b2.depth ); }; // calculate the distance between two points (x1, y1, z1) & (x2, y2, z2) var dist3D = function(x1, y1, z1, x2, y2, z2) { return sq((x2 - x1) (x2 - x1) + (y2 - y1) * (y2 - y1) + (z2 - z1) * (z2 - z1)); }; // noop; no-operation var noop = function() {}; // Level Logic { //////// Common Layers //////// /var bitEarth = [ "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################", "####################" ], bitHole = [ "####################", "####################", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "### ###", "####################", "####################" ]; var Levels = { "Level 1" : { bitmap : [ bitEarth, bitEarth, bitHole, bitHole ], } }; var bitmap = [];/ //} var Animation = (function() { var Animation = function(type, x, y) { this.type = type \|\| "success"; this.x = x; this.y = y; this.done = false; this.stop = 0; this.opaque = 0; }; Animation.prototype.run = function() { switch (this.type) { case 'success': noFill(); stroke(14, 176, 33, 255 - (this.opaque += 3)); strokeWeight(15); arc(this.x, this.y, 250, 250, 0, this.stop += (360 - this.stop) / 10); if (this.opaque > 255) { this.done = true; } } }; return Animation; })(); var animations = []; var objects = []; var speed = 10; // Player { player = { x : 0, y : 0, z : 0, width : 25, height : 25, depth : 25 }; var Player = (function() { //////// Player Constructor Function //////// var Player = function(config) { //////// Player Attributes //////// this.oType = "player"; this.x = config.x; this.y = config.y; this.z = config.z; this.width = config.width \|\| player.width; this.height = config.height \|\| player.height; this.depth = config.depth \|\| player.depth; this.xVel = 0; this.yVel = 0; this.zVel = 0; this.xAcc = 0; this.yAcc = 0; this.zAcc = 0; }; //////// Player Methods //////// Player.prototype = { display: function() { var t = this; fill3D(0, 0, 200); RectangularPrism(t.x, t.y, t.z, t.width, t.height, t.depth); }, moveX: function() { if (input[LEFT] && this.xVel > -5) { this.xAcc = -1; } else if (input[RIGHT] && this.xVel < 5) { this.xAcc = 1; } else if (abs(this.xVel) > 0.1) { this.xAcc = (this.xVel > 0) ? -0.1 : 0.1; } else { this.xAcc = 0; this.xVel = 0; } this.xVel += this.xAcc; this.x += this.xVel; if (this.x < -300 \|\| this.x > 300) { this.xVel = 0; this.xAcc = 0; this.x = (this.x < -200) ? -300 : 300; } }, moveY: function() { if (input[32] && abs(this.yVel) < 0.1 && abs(this.yAcc) < 0.1) { this.yVel = -15; } else { this.yAcc = 0.5; } this.yVel += this.yAcc; this.y += this.yVel; }, moveZ: function() { if (input[DOWN] && this.zVel > -3) { this.zAcc = -0.5; } else if (input[UP] && this.xVel < 3) { this.zAcc = 0.5; } else if (abs(this.zVel) > 0.1) { this.zAcc = (this.zVel > 0) ? -0.1 : 0.1; } else { this.zAcc = 0; this.zVel = 0; } this.zVel += this.zAcc; this.z += this.zVel; if (this.z < 200 \|\| this.z > 300) { this.zVel = 0; this.zAcc = 0; this.z = (this.z < 200) ? 200 : 300; } }, exec: function() { if (gameState === "play") { // upate players position in 3 steps (1 for each dimension) this.moveY(); for (var i in objects) { if (objects[i].oType === "block" && boxCollide(objects[i], this)) { objects[i].collideY(this); } } this.moveX(); for (var i in objects) { if (objects[i].oType === "block" && boxCollide(objects[i], this)) { objects[i].collideX(this); } } this.moveZ(); for (var i in objects) { if (objects[i].oType === "block" && boxCollide(objects[i], this)) { objects[i].collideZ(this); } } // display player this.display(); player.x = this.x; player.y = this.y; player.z = this.z; } } }; return Player; })(); //} // Blocks { var Block = (function() { var Block = function(config) { //////// Block Attributes //////// this.oType = "block"; this.x = config.x; this.y = config.y; this.z = config.z; this.width = config.width \|\| 25; this.height = config.height \|\| 25; this.depth = config.depth \|\| 25; this.speed = speed; this.type = config.type; this.color = config.color; this.moving = "left"; }; //////// Block Methods //////// Block.prototype = { //////// Method; Display objects //////// display: function() { var t = this; fill3D(this.color.r, this.color.g, this.color.b); RectangularPrism(t.x, t.y, t.z, t.width, t.height, t.depth); }, /////// Methods; collideX, collideY, & collideZ /////// collideX: function(object) { if (boxCollide(object, this)) { gameState = "lost"; } }, collideY: function(object) { if (boxCollide(object, this) && object.z + object.depth > this.z + this.speed * 1.1) { object.yVel = 0; object.yAcc = 0; object.y = this.y - object.height; } }, collideZ: function(object) { if (boxCollide(object, this)) { gameState = "lost"; } }, //////// Method; Move objects //////// move: function() { this.z -= this.speed; if (this.type === "swervy") { if (this.moving === "left") { this.x += (-300 - this.x)/25; if (this.x < -250) { this.moving = "right"; } } else if (this.moving === "right") { this.x += (300 - this.x)/25; if (this.x > 250) { this.moving = "left"; } } } }, //////// Execute All Block Methods //////// exec: function() { // update objects position if (this.type !== "stationary") { this.move(); } // then display them at their current position this.display(); } }; // Return Block Constructor function return Block; })(); //} // Spike { var Spike = (function() { var Spike = function(config) { //////// Block Attributes //////// this.oType = "spike"; this.x = config.x; this.y = config.y; this.z = config.z; this.width = config.width \|\| 25; this.height = config.height \|\| 25; this.depth = config.depth \|\| 25; this.speed = speed; this.type = config.type; this.color = {r : 100, g : 100, b : 100}; }; //////// Block Methods //////// Spike.prototype = { //////// Method; Display objects //////// display: function() { var t = this; fill3D(this.color.r, this.color.g, this.color.b); TriangularPrism(t.x, t.y, t.z, t.width, t.height, t.depth); }, collide: function(object) { if (boxCollide(object, this)) { gameState = "lost"; } }, //////// Method; Move objects //////// move: function() { this.z -= this.speed; }, //////// Execute All Block Methods //////// exec: function() { // update objects position this.move(); // collide with player this.collide(player); // then display them at their current position this.display(); } }; // Return Spike Constructor function return Spike; })(); //} // Rings { var Ring = (function() { var Ring = function(config) { //////// Block Attributes //////// this.oType = "ring"; this.x = config.x; this.y = config.y; this.z = config.z; this.width = config.width \|\| 200; this.height = config.height \|\| 200; this.depth = config.depth \|\| 25; this.speed = config.speed \|\| 5; this.scored = false; }; //////// Block Methods //////// Ring.prototype = { //////// Method; Display objects //////// display: function() { var t = this; //fill(255, 217, 0); fill3D(255, 217, 0); Torus(this.x + this.width/2, this.y + this.height/2, this.z, this.width, this.height, this.depth, 20); }, collide: function(object) { if (boxCollide(object, this) && !this.scored && dist(this.x + this.width/2, this.y + this.height/2, object.x + object.width/2, object.y + object.height/2) < this.width/2) { score += 1000; animations.push(new Animation("success", 300, 300)); this.scored = true; } }, //////// Method; Move objects //////// move: function() { this.z -= this.speed; }, //////// Execute All Block Methods //////// exec: function() { // update objects position this.move(); // collide with player this.collide(player); // then display them at their current position this.display(); } }; // Return Ring Constructor function return Ring; })(); //} floorY = 100; //////// Settupg up Game //////// objects.push(new Block({ x : -500, y : floorY, z : 100, width: 1000, height: 200, depth: 2000, type: "stationary", oType: "block", color: {r : 255, g : 255, b : 255} })); objects.push(new Player({ x : 0, y : 0, z : 250, type: "player", oType: "player" })); var whateverY = 0; //} draw = function() { background(78, 174, 201); updateCamera(); if (timer++ > 300/speed) { timer = 0; sCount++; if (sCount > 10) { var answer = floor(random(0, 3)); if (answer === 0) { for (var i = -350; i < 350; i += 50) { objects.push(new Spike({ x : i, y : floorY - 50, z : 2000, height : 50, width: 50, color: {r : 100, g : 100, b : 100} })); } } else if (answer === 1) { var y = -150; objects.push(new Block({ x : floor(random(-300, 300)), y : y, z : 2000, height : floorY - y, width: floor(random(25, 100)), color: {r : 255, g : 0, b : 0}, type: "swervy" })); } else if (answer === 2) { } sCount = 0; } else { var y = floor(random(0, -50)); objects.push(new Block({ x : floor(random(-300, 300)), y : y, z : 2000, height : floorY - y, width: floor(random(25, 100)), color: {r : random(0, 255), g : random(0, 255), b : random(0, 255)} })); if (frameCount % 10 === 0) { objects.push(new Ring({ x : floor(random(-200, 200)), y : floor(random(-75, -150)), z : 2000 })); } } } // sort objects by z-coordinate objects = objects.sort(function(a, b) { return (a.z + a.depth) - (b.z + b.depth); }); // iterate through objects starting with the last one for (var i = objects.length - 1; i >= 0; i--) { objects[i].exec(); if (objects[i].z < 0) { objects.splice(i, 1); } } if (gameState === "wait") { cursor('auto'); score = 0; noStroke(); fill(255, 255, 255, 100); rect(50, 50, 500, 500); fill(0, 0, 0); pushMatrix(); translate(195, 0); triangle(200, 200, 300, 300, 200, 300); quad(225, 300, 270, 300, 285, 345, 245, 345); popMatrix(); fill(0, 0, 0); textSize(75); text("Click to Play", 88, 150); textSize(30); text("Cause its the right thing to do.\n - Iron Programming", 100, 200, 300, 400); for (var i = 0; i < 9; i++) { pushMatrix(); var message = "Clicky"; translate(100 + i * 50, 450 + sin(frameCount * i * 2) * 30); rotate(frameCount); text(message, -message.length * 5, 0); popMatrix(); } } else if (gameState === "lost") { player.z = Infinity; cursor('auto'); pushMatrix(); translate(0, -600 + (whateverY += (600 - whateverY)/10)); noStroke(); fill(255, 255, 255, 100); rect(50, 50, 500, 500); fill(0, 0, 0); pushMatrix(); translate(195, 0); triangle(200, 200, 300, 300, 200, 300); quad(225, 300, 270, 300, 285, 345, 245, 345); popMatrix(); fill(0, 0, 0); textSize(75); text("You Lost???", 88, 150); textSize(30); text("Click to play again...\nOr else...\n\nYou Scored: " + score, 100, 200, 300, 400); for (var i = 0; i < 9; i++) { pushMatrix(); var message = "Clicky"; translate(100 + i * 50, 450 + sin(frameCount * i * 2) * 30); rotate(frameCount); text(message, -message.length * 5, 0); popMatrix(); } popMatrix(); } else { cursor('none'); score++; speed += 0.005; speed = min(100, speed); fill(0, 0, 0); textSize(30); text("Score: " + score, 500 - score.toString().length * 30/1.5, 40); for (var i = animations.length - 1; i >= 0; i--) { animations[i].run(); if (animations[i].done) { animations.splice(i, 1); } } } }; // Clicky or else mouseClicked = function() { // WAIT what you LOST? PLAY again! I'm so ashamed of you... if (gameState === "wait" \|\| gameState === "lost") { gameState = "play"; whateverY = 0; score = 0; speed = 10; for (var i = objects.length - 1; i --> -1;) { if (objects[i].oType !== "player" && objects[i].type !== "stationary") { objects.splice(i, 1); } } } }; // be good ya'll
Folds	13,26,32,542,545,657,660,1108,1115,1167,1174,1180,1182,1208,1209,1238,1260,1273
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgLXGqt_UCgw
Votes	253
Spin-Offs	18
Type	PJS
Width	600
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Iron Programming
Author Name	ncochran2
Author ID	kaid_1167371439589851086940548
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739452261061
Updated	8 months ago, 1744845499201
Source Deleted	unknown