Witam, Mam problem przy stałym wyświetlaniu wyników po odbiciu paletek.Wynik się wyświetla ale znika po 1s.
<html>
<head>
</head>
<body onkeydown="keydown(event);" onkeyup="keyup(event)">
<canvas width="500" height="300" id="canvas"></canvas>
<script src="pong2.js"></script>
</body>
</html>
function Ball(x, y) {
this.x = x;
this.y = y;
this.dx = 5;
this.dy = 5;
this.r = 10;
};
Ball.prototype.draw = function(ctx) {
ctx.beginPath();
ctx.arc(this.x,this.y,this.r,0,2*Math.PI);
ctx.fillStyle=this.color;
ctx.fill();
}
Ball.prototype.move = function(ctx) {
if(this.x>=495 || this.x<=5) {
this.dx=this.dx*-1;
}
if(this.y>=295 || this.y<=5) {
this.dy=this.dy*-1;
}
this.x = this.x+this.dx;
this.y = this.y+this.dy;
this.draw(ctx);
}
function Pad() {
this.x = 0;
this.y = 0;
this.dy = 0;
this.w = 5;
this.h = 50;
}
Pad.prototype.draw = function(ctx) {
ctx.beginPath();
ctx.rect(this.x, this.y, 5, 50);
ctx.fillStyle = "#3B0B3B";
ctx.fill();
}
Pad.prototype.move = function(ctx) {
this.y = this.y + this.dy;
this.draw(ctx);
if(this.y < 0) {
this.y = 0;
}
if(this.y > 250) {
this.y = 250;
}
}
var wynik1 = 0 ;
var wynik2 = 0;
Pad.prototype.hit = function (ball){
if((ball.y>=this.y) && (ball.y<=(this.y + this.h))){
if(ball.dx>0){
if((ball.x+ball.r)==this.x){
ball.dx=-ball.dx;
ball.color="#D18100";
var t1 = wynik1++;
ctx.fillText(t1,400,200);
}
}
else{
if((ball.x-ball.r)==(this.x + this.w)){
ball.dx=-ball.dx;
ball.color="#00BEFF";
var t2 = wynik2++;
ctx.fillText(t2,200,200);
}
}
}
}
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var pad1 = new Pad();
pad1.x = 10;
pad1.draw(ctx);
var pad2 = new Pad();
pad2.x = 485;
pad2.draw(ctx);
var ball = new Ball(100, 100);
function keydown(event) {
var char = event.which || event.keyCode
document.title = char;
//w
if(char == 87) {
pad1.dy = -5;
}
//s
if(char == 83) {
pad1.dy = 5;
}
//strzalka w gore
if (char==38) {
pad2.dy = -5;
}
//strzalka w dol
if (char==40) {
pad2.dy = 5;
}
}
function keyup(event) {
var char = event.which || event.keyCode
//w
if(char == 87) {
pad1.dy = 0;
}
//s
if(char == 83) {
pad1.dy = 0;
}
//strzalka w gore
if (char==38) {
pad2.dy = 0;
}
//strzalka w dol
if (char==40) {
pad2.dy = 0;
}
}
var wynik2 = 0 ;
function play() {
ctx.fillStyle = "#F0C8F0";
ctx.fillRect(0, 0, 500, 300);
pad1.move(ctx);
pad2.move(ctx);
ball.move(ctx);
pad1.hit(ball);
pad2.hit(ball);
ctx.fillStyle="black";
ctx.font="30px Verdana";
//ctx.fillText(wynik1,400,200)
//wynik1++;
}
setInterval(play, 25);