Viewing Program

Program Data

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

Title	Escape the Maze (3D)
ID	5499883092377600
Created	7 years ago, 1510168921169
Updated	4 years ago, 1606239110996
Code	/** * This is my first 3D program. It uses a method called raycasting to get the 3D affect. I might make more programs with raycasting later. * If you are spinning around and don't know why, put the mouse in the center of the screen. / // to make it look better smooth(); // The high scores. Spin-off proof is required to be added to the list. var highscores = [ ["Cody Lewis", 0, 16], ["micneu01", 0, 20], ["Richard Vaneveld", 0, 22], ["riley boss", 0, 22], ["SpiderFan01", 0, 22], ]; // the world var world = [ [1,1,1], [1,0,1], [1,0,1], [0,0,1], [1,0,0], [1,0,1], [1,0,1], [1,0,0], [0,0,1], [1,0,1], [1,0,1], [1,0,1], [1,1,1], ]; // the dimensions of the world var leng = 21; // make sure leng is an odd number if(leng/2===floor(leng/2)){ leng++; } // the current scene var scene = 1; // win variable var win = false; // frame counter var frame = 0; // countdown timer var countdown = 300; / Recap variables / // the stored movements var yourMovesX = []; var yourMovesY = []; var yourMovesA = []; // the scale var recapScale = 0.7; // the maze image var mazeImg; / Block variables / // block colors (2 is the darker side of the block) var blockColors1 = [color(255, 0, 0),color(0, 255, 0)]; var blockColors2 = [color(166, 7, 7),color(0, 255, 0)]; // the size of the blocks var blockSize = 64; / Player variables / // row and column var prow = 1; var pcol = 1; // corrdinites var position = new PVector(blockSize/2, blockSize/2); // diriection to look var startAngle = 45; var pangle = 90; // size var pwidth = 20; // the player's field of veiw in degrees var fieldOfView = 66; // player's speeds var moveSpeed = 2; var rotateSpeed = 1.5; // move directions var straight = new PVector(1, 0); straight.mult(moveSpeed); straight.rotate(startAngle); var slide = new PVector(0, 1); slide.mult(moveSpeed); slide.rotate(startAngle); // for the looking up/down affect var viewHeight = height/2; // the distance from the player to the canvas var canvasdist = (width/2)/tan(fieldOfView/2); / Time variables / // the start time var startsec; var startmin; // the current time var currentsec; var currentmin; // the displayed time var dmin; var sec; / Maze generator variables */ // starting row and col var crow = round(random(2,(leng-1)/2-1))2-1; var ccol = round(random(2,(leng-1)/2-1))2-1; // other maze varibles var brow = 1; var bcol = 1; var rows = []; var cols = []; var brows = []; var bcols = []; // the kind of block var block = 2; // generating the maze var tunnelling = true; /* Maze generator functions */ var checkdir2 = function() { // if a square up, down, left, or right two blocks away is a 2, add it to the list if(crow<world.length-3 && world[crow+2][ccol]===2 && world[crow+1][ccol]===2){ rows.push(crow+2); cols.push(ccol); brows.push(crow+1); bcols.push(ccol); } if(ccol<world.length-3 && world[crow][ccol+2]===2 && world[crow][ccol+1]===2){ rows.push(crow); cols.push(ccol+2); brows.push(crow); bcols.push(ccol+1); } if(crow>2 && world[crow-2][ccol]===2 && world[crow-1][ccol]===2){ rows.push(crow-2); cols.push(ccol); brows.push(crow-1); bcols.push(ccol); } if(ccol>2 && world[crow][ccol-2]===2 && world[crow][ccol-1]===2){ rows.push(crow); cols.push(ccol-2); brows.push(crow); bcols.push(ccol-1); } // set the current square to 0 world[crow][ccol]=0; if(rows.length===0){ // you are done generating the maze tunnelling=false; // set the end block world[leng-2][leng-2]=2; // create an image of the maze (overhead view) mazeImg = createGraphics(world.length(blockSizerecapScale), world[0].length(blockSizerecapScale), P2D); mazeImg.beginDraw(); mazeImg.noStroke(); for(var i = 0; i < world.length; i++){ for(var j = 0; j < world[i].length; j++){ if(world[i][j] > 0){ mazeImg.fill(blockColors1[world[i][j]-1]); }else{ mazeImg.fill(122, 111, 111); } mazeImg.rect(j(blockSizerecapScale), i(blockSizerecapScale), blockSizerecapScale, blockSizerecapScale); } } mazeImg.endDraw(); } }; var checkdir = function() { // if a square up, down, left, or right two blocks away is a 2, add it to the list if(crow<world.length-3 && world[crow+2][ccol]===1){ rows.push(crow+2); cols.push(ccol); brows.push(crow+1); bcols.push(ccol); } if(ccol<world.length-3 && world[crow][ccol+2]===1){ rows.push(crow); cols.push(ccol+2); brows.push(crow); bcols.push(ccol+1); } if(crow>2 && world[crow-2][ccol]===1){ rows.push(crow-2); cols.push(ccol); brows.push(crow-1); bcols.push(ccol); } if(ccol>2 && world[crow][ccol-2]===1){ rows.push(crow); cols.push(ccol-2); brows.push(crow); bcols.push(ccol-1); } if(rows.length===0){ // if there are not any squares found, backtrack block=2; checkdir2(); world[crow][ccol]=0; } }; var tunnel = function() { block=1; // find out what directons you can go checkdir(); if(tunnelling){ // chose a random square from the list var r=round(random(0,rows.length-1)); // set that as your current location crow=rows[r]; ccol=cols[r]; brow=brows[r]; bcol=bcols[r]; // reset the arrays rows.splice(0); cols.splice(0); brows.splice(0); bcols.splice(0); if(block===1){ // move that direction world[crow][ccol]=2; world[brow][bcol]=2; }else{ // backtrack world[brow][bcol]=0; } } }; /* Raycasting */ var raycaster = function() { background(0, 0, 0); noStroke(); // draw the sky fill(0, 0, 255); rect(0, 0, width, height/2); // draw the floor fill(122, 111, 111); rect(0, height/2, width, height/2); for(var x = 0; x < width; x++){ // go through every column of pixels in the screen // calculate the ray's angle var angle = (pangle - fieldOfView/2) + (fieldOfView/width)x; // wrap the angle around if(angle < 0){ angle += 360; } if(angle > 360){ angle -= 360; } // variables for horizontal edge detection var ahit = false; var checka = true; var ax = 0; var ay = 0; var arow = 0; var acol = 0; var ya = 0; var xa = 0; // calculate the y position for the first horizontal intersection point on the ray if(angle > 0 && angle < 180){ // the ray is pointing down ay = prow * blockSize + blockSize; }else if(angle > 180 && angle < 360){ // the ray is pointing up ay = prow * blockSize; }else{ // don't check horizontal intersections checka = false; } if(checka){ // calculate the y position for the first horizontal intersection point on the ray ax = (pcolblockSize+position.x) + ((prowblockSize+position.y)-ay)/tan(-angle); // calculate which block the point is sitting on arow = floor(ay/blockSize); acol = floor(ax/blockSize); if(arow > world.length-1 \|\| arow < 0 \|\| acol > world[arow].length-1 \|\| acol < 0){ // if the block is off the edge of the world, don't check it checka = false; } // calculate the y distance to the next intersection point if(angle > 0 && angle < 180){ ya = blockSize; } if(angle > 180 && angle < 360){ ya = -blockSize; } // calculate the x distance to the next intersection point var xa = blockSize/tan(angle); if(angle > 180 && angle < 360){ xa = -1; } } // vertical intersection detection variables var bhit = false; var checkb = true; var bx = 0; var by = 0; var brow = 0; var bcol = 0; var yb = 0; var xb = 0; // calculate the x position for the first vertical intersection point on the ray if(angle > 90 && angle < 270){ // the ray is pointing left bx = pcol blockSize; }else if(angle < 90 \|\| angle > 270){ // the ray is pointing right bx = pcol * blockSize + blockSize; }else{ // don't check vertical intersections checkb = false; } if(checkb){ // calculate the x position for the first vertical intersection point on the ray by = (prowblockSize)+position.y + ((pcolblockSize+position.x)-bx)tan(-angle); // calculate which block the point is sitting on brow = floor(by/blockSize); bcol = floor(bx/blockSize); if(brow > world.length-1 \|\| brow < 0 \|\| bcol > world[brow].length-1 \|\| bcol < 0){ // if the block is off the edge of the world, don't check it checkb = false; } // calculate the y distance to the next intersection point var yb = blockSizetan(angle); if(angle > 90 && angle < 270){ yb = -1; } // calculate the x distance to the next intersection point if(angle < 90 \|\| angle > 270){ xb = blockSize; } if(angle > 90 && angle < 270){ xb = -blockSize; } } // check horizontal intersections while(ahit === false && checka === true){ if(world[arow][acol] > 0){ // the ray hit a block ahit = true; }else if(arow-1 >= 0 && world[arow-1][acol] > 0){ // the ray hit a block ahit = true; arow--; }else{ // move to the next intersection point ax += xa; ay += ya; arow = floor(ay/blockSize); acol = floor(ax/blockSize); if(arow > world.length-1 \|\| arow < 0 \|\| acol > world[arow].length-1 \|\| acol < 0){ // the ray went off the edge of the world, stop checking intersections checka = false; } } } // check vertical intersections while(bhit === false && checkb === true){ if(world[brow][bcol] > 0){ // the ray hit a block bhit = true; }else if(bcol-1 >= 0 && world[brow][bcol-1] > 0){ // the ray hit a block bhit = true; bcol--; }else{ // move to the next intersection point bx += xb; by += yb; brow = floor(by/blockSize); bcol = floor(bx/blockSize); if(brow > world.length-1 \|\| brow < 0 \|\| bcol > world[brow].length-1 \|\| bcol < 0){ // the ray went off the edge of the world, stop checking intersections checkb = false; } } } // calculate the distances from the player to the block that you hit var adist = 0; var bdist = 0; var finaldist = 0; if(ahit){ adist = dist(pcolblockSize+position.x, prowblockSize+position.y, ax, ay); } if(bhit){ bdist = dist(pcolblockSize+position.x, prowblockSize+position.y, bx, by); } // deside which point is closer the player if(ahit && bhit){ if(adist < bdist){ finaldist = adist; bhit = false; }else{ finaldist = bdist; ahit = false; } }else{ if(ahit){ finaldist = adist; bhit = false; }else{ finaldist = bdist; ahit = false; } } // remove the "fish-eye effect" finaldist = finaldist cos(pangle-angle); // calculate the height of the displayed wall var wallHeight = (blockSize/finaldist)canvasdist; // chose which color to draw the wall if(ahit){ stroke(blockColors1[(world[arow][acol])-1]); }else{ stroke(blockColors2[(world[brow][bcol])-1]); } // draw the wall line(x, viewHeight-wallHeight/2, x, viewHeight+wallHeight/2); } }; /* Create a background image / raycaster(); var backgroundImg = get(0, 0, width, height); world.splice(0); pangle = startAngle; / Build the world / // make a grid of ones that is leng by leng world.length=leng; for(var i=0; i<world.length; i++){ var arr=[]; arr.length=leng; world[i]=arr; for(var j=0; j<world[i].length; j++){ world[i][j]=1; } } // make the start square a two world[crow][ccol]=2; / Key Handling / // array of keys var keys = []; // a key is pressed var keyPressed = function() { keys[keyCode] = true; }; // a key is released var keyReleased = function() { keys[keyCode] = false; }; / Button clicking */ mouseClicked = function() { if(scene === 1){ // home screen // play button if(mouseX > 150 && mouseX < 250 && mouseY > 100 && mouseY < 150){ scene = 4; } // help button if(mouseX > 150 && mouseX < 250 && mouseY > 175 && mouseY < 225){ scene = 2; } // high scores button if(mouseX > 150 && mouseX < 250 && mouseY > 250 && mouseY < 300){ scene = 3; } }else if(scene === 2){ // help screen // back button if(mouseX > 150 && mouseX < 250 && mouseY > 310 && mouseY < 360){ scene = 1; } }else if(scene === 3){ // highscores screen // back button if(mouseX > 150 && mouseX < 250 && mouseY > 310 && mouseY < 360){ scene = 1; } }else{ // game screen // play button if(mouseX > 50 && mouseX < 150 && mouseY > 330 && mouseY < 380){ // reset everything countdown = 300; win = false; yourMovesX.splice(0); yourMovesY.splice(0); yourMovesA.splice(0); prow = 1; pcol = 1; position = new PVector(blockSize/2, blockSize/2); pangle = startAngle; straight = new PVector(1, 0); straight.mult(moveSpeed); straight.rotate(startAngle); slide = new PVector(0, 1); slide.mult(moveSpeed); slide.rotate(startAngle); var viewHeight = height/2; // reset the world world.splice(0); world.length=leng; for(var i=0; i<world.length; i++){ var arr=[]; arr.length=leng; world[i]=arr; for(var j=0; j<world[i].length; j++){ world[i][j]=1; } } // reset the maze gererator variables crow = round(random(2,(leng-1)/2-1))2-1; ccol = round(random(2,(leng-1)/2-1))2-1; brow = 1; bcol = 1; rows = []; cols = []; brows = []; bcols = []; block = 2; world[crow][ccol]=2; // start generating a new maze tunnelling = true; } // home button if(mouseX > 250 && mouseX < 350 && mouseY > 330 && mouseY < 380){ scene = 1; //reset everything win = false; countdown = 300; yourMovesX.splice(0); yourMovesY.splice(0); yourMovesA.splice(0); prow = 1; pcol = 1; position = new PVector(blockSize/2, blockSize/2); pangle = startAngle; straight = new PVector(1, 0); straight.mult(moveSpeed); straight.rotate(startAngle); slide = new PVector(0, 1); slide.mult(moveSpeed); slide.rotate(startAngle); var viewHeight = height/2; // reset the world world.splice(0); world.length=leng; for(var i=0; i<world.length; i++){ var arr=[]; arr.length=leng; world[i]=arr; for(var j=0; j<world[i].length; j++){ world[i][j]=1; } } // reset the maze gererator variables crow = round(random(2,(leng-1)/2-1))2-1; ccol = round(random(2,(leng-1)/2-1))2-1; brow = 1; bcol = 1; rows = []; cols = []; brows = []; bcols = []; block = 2; world[crow][ccol]=2; // start generating a new maze tunnelling = true; } } }; /* Draw Loop */ var draw = function() { if(tunnelling){ // generate the maze tunnel(); } if(scene === 1){ // home screen textFont(createFont("cursive")); textAlign(CENTER, CENTER); stroke(0, 0, 0); fill(255, 255, 255); textSize(40); // the background image(backgroundImg, 0, 0); // title text("Escape the Maze", 200, 50); // button rectangles fill(0, 0, 0); rect(150, 100, 100, 50, 10); rect(150, 175, 100, 50, 10); rect(150, 250, 100, 50, 10); // button text fill(255, 255, 255); textSize(25); text("Play", 200, 125); text("Help", 200, 200); text("Scores", 200, 275); }else if(scene === 2){ // help screen stroke(0, 0, 0); textFont(createFont("cursive")); textAlign(CENTER, CENTER); textSize(40); fill(255, 255, 255); // the background image(backgroundImg, 0, 0); // heading text text("Instructions", 200, 50); // button rectangle fill(0, 0, 0); rect(150, 310, 100, 50, 10); // button text textSize(25); fill(255, 255, 255); text("Back", 200, 335); // instructions textSize(15); textAlign(LEFT, BASELINE); text("You have been trapped in a maze, and your goal is to escape as quickly as possible by running into the green block. Use WASD to move, and the arrow keys or the mouse to look around. Your time is shown in the upper left corner of the screen. Try to get a new high score!", 25, 100, 350, 300); }else if(scene === 3){ // highscores screen textFont(createFont("cursive")); textAlign(CENTER, CENTER); stroke(0, 0, 0); fill(255, 255, 255); textSize(40); // the background image(backgroundImg, 0, 0); // header text text("High Scores:", 200, 50); // button rectangle fill(0, 0, 0); rect(150, 310, 100, 50, 10); // button text fill(255, 255, 255); textSize(25); text("Back", 200, 335); // create the highscores list text textSize(18); var scoretext = ""; for(var i = 0; i < highscores.length; i++){ if(highscores[i][0] === ""){ scoretext += i+1 + ": Unclaimed"; }else{ var tmin = " minute"; if(highscores[i][1] !== 1){ tmin+="s"; } var tsec = " second"; if(highscores[i][2] !== 1){ tsec+="s"; } scoretext += i+1 + ": " + highscores[i][0] + ", " + highscores[i][1] + tmin +", "+highscores[i][2] + tsec; } if(i !== highscores.length-1){ scoretext += "\n"; } } // display the high score list textAlign(LEFT, BASELINE); text(scoretext, 20, 130, 360, 400); }else{ // game screen if(tunnelling){ // generating screen frame++; textFont(createFont("cursive")); textAlign(CENTER, CENTER); background(255, 255, 255); // draw the spinning arcs noFill(); strokeWeight(10); stroke(0, 0, 255); arc(width/2, height/2, 260, 260, 45/2-frame, 360-45/2-frame); stroke(0, 255, 0); arc(width/2, height/2, 285, 285, -180+45/2-frame, 180-45/2-frame); stroke(255, 0, 0); arc(width/2, height/2, 310, 310, 45/2+frame, 360-45/2+frame); stroke(122, 111, 111); arc(width/2, height/2, 335, 335, -180+45/2+frame, 180-45/2+frame); // draw the text strokeWeight(1); stroke(0, 0, 0); fill(0, 0, 0); textSize(30); text("Generating Maze", 200, 190); }else if(win){ // you win screen // calculate where to draw the maze var imageX = yourMovesX[frame]recapScale-width/2; imageX = constrain(imageX, 0, world.lengthblockSizerecapScale-width); var imageY = yourMovesY[frame]recapScale-height/2; imageY = constrain(imageY, 0, world.lengthblockSizerecapScale-height); // draw the maze image(mazeImg, -imageX, -imageY); // draw the player pushMatrix(); translate(yourMovesX[frame]recapScale-imageX, yourMovesY[frame]recapScale-imageY); rotate(yourMovesA[frame]-90); fill(0, 0, 255); noStroke(); ellipse(0, 0, pwidthrecapScale, pwidthrecapScale); stroke(0, 0, 255); line(0, 0, 0, pwidth/1.5recapScale); resetMatrix(); // win message textFont(createFont("cursive")); textAlign(CENTER, CENTER); fill(255, 255, 255); textSize(30); text("You escaped the maze!", 200, 60); textSize(17); var tmin = " minute"; if(dmin !== 1){ tmin+="s"; } var tsec = " second"; if(sec !== 1){ tsec+="s"; } text("And, you did it in only "+dmin+tmin+", "+sec+tsec+"!", 200, 100); // if you got a high score, draw this text if(highscores[highscores.length-1][0] === "" \|\| highscores[highscores.length-1][1]60+highscores[highscores.length-1][2] > dmin60+sec){ textSize(20); text("You got a high score! Save as a spin-off and tell me in tips and thanks to be added to the list.", 25, 175, 350, 200); } // button rectangles fill(0, 0, 0); noStroke(); rect(50, 330, 100, 50, 10); rect(250, 330, 100, 50, 10); // button text fill(255, 255, 255); textSize(25); text("Play", 100, 355); text("Home", 300, 355); // increase the frame count frame++; if(frame > yourMovesX.length-1){ // restart the recap frame = 0; } }else if(countdown > 0){ // reduce the countdown timer countdown--; background(255, 255, 255); fill(0, 0, 0); textFont(createFont("cursive")); textAlign(CENTER, CENTER); textSize(50); // draw the countdown text if(countdown < 100){ text("Go!", 200, 200); }else if(countdown < 200){ text("Set,", 200, 200); }else{ text("Ready,", 200, 200); } if(countdown <= 0){ // set the start time startsec = second(); startmin = minute(); win = false; // reset the frame count frame = 0; } }else{ / Movement / // look down if((keys[DOWN] \|\| mouseY > height-height/4) && viewHeight > height/4){ viewHeight--; } // look up if((keys[UP] \|\| mouseY < height/4) && viewHeight < (height/4)3){ viewHeight++; } // rotate right if(keys[RIGHT] \|\| mouseX > width-width/5){ pangle+=rotateSpeed; straight.rotate(rotateSpeed); slide.rotate(rotateSpeed); } // rotate slower right if(mouseX <= width-width/5 && mouseX > width-width/2.5 && keys[RIGHT] === false){ pangle+=rotateSpeed/2; straight.rotate(rotateSpeed/2); slide.rotate(rotateSpeed/2); } // rotate left if(keys[LEFT] \|\| mouseX < width/5){ pangle-=rotateSpeed; straight.rotate(-rotateSpeed); slide.rotate(-rotateSpeed); } // rotate slower left if(mouseX >= width/5 && mouseX < width/2.5 && keys[LEFT] === false){ pangle-=rotateSpeed/2; straight.rotate(-rotateSpeed/2); slide.rotate(-rotateSpeed/2); } // wrap the angle around if(pangle > 360){ pangle -= 360; } if(pangle < 0){ pangle += 360; } // move forward if(keys[87]){ position.add(straight); } // move backward if(keys[83]){ position.sub(straight); } // move right if(keys[68]){ position.add(slide); } // move left if(keys[65]){ position.sub(slide); } /* Colision detection / // the block to the right if(position.x > blockSize-pwidth/2){ if(world[prow][pcol+1] > 0){ if(world[prow][pcol+1] === 2){ win = true; }else{ position.x = blockSize-1-pwidth/2; } }else if(position.x > blockSize){ position.x -= blockSize; pcol++; } } // the block to the left if(position.x < pwidth/2){ if(world[prow][pcol-1] > 0){ if(world[prow][pcol-1] === 2){ win = true; }else{ position.x = 1+pwidth/2; } }else if(position.x < 0){ position.x += blockSize; pcol--; } } // the block below if(position.y > blockSize-pwidth/2){ if(world[prow+1][pcol] > 0){ if(world[prow+1][pcol] === 2){ win = true; }else{ position.y = blockSize-1-pwidth/2; } }else if(position.y > blockSize){ position.y -= blockSize; prow++; } } // the block above if(position.y < pwidth/2){ if(world[prow-1][pcol] > 0){ if(world[prow-1][pcol] === 2){ win = true; }else{ position.y = 1+pwidth/2; } }else if(position.y < 0){ position.y += blockSize; prow--; } } / Display / // draw the 3D maze raycaster(); / Calculate and show the time */ // calculate the time currentsec = second(); currentmin = minute(); dmin = currentmin-startmin; if(dmin < 0){ dmin += 60; } sec = 0; if(currentsec < startsec){ dmin--; sec=currentsec-startsec+60; }else{ sec=currentsec-startsec; } // display the time fill(255, 255, 255); textSize(15); textFont(createFont("cursive")); textAlign(LEFT, BASELINE); var tmin = "minute"; if(dmin !== 1){ tmin+="s"; } var tsec = "second"; if(sec !== 1){ tsec+="s"; } text("Time: "+dmin+" "+tmin+", "+sec+" "+tsec, 5, 20); // save your position yourMovesX.push(pcolblockSize+position.x); yourMovesY.push(prow*blockSize+position.y); yourMovesA.push(pangle); } } };
Folds	7,13,15,29,33,35,112,161,162,194,195,221,223,412,421,428,435,437,439,441,443,563,565,909
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgJyQ1cPiCQw
Votes	242
Spin-Offs	41
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	joel
Author Name	JoelTheBurritoEater
Author ID	kaid_272382894461019601503796
Author Profile Access	COACH

Archive Data

Added	6 months ago, 1739389388168
Updated	6 months ago, 1739389429781
Source Deleted	unknown