Демо по ТЗ · proof of concept

10 игр к новостям пяти регионов

У каждой игры есть прямая ссылка и макет издания, в который она встроена. Все десять изданий подключают игру по-разному: loader, прямой iframe, SPA, блок в середине статьи со спонсором, строгая CSP, загрузка после согласия на cookies.

Игры

СШАEN

Grow a newborn planet

Аркада на одной кнопке

Удерживайте, чтобы поднять планету на внешнюю орбиту: собирайте газ, уворачивайтесь от вспышек. Space.com, Elias 2-24 b.

Играть В издании game.json

СШАENНовая

Crew-13: mission briefing

Распределение ролей + брифинг

Рассадите экипаж по креслам и ответьте на три вопроса о переносе запуска. Space.com и блог NASA.

Играть В издании game.json

СНГRU

ИИ-гонка: верю / не верю

Карточки со свайпом

7 утверждений, после каждого — пояснение по статье. «Коммерсантъ».

Играть В издании В SPA game.json

СНГRUНовая

Слово из новости: гекконы

Угадай слово за 6 попыток

Три слова из научной новости о новых видах гекконов, экранная и физическая клавиатура. «Санкт-Петербургские ведомости».

Играть В SPA game.json

ИндияEN

Chase 296

Батинг на тайминг

Одно нажатие — один овер, 296 ранов за 50 оверов. ESPNcricinfo.

Играть В издании game.json

ИндияEN · HIНовая

Javelin final

Бросок: сила и угол

Три попытки против реальных медальных результатов Азиатских игр. Olympics.com.

Играть हिन्दी В издании game.json

КитайZH · EN

猜数字：全国科普月

Угадай число ползунком

6 раундов, очки за близость к ответу. China Daily.

Играть В издании game.json

КитайZH · ENНовая

高铁排排看

Сортировка

Расставьте четыре новые линии высокоскоростных железных дорог по длине, затем по времени в пути. Синьхуа.

Играть EN В издании game.json

ЕвропаEN

Young scientist memory

Memory, 6 пар

Факты о конкурсе EUCYS 2026 в Киле. RTÉ News.

Играть В издании game.json

ЕвропаDE · ENНовая

Solar-Lückentext

Текст с пропусками

Вставьте цифры рекорда солнечной генерации в Германии, два варианта лишние. Solarserver.

Spielen EN В издании game.json

Издания и способы интеграции

Все издания — макеты с вымышленными названиями. Тексты статей написаны заново, со ссылкой на оригинал. Внизу каждого макета показан код вставки и журнал событий виджета.

Макет издания	Способ интеграции	Что показывает	Игра
Newsroom DemoСША · EN	Loader + контейнер после статьи	Базовый путь: тизер при приближении к экрану, iframe по клику, подстройка высоты, события	Grow a newborn planet
Демо-редакцияСНГ · RU	Loader + контейнер после статьи	То же на русском	ИИ-гонка
Newsroom Demo · IndiaИндия · EN	Loader + контейнер после статьи	Лёгкая игра для недорогих телефонов	Chase 296
新闻演示站Китай · ZH	Loader + контейнер после статьи	Тизер на zh-CN, без внешних шрифтов	猜数字
Newsroom Demo · EuropeЕвропа · EN	Loader + контейнер после статьи	Игра без cookies и localStorage	Young scientist memory
Launchpad WeeklyСША · EN	Прямой iframe без скрипта	Резервный путь для CMS без сторонних скриптов: без тизера и событий, фиксированная высота	Crew-13 briefing
Лента-демоСНГ · RU	SPA без перезагрузки	Loader один раз на приложение, новые статьи подхватываются автоматически; статья без игры — блок скрыт	Слово из новости, ИИ-гонка
SportsDesk DemoИндия · EN / HI	Блок в середине статьи, спонсор, фирменные цвета	Размещение после второго абзаца, спонсорская плашка из каталога, цвета через CSS-переменные, переключение языка тизера	Javelin final
铁路资讯演示站Китай · ZH	Строгая Content-Security-Policy	Без inline-скриптов и стилей; какие домены добавить в CSP	高铁排排看
Demo-RundschauГермания · DE	Загрузка после согласия (CMP), тёмная тема	Loader активируется только после согласия, при отказе — заглушка; тизер в тёмной теме	Solar-Lückentext

Как устроено

Базовая вставка: контейнер после статьи и асинхронный loader.

<div class="news-game"
     data-placement="article-end"
     data-article-id="us-elias-2-24b"
     data-lang="en"></div>
<script async src="https://goshva.github.io/newsgame/widget/v1.js" data-site="demo-us"></script>

widget/v1.js — loader без зависимостей: тизер в Shadow DOM, ленивый показ, iframe по клику с sandbox="allow-scripts", проверка источника сообщений, таймаут 5 с, скрытие при ошибке, поддержка SPA и строгой CSP, спонсорская плашка.
catalog.json — какая игра к какой статье, тексты тизеров на языках, спонсор, срок актуальности, enabled для отключения игры или площадки.
games/shared/runtime.js — общая оболочка игр: загрузка game.json, кнопки «Заново», «Пауза», «Вернуться к статье», протокол postMessage v1, отчёт о высоте.
Цвета тизера: --ng-accent, --ng-pop, --ng-surface на контейнере.
События: config_request, visible, launch, ready, start, complete, error, exit. Страница получает их как newsgame:event.