Инструкции по реализации функционала

Чтобы теперь задействовать левую ракетку, которая до этого момента была заколдована в виде стены, допишем следующие три строчки в функцию обратного вызова при загрузке модели в скрипте ai.js:

к сведению

Следующа часть кода изменяет часть кода обратного вызова на событие document.getElementsByClassName("modelFile")[0].onchange в файле ai.js.

    reader.onloadend = async function () {
        onnxSess = new onnx.InferenceSession();
        await onnxSess.loadModel(reader.result);
        use_bot.state = true;
        waitUntil(use_bot, runONNX);
        leftPaddle.width = rightPaddle.width;
        leftPaddle.height = rightPaddle.height;
        leftPaddle.y = rightPaddle.y;
    };

Таким образом, ширина, толщина и начальная позиция левой ракетки станет аналогичной правой ракетке.

Теперь нужно заменить некоторые входные данные в функции runONNX. Отзеркалим горизонтальную координату мячика, а вместо координаты правой ракетки будем подавать на вход координату левой:

к сведению

Следующая часть кода изменяет часть кода в функции runONNX в файле ai.js.

    var inp = Float32Array.from([
        1 - ball.x / normalizationConstant,
        ball.y / normalizationConstant,
        leftPaddle.y / normalizationConstant
    ]);

В теле операторов ветвления также заменяем правую ракетку на левую:

к сведению

Следующая часть кода изменяет часть кода в функции runONNX в файле ai.js.

    if (actionId === 2) {
        // up
        leftPaddle.dy = -leftPaddle.paddleSpeed;
    } else if (actionId === 1) {
        // down
        leftPaddle.dy = leftPaddle.paddleSpeed;
    } else {
        //nothing
        leftPaddle.dy = 0;
    }

Завершающим штрихом является добавление логики движений левой ракетки со стенками в движок игры скрипта engine.js:

к сведению

Следующую часть кода добавляем между строчками updateDataset(); и rightPaddle.y += rightPaddle.dy; в функции loop файла engine.js.

    updateDataset();

    if (use_bot.state) {
        leftPaddle.y += leftPaddle.dy;
        // Если правая платформа пытается вылезти за игровое поле вниз,
        if (leftPaddle.y < grid) {
            // то оставляем её на месте
            leftPaddle.y = grid;
        }
        // Проверяем то же самое сверху
        else if (leftPaddle.y > LeftmaxPaddleY) {
            leftPaddle.y = LeftmaxPaddleY;
        }
    }

    // Если платформы на предыдущем шаге куда-то двигались — пусть продолжают двигаться
    rightPaddle.y += rightPaddle.dy;

к сведению

Итоговый результат выполнения шага можно скачать тут.