نمره بازی

با فشار دادن دکمه‌ها می‌توانید مکعب قرمز را حرکت دهید:

امتیاز

روش‌های مختلفی برای ثبت امتیاز در بازی وجود دارد، ما به شما نشان خواهیم داد که چگونه امتیاز را روی کانواس بنویسیم.

ابتدا یک کامپوننت امتیاز بسازیم:

var myGamePiece;
var myObstacles = [];
var myScore;
function startGame() {
  myGamePiece = new component(30, 30, "red", 10, 160);
  myScore = new component("30px", "Consolas", "black", 280, 40, "text");
  myGameArea.start();
}

در نتیجه، باید از یک پارامتر اضافی در فراخوانی سازنده‌ی کامپوننت استفاده کنیم، تا به سازنده‌ی کامپوننت اطلاع دهیم که نوع این کامپوننت "text" است.

در ساختار سازنده‌ی کامپوننت، ما بررسی می‌کنیم که آیا کامپوننت به عنوان "text" نوع، و از fillText مетод کیست، در عوض fillRect مетод:

function component(width, height, color, x, y, type) {
  this.type = type;
  this.width = width;
  this.height = height;
  this.speedX = 0;
  this.speedY = 0;
  this.x = x;
  this.y = y;
  this.update = function() {
    ctx = myGameArea.context;
    if (this.type == "text") {
      ctx.font = this.width + " " + this.height;
      ctx.fillStyle = color;
      ctx.fillText(this.text, this.x, this.y);
    } در غیر این صورت {}}
      ctx.fillStyle = color;
      ctx.fillRect(this.x, this.y, this.width, this.height);
    }
  }
...
}

در نهایت، در داخل تابع updateGameArea، کد‌هایی اضافه می‌کنیم که امتیاز را روی کانواس بنویسیم. ما از frameNo برای محاسبه امتیاز از این ویژگی‌ها استفاده می‌کنیم:

function updateGameArea() {
  var x, height, gap, minHeight, maxHeight, minGap, maxGap;
  برای (i = 0; i < myObstacles.length; i += 1) {
    اگر (myGamePiece.crashWith(myObstacles[i])) {
      myGameArea.stop();
      بازگردان;
    }
  }
  myGameArea.clear();
  myGameArea.frameNo += 1;
  اگر (myGameArea.frameNo == 1 یا everyinterval(150)) {
    x = myGameArea.canvas.width;
    minHeight = 20;
    maxHeight = 200;
    height = Math.floor(Math.random()*(maxHeight-minHeight+1)+minHeight);
    minGap = 50;
    maxGap = 200;
    gap = Math.floor(Math.random()*(maxGap-minGap+1)+minGap);
    myObstacles.push(new component(10, height, "green", x, 0));
    myObstacles.push(new component(10, x - height - gap, "green", x, height + gap));
  }
  برای (i = 0; i < myObstacles.length; i += 1) {
    myObstacles[i].speedX = -1;
    myObstacles[i].newPos();
    myObstacles[i].update();
  }
  myScore.text = "SCOR: " + myGameArea.frameNo;
  myScore.update();
  myGamePiece.newPos();
  myGamePiece.update();
}

آزمایش کنید