Показать сообщение отдельно
  #3 (permalink)  
Старый 13.11.2020, 10:33
Аспирант
Отправить личное сообщение для Alena_03 Посмотреть профиль Найти все сообщения от Alena_03
 
Регистрация: 06.09.2020
Сообщений: 57

рони, не получается почему-то, теперь другая ошибка Uncaught TypeError: Road is not a constructor
const canvas = document.getElementById("game");
const ctx = canvas.getContext("2d");

var Road = new Image("layout/assets/img/bg-game.jpg");

Resize();

window.addEventListener("resize", Resize);

window.addEventListener("keydown", 
	function (e) { KeyDown(e); }); //Получение 
					// нажатий с клавиатуры

var objects = []; //Массив игровых объектов
var roads = 
[
    new Road("layout/assets/img/bg-game.jpg", 0),
    new Road("layout/assets/img/bg-game.jpg", 626)
]; //Массив с фонами
 
var player = null; //Объект, которым управляет игрок,
// — тут будет указан номер объекта в массиве objects

function Start()
{
    timer = setInterval(Update, 1000 / 60); //Состояние
    // игры будет обновляться 60 раз в секунду
    // — при такой частоте обновление происходящего
    // будет казаться очень плавным
}
 
function Stop()
{
    clearInterval(timer); //Остановка обновления
}
 
function Update() //Обновление игры
{
    roads[0].Update(roads[1]);
    roads[1].Update(roads[0]);
 
    Draw();
}
 
function Draw() //Работа с графикой
{
    ctx.clearRect(0, 0, canvas.width, canvas.height); //Очистка холста от предыдущего кадра
 
    for(var i = 0; i < roads.length; i++)
    {
        ctx.drawImage
        (
            roads[i].image, //Изображение для отрисовки
            0, //Начальное положение по оси X на изображении
            0, //Начальное положение по оси Y на изображении
            roads[i].image.width, //Ширина изображения
            roads[i].image.height, //Высота изображения
            roads[i].x, //Положение по оси X на холсте
            roads[i].y, //Положение по оси Y на холсте
            canvas.width, //Ширина изображения на холсте
            canvas.width //Так как ширина и высота фона одинаковые, в качестве высоты указывается ширина
        );
    }
}
 
function KeyDown(e)
{
    switch(e.keyCode)
    {
        case 37: //Влево
            break;
 
        case 39: //Вправо
            break;
 
        case 38: //Вверх
            break;
 
        case 40: //Вниз
            break;
 
        case 27: //Esc
            break;
    }
}
 
function Resize()
{
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
}

class Road_cl
{
    constructor(image, y)
    {
        this.x = 0;
        this.y = y;
 
        this.image = new Image();
        
        this.image.src = "layout/assets/img/bg-game.jpg";
    }
 
    Update(road) 
    {
        this.y += speed; //При обновлении изображение смещается вниз
 
        if(this.y > window.innerHeight) //Если изображение ушло за край холста, то меняем положение
        {
            this.y = road.y - this.image.height + speed; //Новое положение указывается с учётом второго фона
        }
    }
}

Последний раз редактировалось Alena_03, 13.11.2020 в 11:09.
Ответить с цитированием