Инструкция по сборке чистой веб-версии DOOM 2 (WebAssembly) с Fullscreen
Эта пошаговая инструкция позволит вам собрать оригинальный DOOM 2 для работы на любом веб-сервере в браузере. Игра компилируется на базе движка Doomgeneric через Emscripten (WASM), не зависает в браузере и поддерживает разворачивание на весь экран по кнопке.
Шаг 1. Подготовка окружения и скачивание исходников
Создаем чистую изолированную папку и клонируем официальный репозиторий:
rm -rf ~/doom-fresh
mkdir ~/doom-fresh && cd ~/doom-fresh
git clone https://github.com/ozkl/doomgeneric.git
cd doomgeneric/doomgeneric
Шаг 2. Добавление файла игры (WAD)
Скопируйте ваш файл игровых ресурсов (например, от Doom 2) в текущую папку. Важно: имя файла внутри WebAssembly должно быть строго маленькими буквами!
cp /путь/к/вашему/файлу/doom2.wad ./doom2.wad
Шаг 3. Создание HTML-шаблона (shell.html)
Браузеры блокируют автоматический переход во весь экран, поэтому нам нужна кнопка, привязанная к действию пользователя. Создаем файл-шаблон:
nano shell.htmlВставьте в него следующий код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Чистый DOOM на WebAssembly</title>
<style>
body { background: #111; color: #fff; text-align: center; font-family: sans-serif; margin: 0; padding: 20px; }
#canvas { width: 640px; height: 400px; border: 3px solid #444; background: #000; display: block; margin: 20px auto; image-rendering: pixelated; }
.btn { padding: 12px 25px; font-size: 18px; font-weight: bold; background: #e50914; color: white; border: none; cursor: pointer; border-radius: 5px; }
.btn:hover { background: #b80710; }
</style>
</head>
<body>
<h2>DOOM 2 (Чистая WebAssembly сборка)</h2>
<button class="btn" id="fs-btn">ИГРАТЬ НА ВЕСЬ ЭКРАН</button>
<canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
<script type='text/javascript'>
var Module = {
canvas: (function() { return document.getElementById('canvas'); })(),
print: function(text) { console.log(text); },
printErr: function(text) { console.error(text); },
arguments: ['-iwad', 'doom2.wad']
};
// Запрос полноэкранного режима по клику (требование безопасности браузера)
document.getElementById('fs-btn').addEventListener('click', () => {
const canvas = document.getElementById('canvas');
if (canvas.requestFullscreen) { canvas.requestFullscreen(); }
else if (canvas.webkitRequestFullscreen) { canvas.webkitRequestFullscreen(); }
});
</script>
{{{ SCRIPT }}}
</body>
</html>Сохраните и закройте ([kbd]Ctrl+O[/kbd], [kbd]Enter[/kbd], [kbd]Ctrl+X[/kbd]).
Шаг 4. Настройка Makefile под WebAssembly
Открываем родной файл сборки для Emscripten, чтобы заставить его использовать наш HTML-шаблон и вшить WAD-файл игры:
nano Makefile.emscriptenНайдите строчку, начинающуюся с LDFLAGS=, и замените её целиком на следующую:
LDFLAGS=-s USE_SDL=2 -s ALLOW_MEMORY_GROWTH=1 -s ASYNCIFY=1 --shell-file shell.html --preload-file doom2.wad@/doom2.wadСохраните и закройте файл.
Шаг 5. Компиляция проекта
Активируем компилятор Emscripten (укажите ваш путь к emsdk) и запускаем автоматическую сборку через Makefile:
source ~/doom-web/emsdk/emsdk_env.sh
emmake make -f Makefile.emscripten
Шаг 6. Запуск веб-сервера
После успешного завершения сборки запускаем локальный сервер прямо из этой папки:
python3 -m http.server 8080
Результат:
Откройте браузер по адресу http://ВАШ_IP_СЕРВЕРА:8080/doomgeneric.html. Нажмите на красную кнопку «ИГРАТЬ НА ВЕСЬ ЭКРАН», и игра развернется на полный монитор без зависаний браузера!