var показывая WinScreen = false; и var показываяGameoverScreen = false; - PullRequest
0 голосов
/ 20 января 2019

Моя проблема как с «showWinScreen», так и с «displayGameoverScreen».

Когда player1Score достигает WINNING_SCORE = 1;тогда должно появиться "показывая WinScreen".И когда «if (ball <0) {ballReset} также должно« showGameoverScreen ». </p>

Результат должен быть похож на игру в понг, но только на одно весло, и когда мяч касается противоположной другой стены, следует добавить точкуплюс должен появиться винскрин. И если мяч не попадает в ракетку и касается стены за ракеткой, должен появиться экран «Игра закончена».

var canvas;
var canvasContext;

var ballX = 300;
var ballY = 200;
var ballSpeedX = 5;
var ballSpeedY = 5;

var player1Score = 0;
const WINNING_SCORE = 1;
var showingWinScreen = false;
var showingGameoverScreen = true;

var paddle1Y = 150;
const PADDLE_THICKNESS = 10;
const PADDLE_HEIGHT = 100;




window.onload = function (){
  canvas = document.getElementById("gameCanvas");
  canvasContext = canvas.getContext("2d");
  
  var framesPerSecond = 30;
  setInterval(function() {
    drawEverything();
    moveEverything();
  }, 1000/framesPerSecond);
  
  document.addEventListener('keydown', handleKeyDown, true,
              );
  
}

function ballReset(){
   if(player1Score == WINNING_SCORE){
      showingWinScreen = true;
    }
  //ballSpeedX = -ballSpeedX;
    ballX = canvas.width/2;
    ballY = canvas.height/2;
    
  }


function moveEverything(){
 //ballX bouncing back
  ballX = ballX - ballSpeedX;
  //ball starting Y angle
  ballY = ballY + ballSpeedY;
  
  if(ballX < 0/*600*/){
    if(ballY > paddle1Y &&
      ballY < paddle1Y + PADDLE_HEIGHT) {
      ballSpeedX =-ballSpeedX;
    }
   
    }if(ballX > canvas.width/*600*/){
    /*ballSpeedX=5;*/ballSpeedX = -ballSpeedX;
      player1Score += 1;
  }
  
  if(ballY < 0/*600*/){
    /*ballSpeedX=5;*/ballSpeedY = -ballSpeedY;
   
  }if(ballY > canvas.height/*400*/){
    /*ballSpeedX=5;*/ballSpeedY = -ballSpeedY;
  }if(ballX < 0){
    ballReset();
  }
 
}


//draws all on the gameCanvas wich is black.
function drawEverything(){
  //Next line blanks the screen with black
  colorRect(0,0,canvas.width,canvas.height, "black");
  
  if(showingWinScreen){
    canvasContext.fillStyle = "white";
    if(player1Score == WINNING_SCORE) {
      canvasContext.fillText("Left Player Won!", canvas.width/2, 200);
    }
    else{
      showingGameoverScreen();
      canvasContext.fillText("GameOver", canvas.width/2, 200);
      
    }
  }
  //next line draw left paddle
  colorRect(0,paddle1Y, PADDLE_THICKNESS,PADDLE_HEIGHT, "white");
  //next line draws ball from the function
  colorCircle(ballX,ballY,10, "white");
  canvasContext.fillText(player1Score, 100, 100);
}
// summerize the ball information
function colorCircle(centerX,centerY, radius, drawColor){
  canvasContext.fillStyle = drawColor;
  canvasContext.beginPath();
  canvasContext.arc(centerX, centerY, radius, 0,Math.PI*2,true);
  canvasContext.fill();
}
//summerize the canvas info, like; Color and width/height
function colorRect(leftX, topY, width,height, drawColor){
  canvasContext.fillStyle = drawColor;
  canvasContext.fillRect(leftX, topY, width, height);



}
//sets the function for paddle handling
function handleKeyDown ( event ) {
  var keyCode = event.which || event.keyCode;
  
  switch (keyCode){
    case 38:
      paddle1Y -=5;
      break;
      
    case 40:
      paddle1Y +=5;
      break;
      
    default:
      // Avoid preventDefault() when not pressing expected keys
      return;
  }
  
  // Don't scroll window when pressing UP/DOWN
  event.preventDefault();
  
}
<canvas id = "gameCanvas" width = "600" height= "400"></canvas>
...