Viewing Program

Program Data

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

Title	Traffic Jam
ID	5364286458560512
Created	9 years ago, 1466419862903
Updated	9 years ago, 1466544334036
Code	/ This is my second game on KA I hope you enjoy it, and put any of your suggestion in the T&T I would also like to thank everyone that posted kind reviews in the T&T THIS GAME IS PLAYABLE ON MOBILE DEVICES! Version 1.0---5:50 a.m. 6/20: Game released Version 1.1---5:30 p.m. 6/20: Score isn't added after you crash Version 1.2---9:00 p.m. 6/20: You can use W,A,S,D to speed up the cars Each car isn't updated or drawn after it disappears from the screen, getting rid of some lag Version 1.3---7:20 a.m. 6/21: Fixes bug where you can speed up a crashed car Version 1.4---4:20 p.m. 6/21: Fixes bug where you can't use the arrows keys or W,A,S,D after you restart Special thanks to Edward @Efhiii for the changes made in Version 1.2 To add: Better grass graphics Bikes (speed up to cars slowest) Leaderboard / frameRate(30); //Variables var font = createFont("IMPACT"); var carHover = false; var carDirection; var cars = []; var carFrequency = 100; var gameOver = false; var score = 0; var highScore = 0; var end = 0; var transparency = 100; var transparencyUp = true; var restartBool = false; var cloudx = []; var cloudSpeed = []; var startTime = millis(); var time; var currentScene = 0; var rectx = 400; var rect2x = 200; var introVisibility = 0; var transition = 0; var version = "Version 1.4"; var carType = []; var randomCar = []; var truckChances = 10; var current=[0,0,0,0]; //Button Constructor var Button = function(config, nextscene) { this.x = config.x \|\| 20; this.y = config.y \|\| 15; this.label = config.label \|\| "BACK"; this.width = config.width; this.height = config.height; this.size = config.size \|\| 19; this.scene = config.scene \|\| 1; this.font = config.font \|\| font; this.nextScene = nextscene; this.maxSize = 35; this.minSize = 30; this.changeCursor = config.changeCursor \|\| function() {}; }; Button.prototype.isMouseInside = function() { return mouseX > this.x-this.width/2 && mouseX < this.x+this.width/2 && mouseY > this.y-this.height/2 && mouseY < this.y+this.height/2 && currentScene === this.scene; }; Button.prototype.draw = function() { if (this.scene === currentScene) { this.changeCursor(); if (this.isMouseInside()) { if (this.size < this.maxSize) { this.size++; } if (mouseIsPressed) { cursor("DEFAULT"); currentScene = this.nextScene; } fill(255, 255, 255, 100); } else { if (this.size > this.minSize) { this.size--; } fill(255, 255, 255); } textAlign(CENTER, CENTER); textFont(this.font, this.size); text(this.label, this.x, this.y); } }; var start = new Button({ size: 30, x: 155, y: 250, label: "START", scene: 1, width: 70, height: 30 }, 3); var how = new Button({ size: 30, x: 255, y: 250, label: "HOW", scene: 1, width: 55, height: 30, changeCursor: function() { if (this.isMouseInside() \|\| start.isMouseInside()) { cursor(HAND); } else { cursor("DEFAULT"); } } }, 2); var back = new Button({ size: 30, x: 55, y: 45, label: "BACK", scene: 2, width: 75, height: 30, changeCursor: function() { if (this.isMouseInside()) { cursor(HAND); } else { cursor("DEFAULT"); } } }, 1); var main = new Button({ size: 30, x: 200, y: 275, label: "MAIN MENU", scene: 3, width: 150, height: 30 }, 4); var restart = new Button({ size: 30, x: 200, y: 325, label: "RESTART", scene: 3, width: 100, height: 30, changeCursor: function() { if (this.isMouseInside() \|\| main.isMouseInside()) { cursor(HAND); if (mouseIsPressed) { restartBool = true; } } else { cursor("DEFAULT"); } } }, 3); //Car Constructor var Car = function(direction, type) { this.direction = direction \|\| 0; //0=right, 1=left, 2=up, 3=down this.speed = 3.5; this.color1 = random(0, 255); this.color2 = random(0, 255); this.color3 = random(0, 255); this.otherCars = []; this.touching = 0; this.type = type; this.smokex = []; this.smokey = []; if (this.type === 'car') { this.maxSpeed = 15; } else if (this.type === 'truck') { this.maxSpeed = 10; } else if (this.type === 'bike') { this.speed = 2.5; this.maxSpeed = 5; } for (var i = 0; i < 75; i++) { if (this.type === 'car') { this.smokex[i] = 10; } else if (this.type === 'truck') { this.smokex[i] = 30; } this.smokey[i] = 0; } switch (this.direction) { case 0: this.x = -50; this.y = 225; break; case 1: this.x = 450; this.y = 175; break; case 2: this.x = 225; this.y = 450; break; case 3: this.x = 175; this.y = -50; } if (this.direction < 2) { if (this.type === 'truck') { this.width = 100; } else { this.width = 70; } this.height = 30; } else { this.width = 30; if (this.type === 'truck') { this.height = 100; } else { this.height = 70; } } this.hover = false; this.wasOnScreen = false; }; Car.prototype.draw = function() { noStroke(); rectMode(CENTER); translate(this.x, this.y); if (this.direction === 1) { rotate(180); } else if (this.direction === 2) { rotate(-90); } else if (this.direction === 3) { rotate(90); } if (this.type === 'car') { fill(this.color1, this.color2, this.color3); rect(0, 0, 70, 30, 10); rotate(20); rect(18, 9, 7, 7, 10); rotate(-40); rect(18, -9, 7, 7, 10); rotate(20); fill(107, 168, 158); stroke(107, 168, 158); strokeWeight(2); line(-5, 10, 5, 10); line(-5, -10, 5, -10); rect(15, 0, 15, 20, 5); rect(-15, 0, 10, 15, 5); if (this.speed < 1) { stroke(97, 97, 97); line(30, -10, 25, 7); line(25, 7, 22, -7); line(22, -7, 18, 0); for (var i = 0; i < this.smokex.length; i++) { noStroke(); fill(66, 66, 66); this.smokex[i] = random(this.smokex[i]-2, this.smokex[i]+2); this.smokey[i] = random(this.smokey[i]-2, this.smokey[i]+2); this.smokex[i] = constrain(this.smokex[i], -10, 40); this.smokey[i] = constrain(this.smokey[i], -20, 20); ellipse(this.smokex[i], this.smokey[i], 10, 10); } } } else if (this.type === 'truck') { fill(this.color1, this.color2, this.color3); rect(15, 0, 70, 30, 10); rotate(20); rect(42, -1, 7, 7, 10); rotate(-40); rect(40, -1, 7, 7, 10); rotate(20); stroke(107, 168, 158); strokeWeight(5); line(32, 0, 27, -12); line(32, 0, 27, 12); noStroke(); fill(255, 255, 255); rect(-15, 0, 70, 30, 5); if (this.speed < 1) { for (var i = 0; i < this.smokex.length; i++) { noStroke(); fill(66, 66, 66); this.smokex[i] = random(this.smokex[i]-2, this.smokex[i]+2); this.smokey[i] = random(this.smokey[i]-2, this.smokey[i]+2); this.smokex[i] = constrain(this.smokex[i], 20, 70); this.smokey[i] = constrain(this.smokey[i], -20, 20); ellipse(this.smokex[i], this.smokey[i], 10, 10); } } } resetMatrix(); }; Car.prototype.isMouseInside = function() { return mouseX < this.x+this.width/2 && mouseX > this.x-this.width/2 && mouseY < this.y+this.height/2 && mouseY > this.y-this.height/2; }; Car.prototype.collision = function() { this.touching = 0; for (var i = 0; i < this.otherCars.length; i++) { if (this.x+this.width/2 > this.otherCars[i].x-this.otherCars[i].width/2 && this.x-this.width/2 < this.otherCars[i].x+this.otherCars[i].width/2 && this.y+this.height/2 > this.otherCars[i].y-this.otherCars[i].height/2 && this.y-this.height/2 < this.otherCars[i].y+this.otherCars[i].height/2 && this.x > -this.width/2 && this.x < 400+this.width/2 && this.y > -this.height/2 && this.y < 400+this.height/2 && this.otherCars[i].x > -this.otherCars[i].width/2 && this.otherCars[i].x < 400+this.otherCars[i].width/2 && this.otherCars[i].y > -this.otherCars[i].height/2 && this.otherCars[i].y < 400+this.otherCars[i].height/2) { this.touching++; } } if (this.touching > 1) { return true; } else { return false; } }; Car.prototype.onScreen = function() { return this.x > -this.width/2 && this.x < 400+this.width/2 && this.y > -this.height/2 && this.y < 400+this.height/2; }; Car.prototype.update = function() { switch (this.direction) { case 0: this.x+=this.speed; break; case 1: this.x-=this.speed; break; case 2: this.y-=this.speed; break; case 3: this.y+=this.speed; break; } if (this.isMouseInside()) { carHover = true; this.hover = true; if (mouseIsPressed && this.speed > 0) { this.speed = this.maxSpeed; } } if (this.hover && !this.isMouseInside()) { this.hover = false; carHover = false; } if (this.collision()) { this.speed = 0; gameOver = true; } if (this.onScreen()) { this.wasOnScreen = true; } }; //Clouds var drawCloud = function(x, y, size) { noStroke(); fill(255, 255, 255); ellipse(x, y, size, size); ellipse(x-size/2, y+size/3, size, size/2); ellipse(x+size/2, y+size/4, size, size/2); ellipse(x+size/1.8, y-size/7, size/1.5, size/1.5); }; cloudx[0] = 100; cloudx[1] = 50; cloudx[2] = 350; cloudx[3] = -30; cloudx[4] = 250; //Scenes var intro = function() { time = (millis()-startTime)/1000; background(255, 255, 255); noStroke(); rectMode(CENTER); fill(158, 158, 158); for (var x = 0; x < 3; x++) { for (var y = 0; y < 2; y++) { if (time > 0.25 && x === 0) { rect(x57+145, y112+106, 20, 20); } if (time > 0.5 && x === 1) { rect(x57+145, y112+106, 20, 20); } if (time > 0.75 && x === 2) { rect(x57+145, y112+106, 20, 20); } } } fill(255, 0, 0); rectMode(LEFT); if (time > 1) { rect(130, 153, 20, 20); rect(254, 153, 20, 20); } rect(165, 124, 75, 21, 65); rect(165, 124, 21, 68, 65); rect(165, 178, 75, 21, 65); if (time < 1.75) { rect(224, 124, 21, 74, 65); } if (time > 1.75) { rect(225, 158, 5, 15, 65); rect(209, 148, 5, 24, 65); rect(212, 168, 18, 5, 65); rect(213, 148, 17, 5, 65); rect(219, 158, 7, 5, 65); } fill(158, 158, 158, introVisibility); textSize(45); text("CUBIVE GAMING", 19, 298); fill(255, 255, 255); if (time > 2.25 && introVisibility < 255) { introVisibility+=5; } if (time > 4.25 && rectx > 200) { rectx-=10; } if (rect2x <= 0) { currentScene = 1; } if (rectx <= 200) { fill(158, 158, 158); rect(rect2x, -5, 200, 410); rect2x-=10; } fill(255, 0, 0); rect(rectx, -5, 200, 410); }; //Logo var drawScene1 = function() { background(17, 194, 179); noStroke(); drawCloud(cloudx[0], 350, 50); drawCloud(cloudx[1], 150, 25); drawCloud(cloudx[2], 300, 65); drawCloud(cloudx[3], 50, 35); drawCloud(cloudx[4], 75, 60); for (var i = 0; i < cloudx.length; i++) { if (cloudx[i] < 475) { cloudx[i]+=0.5; } else { cloudx[i] = -75; } } rectMode(CENTER); fill(0, 0, 0); rect(200, 116, 400, 15); fill(64, 64, 64); rect(60, 200, 100, 250, 36); rect(340, 200, 100, 250, 36); fill(0, 0, 0); fill(255, 0, 0, transparency); ellipse(60, 128, 60, 60); ellipse(340, 128, 60, 60); fill(255, 255, 0, transparency); ellipse(60, 204, 60, 60); ellipse(340, 204, 60, 60); fill(9, 155, 15, transparency); ellipse(60, 280, 60, 60); ellipse(340, 280, 60, 60); stroke(51, 51, 51); strokeWeight(10); noFill(); arc(60, 128, 60, 60, 180, 360); arc(340, 128, 60, 60, 180, 360); arc(60, 204, 60, 60, 180, 360); arc(340, 204, 60, 60, 180, 360); arc(60, 280, 60, 60, 180, 360); arc(340, 280, 60, 60, 180, 360); textAlign(CENTER, CENTER); fill(255, 255, 255); textFont(font, 50); text("TRAFFIC JAM", 200, 181); textSize(15); text(version, 200, 218); if (transparencyUp) { if (transparency < 255) { transparency+=15; } else { transparencyUp = false; } } else { if (transparency > 75) { transparency-=15; } else { transparencyUp = true; } } }; //Main Menu var drawScene2 = function() { background(17, 194, 179); noStroke(); fill(13, 171, 24); rectMode(CENTER); rect(200, 350, 400, 200); fill(61, 61, 61); rect(200, 334, 400, 84); fill(255, 255, 0); rect(200,326, 400, 4); ellipse(302, 66, 75, 75); drawCloud(cloudx[0], 111, 45); drawCloud(cloudx[2], 105, 35); drawCloud(cloudx[3], 75, 35); for (var i = 0; i < cloudx.length; i++) { if (cloudx[i] < 475) { cloudx[i]+=0.25; } else { cloudx[i] = -75; } } textAlign(CENTER, CENTER); textFont(font, 40); fill(255, 255, 255); text("HOW", 200, 160); textAlign(CENTER, TOP); textFont(createFont("sans-serif"), 20); text("The traffic lights have broken! Your job is\n to direct traffic and avoid collisions. Press\n each car, use W A S D, or use the arrow\nkeys to speed the cars up.", 200, 186); }; //How var drawScene3 = function() { background(50, 194, 17); fill(255, 255, 255); textFont(font, 20); textAlign(LEFT, CENTER); text("Score:", 25, 25); textAlign(RIGHT, CENTER); text(score, 130, 25); if (score > highScore) { highScore = score; } fill(255, 255, 0); text(highScore, 130, 50); noStroke(); rectMode(CENTER); fill(51, 51, 51); rect(200, 200, width, height/4); rect(200, 200, width/4, height); fill(255, 255, 0); rectMode(LEFT); rect(0, 197.5, 150, 5); rect(250, 197.5, 150, 5); rect(197.5, 0, 5, 150); rect(197.5, 250, 5, 150); fill(255, 255, 255); rect(135, 198, 15, 52); rect(250, 150, 15, 52); rect(150, 135, 52, 15); rect(198, 250, 52, 15); }; //Game var drawScene4 = function() { background(0, 0, 0); transition++; if (transition > 30) { currentScene = 1; } }; //Transition var draw = function() { if (restartBool) { restartBool = false; score = 0; cars = []; carFrequency = 100; gameOver = false; end = 0; transition = 0; current=[0,0,0,0]; } if (currentScene === 0) { intro(); } else if (currentScene === 1) { drawScene1(); start.draw(); how.draw(); restartBool = true; } else if (currentScene === 2) { drawScene2(); back.draw(); } else if (currentScene === 3) { drawScene3(); cursor("DEFAULT"); for (var i = 0; i < cars.length; i++) { cars[i].otherCars = cars; if (cars[i].onScreen() \|\| !cars[i].wasOnScreen) { cars[i].draw(); cars[i].update(); } } if (gameOver) { end++; } if (end < 100) { if (carHover) { cursor(HAND); } else { cursor("DEFAULT"); } if (frameCount%10 === 0 && !gameOver) { score+=10; } if (frameCount%carFrequency === 0) { if ((score < 350 \|\| frameCount%75 === 25) && carFrequency > 75) { carDirection = round(random(1,4)); carFrequency = 100; } else if ((score < 700 \|\| frameCount%50 === 25) && carFrequency > 50) { carDirection = round(random(1,8)); carFrequency = 75; truckChances = 9.5; } else { carDirection = round(random(1,9)); carFrequency = 50; truckChances = 9; } for (var i = 0; i < 4; i++) { randomCar[i] = random(1, 10); if (randomCar[i] > truckChances) { carType[i] = 'truck'; } else { carType[i] = 'car'; } } switch (carDirection) { case 1: cars.push(new Car(0, carType[0])); cars.push(new Car(2, carType[2])); break; case 2: cars.push(new Car(0, carType[0])); cars.push(new Car(3, carType[3])); break; case 3: cars.push(new Car(1, carType[1])); cars.push(new Car(2, carType[2])); break; case 4: cars.push(new Car(1, carType[1])); cars.push(new Car(3, carType[3])); break; case 5: cars.push(new Car(0, carType[0])); cars.push(new Car(1, carType[1])); cars.push(new Car(2, carType[2])); break; case 6: cars.push(new Car(0, carType[0])); cars.push(new Car(1, carType[1])); cars.push(new Car(3, carType[3])); break; case 7: cars.push(new Car(0, carType[0])); cars.push(new Car(2, carType[2])); cars.push(new Car(3, carType[3])); break; case 8: cars.push(new Car(1, carType[1])); cars.push(new Car(2, carType[2])); cars.push(new Car(3, carType[3])); break; case 9: cars.push(new Car(0, carType[0])); cars.push(new Car(1, carType[1])); cars.push(new Car(2, carType[2])); cars.push(new Car(3, carType[3])); } } } else { cars = []; rectMode(CENTER); noStroke(); fill(0, 0, 0); rect(200, 200, 400, 400); textFont(font, 50); textAlign(CENTER, CENTER); fill(255, 255, 255); text("GAME OVER", 200, 114); textSize(30); text("Score: " + score, 200, 175); if (highScore < score) { highScore = score; } text("High Score: " + highScore, 200, 225); main.draw(); restart.draw(); } } else if (currentScene === 4) { drawScene4(); } }; //Handles keys pressed keyPressed = function(){//0=right, 1=left, 2=up, 3=down var testDirection=-1; if (key.toString().toLowerCase()==="w"\|\|keyCode===UP) { testDirection=2; } if (key.toString().toLowerCase()==="a"\|\|keyCode===LEFT) { testDirection=1; } if (key.toString().toLowerCase()==="s"\|\|keyCode===DOWN) { testDirection=3; } if (key.toString().toLowerCase()==="d"\|\|keyCode===RIGHT) { testDirection=0; } if(testDirection>=0&&!gameOver){ var correct=[]; for (var i = 0; i < cars.length; i++) { if(cars[i].direction===testDirection){ correct.push(i); } } if (cars[correct[current[testDirection]]].type === 'car') { cars[correct[current[testDirection]]].speed = 15; } else { cars[correct[current[testDirection]]].speed = 10; } current[testDirection]++; } };
Folds	57,70,71,77,78,100,102,110,111,126,127,142,143,151,152,170,173,234,235,304,305,310,311,332,333,336,337,370,373,380,388,446,447,506,507,535,536,565,566,572,574,704,707,735
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgNimpNnDCQw
Votes	166
Spin-Offs	12
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Eli Nordan
Author Name	eli1881
Author ID	kaid_1208584304843916253290554
Author Profile Access	PUBLIC

Archive Data

Added	10 months ago, 1739381009493
Updated	10 months ago, 1739381019500
Source Deleted	unknown