Viewing Program

Program Data

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

Title	Cricket (Game)
ID	6028016370794496
Created	4 years ago, 1606137841625
Updated	4 years ago, 1606373111436
Code	/* Cricket (Game) Gray Wolf, November 2020 Based off ICC Champions Trophy 2017 Google Doodle https://www.google.com/doodles/icc-champions-trophy-2017-begins If it doesn't load straight away, try clicking on the Restart button How to play: - click to swing the bat and hit the ball (timing is everything) -- if the ball goes over the boundary on the full you get 6 points -- if the ball goes over the boundary (not on the full) you get 4 points -- you get a point for each run down the pitch - press P to pause / resume My timezone is AEST so may not respond straight away -------------------------------------------------------- Leaderboard 1 - Cloudy ☁ - 152 2 - eli uminer - 148 3 - rigsha30 - 145 4 - FinDaBeast - 136 5 - R4MP4G3 - 133 6 - 𝔾𝕃𝔸𝔻𝕀𝔸𝕋𝕆ℝ 𝕊𝕋𝕌𝔻𝕀𝕆𝕊- - 127 7 - Wyatt-Matthews - 105 8 - Ball 'o' Weed - 104 9 - Mojo1000 - 102 10 - nahuettel - 101 -------------------------------------------------------- Updates: - Added mole with OUT! sign when you get out - Updated bat/swing mechanics when miss the ball, etc. - Added flowers in the background - Added ability to swing only after the ball has been bowled - Updated scoring so more accurate Want to be notified when I create a new program? Sub here: https://www.khanacademy.org/cs/gray-wolf/4876588413698048 Credit to KWC for the setKALoopTimout() function Credit to Bob Lyon for the `new` object implementation Note: If you take a spin-off you will need to go into Settings and change the width/height to 600, save, then refresh your page / var game; //Keys/Mouse { //Key\|Button stuff var clicked = false; var hover = false; var keys = []; keyPressed = function () { keys[keyCode] = true; }; keyReleased = function () { keys[keyCode] = false; }; mouseClicked = function () { clicked = true; }; } /* @created_by MKaelin368 (KWC) (c) 2018 / var setKALoopTimeout = function (ms) { var method_name = "KAInfiniteLoopSetTimeout"; if (method_name in this) { this[method_name](ms >>> 0); } }; var Button = function (config) { this.x = config.x; this.y = config.y; this.size = config.size \|\| 60; this.content = config.content \|\| "Home"; this.textSize = config.textSize \|\| this.size / 5; this.backColor = color(240); this.textColor = color(116, 153, 72); this.func = config.func \|\| function() {}; this.draw = function () { //circles if(dist(mouseX, mouseY, this.x, this.y) <= this.size / 2) { //hover hover = true; if (clicked) { this.func(); } } if(this.content === "bat") { this.backColor = hover ? color(255, 238, 0) : color(227, 212, 7); } else { this.backColor = hover ? color(255) : color(240); } pushStyle(); textAlign(CENTER, CENTER); textSize(this.textSize); noStroke(); fill(this.backColor); ellipse(this.x, this.y, this.size, this.size); fill(this.textColor); switch(this.content) { case "play": triangle(this.x + this.size0.25, this.y, this.x - this.size0.15, this.y - this.size0.25, this.x - this.size0.15, this.y + this.size0.25); break; case "how": textSize(this.size0.6); text("?", this.x, this.y); break; case "bat": stroke(40); strokeWeight(1); fill(255); pushMatrix(); translate(this.x, this.y); rotate(40); beginShape(); vertex(-this.size 0.1, -this.size * 0.35); vertex(this.size * 0.1, -this.size * 0.35); vertex(this.size * 0.1, this.size * 0.2); vertex(0, this.size * 0.25); vertex(-this.size * 0.1, this.size * 0.2); vertex(-this.size * 0.1, -this.size * 0.35); endShape(); strokeWeight(3); line(0, this.size * 0.25, 0, this.size * 0.4); popMatrix(); break; case "replay": noFill(); stroke(this.textColor); strokeWeight(5); pushMatrix(); translate(this.x, this.y); rotate(sin(frameCount * 5) * 20); arc(0, 0, this.size * 0.6, this.size * 0.6, 1, 275); noStroke(); fill(this.textColor); translate(this.size * 0.30, -this.size * 0.18); rotate(-70); triangle(0, -this.size * 0.1, -this.size * 0.14, -this.size * 0.3, this.size * 0.14, -this.size * 0.3); popMatrix(); break; default: text(this.content, this.x, this.y); } popStyle(); }; }; var ToggleButton = function(config) { this.x = config.x \|\| 300; this.y = config.y \|\| 300; this.w = config.w \|\| 50; this.x2 = this.x + this.w; this.px = this.x; this.size = config.size \|\| 48; this.on = config.on \|\| false; this.active = this.false; this.onColor = color(122, 179, 98); this.offColor = color(133, 163, 96); this.color = this.on ? this.onColor : this.offColor; this.offTextColor = color(242, 242, 242, 200); this.onTextColor = color(242, 242, 242, 200); this.onOutlineColor = color(242, 242, 242, 200); this.offOutlineColor = color(179, 179, 179, 50); this.outlineColor = this.on ? this.onOutlineColor : this.offOutlineColor; this.hoverColor = color(50, 50); this.func = config.func \|\| function() {}; this.toggle = function() { this.on = !this.on; this.color = this.on ? this.onColor : this.offColor; this.outlineColor = this.on ? this.onOutlineColor : this.offOutlineColor; this.active = true; }; this.draw = function() { if (dist(mouseX, mouseY, this.x, this.y) <= this.size / 2 \|\| dist(mouseX, mouseY, this.x2, this.y) <= this.size / 2 \|\| ( mouseX > this.x && mouseX < this.x + this.w && mouseY > this.y - this.size / 2 && mouseY < this.y + this.size / 2)) { hover = true; if(clicked) { this.toggle(); this.func(); } } if(this.active) { if(this.on) { this.px = lerp(this.px, this.x2, 0.2); if(round(this.px) === this.x2) { this.px = this.x2; this.active = false; } } else { this.px = lerp(this.px, this.x, 0.2); if(round(this.px) === this.x) { this.px = this.x; this.active = false; } } } pushStyle(); noStroke(); fill(this.color); ellipse(this.x, this.y, this.size * 1.1, this.size * 1.1); ellipse(this.x + this.w, this.y, this.size * 1.1, this.size * 1.1); rect(this.x, this.y - (this.size * 1.1 * 0.5), this.w, this.size * 1.11); //text fill(this.onTextColor); textAlign(CENTER, CENTER); textSize(this.size * 0.35); text("ON", this.x, this.y); fill(this.offTextColor); text("OFF", this.x + this.w, this.y); fill(235); stroke(this.outlineColor); strokeWeight(2); ellipse(this.px, this.y, this.size, this.size); noStroke(); fill(this.color); triangle(this.px, this.y - this.size * 0.3, this.px, this.y + this.size * 0.3, this.px - this.size * 0.3, this.y); rect(this.px - this.size * 0.3, this.y - this.size * 0.1, this.size * 0.3, this.size * 0.2); if(game.sound) { noFill(); stroke(this.color); strokeWeight(this.size/20); arc(this.px + this.size * 0.1, this.y, this.size * 0.2, this.size * 0.2, -91, 90); arc(this.px + this.size * 0.1, this.y, this.size * 0.4, this.size * 0.4, -81, 80); } else { noFill(); stroke(this.color); strokeWeight(this.size/20); line(this.px + this.size * 0.1, this.y - this.size * 0.1, this.px + this.size * 0.25, this.y + this.size * 0.1); line(this.px + this.size * 0.1, this.y + this.size * 0.1, this.px + this.size * 0.25, this.y - this.size * 0.1); } popStyle(); }; }; var Pitcher = function(config) { this.x = config.x; this.y = config.y; this.w = 1; this.h = 1; this.by = this.y; this.py = config.py \|\| this.y + 20; //pitch point this.scale = config.scale \|\| 1; this.vy = config.vy \|\| 0; this.state = config.state \|\| "neutral"; this.reset = function() { }; this.update = function() { switch(this.state) { case "neutral": //move forward to pitch position with no arm this.y = ceil(lerp(this.y, this.py, 0.1)); break; case "stand": //move forward to pitch position with no arm this.y = ceil(lerp(this.y, this.py, 0.1)); break; case "ready": //move back to ready position with arm up this.y = lerp(this.y, this.by, 0.1); break; case "pitch": //move foward to pitch position with arm up this.y = ceil(lerp(this.y, this.py, 0.1)); if(this.y === this.py) { if(game.sound){ game.sounds.swing.audio.play(); } this.state = "pitched"; } break; case "pitched": //stay at pitched position with arm down this.y = this.py; break; } }; this.draw = function() { pushMatrix(); translate(this.x, this.y); scale(this.scale); image(game.images.snailFront, 0, 0); //draw arm in correct state switch(this.state) { case "stand": case "ready": case "pitch": pushStyle(); noFill(); stroke(150, 100, 47); strokeWeight(7); line(35, 110, 10, 55); noStroke(); fill(150, 100, 47); ellipse(10, 55, 20, 20); popStyle(); break; case "pitched": pushStyle(); noFill(); stroke(150, 100, 47); strokeWeight(7); line(35, 120, 35, 210); noStroke(); fill(150, 100, 47); ellipse(35, 210, 20, 20); popStyle(); break; } popMatrix(); }; this.go = function() { this.draw(); this.update(); }; }; var Cricket = function(config) { this.x = config.x \|\| 0; this.y = config.y \|\| 0; this.w = 1; this.h = 1; this.scale = config.scale \|\| 1; this.runs = 0; //second cricket this.x1 = config.x1 \|\| 0; this.y1 = config.y1 \|\| 0; this.w1 = 0; this.h1 = 0; this.scale1 = config.scale1 \|\| 1; this.angle = -40; //for swinging the bat this.state = config.state \|\| "neutral"; this.init = function() { this.scale = 0.7; this.w = game.images.cricketSide.width * this.scale; this.h = game.images.cricketSide.height * this.scale; //second cricket this.scale1 = 0.25; this.x1 = 250; this.y1 = 255; this.w1 = game.images.cricketFront.width * this.scale1; this.h1 = game.images.cricketFront.height * this.scale1; this.close = { x: this.x, y: this.y, w: this.w, h: this.h, scale: this.scale }; this.far = { x: this.x1, y: this.y1, w: this.w1, h: this.h1, scale: this.scale1 }; }; this.update = function() { switch(this.state) { case "neutral": //bat in neutral position (on ground) this.angle = lerp(this.angle, -40, 0.1); break; case "ready": //bat in ready position (behind back) this.angle = lerp(this.angle, 110, 0.1); break; case "hit": //swing the bat this.angle = lerp(this.angle, -120, 0.3); if(game.hitState !== "six" && game.contact) { //&& round(this.angle) === -120 //move and scale w/h this.x = lerp(this.x, this.far.x, 0.1); this.y = lerp(this.y, this.far.y, 0.1); this.w = lerp(this.w, this.far.w, 0.1); this.h = lerp(this.h, this.far.h, 0.1); this.x1 = lerp(this.x1, this.close.x, 0.1); this.y1 = lerp(this.y1, this.close.y, 0.1); this.w1 = lerp(this.w1, this.close.w, 0.1); this.h1 = lerp(this.h1, this.close.h, 0.1); if(round(this.x) === this.far.x) { this.runs++; this.x = this.close.x; this.y = this.close.y; this.w = this.close.w; this.h = this.close.h; this.x1 = this.far.x; this.y1 = this.far.y; this.w1 = this.far.w; this.h1 = this.far.h; } } break; case "back": if(game.state !== "four") { if(this.runs % 2 === 1 && this.y >= 275) { game.score+= this.runs + 1; } else if(this.runs % 2 === 0 && this.y < 275) { game.score+= this.runs + 1; } else { game.score+= this.runs; } } this.runs = 0; this.x = this.close.x; this.y = this.close.y; this.w = this.close.w; this.h = this.close.h; this.x1 = this.far.x; this.y1 = this.far.y; this.w1 = this.far.w; this.h1 = this.far.h; this.state = "neutral"; break; } }; this.bat = function() { pushMatrix(); translate(this.x + this.w * 0.53, this.y + this.h * 0.70); rotate(this.angle); pushStyle(); //arm noFill(); stroke(66, 77, 33); strokeWeight(3); line(0, 0, 0, 15); //cricket bat handle stroke(144, 107, 44); strokeWeight(5); line(0, 15, 0, 24); //cricket bat main noStroke(); fill(255); beginShape(); vertex(-2, 24); vertex(4, 24); vertex(4, 65); vertex(-2, 65); vertex(-5, 60); vertex(-5, 28); vertex(-2, 24); endShape(CLOSE); //hand noStroke(); fill(255); ellipse(0, 17, 8, 8); popStyle(); popMatrix(); }; this.draw = function() { switch(this.state) { case "neutral": case "ready": //cricket image(game.images.cricketSide, this.x, this.y, this.w, this.h); //shadow under cricket noStroke(); fill(50, 40); ellipse(this.x + this.w * 0.53, this.y + this.h * 0.97, 30, 14); //bat this.bat(); //draw other cricket image(game.images.cricketFront, this.x1, this.y1, this.w1, this.h1); break; case "hit": if(game.hitState === "six") { image(game.images.cricketSide, this.x, this.y, this.w, this.h); } else if(!game.contact) { image(game.images.cricketSide, this.x, this.y, this.w, this.h); this.bat(); } else { image(game.images.cricketBack, this.x, this.y, this.w, this.h); } //swing the bat //shadow under cricket noStroke(); fill(50, 40); ellipse(this.x + this.w * 0.53, this.y + this.h * 0.97, 30, 14); //bat if(game.hitState === "six" \|\| ~~this.angle > -80) { this.bat(); } //draw other cricket image(game.images.cricketFront, this.x1, this.y1, this.w1, this.h1); break; case "back": image(game.images.cricketSide, this.x, this.y, this.w, this.h); image(game.images.cricketFront, this.x1, this.y1, this.w1, this.h1); break; } }; this.go = function() { this.draw(); this.update(); }; }; var Wickets = function(config) { this.state = "neutral"; this.w1 = { x: 0, y: 0, angle: 0 }; this.w2 = { x: 0, y: 0, angle: 0 }; this.w3 = { x: 0, y: 0, angle: 0 }; this.b1 = 0; this.b2 = 0; this.image = function() { image(game.images.wickets, 270, 430); }; this.reset = function() { this.w1.x = 0; this.w1.y = 0; this.w1.angle = 0; this.w2.x = 0; this.w2.y = 0; this.w2.angle = 0; this.w3.x = 0; this.w3.y = 0; this.w3.angle = 0; this.b1 = 0; this.b2 = 0; }; this.update = function() { switch(this.state) { case "neutral": this.reset(); break; case "out": this.w1.x = 108; this.w1.y = 304; this.w1.angle = lerp(this.w1.angle, -20, 0.2); this.w2.x = 118; this.w2.y = 304; this.w2.angle = lerp(this.w2.angle, 5, 0.2); this.w3.x = 129; this.w3.y = 304; this.w3.angle = lerp(this.w3.angle, 10, 0.2); this.b1 = lerp(this.b1, 35, 0.2); this.b2 = lerp(this.b2, 37, 0.2); /* this.w1.x = lerp(this.w1.x, 108, 0.1); this.w1.y = lerp(this.w1.y, 304, 0.1); this.w1.angle = lerp(this.w1.angle, -20, 0.1); this.w2.x = lerp(this.w2.x, 118, 0.1); this.w2.y = lerp(this.w2.y, 304, 0.1); this.w2.angle = lerp(this.w2.angle, 5, 0.1); this.w3.x = lerp(this.w3.x, 129, 0.1); this.w3.y = lerp(this.w3.y, 304, 0.1); this.w3.angle = lerp(this.w3.angle, 10, 0.1); this.b1 = lerp(this.b1, 35, 0.2); this.b2 = lerp(this.b2, 37, 0.2); / break; } }; this.draw = function() { pushMatrix(); //translate(-180, 0); translate(-180, 0); scale(1.6); translate(180, 0); //shadow under wickets (close) noStroke(); fill(50, 40); ellipse(120, 305, 35, 15); //wickets noStroke(); fill(144, 107, 44); pushMatrix(); translate(this.w1.x, this.w1.y); rotate(this.w1.angle); translate(-this.w1.x, -this.w1.y); beginShape(); vertex(108, 304); vertex(107, 274); vertex(110, 274); vertex(110, 286); vertex(112, 285); vertex(113, 288); vertex(110, 290); vertex(111, 304); endShape(CLOSE); popMatrix(); pushMatrix(); translate(this.w2.x, this.w2.y); rotate(this.w2.angle); translate(-this.w2.x, -this.w2.y); beginShape(); vertex(118, 304); vertex(119, 274); vertex(122, 274); vertex(122, 304); endShape(CLOSE); popMatrix(); pushMatrix(); translate(this.w3.x, this.w3.y); rotate(this.w3.angle); translate(-this.w3.x, -this.w3.y); beginShape(); vertex(129, 304); vertex(131, 274); vertex(134, 274); vertex(133, 293); vertex(136, 292); vertex(136, 294); vertex(133, 298); vertex(133, 304); endShape(CLOSE); popMatrix(); pushMatrix(); translate(0, this.b1); beginShape(); vertex(107, 272); vertex(120, 272); vertex(119, 274); vertex(106, 274); endShape(CLOSE); popMatrix(); pushMatrix(); translate(0, this.b2); beginShape(); vertex(122, 271); vertex(125, 271); vertex(125, 268); vertex(127, 271); vertex(134, 271); vertex(134, 273); vertex(120, 274); endShape(CLOSE); popMatrix(); popMatrix(); }; this.go = function() { this.draw(); this.update(); }; }; var Building = function() { this.pillar = function() { noStroke(); //body of pillar fill(144, 90, 47); rect(240, 80, 25, 30); fill(109, 60, 27); rect(240, 77, 25, 3); //bottom windows fill(6, 16, 7); rect(242, 100, 3, 10); rect(247, 100, 11, 10); rect(260, 100, 3, 10); //top windows rect(242, 83, 3, 5); rect(247, 83, 3, 5); rect(255, 83, 3, 5); rect(260, 83, 3, 5); //middle windows rect(247, 90, 11, 5); rect(242, 90, 3, 5); rect(260, 90, 3, 5); //top of black bottom window fill(234, 234, 234); rect(247, 96, 11, 3); //bottom light gray fill(204, 204, 204); beginShape(); vertex(240, 77); vertex(240, 72); vertex(243, 69); vertex(262, 69); vertex(265, 72); vertex(265, 77); endShape(CLOSE); //white on top of light gray fill(234, 234, 234); rect(243, 66, 19, 3); //top light gray fill(204, 204, 204); rect(244, 65, 17, 1); rect(245, 64, 15, 1); rect(246, 63, 13, 1); fill(174, 174, 174); rect(248, 62, 9, 1); //dark gray windows fill(109, 109, 109); rect(241, 73, 6, 4); rect(248, 73, 9, 4); rect(258, 73, 6, 4); //antennas noFill(); stroke(234, 234, 234); strokeWeight(1); line(250, 57, 250, 62); line(255, 57, 255, 62); line(252, 52, 252, 89); noStroke(); fill(187, 146, 115); ellipse(250, 57, 2, 2); ellipse(255, 57, 2, 2); ellipse(252, 52, 2, 2); }; this.draw = function() { pushMatrix(); translate(-300, 100); scale(2.0); //main brown of building noStroke(); fill(144, 90, 47); rect(264, 83, 76, 27); //white stripes across building fill(234, 234, 234); rect(264, 96, 76, 3); rect(264, 86, 76, 3); //white posts at bottom noFill(); stroke(234, 234, 234); strokeWeight(1); line(268, 99, 268, 110); line(285, 99, 285, 110); line(337, 99, 337, 110); line(320, 99, 320, 110); //black windows at bottom noStroke(); fill(6, 16, 7); //left rect(270, 99, 5, 11); rect(278, 99, 5, 11); //left middle rect(287, 99, 5, 11); rect(295, 99, 5, 11); //right middle rect(305, 99, 5, 11); rect(313, 99, 5, 11); //right rect(322, 99, 5, 11); rect(330, 99, 5, 11); //top dark gray fill(109, 109, 105); rect(264, 73, 76, 10); //top white fill(234, 234, 234); rect(261, 69, 82, 4); //white posts at top noFill(); stroke(234, 234, 234); line(268, 73, 268, 88); line(285, 73, 285, 88); line(337, 73, 337, 88); line(320, 73, 320, 88); line(303, 73, 303, 88); //scoreboard stroke(234, 234, 234); fill(68, 136, 187); rect(282, 43, 40, 31); this.pillar(); pushMatrix(); translate(100, 0); this.pillar(); popMatrix(); popMatrix(); }; }; var Flower = function(config) { this.x = config.x; this.y = config.y; this.h = config.h; this.leaf = function(h, angle) { noStroke(); fill(232, 214, 0); pushMatrix(); translate(this.x, this.y - h); rotate(angle); beginShape(); vertex(0, 0); bezierVertex(-8, 15, -8, 25, 0, 30); bezierVertex(8, 25, 8, 15, 0, 0); endShape(); popMatrix(); }; this.draw = function() { pushStyle(); noFill(); stroke(232, 214, 0); strokeWeight(1); line(this.x, this.y, this.x, this.y - this.h); this.leaf(this.h 0.6, -120); this.leaf(this.h * 0.7, -120); this.leaf(this.h * 0.8, -120); this.leaf(this.h * 0.9, -120); this.leaf(this.h * 0.6, 120); this.leaf(this.h * 0.7, 120); this.leaf(this.h * 0.8, 120); this.leaf(this.h * 0.9, 120); popStyle(); }; }; var Ball = function(config) { this.x = config.x \|\| 0; this.y = config.y \|\| 0; this.size = config.size \|\| 3; this.vx = 0; this.vy = 0; this.gravity = 0.1; this.applyGravity = false; this.speed = config.speed \|\| 2; this.angle = config.angle \|\| 0; this.tx = config.tx \|\| 0; this.ty = config.ty \|\| 0; this.pIndex = 1; this.color = config.color \|\| color(227, 63, 41); this.state = config.state \|\| "neutral"; this.reset = function() { this.vx = 0; this.vy = 0; this.applyGravity = false; }; this.update = function() { this.x += this.vx; this.y += this.vy; }; this.draw = function() { this.size = constrain(map(this.y, 250, 500, 5, 12), 4, 12); switch(this.state) { case "neutral": //don't display the ball in this state break; default: noStroke(); fill(this.color); ellipse(this.x, this.y, this.size, this.size); break; } }; this.go = function() { this.draw(); //this.update(); }; }; var Mole = function(config) { this.x = config.x; this.y = config.y; this.moleCoords = { y: 485, fy: 485, ty: 350 }; this.dirtCoords = { y: 480, fy: 480, ty: 457 }; this.state = "neutral"; this.update = function() { switch(this.state) { case "neutral": //don't show anything break; case "show": if(this.dirtCoords.y !== this.dirtCoords.ty) { this.dirtCoords.y = constrain(this.dirtCoords.y - 2, this.dirtCoords.ty, this.dirtCoords.fy); } else { this.moleCoords.y = constrain(this.moleCoords.y - 4, this.moleCoords.ty, this.moleCoords.fy); } break; case "hide": if(this.moleCoords.y !== this.moleCoords.fy) { this.moleCoords.y = constrain(this.moleCoords.y + 4, this.moleCoords.ty, this.moleCoords.fy); } else { this.dirtCoords.y = constrain(this.dirtCoords.y + 2, this.dirtCoords.ty, this.dirtCoords.fy); } if(this.dirtCoords.y === this.dirtCoords.fy) { this.state = "neutral"; } break; } }; this.draw = function() { image(game.images.mole, 45, this.moleCoords.y, game.images.mole.width * 0.6, game.images.mole.height * 0.6); image(game.images.dirt, 25, this.dirtCoords.y, game.images.dirt.width * 0.6, game.images.dirt.height * 0.6); noStroke(); fill(116, 153, 72); rect(this.x, this.y, 163, 200); }; this.go = function() { if(this.state !== "neutral") { this.draw(); this.update(); } }; }; var Person = function(config) { this.x = config.x; this.y = config.y; this.bx = this.x; this.by = this.y; this.vy = 0; this.w = config.w \|\| 50; this.h = config.h \|\| 70; this.yMax = ~~random(this.h * 0.2, this.h * 0.7); this.speed = ~~random(5, 10); this.color = config.color \|\| color(random(100, 200), random(100, 200), random(100, 200)); this.feelerColor = random() < 0.5 ? this.color : color(40, 60); this.feelers = config.feelers \|\| ~~random(4); this.state = config.state \|\| "neutral"; }; Person.new = function(config) { var obj = Object.create(Person.prototype); Person.apply(obj, arguments); return obj; }; Person.prototype.update = function() { switch(this.state) { case "neutral": if(this.vy !== 0) { this.vy = ~~(lerp(this.vy, 0, 0.2)); } break; case "cheer": this.vy = abs(sin(frameCount * this.speed) * this.yMax); break; } }; Person.prototype.draw = function() { pushMatrix(); translate(this.x, this.y - this.vy); pushStyle(); switch(this.feelers) { case 1: noFill(); stroke(this.feelerColor); strokeWeight(1); line(-this.w * 0.1, -this.h * 0.4, -this.w * 0.1, -this.h * 0.7); line( this.w * 0.1, -this.h * 0.4, this.w * 0.1, -this.h * 0.7); noStroke(); fill(this.feelerColor); ellipse(-this.w * 0.1, -this.h * 0.7, this.w * 0.1, this.w * 0.1); ellipse( this.w * 0.1, -this.h * 0.7, this.w * 0.1, this.w * 0.1); break; case 2: noFill(); stroke(this.feelerColor); strokeWeight(1); line(-this.w * 0.1, -this.h * 0.4, -this.w * 0.2, -this.h * 0.7); line( this.w * 0.1, -this.h * 0.4, this.w * 0.2, -this.h * 0.7); noStroke(); fill(this.feelerColor); ellipse(-this.w * 0.2, -this.h * 0.7, this.w * 0.1, this.w * 0.1); ellipse( this.w * 0.2, -this.h * 0.7, this.w * 0.1, this.w * 0.1); break; case 3: noFill(); stroke(this.feelerColor); strokeWeight(1); bezier( -this.w * 0.1, -this.h * 0.4, -this.w * 0.2, -this.h * 0.6, -this.w * 0.5, -this.h * 0.8, -this.w * 0.7, -this.h * 0.6); bezier( this.w * 0.1, -this.h * 0.4, this.w * 0.2, -this.h * 0.6, this.w * 0.5, -this.h * 0.8, this.w * 0.7, -this.h * 0.6); break; } noStroke(); fill(this.color); ellipse(0, 0, this.w, this.h); //eyes fill(240); ellipse( this.w * 0.1, -this.h * 0.2, this.w * 0.2, this.h * 0.2); ellipse(-this.w * 0.1, -this.h * 0.2, this.w * 0.2, this.h * 0.2); fill(40); ellipse( this.w * 0.1, -this.h * 0.2, this.w * 0.1, this.h * 0.1); ellipse(-this.w * 0.1, -this.h * 0.2, this.w * 0.1, this.h * 0.1); popStyle(); popMatrix(); }; Person.prototype.go = function() { this.draw(); this.update(); }; var Snail = function(config) { this.x = config.x \|\| 0; this.y = config.y \|\| 0; this.bx = this.x; this.by = this.y; this.w = 1; this.h = 1; this.scale = config.scale \|\| 1; this.vx = config.vx \|\| 0; this.vy = config.vy \|\| 0; this.speed = config.speed \|\| 0.5; this.angle = 0; }; Snail.new = function(config) { var obj = Object.create(Snail.prototype); Snail.apply(obj, arguments); return obj; }; Snail.prototype.init = function() { //set scale and width/height based on y position this.scale = map(this.y, 200, 400, 0.05, 0.5); this.w = game.images.snailRight.width * this.scale; this.h = game.images.snailRight.height * this.scale; }; Snail.prototype.reset = function() { this.vx = 0; this.vy = 0; this.angle = 0; }; Snail.prototype.update = function() { this.x+= this.vx; this.y+= this.vy; }; Snail.prototype.draw = function() { pushMatrix(); if(this.x < width / 2) { image(game.images.snailRight, this.x, this.y, this.w, this.h); } else { image(game.images.snailLeft, this.x, this.y, this.w, this.h); } popMatrix(); }; Snail.prototype.go = function() { this.draw(); this.update(); }; var Game = function() { this.page = "load"; this.state = "neutral"; this.hitState = "neutral"; this.moleState = "neutral"; this.started = false; this.paused = false; this.counter = 0; this.screenImage = undefined; this.images = undefined; this.imageIndex = 0; this.loaded = false; this.fonts = { body: createFont("Verdana"), score: createFont("Trebuchet MS") }; this.score = 0; this.bestScore = 0; this.pitches = 0; this.BALL_SPEED_MIN = 2; this.BALL_SPEED_MAX = 6; this.ballSpeed = this.BALL_SPEED_MIN; this.gameOver = false; this.cricket = new Cricket({ x: 215, y: 315 }); this.pitcher = new Pitcher({ x: 306, y: 235, //pitch start point py: 260, //pitch point scale: 0.23 }); this.wickets = new Wickets(); this.mole = new Mole({ x: 25, y: 480 }); this.fielders = []; this.persons = []; this.trails = []; this.dusts = []; this.balloons = []; this.clouds = []; this.buttons = { play: new Button({ x: 300, y: 560, content: "play", func: function() { game.reset(); game.started = true; game.state = "start"; game.control(); } }), replay: new Button({ x: 300, y: 560, content: "replay", func: function() { game.reset(); game.started = true; game.state = "start"; game.control(); } }), bat: new Button({ x: 300, y: 560, content: "bat", func: function() { if(game.pitcher.state === "pitched") { game.state = "hit"; game.hitBall(); game.control(); } } }) }; this.sound = false; this.sounds = { pitch: getSound("retro/hit2"), hit: getSound("rpg/hit-whack"), clap: getSound("retro/thruster-long"), swing: getSound("rpg/battle-swing"), fielder: getSound("rpg/giant-hyah"), wickets: getSound("rpg/hit-thud") }; this.soundButton = new ToggleButton({ x: 25, y: 574, size: 34, w: 40, func: function() { game.sound = !game.sound; } }); this.steps = 10; //how many points in the path this.pathIndex = 0; this.origins = { x1: 307, y1: 272, x2: 300, y2: 450 }; this.paths = [ { //straight cx1: 307, cy1: 272, cx2: 301, cy2: 424, x2: 301, y2: 424 }, { cx1: 326, cy1: 338, cx2: 328, cy2: 386, x2: 315, y2: 432 }, { cx1: 340, cy1: 338, cx2: 343, cy2: 388, x2: 323, y2: 432 }, { cx1: 322, cy1: 318, cx2: 328, cy2: 362, x2: 310, y2: 413 }, { cx1: 335, cy1: 321, cx2: 344, cy2: 367, x2: 330, y2: 410 }, { cx1: 301, cy1: 322, cx2: 300, cy2: 374, x2: 304, y2: 421 }, { cx1: 287, cy1: 331, cx2: 280, cy2: 382, x2: 280, y2: 428 }, { cx1: 298, cy1: 326, cx2: 292, cy2: 358, x2: 308, y2: 398 }, { cx1: 279, cy1: 329, cx2: 277, cy2: 364, x2: 298, y2: 408 } ]; this.points = []; this.hit = false; this.sixMax = false; this.contact = false; this.ball = new Ball({ x: this.origins.x1, y: this.origins.y1 }); this.boundaryBezier = { x1: 0, y1: 245, cx1: 200, cy1: 220, cx2: 400, cy2: 220, x2: 600, y2: 245 }; this.boundaryPoints = []; this.cricketFront = function() { //shadow under cricket noStroke(); fill(50, 40); ellipse(123, 281, 62, 13); //arm - left noFill(); stroke(66, 77, 33); strokeWeight(3); bezier(128, 222, 136, 221, 150, 225, 156, 234); //arm - right bezier(109, 222, 104, 234, 102, 240, 100, 246); //cricket bat handle stroke(144, 107, 44); strokeWeight(5); line(99, 245, 93, 261); //cricket bat main noStroke(); fill(255); beginShape(); vertex(93, 260); vertex(95, 266); vertex(80, 311); bezierVertex(76, 315, 73, 312, 71, 307); vertex(86, 264); vertex(93, 260); endShape(CLOSE); //hand - left noStroke(); fill(255); ellipse(157, 240, 12, 12); //hand - right ellipse(97, 252, 12, 12); //leg - left noFill(); stroke(66, 77, 33); strokeWeight(5); line(127, 260, 128, 278); //leg - right line(117, 262, 116, 278); //feeler - left noFill(); stroke(66, 77, 33); strokeWeight(2); bezier(128, 156, 128, 126, 148, 85, 184, 87); //feeler - right bezier(113, 156, 113, 126, 95, 88, 58, 88); //body noStroke(); fill(130, 146, 58); beginShape(); vertex(130, 217); bezierVertex(132, 232, 133, 248, 131, 258); bezierVertex(126, 265, 118, 265, 112, 260); bezierVertex(109, 248, 108, 233, 109, 217); endShape(CLOSE); //strikes on body noFill(); stroke(111, 128, 54); strokeWeight(4); line(112, 226, 128, 226); line(112, 238, 129, 238); line(112, 250, 129, 250); //head noStroke(); fill(127, 149, 59); beginShape(); vertex(120, 154); bezierVertex(131, 153, 147, 158, 155, 169); bezierVertex(161, 181, 162, 199, 151, 213); bezierVertex(143, 220, 131, 223, 120, 223); bezierVertex(106, 223, 92, 216, 85, 206); bezierVertex(77, 188, 79, 174, 91, 162); bezierVertex(102, 156, 110, 155, 118, 154); endShape(CLOSE); //mouth noFill(); stroke(66, 77, 33); strokeWeight(2); bezier(104, 207, 114, 214, 126, 214, 137, 207); //eye - left fill(255, 255, 255); stroke(200); strokeWeight(1); beginShape(); vertex(152, 149); bezierVertex(165, 152, 174, 159, 175, 176); bezierVertex(172, 190, 163, 197, 151, 194); bezierVertex(138, 188, 135, 176, 134, 164); bezierVertex(135, 154, 141, 149, 152, 149); endShape(CLOSE); //eye - right beginShape(); vertex(85, 150); bezierVertex(93, 149, 100, 150, 104, 158); bezierVertex(107, 168, 108, 186, 93, 193); bezierVertex(77, 200, 66, 186, 65, 173); bezierVertex(67, 161, 74, 154, 85, 150); endShape(CLOSE); //eyeball - left noStroke(); fill(66, 77, 33); ellipse(153, 179, 33, 35); //eyeball - right ellipse(90, 179, 33, 35); //eyebrow - left noFill(); stroke(66, 77, 33); strokeWeight(2); bezier(158, 141, 167, 144, 174, 151, 180, 158); //eyebrow - right bezier(81, 142, 72, 145, 64, 151, 60, 158); }; this.cricketBack = function() { //shadow under cricket noStroke(); fill(50, 40); ellipse(123, 281, 62, 13); //arm - left noFill(); stroke(66, 77, 33); strokeWeight(3); bezier(128, 222, 136, 221, 150, 225, 156, 234); //arm - right bezier(109, 222, 104, 234, 102, 240, 100, 246); //cricket bat handle stroke(144, 107, 44); strokeWeight(5); line(99, 245, 93, 261); //cricket bat main noStroke(); fill(255); beginShape(); vertex(93, 260); vertex(95, 266); vertex(80, 311); bezierVertex(76, 315, 73, 312, 71, 307); vertex(86, 264); vertex(93, 260); endShape(CLOSE); //hand - left noStroke(); fill(255); ellipse(157, 240, 12, 12); //hand - right ellipse(97, 252, 12, 12); //eye - left fill(111, 128, 54); noStroke(); beginShape(); vertex(152, 149); bezierVertex(165, 152, 174, 159, 175, 176); bezierVertex(172, 190, 163, 197, 151, 194); bezierVertex(138, 188, 135, 176, 134, 164); bezierVertex(135, 154, 141, 149, 152, 149); endShape(CLOSE); //eye - right beginShape(); vertex(85, 150); bezierVertex(93, 149, 100, 150, 104, 158); bezierVertex(107, 168, 108, 186, 93, 193); bezierVertex(77, 200, 66, 186, 65, 173); bezierVertex(67, 161, 74, 154, 85, 150); endShape(CLOSE); //head noStroke(); fill(127, 149, 59); beginShape(); vertex(120, 154); bezierVertex(131, 153, 147, 158, 155, 169); bezierVertex(161, 181, 162, 199, 151, 213); bezierVertex(143, 220, 131, 223, 120, 223); bezierVertex(106, 223, 92, 216, 85, 206); bezierVertex(77, 188, 79, 174, 91, 162); bezierVertex(102, 156, 110, 155, 118, 154); endShape(CLOSE); //body noStroke(); fill(130, 146, 58); beginShape(); vertex(130, 217); bezierVertex(132, 232, 133, 248, 131, 258); bezierVertex(126, 265, 118, 265, 112, 260); bezierVertex(109, 248, 108, 233, 109, 217); endShape(CLOSE); //wings noStroke(); fill(111, 128, 54); beginShape(); vertex(120, 212); bezierVertex(137, 222, 140, 258, 128, 286); vertex(120, 282); vertex(112, 286); bezierVertex(101, 258, 103, 223, 120, 212); endShape(CLOSE); noFill(); stroke(66, 77, 33); strokeWeight(2); line(120, 252, 120, 279); //feeler - left noFill(); stroke(66, 77, 33); strokeWeight(2); bezier(128, 156, 128, 126, 148, 85, 184, 87); //feeler - right bezier(113, 156, 113, 126, 95, 88, 58, 88); //eyebrow - left noFill(); stroke(66, 77, 33); strokeWeight(2); bezier(158, 141, 167, 144, 174, 151, 180, 158); //eyebrow - right bezier(81, 142, 72, 145, 64, 151, 60, 158); }; this.cricketSide = function() { pushMatrix(); translate(-561, -920); scale(2.5); //shadow under cricket noStroke(); fill(50, 40); //ellipse(275, 482, 24, 14); //legs noFill(); stroke(94, 94, 53); strokeWeight(2); beginShape(); vertex(274, 473); vertex(278, 475); vertex(275, 481); vertex(278, 481); endShape(); beginShape(); vertex(271, 471); vertex(272, 474); vertex(271, 477); vertex(272, 478); endShape(); //body noStroke(); fill(130, 146, 58); beginShape(); vertex(280, 456); bezierVertex(277, 467, 278, 476, 269, 472); vertex(272, 456); endShape(CLOSE); //strikes on body noFill(); stroke(111, 128, 54); strokeWeight(1); bezier(277, 461, 275, 460, 273, 460, 271, 459); bezier(277, 465, 275, 464, 273, 464, 271, 463); bezier(276, 469, 274, 468, 272, 467, 270, 466); //wing fill(111, 128, 54); beginShape(); vertex(269, 456); bezierVertex(265, 462, 265, 471, 267, 476); bezierVertex(271, 470, 273, 464, 274, 457); endShape(CLOSE); //head noStroke(); fill(127, 149, 59); beginShape(); vertex(262, 434); bezierVertex(275, 431, 286, 430, 294, 435); bezierVertex(301, 441, 300, 450, 295, 454); bezierVertex(287, 459, 269, 460, 261, 451); bezierVertex(255, 446, 256, 440, 262, 434); endShape(CLOSE); //eye fill(255); ellipse(274, 438, 20, 20); fill(66, 77, 33); ellipse(276, 435, 14, 14); //mouth noFill(); stroke(66, 77, 33); strokeWeight(1); bezier(295, 453, 292, 454, 290, 452, 287, 449); //feelers bezier(258, 441, 247, 430, 244, 414, 251, 402); bezier(260, 438, 254, 425, 255, 412, 261, 403); bezier(263, 434, 264, 428, 267, 426, 272, 425); noStroke(); popMatrix(); }; this.snailFront = function() { //feelers noFill(); stroke(150, 100, 47); strokeWeight(7); line(76, 135, 76, 64); line(114, 135, 114, 64); noStroke(); fill(150, 100, 47); ellipse(114, 64, 15, 15); ellipse(76, 64, 15, 15); //shell noStroke(); fill(118, 73, 32); beginShape(); vertex(46, 236); vertex(46, 192); vertex(146, 192); vertex(146, 236); endShape(CLOSE); arc(96, 192, 100, 60, 181, 360); //body noStroke(); fill(189, 132, 71); beginShape(); vertex(56, 243); vertex(55, 170); bezierVertex(56, 136, 71, 119, 96, 119); bezierVertex(124, 119, 136, 138, 137, 170); vertex(137, 243); endShape(CLOSE); //base of body noFill(); stroke(189, 132, 71); strokeWeight(14); line(48, 236, 144, 236); //mouth noStroke(); fill(83, 63, 46); arc(96, 169, 26, 20, 1, 180); //eyes fill(255); ellipse(78, 150, 30, 30); ellipse(112, 150, 30, 30); fill(65, 62, 63); ellipse(79, 156, 22, 22); ellipse(112, 156, 22, 22); }; this.snailSide = function(flip) { if(flip) { pushMatrix(); translate(298, 0); scale(-1, 1); } //feelers noFill(); stroke(150, 100, 47); strokeWeight(7); line(74, 135, 74, 64); line(112, 135, 112, 64); noStroke(); fill(150, 100, 47); ellipse(112, 64, 15, 15); ellipse(74, 64, 15, 15); //shell noStroke(); fill(118, 73, 32); beginShape(); vertex(131, 236); vertex(131, 207); vertex(240, 207); vertex(240, 236); endShape(CLOSE); arc(184, 207, 111, 95, 181, 360); //spiral noFill(); stroke(57, 42, 32); beginShape(); vertex(214, 216); bezierVertex(218, 182, 184, 162, 165, 188); bezierVertex(156, 217, 174, 221, 190, 216); bezierVertex(203, 210, 197, 191, 179, 200); //vertex(176, 207); endShape(); //body noStroke(); fill(189, 132, 71); beginShape(); vertex(56, 243); vertex(55, 170); bezierVertex(56, 136, 71, 119, 96, 119); bezierVertex(124, 119, 136, 138, 137, 170); vertex(137, 243); endShape(CLOSE); //base of body noStroke(); fill(189, 132, 71); rect(49, 229, 200, 14, 50); //mouth noStroke(); fill(83, 63, 46); arc(86, 169, 26, 20, 1, 180); //eyes fill(255); ellipse(73, 150, 30, 30); ellipse(105, 150, 30, 30); fill(65, 62, 63); ellipse(65, 151, 22, 22); ellipse(97, 151, 22, 22); if(flip) { popMatrix(); } }; this.pitch = function() { pushMatrix(); translate(-120, 20); scale(1.4); //pitch fill(210, 180, 140); noStroke(); beginShape(); vertex(224, 332); vertex(278, 172); vertex(322, 172); vertex(376, 332); endShape(CLOSE); //lines on pitch (close) fill(224, 203, 175); beginShape(); vertex(242, 279); vertex(358, 279); vertex(359, 281); vertex(241, 281); endShape(CLOSE); beginShape(); vertex(256, 304); vertex(347, 304); vertex(347, 307); vertex(256, 307); endShape(CLOSE); beginShape(); vertex(258, 280); vertex(244, 332); vertex(249, 332); vertex(262, 280); endShape(CLOSE); beginShape(); vertex(340, 280); vertex(353, 332); vertex(358, 332); vertex(344, 280); endShape(CLOSE); //lines on pitch (far) beginShape(); vertex(277, 177); vertex(323, 177); vertex(324, 178); vertex(276, 178); endShape(CLOSE); beginShape(); vertex(283, 172); vertex(281, 177); vertex(282, 177); vertex(283, 172); endShape(CLOSE); beginShape(); vertex(317, 172); vertex(319, 177); vertex(318, 177); vertex(317, 172); endShape(CLOSE); beginShape(); vertex(278, 174); vertex(322, 174); vertex(323, 173); vertex(277, 173); endShape(CLOSE); //wickets (far end) pushMatrix(); translate(180, 53); scale(0.4); fill(144, 107, 44); beginShape(); vertex(288, 304); vertex(287, 274); vertex(290, 274); vertex(290, 286); vertex(292, 285); vertex(293, 288); vertex(290, 290); vertex(291, 304); endShape(CLOSE); beginShape(); vertex(298, 304); vertex(299, 274); vertex(302, 274); vertex(302, 304); endShape(CLOSE); beginShape(); vertex(309, 304); vertex(311, 274); vertex(314, 274); vertex(313, 293); vertex(316, 292); vertex(316, 294); vertex(313, 298); vertex(313, 304); endShape(CLOSE); beginShape(); vertex(287, 272); vertex(300, 272); vertex(299, 274); vertex(286, 274); endShape(CLOSE); beginShape(); vertex(302, 271); vertex(305, 271); vertex(305, 268); vertex(307, 271); vertex(314, 271); vertex(314, 273); vertex(300, 274); endShape(CLOSE); popMatrix(); popMatrix(); }; this.drawMole = function() { pushStyle(); noStroke(); //body fill(71, 49, 34); arc(300, 200, 150, 150, 181, 360); rect(225, 200, 150, 130); //eyes fill(255); ellipse(280, 160, 45, 45); ellipse(320, 160, 45, 45); fill(40); ellipse(284, 162, 30, 30); ellipse(316, 162, 30, 30); //glasses noFill(); stroke(0, 143, 194); strokeWeight(6); ellipse(273, 160, 55, 55); ellipse(327, 160, 55, 55); line(355, 155, 360, 155); line(245, 155, 235, 155); arc(365, 170, 30, 30, -90, 0); arc(236, 170, 30, 30, 180, 270); //skin noStroke(); fill(244, 129, 129); arc(300, 225, 110, 100, 181, 360); rect(245, 225, 110, 105); //nose fill(232, 79, 79); rect(295, 167, 10, 31); arc(295, 183, 27, 31, 91, 270); arc(305, 183, 27, 31, -91, 90); //mouth fill(40); arc(300, 204, 32, 25, 1, 180); //teeth fill(255); arc(296, 204, 10, 12, 1, 180); arc(305, 204, 10, 12, 1, 180); //part of arm behind the sign fill(71, 49, 34); ellipse(210, 275, 30, 30); ellipse(390, 275, 30, 30); //sign fill(255); rect(210, 230, 180, 70); //OUT! text on sign fill(133, 80, 37); textSize(44); textFont(createFont("Arial Black")); text("OUT!", 240, 280); //arms/hands fill(71, 49, 34); ellipse(210, 260, 30, 30); rect(195, 260, 15, 15); ellipse(390, 260, 30, 30); rect(390, 260, 15, 15); popStyle(); }; this.setup = function() { this.images = { cricketFront: function() { background(0, 0); game.cricketFront(); return get(54, 82, 133, 232); }, cricketBack: function() { background(0, 0); game.cricketBack(); return get(54, 82, 133, 232); }, cricketSide: function() { background(0, 0); game.cricketSide(); return get(54, 82, 133, 204); }, snailFront: function() { background(0, 0); game.snailFront(); return get(21, 53, 133, 191); }, snailRight: function() { background(0, 0); game.snailSide(true); return get(47, 53, 203, 191); }, snailLeft: function() { background(0, 0); game.snailSide(false); return get(47, 53, 203, 191); }, building: function() { background(0, 0); var building = new Building(); building.draw(); return get(177, 184, 255, 137); }, pitch: function() { background(0, 0); game.pitch(); return get(191, 242, 216, 244); }, back: function() { background(19, 167, 212); noStroke(); fill(16, 134, 166); for(var i = 0; i <= 200; i++) { fill(lerpColor(color(16, 134, 166), color(19, 167, 212), i/200)); rect(0, i, width, i); } //back (yellow) wall fill(249, 236, 49); rect(0, 190, width, 50); fill(116, 153, 72); ellipse(width/2, 815, width * 4, height * 2); return get(0, 0, width, height); }, ground: function() { background(0, 0); //ground pushStyle(); fill(116, 153, 72); stroke(255); strokeWeight(4); ellipse(width/2, 830, width * 4, height * 2); popStyle(); return get(0, 0, width, height); }, balloonFour: function() { background(0, 0); pushStyle(); noStroke(); fill(100, 184, 100); ellipse(100, 100, 50, 60); triangle(95, 137, 106, 137, 100, 125); fill(255); textAlign(CENTER, CENTER); textSize(30); text("4", 100, 100); stroke(80); strokeWeight(1); line(100, 137, 100, 160); popStyle(); return get(73, 68, 53, 94); }, balloonSix: function() { background(0, 0); pushStyle(); noStroke(); fill(214, 98, 214); ellipse(100, 100, 50, 60); triangle(95, 137, 106, 137, 100, 125); fill(255); textAlign(CENTER, CENTER); textSize(30); text("6", 100, 100); stroke(80); strokeWeight(1); line(100, 137, 100, 160); popStyle(); return get(73, 68, 53, 94); }, wickets: function() { background(0, 0); game.wickets.draw(); return get(270, 430, 60, 72); }, cloud1: function() { background(0, 0); pushMatrix(); scale(1.2); noStroke(); fill(255, 255, 255, 150); beginShape(); vertex(290, 184); bezierVertex(293, 180, 296, 177, 306, 179); bezierVertex(310, 169, 314, 166, 322, 169); bezierVertex(324, 160, 327, 151, 330, 150); bezierVertex(337, 145, 347, 148, 355, 165); bezierVertex(365, 163, 377, 165, 383, 176); bezierVertex(388, 176, 392, 177, 396, 184); endShape(CLOSE); popMatrix(); return get(345, 173, 132, 52); }, cloud2: function() { background(0, 0); pushMatrix(); scale(2); noStroke(); fill(255, 255, 255, 150); beginShape(); vertex(44, 177); bezierVertex(46, 172, 52, 169, 60, 171); bezierVertex(61, 165, 65, 156, 71, 154); bezierVertex(77, 152, 82, 157, 84, 162); bezierVertex(88, 161, 94, 162, 98, 168); bezierVertex(103, 169, 109, 170, 113, 177); endShape(CLOSE); popMatrix(); return get(84, 304, 144, 53); }, flower: function() { background(0, 0); var flower = new Flower({ x: 300, y: 400, h: 250 }); flower.draw(); return get(272, 147, 55, 255); }, mole: function() { background(0, 0); game.drawMole(); return get(192, 122, 215, 209); }, dirt: function() { background(0, 0); pushStyle(); noStroke(); fill(133, 80, 37); arc(300, 335, 75, 75, 180, 360); arc(265, 335, 65, 65, 180, 360); arc(345, 335, 65, 65, 180, 360); arc(220, 335, 45, 45, 180, 360); arc(390, 335, 45, 45, 180, 360); arc(189, 335, 35, 35, 180, 360); arc(421, 335, 35, 35, 180, 360); rect(172, 331, 266, 5); popStyle(); return get(169, 295, 271, 42); } }; //add clouds for(var i = 0; i < 5; i++) { if(i === 2) {continue;} this.clouds.push({ x: random(i * 120, i * 120 + 50), y: random(30, 110), scale: random(0.3, 0.5), type: random() < 0.5 ? 1 : 2 }); } //add balloons for(var i = 0; i < 10; i++) { this.balloons.push({ x: 50 + i * 50, y: 250, vy: random(-2, -1) }); } //add boundary bezier points for(var i = 0; i <= 40; i++) { var t = i / 40; var x = bezierPoint(this.boundaryBezier.x1, this.boundaryBezier.cx1, this.boundaryBezier.cx2, this.boundaryBezier.x2, t); var y = bezierPoint(this.boundaryBezier.y1, this.boundaryBezier.cy1, this.boundaryBezier.cy2, this.boundaryBezier.y2, t); this.boundaryPoints.push({ x: x, y: y }); } //add fielders to pitch this.fielders.push(Snail.new({ x: 190, y: 260 })); this.fielders.push(Snail.new({ x: 220, y: 225 })); this.fielders.push(Snail.new({ x: 100, y: 250 })); this.fielders.push(Snail.new({ x: 20, y: 290 })); this.fielders.push(Snail.new({ x: 400, y: 260 })); this.fielders.push(Snail.new({ x: 360, y: 225 })); this.fielders.push(Snail.new({ x: 480, y: 240 })); this.fielders.push(Snail.new({ x: 540, y: 300 })); //crowd of people //back row for(var i = 0; i < this.boundaryPoints.length; i+=2) { var h = ~~random(25, 35); this.persons.push(Person.new({ x: random(this.boundaryPoints[i].x - 5, this.boundaryPoints[i].x + 5), y: random(this.boundaryPoints[i].y, this.boundaryPoints[i].y + 5) - h / 2, w: ~~random(h - 5, h + 5), h: h })); } //front row for(var i = 0; i < this.boundaryPoints.length; i+=2) { var h = ~~random(15, 25); this.persons.push(Person.new({ x: random(this.boundaryPoints[i].x - 5, this.boundaryPoints[i].x + 5), y: random(this.boundaryPoints[i].y, this.boundaryPoints[i].y + 5) - h / 2, w: ~~random(h - 5, h + 5), h: h })); } }; this.setup(); this.getPathPoints = function() { this.points.length = 0; this.pathIndex = ~~random(this.paths.length); var path = this.paths[this.pathIndex]; for (var i = 0; i <= this.steps; i++) { var t = i / this.steps; var x = bezierPoint(this.origins.x1, path.cx1, path.cx2, path.x2, t); var y = bezierPoint(this.origins.y1, path.cy1, path.cy2, path.y2, t); var tx = bezierTangent(this.origins.x1, path.cx1, path.cx2, path.x2, t); var ty = bezierTangent(this.origins.y1, path.cy1, path.cy2, path.y2, t); var a = atan2(ty, tx); a += 90; this.points.push({ x: x, y: y, angle: a }); } this.points.push({ x: 300, y: 460, angle: 0 }); }; this.reset = function() { this.state = "neutral"; this.started = false; this.counter = 0; this.bestScore = max(this.bestScore, this.score); this.score = 0; this.gameOver = false; this.hit = false; this.hitState = ""; this.sixMax = false; this.trails.length = 0; this.dusts.length = 0; this.getPathPoints(); this.wickets.state = "neutral"; this.mole.state = "hide"; this.ballSpeed = this.BALL_SPEED_MIN; this.pitches = 0; this.contact = false; this.ball.pIndex = 1; this.ball.applyGravity = false; this.ball.speed = this.BALL_SPEED_MIN; this.ball.x = this.points[0].x; this.ball.y = this.points[0].y; this.ball.tx = this.points[1].x; this.ball.ty = this.points[1].y; this.ball.angle = atan2(this.ball.ty-this.ball.y, this.ball.tx-this.ball.x); this.ball.vx = this.ball.speed * cos(this.ball.angle); this.ball.vy = this.ball.speed * sin(this.ball.angle); this.resetFielders(); }; this.next = function() { this.hit = false; this.hitState = ""; this.counter = 0; this.gameOver = false; this.sixMax = false; this.trails.length = 0; this.dusts.length = 0; this.getPathPoints(); this.wickets.state = "neutral"; this.wickets.reset(); this.mole.state = "hide"; this.contact = false; if(this.pitches % 4 === 0) { this.ballSpeed = constrain(this.ballSpeed + 0.25, this.BALL_SPEED_MIN, this.BALL_SPEED_MAX); } this.ball.pIndex = 1; this.ball.applyGravity = false; this.ball.speed = random(this.BALL_SPEED_MIN, this.ballSpeed); this.ball.x = this.points[0].x; this.ball.y = this.points[0].y; this.ball.tx = this.points[1].x; this.ball.ty = this.points[1].y; this.ball.angle = atan2(this.ball.ty-this.ball.y, this.ball.tx-this.ball.x); this.ball.vx = this.ball.speed * cos(this.ball.angle); this.ball.vy = this.ball.speed * sin(this.ball.angle); for(var i = 0; i < this.persons.length; i++) { this.persons[i].state = "neutral"; } this.resetFielders(); this.state = "start"; this.control(); }; this.load = function (s) { var obj = Object.keys(this.images); this.images[obj[this.imageIndex]] = this.images[obj[this.imageIndex]](); this.imageIndex++; background(116, 153, 72); pushStyle(); fill(0, 150); textAlign(CENTER, CENTER); textSize(40); text('LOADING...', 300, 250); noStroke(); fill(255, 150); rect(width * 0.1, 300, (this.imageIndex / obj.length) * width * 0.8, 15); popStyle(); if(this.imageIndex < obj.length){ this.loaded = false; } else { this.cricket.init(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].init(); } this.loaded = true; this.page = s; } }; this.runClouds = function() { for(var i = 0; i < this.clouds.length; i++) { var cloud = this.clouds[i]; var img = cloud.type === 1 ? this.images.cloud1 : this.images.cloud2; image(img, cloud.x, cloud.y, img.width * cloud.scale, img.height * cloud.scale); } }; this.displayScene = function() { //back scene image(this.images.back, 0, 0); this.runClouds(); pushMatrix(); scale(0.5); image(this.images.flower, 100, 210); image(this.images.flower, 170, 240); image(this.images.flower, 250, 260); image(this.images.flower, 10, 250); image(this.images.flower, 1120, 220); image(this.images.flower, 1040, 240); image(this.images.flower, 950, 260); image(this.images.flower, 880, 250); popMatrix(); //display building image(this.images.building, 300 - this.images.building.width / 2, 54); }; this.control = function() { switch(this.state) { case "neutral": this.cricket.state = "neutral"; this.pitcher.state = "neutral"; this.ball.state = "neutral"; break; case "start": this.cricket.state = "ready"; this.pitcher.state = "ready"; this.ball.state = "ready"; break; case "hit": this.cricket.state = "hit"; break; case "run": this.cricket.state = "run"; break; } }; this.control(); this.collision = function(ball, obj) { if( ball.x + ball.size / 2 > obj.x && ball.x - ball.size / 2 < obj.x + obj.w && ball.y + ball.size / 2 > obj.y && ball.y - ball.size / 2 < obj.y + obj.h) { return true; } return false; }; this.resetBalloons = function(state) { for(var i = 0; i < this.balloons.length; i++) { this.balloons[i].y = 250; this.balloons[i].state = state; } }; this.runBalloons = function() { for(var i = 0; i < this.balloons.length; i++) { var balloon = this.balloons[i]; balloon.y+= balloon.vy; if(balloon.state === "four") { image(this.images.balloonFour, balloon.x, balloon.y, this.images.balloonFour.width * 0.6, this.images.balloonFour.height * 0.6); } else { image(this.images.balloonSix, balloon.x, balloon.y, this.images.balloonSix.width * 0.6, this.images.balloonSix.height * 0.6); } } }; this.hitBall = function() { if(this.ball.y >= 420 && this.ball.y <= 465) { this.contact = true; if(this.sound){ this.sounds.hit.audio.play(); } if(this.ball.y >= 440 && this.ball.y <= 450) { this.hitState = "six"; this.cricket.state = "neutral"; this.ball.speed = 2; } else { this.ball.speed = ~~random(2, 7); this.cricket.state = "run"; } this.hit = true; this.ball.angle = map(this.ball.y, 420, 465, 200, 340); this.ball.vx = this.ball.speed * cos(this.ball.angle); this.ball.vy = this.ball.speed * sin(this.ball.angle) + (this.hitState === "six" ? -5 : 0); } else { this.contact = false; if(this.sound){ this.sounds.swing.audio.play(); } } }; this.moveBall = function() { switch(this.state) { case "neutral": break; case "start": switch(this.pitcher.state) { case "ready": case "pitch": this.ball.x = this.pitcher.x; this.ball.y = this.pitcher.y + 10; this.ball.go(); break; case "pitched": this.ball.x+= this.ball.vx; this.ball.y+= this.ball.vy; if (dist(this.ball.x, this.ball.y, this.ball.tx, this.ball.ty) <= 10) { this.ball.pIndex++; //add dust on second to last bezier point if(this.ball.pIndex === this.points.length - 1) { for(var i = 0; i < 15; i++) { this.dusts.push({ x: random(this.ball.x - 3, this.ball.x + 3), y: random(this.ball.y - 3, this.ball.y + 3), vx: random(-0.5, 0.5), vy: 0, size: random(2, 5), color: color(random(110, 130), random(90, 100), random(25, 35)), opacity: ~~random(220, 250) }); } } if(this.ball.pIndex < this.points.length) { this.ball.tx = this.points[this.ball.pIndex].x; this.ball.ty = this.points[this.ball.pIndex].y; this.ball.angle = atan2(this.ball.ty-this.ball.y, this.ball.tx-this.ball.x); this.ball.vx = this.ball.speed * cos(this.ball.angle); this.ball.vy = this.ball.speed * sin(this.ball.angle); } } this.ball.go(); break; } break; case "hit": if(this.hit) { //hit the ball this.ball.x+= this.ball.vx; this.ball.y+= this.ball.vy; if(frameCount % 2 === 0) { this.trails.push({ x: this.ball.x, y: this.ball.y, size: this.ball.size * 0.8, opacity: 200 }); } if(this.hitState === "six" && this.ball.y < 140) { this.ball.vy += this.ball.gravity; this.sixMax = true; //reached the gravity point this.cricket.state = "neutral"; } if(this.sixMax === true && this.ball.y > 180) { this.state = "six"; this.counter = 0; this.resetBalloons("six"); this.score+= 6; if(this.sound){ //this.sounds.clap.audio.play(); } } } else { //swing and missed the ball this.ball.x+= this.ball.vx; this.ball.y+= this.ball.vy; if (dist(this.ball.x, this.ball.y, this.ball.tx, this.ball.ty) <= 10) { this.ball.pIndex++; if(this.ball.pIndex < this.points.length) { this.ball.tx = this.points[this.ball.pIndex].x; this.ball.ty = this.points[this.ball.pIndex].y; this.ball.angle = atan2(this.ball.ty-this.ball.y, this.ball.tx-this.ball.x); this.ball.vx = this.ball.speed * cos(this.ball.angle); this.ball.vy = this.ball.speed * sin(this.ball.angle); } } } this.displayTrails(); this.ball.go(); break; case "fielder": this.ball.vx = 0; this.ball.vy = 0; this.ball.x = lerp(this.ball.x, this.pitcher.x, 0.2); this.ball.y = lerp(this.ball.y, this.pitcher.y + 15, 0.2); this.ball.go(); break; case "run": break; } }; this.collisionWickets = function() { if(this.ball.y > 485) { return true; } return false; }; this.collisionBoundary = function() { for(var i = 0; i < this.boundaryPoints.length; i++) { var p = this.boundaryPoints[i]; if(dist(this.ball.x, this.ball.y, p.x, p.y) <= this.ball.size) { return true; } } return false; }; this.collisionFielder = function() { for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; if( this.ball.x + this.ball.size > fielder.x && this.ball.x < fielder.x + fielder.w && this.ball.y + this.ball.size > fielder.y + fielder.h / 2 && this.ball.y < fielder.y + fielder.h) { if(this.sound){ this.sounds.fielder.audio.play(); } return true; } } return false; }; this.moveFielders = function() { //set direction of each fielder towards the current position of the ball for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; fielder.angle = atan2(this.ball.y - fielder.y, this.ball.x - fielder.x); fielder.vx = fielder.speed * cos(fielder.angle); fielder.vy = fielder.speed * sin(fielder.angle); } }; this.resetFielders = function() { for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].reset(); } }; this.displayTrails = function() { pushStyle(); noStroke(); for(var i = this.trails.length - 1; i >= 0; i--) { var trail = this.trails[i]; trail.opacity-= 10; fill(255, trail.opacity); ellipse(trail.x, trail.y, trail.size, trail.size); } //credit to Bob Lyon for a memory free way to "splice" objects while (this.trails.length > 0 && this.trails[0].opacity <= 0) { this.trails.shift(); } popStyle(); }; this.displayDust = function() { pushStyle(); noStroke(); for(var i = this.dusts.length - 1; i >= 0; i--) { var dust = this.dusts[i]; dust.opacity-= 5; fill(dust.color, dust.opacity); ellipse(dust.x, dust.y, dust.size, dust.size); dust.x+= dust.vx; dust.y+= dust.vy; } //credit to Bob Lyon for a memory free way to "splice" objects while (this.dusts.length > 0 && this.dusts[0].opacity <= 0) { this.dusts.shift(); } popStyle(); }; this.displayFieldersBoundingBox = function() { noFill(); stroke(255); strokeWeight(1); for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; rect(fielder.x, fielder.y, fielder.w, fielder.h); } }; this.pad = function(num, n) { var s = "0000" + num; return s.substr(s.length - n); }; this.displayScore = function() { pushStyle(); textFont(this.fonts.body); textAlign(CENTER, CENTER); textSize(24); fill(255); text(this.pad(this.score, 4), 300, 87); fill(240, 200); textSize(14); text("BEST SCORE\n" + this.bestScore, 300, 30); popStyle(); }; this.displayCrowd = function() { for(var i = 0; i < this.persons.length; i++) { this.persons[i].go(); } }; this.gameover = function() { pushMatrix(); translate(0, 0); pushStyle(); noStroke(); rectMode(CENTER); fill(255, 70); rect(300, 300, 200, 100); textAlign(CENTER, CENTER); textSize(50); fill(0, 150); text("OUT", 300, 300); popStyle(); popMatrix(); }; this.play = function() { //if paused then just display the last game image if(this.paused) { pushStyle(); noStroke(); image(this.screenImage, 0, 0, width, height); rectMode(CENTER); fill(255, 70); rect(width/2, height/2, 300, 150); textAlign(CENTER, CENTER); textSize(40); fill(0, 150); text("PAUSED", width/2, height0.47); textSize(30); text("Press P to resume", width/2, height0.55); popStyle(); return; } this.counter++; this.displayScene(); if(this.state === "four" \|\| this.state === "six") { this.runBalloons(); } this.displayCrowd(); image(this.images.ground, 0, 0); //pitch image(this.images.pitch, 300 - this.images.pitch.width / 2, 280); this.displayDust(); /* noStroke(); fill(255); for(var i = 0; i < this.points.length; i++) { ellipse(this.points[i].x, this.points[i].y, 5, 5); } / switch(this.state) { case "neutral": this.cricket.draw(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].draw(); } if(this.started) { this.buttons.replay.draw(); } else { this.buttons.play.draw(); } break; case "start": this.moveBall(); this.cricket.go(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].go(); } if(this.pitcher.state === "ready" && frameCount % 300 === 0) { this.pitcher.state = "pitch"; } //check if ball hits wickets if(this.collisionWickets()) { this.state = "gameover"; this.gameOver = true; this.mole.state = "show"; this.wickets.state = "out"; this.cricket.state = "back"; this.counter = 0; if(this.sound){ this.sounds.wickets.audio.play(); } } this.buttons.bat.draw(); break; case "hit": this.moveBall(); this.cricket.go(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].go(); } //actions if not six if(this.hitState !== "six") { this.moveFielders(); //check if ball hits wickets if(this.collisionWickets()) { this.state = "gameover"; this.gameOver = true; this.mole.state = "show"; this.wickets.state = "out"; this.cricket.state = "back"; this.counter = 0; if(this.sound){ this.sounds.wickets.audio.play(); } } //check if four runs (ball hits the boundary) else if(this.collisionBoundary() \|\| this.ball.y < 225) { this.state = "four"; this.counter = 0; this.cricket.state = "back"; this.resetBalloons("four"); this.score+= 4; if(this.sound){ //this.sounds.clap.audio.play(); } } //check if snail get the ball else if(this.collisionFielder()) { this.state = "fielder"; this.cricket.state = "back"; this.counter = 0; } } break; case "run": this.cricket.go(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].go(); } break; case "six": this.cricket.draw(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { this.fielders[i].draw(); } for(var i = 0; i < this.persons.length; i++) { this.persons[i].state = "cheer"; } if(this.counter % 360 === 0) { this.next(); } break; case "four": this.cricket.go(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; fielder.go(); fielder.angle = atan2(fielder.by - fielder.y, fielder.bx - fielder.x); fielder.vx = fielder.speed cos(fielder.angle); fielder.vy = fielder.speed * sin(fielder.angle); } for(var i = 0; i < this.persons.length; i++) { this.persons[i].state = "cheer"; } if(this.counter % 300 === 0) { this.next(); } break; case "fielder": this.cricket.go(); this.wickets.image(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; fielder.go(); fielder.angle = atan2(fielder.by - fielder.y, fielder.bx - fielder.x); fielder.vx = fielder.speed * cos(fielder.angle); fielder.vy = fielder.speed * sin(fielder.angle); } this.pitcher.state = "stand"; this.moveBall(); if(this.counter % 240 === 0) { this.next(); } break; case "gameover": this.cricket.go(); this.wickets.go(); this.pitcher.go(); for(var i = 0; i < this.fielders.length; i++) { var fielder = this.fielders[i]; fielder.go(); fielder.angle = atan2(fielder.by - fielder.y, fielder.bx - fielder.x); fielder.vx = fielder.speed * cos(fielder.angle); fielder.vy = fielder.speed * sin(fielder.angle); } this.buttons.replay.draw(); break; } this.displayScore(); if(this.gameOver) { //this.gameover(); } this.mole.go(); this.soundButton.draw(); }; this.checkKeyPressed = function() { if (keyPressed && keyCode === 80) { //P - Pause if(this.page === "play") { this.paused = !this.paused; this.screenImage = get(); } keyCode = 0; } }; this.displayFrameRate = function(rate) { textSize(14); fill(255, 100); textAlign(RIGHT, BOTTOM); text(rate, width-8, height-5); }; }; game = new Game(); draw = function() { setKALoopTimeout(10000); game.checkKeyPressed(); background(19, 167, 212); switch(game.page) { case "load": game.load("play"); break; case "play": game.play(); game.displayFrameRate(~~this.__frameRate); break; } cursor(hover ? 'pointer' : 'default'); hover = false; clicked = false; };
Folds	53,67,70,75,77,161,162,265,266,350,351,558,559,714,715,860,861,897,898,942,943,999,1001,1015,1016,1020,1021,1032,1033,1090,1091,1094,1096,1108,1109,1113,1114,1119,1120,1124,1125,1128,1129,1138,1139,1142,1144,2985
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgO3zrs7aCgw
Votes	392
Spin-Offs	13
Type	PJS
Width	600
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Gray Wolf 🐺
Author Name	grantjenkins
Author ID	kaid_639291037700385781852565
Author Profile Access	COACH

Archive Data

Added	6 months ago, 1739452670819
Updated	4 months ago, 1744828476407
Source Deleted	unknown