Viewing Program

Program Data

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

Title	Planes 2 [Now with Balloons!]
ID	5707702964748288
Created	7 years ago, 1540640229246
Updated	6 years ago, 1556795592014
Code	/**************************************************************** ____ __ ________ ___ __ ______ ______ ______ / __ \ / / / ____ / / \| / / / ____/ / ____/ /___ / / /_/ / / / / /___/ / / /\| \|/ / / /_ / /___ ___/ / / /___/ / / / ____ / / / \| / / / __/ /___ / / ___/ / / /__ / / / / / / \|/ / / /___ ___/ / / /__ / /____/ /_/ /_/ /_/ \|_/ /_____/ /____/ /____/ * The Offical Release of the sequel to "Planes 'n Balloons" * * My latest project, Planes 2 * It's my first time trying to work inside of a * fade 3D environment. I'm fairly pleased with the * way the controls/game play turned out. * * Please let me know in the T&T about what you * think, any bugs you found, or any suggestions * you have. * * This is my 6th game, but by far this has some of * the most complicated code I've ever written. * *************************************************************** * 🔷 Work Log { * ~2 months total * -95% Coding * -5% commenting * 100+ hours * } * ✅ Updates: { * Updated the player control graphics and enemy plane life * graphics. * * Particle system objects updated for better run time. * * Added Enemy Balloons to the game! * } * 🔴 Bugs { * BUG: The enemy planes don't move properly when I hit the * arrow keys. They seem to keep rotating back to their * original positions. * * SOLUTION: I've had this bug to. Although I have not yet fixed * it, you can let go of all arrow keys, wait for a few * seconds, and then it should work properly. It seems to * be caused mainly when a plane veers in while you are * pressing the arrow keys at a certain time. * * If you find a bug, please let me know in the T&T so I can * try and fix it! * } * 🔷 Credits: { * Gray Wolf: Lightning function during the logo. * KWC: For code commenting, graphic inspiration, and code * techniques. * } **************************************************************/ var setup = function() { // ⬟ Define Object create constructor { / ⬇ Object constructor. This function is used to 'create' instences of objects. I don't use new, because a .create actually works better. / Object.constructor.prototype.create = function () { var obj = Object.create(this.prototype); return this.apply(obj, arguments), obj; }; //} // ⬟ Define Render Scenes constructor and instence { /* ⬇ RenderScenes constructor. This constructor declares and stores variables for the RenderScenes object. I use .create calling the above function to create an instence of RenderScenes. The event handler for RenderScenes has been split defined so that I can call scene.(function) in other objects. / var RenderScenes = function() { this.scene = "logo"; }; var scene = RenderScenes.create(); //} // ⬟ Define Transition constructor/event handler/instance { /* ⬇Transition constructor. This constructor has a run function that runs transition code. It also includes two global variables, inTrans, and transTo, which are of boolean and string type, respectively. / var inTrans = false, transTo = ""; var Transition = function() { this.time = 0; this.op = 0; this.run = function() { rectMode(CENTER); noStroke(); fill(255, 255, 255, this.op); rect(width / 2.5, height / 2.5, width 2, height * 2); if (inTrans) { if (this.time > 0 && this.time < 15) { this.op += 18; } if (this.time === 15) { scene.to(transTo); } if (this.time > 15) { this.op -= 18; } if (this.time > 30) { this.time = 0; inTrans = false; this.op = 0; } this.time++; } }; }; var transene = Transition.create(); //} // ⬟ Define Logo constructor/event handler/instance { /** ⬇ Lightning and Logo constructors/event handlers. The Lightning was written by Gray Wolf. Both are current sequence defined. Called once by a single reference variable 'logo.run()' / var Lightning = function(config) { this.minx = config.minx \|\| width/3; this.maxx = config.maxx \|\| width-width/3; this.y = config.y \|\| 0; this.length = config.length \|\| 30; this.depth = config.depth \|\| 18; this.weight = config.weight \|\| 3; this.angleRange = config.angleRange \|\| 60; //should always be less than 90 so forks always move down this.forkColor = config.forkColor \|\| color(255); this.flashColor = config.flashColor \|\| color(75); }; Lightning.prototype.fork = function(length, depth, weight, maxAngle) { var angle = 0; var valid = false; while(!valid) { angle = random(-30, 30); if(maxAngle + angle > -this.angleRange && maxAngle + angle < this.angleRange) { //ensure forks only ever within n degree area (moving downwards) valid = true; } } maxAngle+= angle; //Store the total angle depth--; strokeWeight(weight); stroke(this.forkColor); line(0, 0, 0, length); translate(0, length); //Only generate more forks for given depth if (depth >= 0) { pushMatrix(); if(angleMode === "radians") {rotate(radians(angle));} else {rotate(angle);} //rotate based on current angleMode this.fork(length, depth, weight0.75, maxAngle); popMatrix(); //Randomly add a new fork if(random() < 0.1) { angle = random(-30, 30); pushMatrix(); if(angleMode === "radians") {rotate(radians(angle));} else {rotate(angle);} //rotate based on current angleMode this.fork(length0.85, depth, weight0.5, angle); popMatrix(); } } }; Lightning.prototype.display = function() { rectMode(LEFT); fill(this.flashColor, 50); rect(0,0,width,height); pushMatrix(); translate(random(this.minx, this.maxx), this.y); rotate(random(-25,25)); this.fork(this.length, this.depth, this.weight, 0); popMatrix(); }; var lightning = new Lightning( { minx: width * 0.2, maxx: width * 0.8, y: 0, length: 50, depth: 24, weight: 4 }); var Logo = function() { var Typer = function(x,y,sz) { this.x = x; this.y = y; this.sz = sz; this.t = 0; this.type = function(txt) { textFont(createFont("times new roman")); pushMatrix(); translate(this.x,this.y); textAlign(CENTER,CENTER); textSize(this.sz); fill(255); text(txt.substring(0,this.t),-1,1); fill(0); text(txt.substring(0,this.t),0,0); popMatrix(); this.t += 0.15; }; }; this.who = new Typer(300,530,20); rectMode(LEFT); this.sLeft = function(x,y) { pushMatrix(); translate(x,y); stroke(0, 0, 0); fill(0, 0, 0); beginShape(); vertex(221,-220); bezierVertex(21,-74,65,-125,-50,-43); bezierVertex(-91,-11,-56,-14,-19,-20); bezierVertex(50,-28,45,-22,14,7); bezierVertex(-78,91,-73,76,-242,220); bezierVertex(-137,116,-150,22,-150,-87); bezierVertex(-160,-179,-90,-140,39,-154); bezierVertex(137,-169,128,-167,220,-219); endShape(); noStroke(); for(var i = 0.80; i < 1.01; i += 0.02) { pushMatrix(); translate(1,-3); scale(i); fill(128, 43, 9, 40); beginShape(); vertex(221,-220); bezierVertex(21,-74,65,-125,-50,-43); bezierVertex(-91,-11,-56,-14,-19,-20); bezierVertex(50,-28,45,-22,14,7); bezierVertex(-78,91,-73,76,-242,220); bezierVertex(-137,116,-150,22,-150,-87); bezierVertex(-160,-179,-90,-140,39,-154); bezierVertex(137,-169,128,-167,220,-219); endShape(); popMatrix(); } popMatrix(); }; this.sRight = function(x,y) { pushMatrix(); translate(x,y); stroke(0, 0, 0); fill(0, 0, 0); beginShape(); vertex(243,-220); bezierVertex(214,-187,180,-160,94,-108); bezierVertex(-133,12,11,-48,46,-39); bezierVertex(79,-33,53,7,7,46); bezierVertex(-54,97,-25,71,-226,223); bezierVertex(-54,122,-82,152,103,145); bezierVertex(186,144,152,53,155,-34); bezierVertex(157,-119,137,-103,240,-216); endShape(); noStroke(); for(var i = 0.76; i < 0.98; i += 0.02) { pushMatrix(); translate(8,-2); scale(i); fill(128, 43, 9, 40); beginShape(); vertex(243,-220); bezierVertex(214,-187,180,-160,94,-108); bezierVertex(-133,12,11,-48,46,-39); bezierVertex(79,-33,53,7,7,46); bezierVertex(-54,97,-25,71,-226,223); bezierVertex(-54,122,-82,152,103,145); bezierVertex(186,144,152,53,155,-34); bezierVertex(157,-119,137,-103,240,-216); endShape(); popMatrix(); } popMatrix(); }; this.shake = false; this.shakeTimer = 0; this.inLeft = -1000; this.inRight = 1600; this.fadeOpp = 0; this.lightningTimer = 0; this.letter = function(x,y,s,letter) { pushMatrix(); translate(x,y); textSize(s); textAlign(CENTER,CENTER); for(var i = 0; i > -6; i--) { fill(50); text(letter,i,-i); } fill(82); text(letter,0,0); popMatrix(); }; this.run = function() { background(0); if(this.inLeft < 300) { this.inLeft += 50; } else { this.shake = true; } if(this.inRight > 300) { this.inRight -= 50; } else { this.shake = true; } if(this.shake) { this.shakeTimer++; if(this.shakeTimer <= 30) { translate(random(-7,7),random(-7,7)); } else { this.who.type("ѕнєяℓσ¢к нσℓмєѕ presents..."); } if(this.shakeTimer > 280) { this.fadeOpp += 2; } if(this.fadeOpp > 255) { inTrans = true; transTo = "menu"; } } this.sz = 35; if(this.lightningTimer%this.sz === 0) { lightning.display(); } this.lightningTimer = floor(random(this.sz)); this.sRight(this.inRight,300); this.sLeft(this.inLeft,300); rectMode(LEFT); fill(0, this.fadeOpp); noStroke(); rect(0,0,width,height); resetMatrix(); }; }; var logo = new Logo(); //} // ⬟ Define global variables { /** ⬇ Global variables are not great for program efficency, but there are a few that I really need. clicked is used for when the mouse is clicked, hoverButton is used for when the mouse is over a button, and keys is an array that uses keyCode to alert the key managmenet event handler when specific keys are pushed. / var clicked, hoverButton = false; var keys = []; //} // ⬟ Define Point to Circle collision { /* ⬇ PointCircleCollide is a point to circle collision function. It takes 5 paramaters: circle x, circle y, circle size (diamater), point x, and point y; It then compares the point to the cirlce and returns the appropriate boolean value. / var PointCircleCollide = function(x,y,s,x2,y2) { return dist(x2,y2,x,y) <= s/2; }; //} // ⬟ Define specific Key and Mouse event handlers { /* ⬇ key and mouse event functions. Uses the global variable keys[] and stores the appropriate keyCode value in keys[0]. When a key is pressed, the boolean value inside of keys is set to true. Likewise, when a key is released, the boolean value is set to false. When the mouse is clicked, the boolean variable clicked is set to true. There is no mouseReleased function because clicked is automatically set to false inside of the run-time loop. / keyPressed = function() { keys[keyCode] = true; }; keyReleased = function() { keys[keyCode] = false; }; mouseClicked = function() { clicked = true; }; //} // ⬟ Define readability and rendering function { /* ⬇ Redability and Rendering functions: trans: trans if a function that groups a pushMatrix() call along with x, y, and r values for x, y, and rotate positions Dial: graphical rendering function. renders a dial for the large image storing and the in game player plane. Radar: graphical rendering function. renders a radar for the large image storing and the in game playe rplane. SherlockHolmes: Copyright sherlock holmes box on the main screen. paintEnemyPlane: paints an enemy plane for the main menu. I don't need to use the object for this one, becuase I don't want all of the event handlers to be on the main screen. Instead, just render a picture on the screen in a seperate function. circle: an ease of use function. Renders the cloud circles on the title page. outline: the circle function calls to form the title on the menu page. paintWorld: word rendering for the special outlined text on the HOW and YOU DIED page. crack: rendering of the cockpit glass gracks during the game. Used as a life indication. / var trans = function(x,y,r) { pushMatrix(); translate(x,y); rotate(r); }; var Dial = function(x,y,s,space,rot,s1,s2,r) { pushMatrix(); translate(x,y); scale(s1,s2); rotate(r); noStroke(); fill(20, 20, 20); ellipse(0.73,1.29,s1.1,s1.1); strokeWeight(s0.0384); stroke(222, 222, 222); fill(0, 0, 0); ellipse(0,0,s,s); if(space < 5) { space = 5; } for(var i = 0; i < 360; i += space) { pushMatrix(); rotate(i); strokeWeight(1); stroke(255); line(0,-s0.462,0,-s0.44); popMatrix(); } for(var i = 0; i < 360; i += space4) { pushMatrix(); rotate(i); strokeWeight(1); stroke(255); line(0,-s0.41,0,-s0.36); popMatrix(); } pushMatrix(); rotate(rot); strokeWeight(s0.05); line(0,0,0,-s0.5); popMatrix(); noFill(); noStroke(); ellipse(0,0,s,s); fill(255, 255, 255, 20); quad(s0.37,s-0.36,s0.39,s-0.30,s-0.54,s0.31,s-0.48,s0.21); quad(s0.48,s-0.20,s0.44,s-0.25,s-0.42,s0.31,s-0.39,s0.35); popMatrix(); }; var Radar = function(x,y,s,rot) { pushMatrix(); translate(x,y); noFill(); strokeWeight(1); stroke(255, 255, 255); for(var i = s; i > 5; i -= s/4) { fill(105, 94, 255, 100); ellipse(0,0,i,i); } pushMatrix(); rotate(rot); line(0,0,0,-s/2); popMatrix(); noStroke(); popMatrix(); }; var SherlockHolmes = function(x,y) { pushMatrix(); translate(x,y); textFont(createFont("times new roman")); fill(0); rectMode(CENTER); noStroke(); rect(0,0,159,37,9); strokeWeight(2); stroke(255); rect(0,0,152,30,6); fill(255); textSize(14); textAlign(CENTER,CENTER); text("© ѕнєяℓσ¢к нσℓмєѕ 2018",0,0); popMatrix(); }; var paintEnemyPlane = function(x,y,s,r) { pushMatrix(); translate(x,y); scale(s); rotate(r); noStroke(); //part 0 fill(84, 102, 46); ellipse(0,-21,3,41); ellipse(0,-11,71,3); //part 3 pushMatrix(); scale(-1,1); translate(0,0); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(130,5,-87,4,0,4); endShape(); fill(101, 122, 51); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(130,0,-87,8,0,-12); endShape(); fill(135, 128, 0); bezier(32,-4,45,5,67,0,55,-4); bezier(95,-1.67,117,-6,67,-4,71,0.57); noStroke(); fill(89, 89, 89); ellipse(42,2,5,5); fill(0); ellipse(42,2,2,2); popMatrix(); //part 1 fill(84, 102, 46); ellipse(0,0,40,40); fill(101, 122, 51); ellipse(-1,-1,36,36); //part 2 fill(84, 102, 46); beginShape(); vertex(18,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(120,5,-3,2,18,4); endShape(); fill(101, 122, 51); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(121,0,-48,8,0,-12); endShape(); fill(135, 128, 0); bezier(32,-4,45,5,67,0,55,-4); bezier(95,-1,117,-6,67,-4,71,1); noStroke(); fill(89, 89, 89); ellipse(42,2,5,5); fill(0); ellipse(42,2,2,2); pushMatrix(); rotate(70); for(var i = 0; i < 360; i += 360/3) { pushMatrix(); fill(128, 128, 128); rotate(i); translate(0,-26); beginShape(); vertex(0,-2); bezierVertex(6,5,-2,27,0,25); bezierVertex(-2,16,-6,7,0,-2); endShape(); fill(143, 143, 143); beginShape(); vertex(0,-2); bezierVertex(2,5,-1,27,0,25); bezierVertex(-2,16,-6,7,0,-2); endShape(); popMatrix(); } popMatrix(); fill(77, 77, 77); ellipse(0,0,10,10); fill(99, 99, 99); ellipse(-0.7,-1.1,8,8); popMatrix(); }; var circle = function(x,y,s) { pushMatrix(); translate(x,y); noStroke(); fill(233, 232, 255); ellipse(0,0,s,s); fill(255, 255, 255); ellipse(-3,-3,s0.8,s0.8); popMatrix(); }; var outline = function(x,y) { resetMatrix(); pushMatrix(); translate(x,y); translate(-18,-13); scale(0.80,0.80); //P circle(87,75,48); circle(90,101,44); circle(86,133,45); circle(87,162,42); circle(85,190,48); circle(123,66,48); circle(153,81,45); circle(147,113,45); circle(121,129,36); //L translate(-5,0); circle(207,70,50); circle(206,101,44); circle(206,133,44); circle(201,162,51); circle(205,190,46); circle(234,193,46); circle(261,191,43); //A translate(-6,0); circle(315,191,46); circle(317,163,45); circle(328,129,48); circle(333,100,45); circle(355,140,41); circle(346,73,45); circle(369,71,45); circle(381,95,40); circle(386,125,47); circle(389,160,44); circle(392,188,49); //N translate(-2,0); circle(450,188,49); circle(448,155,46); circle(451,126,52); circle(449,98,46); circle(465,97,41); circle(481,122,46); circle(494,151,35); circle(513,158,38); circle(516,129,38); circle(513,100,43); circle(512,70,49); circle(510,186,46); circle(449,70,48); //E translate(-6,0); circle(570,188,44); circle(567,159,41); circle(572,126,46); circle(570,97,39); circle(574,68,39); circle(600,67,42); circle(629,67,40); circle(598,129,31); circle(611,130,37); circle(599,189,40); circle(625,188,42); //S translate(-6,0); circle(748,93,42); circle(728,73,46); circle(695,73,50); circle(680,97,46); circle(698,129,44); circle(724,145,42); circle(738,167,48); circle(725,189,43); circle(694,188,48); circle(675,178,40); popMatrix(); }; var paintWord = function(word,x,y,size) { textAlign(CENTER,CENTER); var inc = 0.04; pushMatrix(); translate(x,y); fill(0, 0, 0); text(word,0-incsize,0); text(word,0+incsize,0); text(word,0,0-incsize); text(word,0,0+incsize); text(word,0-incsize,0-incsize); text(word,0-incsize,0+incsize); text(word,0+incsize,0-incsize); text(word,0+incsize,0+incsize); inc = 0.02; fill(255, 255, 255); text(word,0-incsize,0); text(word,0+incsize,0); text(word,0,0-incsize); text(word,0,0+incsize); text(word,0-incsize,0-incsize); text(word,0-incsize,0+incsize); text(word,0+incsize,0-incsize); text(word,0+incsize,0+incsize); fill(0); text(word,0,0); popMatrix(); }; var crack = function(x,y,s,r) { pushMatrix(); translate(x,y); scale(s0.25); rotate(r); strokeWeight(2); noFill(); stroke(100, 250); beginShape(); vertex(0,0); vertex(25,26); vertex(60,39); vertex(69,56); vertex(85,55); vertex(110,62); vertex(110,96); vertex(93,127); endShape(); beginShape(); vertex(0,0); vertex(-9,20); vertex(-31,46); vertex(-31,56); vertex(-9,91); vertex(-21,116); vertex(-49,128); vertex(-50,148); endShape(); beginShape(); vertex(0,0); vertex(-44,2); vertex(-87,-19); vertex(-109,-12); vertex(-174,-17); vertex(-222,2); vertex(-215,37); vertex(-241,47); endShape(); beginShape(); vertex(0,0); vertex(-32,-44); vertex(-21,-78); vertex(27,-106); vertex(67,-85); vertex(111,-70); vertex(137,-89); vertex(143,-131); endShape(); beginShape(); vertex(0,0); vertex(18,-9); vertex(67,-4); vertex(86,-34); vertex(103,-38); vertex(111,-70); vertex(165,-31); vertex(216,-39); endShape(); popMatrix(); }; var need = 3; var health = function(x,y,s,l) { pushMatrix(); translate(x,y); scale(s); need += 0.1(l-need); noStroke(); fill(65, 255, 48); quad((-need)(70/3),-10,70,-10,80,10,-need(70/3)+10,10); noFill(); strokeWeight(2); stroke(100); quad(-70,-10,70,-10,80,10,-60,10); popMatrix(); }; var paintBalloonGraphic = function(x,y,s,s2,r,hit) { pushMatrix(); translate(x,y); scale(s,s2); rotate(r); translate(0,20); rectMode(LEFT); noStroke(); if(!hit) { fill(4, 0, 255); beginShape(); vertex(-4,-7); bezierVertex(-4,-15,-17,-28,-4,-33); bezierVertex(-2,-34,5,-35,9,-30); bezierVertex(12,-23,6,-21,4,-8); bezierVertex(3,-7,2,-5,-4,-7); endShape(); for(var i = 0; i > -15; i -= 3) { fill(0, 0, 0, 20); beginShape(); vertex(-4,-7); bezierVertex(-4,-15,-17,-28,-4,-33); bezierVertex(-2,-34,5,-35,i+9,-30); bezierVertex(i+12,-23,i+6,-21,(i0.6)+4,-8); bezierVertex(3,-7,2,-5,-4,-7); endShape(); } rectMode(LEFT); fill(171, 148, 0); rect(-5,0,10,10, 3); for(var i = 0; i > -10; i -= 1) { noStroke(); fill(0, 0, 0, 12); rect(-5,1,10+i,9,3); } noStroke(); fill(0); rect(-3,-7,1,8); rect(2,-7,1,7); } else if(hit) { noStroke(); fill(171, 148, 0); rect(-5,0,10,10, 3); noStroke(); fill(0); rect(-3,-7,1,8); rect(2,-7,1,7); for(var i = 0; i > -10; i -= 1) { noStroke(); fill(0, 0, 0, 12); rect(-5,1,10+i,9,3); } } popMatrix(); }; //} // ⬟ Define large graphical images { /** ⬇ Large graphical image getting. Includes * planeCockpig * skyBackdrop * gradientSky * title These graphics are a little larger than normal for a game. I use images to access them without lag. Make the graphic once, store it in memory as an image, and then call a single image instead of 10-several hundred lines of code every time I want to render it. / var images = { "planeCockpit": function() { fill(69, 69, 69); noStroke(); beginShape(); vertex(71,554); bezierVertex(22,537,-72,529,-7,514); bezierVertex(22,552,-107,541,35,624); endShape(); fill(61, 61, 61); beginShape(); vertex(71,563); bezierVertex(22,544,-72,539,-7,514); bezierVertex(22,552,-107,541,35,624); endShape(); pushMatrix(); scale(-1,1); translate(-600,0); fill(69); beginShape(); vertex(71,554); bezierVertex(22,537,-72,529,-7,514); bezierVertex(22,552,-107,541,35,624); endShape(); fill(61, 61, 61); beginShape(); vertex(71,563); bezierVertex(22,544,-72,539,-7,514); bezierVertex(22,552,-107,541,35,624); endShape(); popMatrix(); //middle quad braces fill(40); quad(200,412,226,202,250,201,184,609); pushMatrix(); scale(-1,1); translate(-594,0); fill(40); quad(200,412,226,202,250,201,184,609); popMatrix(); //middle quad braces inside detail fill(50); quad(212,412,244,202,250,201,184,609); quad(200,412,226,202,230,201,180,609); for(var i = 200; i < 384; i += 20) { fill(26, 26, 26); ellipse(258-i0.126,16+i,5+(height-i)0.00,5+(height-i)0.00); fill(48, 48, 48); ellipse(259-i0.126,16+i,5+(height-i)0.00,5+(height-i)0.00); } pushMatrix(); scale(-1,1); translate(-593,0); //middle quad braces inside detail fill(50); quad(212,412,244,202,250,201,184,609); quad(200,412,226,202,230,201,180,609); for(var i = 200; i < 384; i += 20) { fill(26, 26, 26); ellipse(258-i0.126,16+i,5+(height-i)0.00,5+(height-i)0.00); fill(48, 48, 48); ellipse(259-i0.126,16+i,5+(height-i)0.00,5+(height-i)0.00); } popMatrix(); //target noFill(); stroke(0, 0, 0); strokeWeight(1); //ellipse(300,338,20,20); line(300,338-2,300,338+2); line(300-2,338,300+2,338); strokeWeight(2); fill(0, 0, 0, 30); stroke(26, 26, 26); ellipse(300,338,45,45); noStroke(); //target holder shading fill(74, 74, 74); beginShape(); vertex(278,333); bezierVertex(274,361,319,372,323,336); bezierVertex(323,363,323,373,323,369); bezierVertex(323,363,323,373,277,369); endShape(); //target holder fill(26); beginShape(); vertex(277,333); bezierVertex(273,366,322,373,323,337); bezierVertex(323,363,323,373,323,369); bezierVertex(323,363,323,373,277,369); endShape(); //top arch on the motherboard strokeCap(ROUND); noFill(); strokeWeight(60); stroke(50); arc(300,702,400,619,247,292); noStroke(); //motherboard dial backdrop fill(61, 61, 61); ellipse(300,674,518,574); fill(45); ellipse(300,688,502,574); for(var i = 0; i < 100; i += 5) { fill(0, 0, 0, 5); ellipse(300,688+i,502,574); } //top left plane window brace fill(50); beginShape(); vertex(18,0); bezierVertex(83,44,168,135,208,211); bezierVertex(207,216,199,221,197,217); bezierVertex(142,130,61,62,-28,0); endShape(); //top right plane window brace pushMatrix(); scale(-1,1); translate(-600,0); beginShape(); vertex(18,0); bezierVertex(83,44,168,135,208,211); bezierVertex(207,216,199,221,197,217); bezierVertex(142,130,61,62,-28,0); endShape(); popMatrix(); //middle arch brace beginShape(); vertex(45,600); bezierVertex(119,333,150,175,300,176); bezierVertex(368,180,446,172,552,601); bezierVertex(368,633,446,627,528,600); bezierVertex(438,209,367,198,300,197); bezierVertex(168,202,168,270,64,617); endShape(); //shade on the middle arch brace fill(82, 82, 82); beginShape(); vertex(45,600); bezierVertex(119,333,150,175,300,176); bezierVertex(368,180,446,172,552,601); bezierVertex(368,633,446,627,546,600); bezierVertex(454,209,377,178,300,179); bezierVertex(181,178,129,270,46,617); endShape(); //middle top quad brace rectMode(CENTER); noStroke(); fill(56, 56, 56); quad(183,250,174,262,418,262,409,250); fill(31, 31, 31); quad(175,266,174,262,418,262,416,264); //bottom two rects on the motherboard fill(0); rect(300,565,114,18); fill(31, 31, 31); rect(300,587,114,31); rect(300,553,114,18); fill(61, 61, 61); rect(300,542,114,3); //rect next to the above fill(23, 23, 23); rect(361,576,8,66); fill(41, 41, 41); rect(450,584,93,47); fill(51, 51, 51); rect(448,587,93,47); fill(69, 69, 69); quad(364,543,397,543,418,607,364,613); //Dials and 3 Radars Dial(146,505,32,360/24,-20+random(-2,2)); Dial(183,474,37,360/10,103+random(-2,2)); Dial(206,522,30,360/15,38+random(-2,2)); Dial(262,515,30,360/18,38+random(-2,2)); Dial(301,515,33,360/12,161+random(-2,2)); Dial(339,515,30,360/20,263+random(-2,2)); Dial(431,526,14,360/7,303+random(-2,2)); Dial(431,504,14,360/7,388+random(-2,2)); Dial(431,481,14,360/7,365+random(-2,2)); Dial(428,582,17,360/11,491+random(-2,2)); Dial(463,582,17,360/5,411+random(-2,2)); Dial(392,516,20,360/8,323+random(-2,2)); Dial(392,470,32,360/16,418+random(-2,2)); Dial(292,481,12,360/6,418+random(-2,2)); Dial(321,481,12,360/6,418+random(-2,2)); Radar(131,564,35,-46+random(-2,2)); Radar(267,469,25,67+random(-2,2)); Radar(472,530,35,161+random(-2,2)); //left rect with 2 dials on it stroke(51, 51, 51); strokeWeight(2); fill(66, 66, 66); rect(202,608,79,100); noStroke(); //2 Dials on the left rect Dial(179,579,21,360/8,523+random(-2,2)); Dial(219,579,21,360/8,312+random(-2,2)); //caved in rect on the top right motherboard fill(33, 33, 33); ellipse(233,448,35,35); fill(46, 46, 46); ellipse(234,450,34,34); //speaker bottom rect fill(23, 23, 23); ellipse(337,597,21,41); strokeWeight(1); for(var i = 582; i < 600; i += 3) { stroke(0); line(331,i,342,i); } strokeWeight(2.12); noFill(); stroke(51, 51, 51); ellipse(337,600,18,41); line(337,581,337,600); //shiny metal thing on the top of the motherboard noStroke(); fill(161, 161, 161); rect(300,421,25,19,5); for(var i = 0; i < 25; i++) { fill(255, 10); rect(300,421,i,19); } //shading metal thing rectMode(LEFT); for(var i = 0; i < 16; i++) { fill(0, 0, 0, 15); rect(313,413.9,-i,16.9); } //indented rect thing next to the shiny metal thing rectMode(CENTER); fill(36, 36, 36); rect(278,429,15,24,5); fill(45); rect(279,430,13,23,5); fill(74, 92, 74); rect(300,420,25,7); fill(45); ellipse(300,430,31,6); ellipse(300,412,31,6); //three circles on left top of the motherboard fill(77, 77, 77); ellipse(250,428,4,4); ellipse(259,428,4,4); ellipse(254,421,4,4); //three circles on right top of the motherboard fill(77, 77, 77); ellipse(339,428,4,4); ellipse(346,431,4,4); ellipse(345,424,4,4); fill(20, 20, 20); ellipse(349,468,20,20); fill(163, 0, 0); ellipse(349,467,18,18); for(var i = 18; i > 0; i--) { fill(0, 0, 0, 9); ellipse(349,467,i,i); } for(var i = 0; i < 34; i += 7) { noStroke(); fill(128, 128, 128); rect(288+i,449,3,10); } fill(110, 110, 110); ellipse(319,465,7,7); fill(46, 46, 46); arc(314,463,25,18,57,182); fill(38, 38, 38); arc(315,461,25,18,57,182); return get(0,0,600,600); }, "skyBackdrop": function() { var c1 = color(164, 161, 255); var c2 = color(209, 207, 255); for(var i = 0; i < height; i += 2) { strokeWeight(2); stroke(lerpColor(c1,c2,i/600)); line(0,i,width,i); } var fade = -900; var xoff = 10.0; var yoff = 0.0; scale(2); pushMatrix(); translate(280,120); rotate(196); for (var x = -10; x < width/3; x++) { fade = -750; var yoff = 0.0; for (var y = 0; y < 100; y++) { var bright = map(noise(xoff, yoff), 0, 1, fade, 500); stroke(235, 235, 235, bright); point(x, y); yoff += 0.05; fade += 7; } xoff += 0.05; } popMatrix(); resetMatrix(); translate(0,130); var fade = -900; var xoff = 15.0; var yoff = 10.0; scale(2); pushMatrix(); translate(100,-10); rotate(130); for (var x = -30; x < 128; x++) { fade = -750; var yoff = 0.0; for (var y = 0; y < 100; y++) { var bright = map(noise(xoff, yoff), 0, 1, fade, 500); stroke(235, 235, 235, bright); point(x, y); yoff += 0.05; fade += 7; } xoff += 0.05; } popMatrix(); resetMatrix(); fade = -900; xoff = 20.0; yoff = 0.0; scale(2); pushMatrix(); translate(0,140); for (var x = 0; x < 150; x++) { fade = -807; var yoff = 0.0; for (var y = 0; y < 100; y++) { var bright = map(noise(xoff, yoff), 0, 1, fade, 500); stroke(235, 235, 235, bright0.4); point(x, y); yoff += 0.05; fade += 7; } xoff += 0.05; } popMatrix(); resetMatrix(); fade = -900; xoff = 0.0; yoff = 0.0; scale(2); pushMatrix(); translate(202,140); for (var x = -100; x < 100; x++) { fade = -807; var yoff = 0.0; for (var y = 0; y < 100; y++) { var bright = map(noise(xoff, yoff), 0, 1, fade, 500); stroke(235, 235, 235, bright0.4); point(x, y); yoff += 0.05; fade += 7; } xoff += 0.05; } popMatrix(); resetMatrix(); noStroke(); for(var i = 0; i < 50; i += 2) { fill(255, 255, 255, 1); rect(0,480,width,-i); } return get(0,0,width,height); }, "gradientSky": function() { var topColor = color(61, 116, 179); var bottomColor = color(148, 182, 255); for(var i = 0; i < height; i += 2) { strokeWeight(2); stroke(lerpColor(color(topColor),color(bottomColor),i/height)); line(1,i,600,i); } return get(0,0,width,height); }, "title": function() { textAlign(CENTER,CENTER); textFont(createFont("Arial Black")); for(var i = 0; i < 400; i += 10) { noStroke(); fill(255, 5); ellipse(width/2,140,i2,i); } var turn = 1; for(var i = 268; i > 212; i -= 5) { strokeWeight(3); stroke(38, 0, 255); line(-450+i2.30,i,183-(-turnturn),i); line(1039-i2.30,i,406,i); strokeWeight(2); stroke(0, 0, 0); line(-450+i2.30,i,183-(-turnturn),i); line(1039-i2.30,i,406,i); turn += 0.33; } textSize(350); fill(0); text("2",width/2-2,140+2); fill(0, 0, 179); text("2",width/2,140); outline(0,49); return get(0,0,width,350); } }; //} // ⬟ Define Button constructor/event handlers/instances { /** ⬇ Button object constructor/event handlers/instances Define all of the different Buttons in the game. This includes event handlers for drawing and mouse clicking. / var Button = function(x,y,w,h,c,txt,nxt) { this.x = x; this.y = y; this.w = w; this.h = h; this.c = c; this.txt = txt; this.nxt = nxt; this.draw = function() { textFont(createFont("Arial Black")); if(mouseX > this.x-(this.w/2) && mouseX < this.x+(this.w/2) && mouseY > this.y-(this.h/2) && mouseY < this.y+(this.h/2) \|\| dist(mouseX,mouseY,this.x-(this.w/2),this.y) < this.h/2 \|\| dist(mouseX,mouseY,this.x+(this.w/2),this.y) < this.h/2) { hoverButton = true; rectMode(CENTER); pushMatrix(); translate(this.x,this.y); if(clicked) { scene.redoAll(); scale(0.9,0.9); inTrans = true; transTo = this.nxt; } else { scale(1.1,1.1); } for(var i = 0; i < 4; i++) { pushMatrix(); translate(i1.1,i); scale(1.03,1.13); noStroke(); fill(0, 0, 0, 50); rect(0,0,this.w,this.h); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); popMatrix(); } noStroke(); fill(c); rect(0,0,this.w+2,this.h); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); strokeWeight(5); stroke(0); line(-this.w/2,-this.h/2,this.w/2,-this.h/2); line(-this.w/2,this.h/2,this.w/2,this.h/2); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); textSize(this.h0.47); textAlign(CENTER,CENTER); for(var i = 0; i < 2.9; i++) { fill(0, 0, 0, 100); text(this.txt,i,i); } fill(255); text(this.txt,0,0); popMatrix(); } else { rectMode(CENTER); pushMatrix(); translate(this.x,this.y); for(var i = 0; i < 4; i++) { pushMatrix(); translate(i1.1,i); scale(1.03,1.13); noStroke(); fill(0, 0, 0, 50); rect(0,0,this.w,this.h); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); popMatrix(); } noStroke(); fill(c); rect(0,0,this.w,this.h); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); strokeWeight(5); stroke(0); line(-this.w/2,-this.h/2,this.w/2,-this.h/2); line(-this.w/2,this.h/2,this.w/2,this.h/2); arc(-this.w/2+0.5,0.5,this.h,this.h,90,270); arc(this.w/2+0.5,0.6,this.h,this.h,-90,90); textSize(this.h0.47); textAlign(CENTER,CENTER); for(var i = 0; i < 2.9; i++) { fill(0, 0, 0, 100); text(this.txt,i,i); } fill(255); text(this.txt,0,0); popMatrix(); } }; }; var Buttons = { play: Button.create(300,400,169,59,color(207, 0, 0),"P L A Y","game"), how: Button.create(300,483,135,51,color(0, 0, 214),"H O W","how"), back: Button.create(300,550,135,51,color(186, 96, 0),"B A C K","menu"), replay: Button.create(300,463,169,59,color(212, 219, 0),"R E P L A Y","game"), }; //} // ⬟ Define Target constructor/event handlers/instance { /* ⬇ TargetFinder is the sights during the plane. This is not part of the image. This is live run-time object calling. It is tested to see if it is inside of the main plane body and then responds appropriately. / var TargetFinder = function(x,y,s) { this.x = x; this.y = y; this.s = s; this.r = 0; this.speed = 0.05; this.draw = function() { pushMatrix(); translate(x,y); noFill(); strokeWeight(1); stroke(0, 0, 0); arc(0,0,s,s,-45,45); arc(0,0,s,s,180-45,180+45); rotate(this.r); noStroke(); fill(0); for(var i = 0; i < 360; i += 360/4) { pushMatrix(); rotate(i); if(this.align) { translate(0,-2+sin(millis()0.3)2); } triangle(-0.08s,-0.3s,0.08s,-0.3s,0.0s,-0.1s); popMatrix(); } if(this.align) { this.r = sin(millis()this.speed)160; } else { this.r = 0; } popMatrix(); }; this.quicken = function() { this.align = true; }; this.slowdown = function() { this.align = false; }; }; var targetFinder = TargetFinder.create(300,338,35); //} // ⬟ Define Count constructor/event handler/instance { /* ⬇ The Plane counter counts how many planes the user has shot down. Includes a single increment prototype. / var Counter = function() { this.c = 0; this.cb = 0; this.inc = function() { this.c++; }; this.incB = function() { this.cb++; }; this.redo = function() { this.c = 0; this.cb = 0; }; }; var count = Counter.create(); //} // ⬟ Define in game background rendering { /* ⬇ Live cloud rendering. This helps to create the 3D effect of flying. Only includes a single rendering prototype. / var Sky = function() { this.x = []; this.y = []; this.s = []; this.xSpeed = []; this.ySpeed = []; this.sSpeed = []; this.opp = []; for(var i = 0; i < 50; i++) { this.x.push(random(200,400)); this.y.push(random(200,400)); this.s.push(random(0.5,1.5)); this.xSpeed.push(random(-5,5)); this.ySpeed.push(random(-5,5)); this.sSpeed.push(random(0.01,0.1)); this.opp.push(random(45)); } this.draw = function() { for(var i = this.x.length-1; i >= 0; i--) { pushMatrix(); translate(this.x[i],this.y[i]); scale(this.s[i]); noStroke(); fill(255, 255, 255, this.opp[i]); ellipse(0,0,150,150); this.x[i] += this.xSpeed[i]; this.y[i] += this.ySpeed[i]; this.s[i] += this.sSpeed[i]; this.opp[i] -= 0.5; if(this.opp[i] < 0) { this.x.splice(i,1); this.y.splice(i,1); this.s.splice(i,1); this.xSpeed.splice(i,1); this.ySpeed.splice(i,1); this.sSpeed.splice(i,1); this.opp.splice(i,1); this.x.push(random(200,400)); this.y.push(random(200,400)); this.s.push(0.5); this.xSpeed.push(random(-5,5)); this.ySpeed.push(random(-5,5)); this.sSpeed.push(random(0.01,0.1)); this.opp.push(random(45)); } popMatrix(); } }; }; var paintSky = Sky.create(); //} // ⬟ Define Player constructor/instance { /* ⬇ Plane constructor and instance. I split-define the player to be able to use it's prototypes inside of the enemy plane event handlers. / var Plane = function() { this.dir = "center"; this.dirY = "center"; this.hitNum = 0; this.dieTime = 0; }; var plane = Plane.create(); //} // ⬟ Define bullet rendering and even handlers { /* ⬇ Includes two different objects. A single Bullet object which allows for shooting from anywhere on the screen (with appropriate rotation) to fly to a single point and then splice out of the array. The second object makes use of the previously defined Bullet constructor/event handlers to create a specific rendering setup for the player gameplay. / var Bullet = function(x,y,r,s,s2) { this.x = x; this.y = y; this.r = r; this.s = s; this.s2 = s2; this.dx = 1; this.dy = 1; this.draw = function() { pushMatrix(); translate(this.x,this.y); scale(this.s,this.s2); rotate(this.r); rectMode(CENTER); noStroke(); fill(0, 0, 0); rect(0,0,3,7); ellipse(0.35,-3,2.79,12.4); popMatrix(); }; this.target = function(x,y) { resetMatrix(); this.dx = x-this.x; this.dy = y-this.y; this.x += 0.1this.dx; this.y += 0.1this.dy; this.setx = x; this.sety = y; }; this.atTarget = function() { if(dist(this.x,this.y,this.setx,this.sety) < 15) { return true; } }; }; var Shooter = function() { this.bullets = []; this.bullets2 = []; this.reload = false; this.reloadTime = 0; this.o = 10; this.c = color(255, 159, 41); this.num = 360; this.resetGun = false; }; var shooter = Shooter.create(); //} // ⬟ Define smoke rendering { /* ⬇ Smoke rendering for whenever an enemy plane is hit. It renders a little puff of smoke that quickly splices out of itself. No specific instance is made because an array is stored inside of the enemy plane object. / var Smoke = function(xPos,yPos) { this.xPos = xPos; this.yPos = yPos; this.x = []; this.y = []; this.s = []; this.sp = []; this.spy = []; this.opp = []; this.num = 15; this.done = false; for(var i = 0; i < this.num; i++) { this.x.push(0); this.y.push(0); this.s.push(random(50,120)); this.sp.push(random(-10,10)); this.spy.push(random(-10,10)); this.opp.push(random(150)); } this.draw = function() { for(var i = this.x.length-1; i >= 0; i--) { pushMatrix(); translate(this.xPos,this.yPos); noStroke(); fill(100, this.opp[i]); pushMatrix(); translate(this.x[i],this.y[i]); ellipse(0,0,this.s[i],this.s[i]); popMatrix(); this.x[i] += this.sp[i]; this.y[i] += this.spy[i]; this.opp[i] -= 5; if(this.opp[i] <= 0) { this.x.splice(i,1); this.y.splice(i,1); this.s.splice(i,1); this.sp.splice(i,1); this.spy.splice(i,1); this.opp.splice(i,1); } popMatrix(); } if(this.opp.length === 0) { this.done = true; } }; this.gone = function() { return this.done; }; }; //} // ⬟ Define steam rendering/instances { /* ⬇ Steam rendering is the little stream of steam comming from the motherboard of the player plane image during the death sequence. Includes 3 specific steam x/y positions. / var SteamParticle = function (x, y) { this.init(x, y); }; SteamParticle.prototype.init = function (x, y) { this.x = x; this.y = y; this.xp = random(-2,2); this.yp = random(2,5); this.opacity = random(255); }; SteamParticle.prototype.execute = function () { fill(200, this.opacity); ellipse(this.x, this.y, 7, 7); this.x += this.xp; this.y -= this.yp; this.opacity -= 15; if (this.opacity <= 0) { this.init(random(-1,1), random(-1,1)); } }; var Steam = function (x, y) { this.init(x,y); }; Steam.prototype.init = function (x, y) { this.xPos = x; this.yPos = y; this.particles = []; this.done = false; for (var i = 0; i < 30; i++) { this.particles.push(SteamParticle.create(0,0)); } }; Steam.prototype.draw = function () { noStroke(); pushMatrix(); translate(this.xPos,this.yPos); for (var i = 29; i >= 0; i--) { this.particles[i].execute(); } popMatrix(); }; Steam.prototype.gone = function () { return this.done; }; var s = Steam.create(318, 461); var s2 = Steam.create(337, 601); var s3 = Steam.create(144, 506); //} // ⬟ Define enemy object smoke rendering { /* ⬇ planeSmoke is the object that is used to create the smoke rendering when a plane has been hit. It is then used in the enemy plane even handlers. / var planeSmoke = function() { this.ps = []; this.draw = function() { for(var i in this.ps) { this.ps[i].draw(); if(this.ps[i].gone()) { this.ps.splice(i,1); } } }; this.add = function() { this.ps.push(new Smoke(300,338)); }; }; var pSmoke = planeSmoke.create(); //} // ⬟ Define enemy object constructor { /* ⬇ Define the EnemyPlane constructor. EnemyPlane must be split defined in order for it to be reference inside of the ePlane object where all of the EnemyPlane instances are handled. / var EnemyPlane = function(x,y,r,s) { this.t = random(100); this.n = random(1000); this.x = x; this.y = y; this.r = r; this.s = s; this.firing = false; this.inLine = false; this.inVear = false; this.propRot = 0; this.px = [0,0,0,0,0]; this.py = [0,0,0,0,0]; this.pr = [0,0,0,0,0]; this.dx = []; this.dy = []; this.dr = []; this.setdx = []; this.setdy = []; this.setdr = []; this.crashInit = false; this.vearInit = false; this.lives = 7; this.goVearIn = false; this.vearDir = ""; this.d2 = 5; this.shakeTimer = 0; this.shakeIt = false; this.o = 10; this.c = color(255, 159, 41); this.shootNum = 0; this.shooting = false; this.ran = 10; this.shootTimer = 0; this.canShoot = false; }; //} // ⬟ Define enemy object array hold constructor/instance { /* ⬇ ePlanes is the object that handels all of the enemy planes during gameplay. It must be split-defined to be properly used along with the EnemyPlane prototypes. / var ePlanes = function() { this.ep = []; this.generalX = 0; this.generalY = 0; this.generalPlaneDir = "center"; this.generalPlaneYDir = "center"; this.r = 0; this.d = 0; this.amt = 10; this.yMAX = 5; this.yVEL = 0; this.yACC = 0.2; this.onIndex = 0; this.poof = false; for(var i = 0; i < 4; i++) { this.ep.push(new EnemyPlane(random(-1000,1000),random(350),0,random(0.3,0.8))); } }; var paintEnemyPlanes = ePlanes.create(); //} // ⬟ Define enemy object event handlers { /* ⬇ EnemyPlane event handlers and rendering. These event handlers are called inside of the ePlane event handler to make the enemy planes workable during game play. The rendering also includes x,y, and r parts of the image to allow for the flyapart during crash. / EnemyPlane.prototype.shoot = function() { pushMatrix(); translate(this.x,this.y); scale(this.s0.8); pushMatrix(); translate(43,-532); noStroke(); fill(this.c, random(200,255)); triangle(5,538,12,535,7+random(-this.o,this.o),525); fill(this.c, random(200,255)); triangle(12,533,9,542,18+random(-this.o,this.o),529); fill(this.c, random(200,255)); triangle(5,534,13,536,7+random(-this.o,this.o),542); fill(this.c, random(200,255)); triangle(15,533,4,538,9+random(-this.o,this.o),545); popMatrix(); pushMatrix(); translate(-41,-533); scale(-1,1); noStroke(); fill(this.c, random(200,255)); triangle(5,538,12,535,7+random(-this.o,this.o),525); fill(this.c, random(200,255)); triangle(12,533,9,542,18+random(-this.o,this.o),529); fill(this.c, random(200,255)); triangle(5,534,13,536,7+random(-this.o,this.o),542); fill(this.c, random(200,255)); triangle(15,533,4,538,9+random(-this.o,this.o),545); popMatrix(); popMatrix(); this.hitFeild = ceil(random(300)); if(this.hitFeild === 5) { plane.hit(); } }; EnemyPlane.prototype.draw = function() { pushMatrix(); translate(this.x,this.y); rotate(this.r); scale(this.s); noStroke(); fill(255, 0, 0); rectMode(CENTER); if(this.lives > 0) { rect(0,-35,this.lives10,3); } //part 0 trans(this.px[0],this.py[0],this.pr[0]); fill(84, 102, 46); ellipse(0,-21,3,41); ellipse(0,-11,71,3); popMatrix(); //part 3 trans(this.px[3],this.py[3],this.pr[3]); pushMatrix(); scale(-1,1); translate(0,0); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(130,5,-87,4,0,4); endShape(); fill(101, 122, 51); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(130,0,-87,8,0,-12); endShape(); fill(135, 128, 0); bezier(32,-4,45,5,67,0,55,-4); bezier(95,-1.67,117,-6,67,-4,71,0.57); noStroke(); fill(89, 89, 89); ellipse(42,2,5,5); fill(0); ellipse(42,2,2,2); popMatrix(); popMatrix(); //part 1 trans(this.px[1],this.py[1],this.pr[1]); fill(84, 102, 46); ellipse(0,0,40,40); fill(101, 122, 51); ellipse(-1,-1,36,36); popMatrix(); //part 2 trans(this.px[2],this.py[2],this.pr[2]); fill(84, 102, 46); beginShape(); vertex(18,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(120,5,-3,2,18,4); endShape(); fill(101, 122, 51); beginShape(); vertex(0,-3); bezierVertex(-20,-4,96,-4,109,-9); bezierVertex(121,0,-48,8,0,-12); endShape(); fill(135, 128, 0); bezier(32,-4,45,5,67,0,55,-4); bezier(95,-1,117,-6,67,-4,71,1); noStroke(); fill(89, 89, 89); ellipse(42,2,5,5); fill(0); ellipse(42,2,2,2); popMatrix(); //part 4 trans(this.px[4],this.py[4],this.pr[4]); pushMatrix(); rotate(this.propRot); for(var i = 0; i < 360; i += 360/3) { pushMatrix(); fill(110); rotate(i); translate(0,-26); beginShape(); vertex(0,-2); bezierVertex(6,5,-2,27,0,25); bezierVertex(-2,16,-6,7,0,-2); endShape(); fill(143); beginShape(); vertex(0,-2); bezierVertex(2,5,-1,27,0,25); bezierVertex(-2,16,-6,7,0,-2); endShape(); popMatrix(); } popMatrix(); fill(77, 77, 77); ellipse(0,0,10,10); fill(99, 99, 99); ellipse(-0.7,-1.1,8,8); popMatrix(); if(this.firing) { fill(250, 242, 155, 200); ellipse(-42,2,6,6); ellipse(42,2,6,6); } popMatrix(); this.propRot += 28; this.n = noise(this.t); this.t += 0.005; this.newN = map(this.n, 0, 1, 0, 10); if(!this.inVear) { this.x += this.newN-4.7; } if(this.newN-4.7 < 0 && !this.inVear && !this.goVearIn) { this.d2 = -3-this.r; } else if(this.newN-4.7 > 0 && !this.inVear && !this.goVearIn) { this.d2 = 3-this.r; } this.r += 0.05this.d2; if(this.goCrash) { this.makeCrash(); } if(PointCircleCollide(this.x,this.y,40this.s,0,338)) { this.inLine = true; } else { this.inLine = false; } this.s += 0.005; if(this.s > 2) { this.vear(); this.inVear = true; } if(this.goVearIn) { this.makevearIn(this.vearDir); } if(this.shakeIt && keys[32]) { this.makeShake(5-this.lives); } this.shootNum = ceil(random(this.ran)); if(this.shootNum === 5 && this.canShoot) { this.shooting = true; } if(this.shooting) { this.shootTimer++; if(this.shootTimer >= 10) { this.shooting = false; this.shootTimer = 0; } if(this.shootTimer%2===0) { this.shoot(); } } }; EnemyPlane.prototype.vear = function() { this.d2 = -30-this.r; this.x -= this.s5; this.s += 0.05; }; EnemyPlane.prototype.vearIn = function(dir) { this.goVearIn = true; this.vearDir = dir; }; EnemyPlane.prototype.makevearIn = function(dir) { if(!this.vearInit) { this.vd = random(paintEnemyPlanes.generalX-200,paintEnemyPlanes.generalX+200); this.vearInit = true; } if(dir === "right") { this.d2 = (dist(this.x,this.y,this.vd,this.y)/30)-this.r; } else if(dir === "left") { this.d2 = -(dist(this.x,this.y,this.vd,this.y)/30)-this.r; } if(!keys[LEFT] && !keys[RIGHT]) { this.x += 0.05dist(this.x,this.y,this.vd,this.y); } if(0.05dist(this.x,this.y,this.vd,this.y) < 2) { this.goVearIn = false; } }; EnemyPlane.prototype.init = function() { for(var i = 0; i < 5; i++) { this.dx.push(random(-10,10)); this.dy.push(random(1,4)); this.dr.push(1,5); } }; EnemyPlane.prototype.crash = function() { this.goCrash = true; }; EnemyPlane.prototype.shake = function() { this.shakeIt = true; }; EnemyPlane.prototype.makeShake = function(mag) { this.x += random(-mag,mag); this.y += random(-mag,mag); }; EnemyPlane.prototype.makeCrash = function() { if(!this.crashInit) { this.init(); this.crashInit = true; count.inc(); } for(var i = 0; i < this.px.length; i++) { this.dy[i] = 1.12this.dy[i]; this.px[i] += this.dx[i]; this.py[i] += this.dy[i]; this.pr[i] += this.dr[i]; } }; EnemyPlane.prototype.hit = function() { this.lives -= 1; this.shake(); }; //} // ⬟ Define enemy object array hold even handlers { /* ⬇ Define the ePlanes event handlers/rendering. This is the actual call that is made to properly handle the enemy planes during gameplay. / ePlanes.prototype.redo = function() { this.ep.length = 0; this.generalX = 0; this.generalY = 0; this.generalPlaneDir = "center"; this.generalPlaneYDir = "center"; this.r = 0; this.d = 0; this.amt = 10; this.yMAX = 5; this.yVEL = 0; this.yACC = 0.2; this.onIndex = 0; this.poof = false; for(var i = 0; i < 4; i++) { this.ep.push(new EnemyPlane(random(-1000,1000),random(350),0,random(0.3,0.8))); } }; ePlanes.prototype.draw = function() { this.genDir = plane.dirY; this.index = 0; this.r += 0.1this.d; this.generalY += this.yVEL; if(this.generalPlaneDir === "center") { this.d = 0-this.r; } else if(this.generalPlaneDir === "left") { this.d = this.amt-this.r; } else if(this.generalPlaneDir === "right") { this.d = -this.amt-this.r; } if(this.genDir === "center") { this.yVEL /= 1.1; } else if(this.genDir === "up") { if(this.yVEL > this.yMAX) { this.yVEL = this.yMAX; } else { this.yVEL += this.yACC; } } else if(this.genDir === "down") { if(this.generalY > 25) { if(this.yVEL < -this.yMAX) { this.yVEL = -this.yMAX; } else { this.yVEL -= this.yACC; } } else { this.yVEL /= 1.1; } } pushMatrix(); translate(300,0); rotate(this.r); this.sum = 0; for(var i = this.ep.length-1; i >= 0; i--) { this.ep[i].draw(); if(plane.dir === "left") { this.ep[i].x += 5; } else if(plane.dir === "right") { this.ep[i].x -= 5; } this.ep[i].y += this.yVEL; this.sum += this.ep[i].inLine; if(this.ep[i].inLine) { this.ep[i].shoot(); } if(this.ep[i].inLine) { if(shooter.bulletThere) { this.ep[i].hit(); this.poof = true; } } if(this.poof) { pSmoke.add(); this.poof = null; } if(this.ep[i].lives <= 0) { this.ep[i].crash(); } if(this.ep[i].py[4] > 1000) { this.ep.splice(i,1); this.ep.push(new EnemyPlane(this.generalX-600,random(420),this.r,random(0.3,0.8))); if(this.ep[this.ep.length-1].x < this.generalX) { this.ep[this.ep.length-1].vearIn("right"); } else { this.ep[this.ep.length-1].vearIn("left"); } } if(this.ep[i].s >= 2 && this.ep[i].x < this.generalX-1000 \|\| this.ep[i].x > this.generalX+1000) { this.ep.splice(i,1); this.ep.push(new EnemyPlane(this.generalX-600,random(420),this.r,random(0.3,0.8))); this.ep[this.ep.length-1].vearIn("right"); } } if(this.sum !== 0) { targetFinder.quicken(); } popMatrix(); }; //} // ⬟ Define enemy balloon object { var Balloon = function(x,y,w,h) { this.x = x; this.y = y; this.w = 19; this.h = 45; this.tiltSize = random(5,10); this.time = random(100); this.tiltSpeed = random(0.1,0.3); this.hit = false; this.inLine = false; this.fside = ceil(random(2)); this.fx = 0; this.gravity = 0.6; this.yVel = 0.01; this.jumpHeight = random(10,30); this.draw = function() { if(!this.hit) { paintBalloonGraphic(this.x,this.y,2,2,this.r,this.hit); this.r = sin(this.timethis.tiltSpeed)this.tiltSize; } else { paintBalloonGraphic(this.x,this.y,2,2,this.r,this.hit); } this.time += 10; if(PointCircleCollide(this.x,this.y-8,40,0,338) \|\| PointCircleCollide(this.x,this.y+16,23,0,338)) { this.inLine = true; } else { this.inLine = false; } }; this.dead = function() { if(this.fside === 1) { this.fx = 10; } else { this.fx = -10; } this.hit = true; this.yVel = -this.jumpHeight; }; this.fling = function() { this.yVel += this.gravity; this.y += this.yVel; this.x += this.fx; }; }; //} // ⬟ Define enemy balloons array object holder { var Ballons = function() { this.ballonsB = []; this.drop = []; this.sum = 0; this.generalX = 0; this.generalY = 0; this.generalBDir = "center"; this.generalBYDir = "center"; this.r = 0; this.d = 0; this.amt = 10; this.yMAX = 5; this.yVEL = 0; this.yACC = 0.2; for(var i = 0; i < 5; i ++) { this.ballonsB.push(new Balloon(random(paintEnemyPlanes.generalX+600,paintEnemyPlanes.generalX+1200),random(250),70,70)); this.drop.push(5); } this.draw = function() { this.genDir = plane.dirY; this.index = 0; this.r += 0.1this.d; this.generalY += this.yVEL; if(paintEnemyPlanes.generalPlaneDir === "center") { this.d = 0-this.r; } else if(paintEnemyPlanes.generalPlaneDir === "left") { this.d = this.amt-this.r; } else if(paintEnemyPlanes.generalPlaneDir === "right") { this.d = -this.amt-this.r; } if(this.genDir === "center") { this.yVEL /= 1.1; } else if(this.genDir === "up") { if(this.yVEL > this.yMAX) { this.yVEL = this.yMAX; } else { this.yVEL += this.yACC; } } else if(this.genDir === "down") { if(this.generalY > 25) { if(this.yVEL < -this.yMAX) { this.yVEL = -this.yMAX; } else { this.yVEL -= this.yACC; } } else { this.yVEL /= 1.1; } } pushMatrix(); translate(300,0); rotate(this.r); this.sum = 0; for(var i = this.ballonsB.length-1; i >= 0; i--) { if(plane.dir === "left") { this.ballonsB[i].x += 5; } else if(plane.dir === "right") { this.ballonsB[i].x -= 5; } this.ballonsB[i].y += this.yVEL; this.ballonsB[i].draw(); this.ballonsB[i].x--; if(this.ballonsB[i].hit) { this.ballonsB[i].r -= 2; this.ballonsB[i].y += this.drop[i]; this.drop[i] = 1.06; } if(this.ballonsB[i].x < paintEnemyPlanes.generalX-600) { this.ballonsB.splice(i,1); this.ballonsB.push(new Balloon(random(paintEnemyPlanes.generalX+600,paintEnemyPlanes.generalX+1200),random(250),70,70)); this.drop.splice(i,1); this.drop.push(5); } this.sum += this.ballonsB[i].inLine; if(this.ballonsB[i].inLine) { if(shooter.bulletThere) { this.ballonsB[i].dead(); count.incB(); pSmoke.add(); } } if(this.ballonsB[i].hit) { this.ballonsB[i].fling(); } } if(this.sum !== 0) { targetFinder.quicken(); } if(this.ballonsB.length < 5) { this.ballonsB.push(new Balloon(random(paintEnemyPlanes.generalX+600,paintEnemyPlanes.generalX+1200),random(250),70,70)); this.drop.push(5); } popMatrix(); }; this.redo = function() { this.ballonsB.length = 0; this.drop.length = 0; for(var i = 0; i < 5; i ++) { this.ballonsB.push(new Balloon(random(paintEnemyPlanes.generalX+600,paintEnemyPlanes.generalX+1200),random(250),70,70)); this.drop.push(5); } }; }; var newBalloons = Ballons.create(); //} // ⬟ Define shooter rendering/event handlers { /** ⬇ The event handlers/rendering for the Shooter. The constructor is defined earlier on. / Shooter.prototype.shoot = function() { this.shooting = false; if(!this.reload && this.num > 0 && !this.resetGun) { this.bullets.push(new Bullet(26,530,37,1.00,0.52)); this.bullets2.push(new Bullet(width-26,530,-33,1.00,0.52)); this.reload = true; this.shooting = true; this.num -= 4; } }; Shooter.prototype.draw = function() { this.bulletThere = false; for(var i = this.bullets.length-1; i >= 0; i--) { this.bullets[i].draw(); this.bullets[i].target(300,338); if(this.bullets[i].atTarget()) { this.bullets.splice(i,1); this.bulletThere = true; } } for(var i = this.bullets2.length-1; i >= 0; i--) { this.bullets2[i].draw(); this.bullets2[i].target(300,338); if(this.bullets2[i].atTarget()) { this.bullets2.splice(i,1); this.bulletThere = true; } } if(this.shooting) { noStroke(); fill(this.c, random(200,255)); triangle(10,538,28,542,7+random(-this.o,this.o),519); fill(this.c, random(200,255)); triangle(12,538,26,542,25+random(-this.o,this.o),518); fill(this.c, random(200,255)); triangle(8,533,21,542,34+random(-this.o,this.o),531); fill(this.c, random(200,255)); triangle(10,533,10,539,4+random(-this.o,this.o),531); pushMatrix(); scale(-1,1); translate(-600,0); fill(this.c, random(155,255)); triangle(10,538,28,542,7+random(-this.o,this.o),519); fill(this.c, random(155,255)); triangle(12,538,26,542,25+random(-this.o,this.o),518); fill(this.c, random(155,255)); triangle(8,533,21,542,34+random(-this.o,this.o),531); fill(this.c, random(155,255)); triangle(10,533,10,539,4+random(-this.o,this.o),531); popMatrix(); } if(this.reload) { this.reloadTime++; if(this.reloadTime > 5) { this.reload = false; this.reloadTime = 0; } } if(keys[16]) { this.resetGun = true; } if(this.resetGun) { if(this.num < 360) { this.num += 4; } else { this.resetGun = false; } } }; Shooter.prototype.round = function(x,y,s) { pushMatrix(); translate(x,y); scale(s); if(this.num > 0) { fill(255, 0, 0, 255-(this.num0.7)); } else { fill(255, 0, 0, 150+sin(millis()0.5)140); } ellipse(0,0,20,20); fill(0); arc(0,0,20,20,360-this.num-90,360-90); popMatrix(); }; Shooter.prototype.redo = function() { this.bullets.length = 0; this.bullets2.length = 0; this.reload = false; this.reloadTime = 0; this.num = 360; this.resetGun = false; }; //} // ⬟ Define explosion rendering/instance { /** ⬇ The player motherboard explosion that ends the death sequence. It then fades into the next scene. It is a little slow, but I don't render invisible circles to save a little on time. / var Xplode = function(xPos,yPos) { this.xPos = xPos; this.yPos = yPos; this.x = []; this.y = []; this.s = []; this.xp = []; this.yp = []; this.sp = []; this.opp = 20; this.time = 0; this.go = false; for(var i = 0; i < 100; i++) { this.x.push(0); this.y.push(0); this.s.push(random(100,150)); this.xp.push(random(-7,7)); this.yp.push(random(-9,3)); this.sp.push(random(6,12)); } this.draw = function() { if(this.go) { pushMatrix(); translate(this.xPos,this.yPos); for(var i = this.x.length-1; i >= 0; --i) { noStroke(); fill(255, 81, 0, this.opp); ellipse(this.x[i],this.y[i],this.s[i],this.s[i]); fill(255, 0, 0, this.opp); ellipse(this.x[i]0.7,this.y[i]0.7,this.s[i]0.8,this.s[i]0.8); fill(64, 64, 64, this.opp); ellipse(this.x[i]0.6,this.y[i]0.6,this.s[i]0.4,this.s[i]0.4); this.x[i] += this.xp[i]; this.y[i] += this.yp[i]; this.s[i] += this.sp[i]; if(this.opp <= 0) { this.x.splice(i,1); this.y.splice(i,1); this.s.splice(i,1); this.xp.splice(i,1); this.yp.splice(i,1); this.sp.splice(i,1); } } this.time++; if(this.time > 70) { scene.to("dead"); this.opp -= 0.4; } popMatrix(); } }; this.now = function() { this.go = true; }; this.redo = function() { this.x.length = 0; this.y.length = 0; this.s.length = 0; this.xp.length = 0; this.yp.length = 0; this.sp.length = 0; this.opp = 20; this.time = 0; this.go = false; for(var i = 0; i < 100; i++) { this.x.push(0,0); this.y.push(0,0); this.s.push(random(100,150)); this.xp.push(random(-7,7)); this.yp.push(random(-9,3)); this.sp.push(random(6,12)); } }; }; var xpl = Xplode.create(300,485); //} // ⬟ Define Player rendering/event handlers { /* ⬇ Player rendering and event handlers. The constructor for this is earlier on in the program. It was split defined so that this could be used along side with ePlane and EnemyPlane prototypes. / Plane.prototype.draw = function() { imageMode(CORNER); shooter.draw(); image(images.planeCockpit,0,0); targetFinder.draw(); shooter.round(240,360); health(513,17,1.00,3-(2this.hitNum)); if(this.hitNum >= 1) { crack(47,265,1.59,-7); } if(this.hitNum >= 2) { crack(552,215,1.71,270); } if(this.hitNum >= 3) { crack(283,75,1.94,14); this.die(); } }; Plane.prototype.hit = function() { this.hitNum++; }; Plane.prototype.die = function() { this.dieTime++; if(this.dieTime >= 50) { s.draw(); } if(this.dieTime >= 150) { s2.draw(); } if(this.dieTime >= 250) { s3.draw(); } if(this.dieTime >= 400) { xpl.now(); xpl.draw(); } }; Plane.prototype.redo = function() { this.dir = "center"; this.dirY = "center"; this.hitNum = 0; this.dieTime = 0; }; //} // ⬟ Define in game Sea rendering/instance { /** ⬇ A graphical 2D rendering of the sea. I use this to help create the effect of turning during gameplay. There is only one reference variable to call it. / var Sea = function() { this.y = []; this.c = []; this.r = 0; this.amt = 10; this.seaY = 0; this.yMAX = 5; this.yVEL = 0; this.yACC = 0.2; for(var i = 480; i < height+51; i++) { this.y.push(i); this.c.push(random(color(0, 0, 194),color(0, 0, 173))); } this.draw = function() { this.seaDir = plane.dir; this.seaDirY = plane.dirY; pushMatrix(); imageMode(CENTER); translate(300,340); rotate(this.r); image(images.skyBackdrop,0,0,700,820); resetMatrix(); translate(300,200+this.seaY); rotate(this.r); if(this.seaDir === "center") { this.d = 0-this.r; } else if(this.seaDir === "left") { this.d = this.amt-this.r; } else if(this.seaDir === "right") { this.d = -this.amt-this.r; } if(this.seaDirY === "center") { this.yVEL /= 1.1; } else if(this.seaDirY === "up") { if(this.yVEL > this.yMAX) { this.yVEL = this.yMAX; } else { this.yVEL += this.yACC; } } else if(this.seaDirY === "down") { if(this.seaY > 50) { if(this.yVEL < -this.yMAX) { this.yVEL = -this.yMAX; } else { this.yVEL -= this.yACC; } } else { this.yVEL /= 1.1; } } strokeWeight(2); for(var i = this.y.length-1; i >= 0; i--) { stroke(this.c[i]); line(-373,this.y[i]-200,width+-237,this.y[i]-200); this.y[i] += 1; if(this.y[i] > height+50) { this.y.splice(i,1); this.c.splice(i,1); this.y.push(480); this.c.push(random(color(20, 20, 200),color(20, 20, 220))); } } rectMode(LEFT); for(var i = 0; i < 50; i += 2) { noStroke(); fill(255, 15); rect(-400,279,width+150,i); } this.r += 0.1this.d; this.seaY += this.yVEL; popMatrix(); }; }; var paintSea = Sea.create(); //} // ⬟ Define keyboard managment event handlers/instance { /** ⬇ All of the key pressing in the game is handled by this object to allow for ease of management. The keyboard managmenet is called direclty from the main run-loop, not another object. / var manageKeys = function() { this.manage = function() { if(keys[RIGHT] && !keys[LEFT]) { plane.dir = "right"; paintEnemyPlanes.generalPlaneDir = "right"; } else if(keys[LEFT] && !keys[RIGHT]) { plane.dir = "left"; paintEnemyPlanes.generalPlaneDir = "left"; } else if(!keys[0]) { plane.dir = "center"; plane.dirY = "center"; paintEnemyPlanes.generalPlaneDir = "center"; } if(keys[UP] && !keys[DOWN]) { plane.dirY = "up"; } else if(keys[DOWN] && !keys[UP]) { plane.dirY = "down"; } if(keys[32]) { shooter.shoot(); } else { shooter.shooting = false; } }; }; var keyboard = manageKeys.create(); //} // ⬟ Define Scene Rendering event handlers { /* ⬇ Rendering of scenes is handled by this object. It allows for graphical rendering/reference variable calls and instante scene trasition. It also resets any variables I need with the scene trasitions. / RenderScenes.prototype.render = function() { frameRate(60); switch(this.scene) { case "logo": logo.run(); break; case "menu": image(images.skyBackdrop,-10,-63,700,830); image(images.title,0,0); paintEnemyPlane(71,457,2.71,-23); paintEnemyPlane(546,529,1.96,1); Buttons.play.draw(); Buttons.how.draw(); SherlockHolmes(300,550); break; case "game": image(images.skyBackdrop,0,0); paintSea.draw(); newBalloons.draw(); paintEnemyPlanes.draw(); pSmoke.draw(); paintSky.draw(); plane.draw(); keyboard.manage(); targetFinder.slowdown(); break; case "how": image(images.skyBackdrop,-10,-63,700,830); textSize(50); paintWord("HOW TO PLAY",width/2,79,72); textSize(22); paintWord("• Use ARROW KEYS to operate your plane\n\n• Align your SIGHTS with ENEMY PLANES\nand ENEMY BALLOONS\n\n• Press SPACE to FIRE your guns \n\n• Press SHIFT to RELOAD your guns\n\n• Avoid ENEMY FIRE",300,327,50); Buttons.back.draw(); break; case "dead": image(images.skyBackdrop,-10,-63,700,830); textFont(createFont("Arial Black")); textSize(35); paintWord("YOU WERE SHOT DOWN!",300,130,75); textSize(25); if(count.c !== 1) { paintWord("You shot down " + count.c + " planes",300,297,75); } else { paintWord("You shot down " + count.c + " plane",300, 297, 75); } if(count.cb !== 1) { paintWord("and " + count.cb + " balloons!",300,330,75); } else { paintWord("and " + count.cb + " balloon!",300,330,75); } Buttons.replay.draw(); Buttons.back.draw(); xpl.draw(); break; } cursor(hoverButton?"pointer":"default"); hoverButton = false; clicked = false; transene.run(); }; RenderScenes.prototype.to = function(nxt) { this.scene = nxt; }; RenderScenes.prototype.redoAll = function() { xpl.redo(); plane.redo(); paintEnemyPlanes.redo(); shooter.redo(); count.redo(); }; //} // ⬟ Define image rendering { /* ⬇ This allows me to call the images defined ealier on. / for(var i in images) { if (typeof images[i] !== "object") { colorMode(RGB, 255); background(0, 0, 0, 0); images[i] = images[i](); } } //} // ⬟ Define draw loop rendering { /* ⬇ The main draw function. I haven't yet figured out how do better make use of the draw function in relation to lag and run-time, but I'm working on it. Render the scene using the RenderScene object in the loop is all that is neccesary. */ draw = function() { scene.render(); }; //} }; setup();
Folds	23,28,29,36,37,50,51,55,58,3060
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgMq9guSRCgw
Votes	205
Spin-Offs	9
Type
Width	600
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	ѕнєяℓσ¢к нσℓмєѕ
Author Name	JohnHWatsonMD
Author ID	kaid_173937876131831563599968
Author Profile Access	COACH

Archive Data

Added	1 years ago, 1707881044850
Updated	10 months ago, 1739447516868
Source Deleted	unknown