alert("Thanks everyone for all the support here's another Soccer game and now it's 2D\nWhat's New:\n* Added ball spinning (thanks to Coder )\n*Added a loader\n*Added scoring and winning system. 3mins match.\n*Added 2D controls. Now control both X and Y axis\n*AI is now more advanced\n*Ground improvement\n*Some minor bugs fixed and added some bugs to fix later😅\ndon't forget to share screenshots of your score") var hardness = Number(prompt("Select Difficulty \n1 for Easy\n2 for medium\n3 for Super Hard Fun", "1")); // var hardness = 1; var ball; var me; var ai; var backimg; if(hardness == 2) { var aispeed = 12; var buffer = 10; } else { var aispeed = 4; var buffer = 15; } var topgoal; var bottomgoal; var kicksound; var cheers; var hitwallsound; var footballimg; var goaldist = 100; var errorLimit = 10; var time = { m: 2, s: 59 }; var winner; var winnerdeclared = false; function preload() { // https://cors-anywhere.herokuapp.com/ scorefont = loadFont('https://dl.dropbox.com/s/6skho5htqsdvcfn/scoreboard.ttf?raw=1'); kicksound = loadSound("https://dl.dropbox.com/s/3etf4lhvu0rosdw/FOOTBALLKICK.mp3?raw=1"); cheers = loadSound("https://dl.dropbox.com/s/cntfvu6mtjzcptp/cheer2.mp3?raw=1"); hitwallsound = loadSound("https://dl.dropbox.com/s/hhb1340y06tb2eu/BOUNCE%2B1.mp3?raw=1"); footballimg = loadImage('https://cors-anywhere.herokuapp.com/https://dl.dropbox.com/s/qz9gfnzfzdfy5j7/unnamed.png?raw=1'); // scorefont = loadFont('scoreboard.ttf'); // kicksound = loadSound('FOOTBALLKICK.mp3'); // cheers = loadSound("cheer2.mp3"); // hitwallsound = loadSound('BOUNCE+1.mp3'); // footballimg = loadImage('Football.png'); } function setup() { createCanvas(window.innerWidth, window.innerHeight); ball = new SoccerBall(); me = new Players(width / 2, (height / 4) * 3, 'me', [102, 255, 255]); ai = new Players(width / 2, height / 4, 'ai', [255, 255, 51]); // rectMode(CENTER); frameRate(50); // background(0, 255, 0); setInterval(countDown, 1000); } function draw() { // background(0, 255, 0); var j = 0; for(var i = 0; i < height; i += height / 12) { if(j % 2 == 0) { fill(76, 187, 23); } else { fill(57, 255, 20); } noStroke(); rectMode(CORNER); rect(0, i, width, height / 12); j++; } drawbg(); ball.show(); ball.move(); ball.checkCollision(); me.show(); me.move(); me.hitTheBall(ball); ai.show(); ai.hitTheBall(ball); ai.aimove(ball); showScores(); showTime(); ball.debugme(); ball.fixme(); if(winnerdeclared == true) { showWinner(); noLoop(); } } function mouseClicked() { if(winnerdeclared == true) { winnerdeclared = false; ball.reset(); time = { s: 59, m: 2 } loop(); } } function drawbg() { rectMode(CENTER); noFill(); // noStroke(); stroke(255); strokeWeight(5); //middleline and circle line(0, height / 2, width, height / 2); ellipse(width / 2, height / 2, 100, 100); //left player goal topgoal = { x: width / 2, y: 0, width: goaldist, height: goaldist } arc(topgoal.x, topgoal.y + topgoal.height / 2, 60, 60, 0, PI); rect(topgoal.x, topgoal.y, topgoal.width, topgoal.height); //right player goal bottomgoal = { x: width / 2, y: height, width: goaldist, height: goaldist } arc(bottomgoal.x, bottomgoal.y - bottomgoal.height / 2, 60, 60, PI, 0); rect(bottomgoal.x, bottomgoal.y, bottomgoal.width, bottomgoal.height); } function showScores() { fill(0); textFont(scorefont); textSize(50); var score = me.score + " : " + ai.score; textAlign(CENTER, BASELINE); text(score, width / 2, height / 2); } function showWinner() { if(me.score > ai.score) { winner = "You Won!"; } else if(ai.score > me.score) { winner = "AI Won!"; } else { winner = "DRAW!"; } if(hardness == 1) { fill(0, 255, 0); } else if(hardness == 2) { fill(255, 255, 0); } else if(hardness == 3) { fill(255, 0, 0); } textFont(scorefont); textSize(80); stroke(0); // noStroke(); textAlign(CENTER, BASELINE); text(winner, width / 2, height / 2 - 100); } function showTime() { fill(255); textFont(scorefont); textSize(25); noStroke(); // var score = ai.score + " : " + me.score; var currentTime = time.m + " : " + time.s; textAlign(CENTER, BASELINE); text(currentTime, width / 2, height / 2 + 30); } function countDown() { if(winnerdeclared != true) { if(time.s > 0) { time.s--; } else if(time.m > 0) { time.m--; time.s = 59; } else { winnerdeclared = true; } } } class SoccerBall { constructor() { this.x = width / 2; this.y = height / 2; this.xvel = 5; this.yvel = 5; this.maxx = 20; this.maxy = 20; this.r = 30; this.ang = 0; this.lasthitters = []; } show() { // texture(footballimg); // fill(255); push(); translate(this.x, this.y); rotate(this.ang); noStroke(); imageMode(CENTER); image(footballimg, 0, 0, this.r, this.r); this.ang += this.xvel - this.yvel; pop(); // ellipse(this.x, this.y, this.r, this.r); } move() { this.x += this.xvel; this.y += this.yvel; // this.x *= random(0.98, 1.02); // this.y *= random(0.98, 1.02); this.x = constrain(this.x, -10, width + 10); this.y = constrain(this.y, -10, height + 10); } checkCollision() { if(this.y < 0) { if(this.x > (width / 2 - topgoal.width / 2) && this.x < (width / 2 + topgoal.width / 2)) { me.score++; this.reset(); this.goaled(); } else { this.yvel *= -0.95; hitwallsound.play(); } } else if(this.y + this.r / 2 > height) { if(this.x > (width / 2 - bottomgoal.width / 2) && this.x < (width / 2 + bottomgoal.width / 2)) { ai.score++; this.reset(); this.goaled(); } else { this.yvel *= -0.95; hitwallsound.play(); } } else if(this.x < 0) { this.xvel *= -1.05; hitwallsound.play(); } else if(this.x + this.r / 2 > width) { this.xvel *= -1.05; hitwallsound.play(); } //fix the bug ball stuck at the top // if(this.xvel >= -2 && this.xvel <= 2) { // this.xvel++; // } } reset() { this.x = width / 2; this.y = height / 2; var dire = floor(random(1, 5)); switch (dire) { case 1: this.xvel = 5; this.yvel = 5; break; case 2: this.xvel = -5; this.yvel = 5; break; case 3: this.xvel = 5; this.yvel = -5; break; case 4: this.xvel = -5; this.yvel = -5; break; default: this.xvel = 5; this.yvel = 5; } } goaled() { noLoop(); textFont(scorefont); textSize(120); fill(255, 255, 0); noStroke(); textAlign(CENTER, BASELINE); text('GOAL!', width / 2, height / 2); cheers.play(); setTimeout(loop, 3000); } debugme() { if((this.x < 0 && this.y < 0) || (this.x < 0 && this.y + this.r > height) || (this.x > width && this.y + this.r > height) || (this.x > width && this.y < 0)) { this.reset(); } } fixme() { var counts = {}; this.lasthitters.forEach(function(x) { counts[x] = (counts[x] || 0) + 1; }); if(counts.me == errorLimit || counts.ai == errorLimit) { this.reset(); this.lasthitters.splice(0, errorLimit); } } } class Players { constructor(x, y, name, fillcol) { this.x = x; this.y = y; this.r = 50; this.score = 0; this.name = name; this.fillcol = fillcol; this.kicked = false; } show() { fill(this.fillcol[0], this.fillcol[1], this.fillcol[2]); noStroke(); ellipse(this.x, this.y, this.r, this.r); } move() { if(hardness == 3) { this.x = width - mouseX; this.y = map(mouseY, height / 2, height, height, height / 2); } else { this.x = mouseX; this.y = mouseY; } this.x = constrain(this.x, this.r / 2, width - this.r / 2); this.y = constrain(this.y, height / 2 + this.r / 2, height - this.r / 2); } aimove(follow) { // if(follow.x > width / 2) { // this.y = follow.y; // } if(follow.yvel < 0 && follow.y + follow.r / 2 < height / 2) { if(this.x < follow.x - buffer) { if(this.x + this.r < height) { this.x += aispeed; } } else if(this.x > follow.x + buffer) { if(this.x + this.r > 0) { this.x -= aispeed; } } if(this.y < follow.y - buffer) { if(this.y + this.r < width) { this.y += aispeed; } } else if(this.y > follow.y + buffer) { if(this.y + this.r > 0) { this.y -= aispeed; } } } else { if(this.x > width / 2 + buffer) { this.x -= aispeed; } else if(this.x < width / 2 - buffer) { this.x += aispeed; } if(this.y > height / 4 + buffer) { this.y -= aispeed; } else if(this.x < height / 4 - buffer) { this.y += aispeed; } } this.x = constrain(this.x, this.r, width - this.r); } hitTheBall(whichball) { var distbw = dist(this.x, this.y, whichball.x, whichball.y); if(distbw <= (this.r + whichball.r) / 2 && this.kicked == false) { whichball.lasthitters.push(this.name); if(whichball.lasthitters.length > errorLimit) { whichball.lasthitters.splice(0, errorLimit); } whichball.yvel *= random(-0.85, -1.2); // whichball.y += whichball.yvel; // whichball.yvel *= random(0.8, 1.2); // var deltaY = (whichball.y - (this.x + this.r)).toFixed(2); // whichball.yvel = deltaY * -0.05; var deltaX = (whichball.x - (this.x + this.r)).toFixed(2); whichball.xvel = deltaX * 0.1; whichball.xvel = constrain(whichball.xvel, -whichball.maxx, whichball.maxx); whichball.yvel = constrain(whichball.yvel, -whichball.maxy, whichball.maxy); //fix the precision whichball.xvel = Number(whichball.xvel.toFixed(2)); whichball.yvel = Number(whichball.yvel.toFixed(2)); if(!kicksound.isPlaying()){ kicksound.play(); } this.kicked = true; } else { this.kicked = false; } } }

⚽Soccer⚽ v2.0 {GAME 🎮}