Домашнє завдання.

Створити розраховану на багато користувачів гру.

Гра є полем з квадратних шахових клітин.

Розмір поля може встановлюватись у налаштуваннях.

Приклад налаштувань гри

{
    fps: 25,
    width: 20,
    height: 20,
    size: 50,
}

fps - кількість кадрів у с.

width, height - кількість клітин по вертикалі та горизонталі

size – розмір клітини в пікселях.

1 реліз

Серверна частина.

1. Створити двомірний масив із клітинами.

Формат масиву.

   scene = [
        [
            [  x: number, 
               y: number, 
               color: string, 
               borderColor: string, 
               border: number, 
               power: number[0-100]  
               actor: object
            ],
            [x: number, y: number, ...],
            []
            ...
        ],
        [],
        ...

    ]

При підключенні користувача на сцені розставити для нього фігури у шаховому порядку білі зверху праворуч, чорні внизу ліворуч (у кутах) для першого та другого користувача.

Якщо користувачів більше 3 нічого не робимо.

Формат об’єкта фігури.

actor = {
   color: string[black|white],
   name: [pone|rook|quin|king|bishop|knight],
   power: number[0-100],
   strenght: number[0-100],
   position: {x,y},
   image: string
}

1. Реалізувати подію переміщення.

Вхідні дані.

{
    action: 'move',
    from: {
        x: number,
        y: number,
    },
    to: {
        x: number,
        y: number,
    }

}

Події переміщати фігуру.

1. З частотою fps передавати на клієнт по вебсокет цей об’єкт сцени.

   { data: scene, action: ‘render’ }

Клієнтська сторона.

1. З’єднається із сервером.

2. Реалізувати функцію малювання клітин на полотні canvas.

3. Реалізувати малювання об’єктів фігур.

4. Реалізувати переміщення фігури з надсиланням повідомлення на сервер.

2 реліз

Серверна частина.

1. На сцену додати нового актора – танк замість ферзя.

2. Додати в сцену масив із кульками.

   { data: scene, action: ‘render’, tanks: [{color: string, image: string position: {x,y}},…], bullets: [{color: string, image: string position: {x,y}},…] }

3. Реалізувати подію повороту танка на 45 градусів.

4. Реалізувати подію пересування танка у 8 напрямах.

5. Реалізувати подію пострілу.

6. Переміщення кульки з видаленням поля при досягненні краю.

Клієнтська частина

1. Відображення танка

2. Відображення куль.

3 реліз

Серверна частина.

1. Відпрацювати колізію кульки з фігурою.

2. Відпрацювати колізію танка із фігурою.