vimp-engine 0.7.2 → 0.8.0

package/src/client/components/model/Game.js

@@ -0,0 +1,172 @@
+import Publisher from '../../../lib/Publisher.js';
+import Factory from '../../../lib/factory.js';
+
+// GameModel
+
+export default class GameModel {
+  constructor(assetsCollection, dependenciesCollection) {
+    // коллекция ассетов (Map)
+    this._assets = assetsCollection || new Map();
+
+    // коллекция зависимостей (Map)
+    this._dependencies = dependenciesCollection || new Map();
+
+    this._data = {};
+    this._managedEffects = {};
+    this.publisher = new Publisher();
+  }
+
+  // создает экземпляры вида:
+  // this._data['Tank']['01']   - игрок c id '01'
+  // this._data['Map']['1']     - данные карты на 1 слое
+  // this._data['Bullet']['f2'] - пуля с id 'f2'
+  //
+  // constructor - имя конструктора для экземпляра
+  // id          - id экземпляра
+  // data        - данные для создания экземпляра
+  create(constructor, id, data) {
+    const instance = Factory(
+      constructor,
+      data,
+      this._assets.get(constructor),
+      this._dependencies.get(constructor),
+    );
+
+    this._data[constructor] = this._data[constructor] || {};
+    this._data[constructor][id] = instance;
+    this.publisher.emit('create', instance);
+  }
+
+  // создает экземпляр эффекта (например анимация выстрела или дыма)
+  // this._managedEffects['ShotEffect'] = [
+  //   [100, 1000, 11, 1, true], [200, 200, 200, 200, false]
+  // ]
+  createEffect(constructor, data) {
+    const instance = Factory(
+      constructor,
+      data,
+      this._assets.get(constructor),
+      this._dependencies.get(constructor),
+    );
+
+    this._managedEffects[constructor] =
+      this._managedEffects[constructor] || new Set();
+    this._managedEffects[constructor].add(instance);
+
+    const originalDestroy = instance.destroy;
+
+    // proxy destroy - для удаления завершенных эффектов из this._managedEffects
+    instance.destroy = (...args) => {
+      if (this._managedEffects[constructor]?.has(instance)) {
+        this._managedEffects[constructor].delete(instance);
+
+        if (this._managedEffects[constructor].size === 0) {
+          delete this._managedEffects[constructor];
+        }
+      }
+
+      originalDestroy.apply(instance, args);
+    };
+
+    this.publisher.emit('createEffect', instance);
+  }
+
+  // возвращает данные:
+  // - экземпляра конструктора
+  // - всех экземляров конструктора
+  // - все данные
+  read(constructor, id) {
+    // если нужны данные по конструктору
+    if (constructor) {
+      // .. и они существуют
+      if (this._data[constructor]) {
+        // .. и также нужны данные конкретного id
+        if (id) {
+          // .. и они существуют
+          if (this._data[constructor][id]) {
+            return this._data[constructor][id];
+          }
+        } else {
+          return this._data[constructor];
+        }
+      }
+    } else {
+      return this._data;
+    }
+  }
+
+  // обновляет данные экземпляра
+  update(constructor, id, data) {
+    if (data === null) {
+      this.remove(constructor, id);
+    } else {
+      this._data[constructor][id].update(data);
+    }
+  }
+
+  // удаляет данные:
+  // - экземпляра конструктора
+  // - всех экземляров конструктора (пустой конструктор)
+  // - все данные (чистое полотно)
+  //
+  // constructor - имя конструктора для экземпляра (необязательно)
+  // id          - id экземпляра (необязательно)
+  remove(constructor, id) {
+    // если данные по конструктору
+    if (constructor) {
+      // .. и данные по конструктору существуют
+      if (this._data[constructor]) {
+        // если данные по конкретному id
+        if (id) {
+          // .. и они существуют
+          if (this._data[constructor][id]) {
+            this.publisher.emit('remove', this._data[constructor][id]);
+            delete this._data[constructor][id];
+          }
+        } else {
+          const data = this._data[constructor];
+
+          for (const id in data) {
+            if (Object.hasOwn(data, id)) {
+              this.publisher.emit('remove', data[id]);
+            }
+          }
+
+          delete this._data[constructor];
+        }
+        // иначе, если данные существуют в эффектах
+      } else if (this._managedEffects[constructor]) {
+        const effectsSet = this._managedEffects[constructor];
+
+        Array.from(effectsSet).forEach(effect => {
+          this.publisher.emit('remove', effect);
+        });
+      }
+      // иначе удаление всех данных
+    } else {
+      for (const constructor in this._data) {
+        if (Object.hasOwn(this._data, constructor)) {
+          const data = this._data[constructor];
+
+          for (const id in data) {
+            if (Object.hasOwn(data, id)) {
+              this.publisher.emit('remove', data[id]);
+            }
+          }
+        }
+      }
+
+      this._data = {};
+
+      Object.keys(this._managedEffects).forEach(constructor => {
+        const effectsSet = this._managedEffects[constructor];
+
+        if (effectsSet) {
+          Array.from(effectsSet).forEach(effect => {
+            this.publisher.emit('remove', effect);
+          });
+        }
+      });
+    }
+  }
+}

package/src/client/components/model/Lobby.js

@@ -0,0 +1,226 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton LobbyModel
+
+let lobbyModel;
+
+// Модель лобби: список серверов (реестр мастера), пагинация, поиск и умный
+// пинг. Сетевого I/O не делает — публикует события, а controller/main.js
+// выполняют fetch REST и сигнальный ping (как остальные модели шлют 'socket').
+export default class LobbyModel {
+  constructor(params) {
+    if (lobbyModel) {
+      return lobbyModel;
+    }
+
+    lobbyModel = this;
+
+    this._pageSize = params.pageSize;
+    this._pingInterval = params.pingInterval;
+
+    this._servers = new Map(); // hostId -> { ...server, latency }
+    this._order = []; // hostId в порядке выдачи мастером
+    this._total = 0; // всего серверов у мастера (для «Загрузить ещё»)
+    this._offset = 0;
+    this._search = '';
+
+    this._pingCounter = 0;
+    this._pending = new Map(); // pingId -> { hostId, time }
+    this._lastPing = new Map(); // hostId -> time последнего пинга
+    this._latencies = new Map(); // hostId -> latency (переживает refresh)
+
+    // Leaderboard выбранной игры (lobby-page-plan) — сетевого I/O не делает,
+    // как и остальная модель; fetch живёт в main.js (fetchLeaderboard/fetchPlacement)
+    this._leaderboard = [];
+    this._leaderboardTotal = 0;
+    this._myPlacement = null;
+    // отличает "ещё грузится" от "пусто, но ответ уже пришёл" (code review
+    // мелочь) — clearLeaderboard сбрасывает список ДО fetch'а (M1), без
+    // этого флага view на доли секунды рисует заглушку "No ranked players
+    // yet" вместо состояния загрузки
+    this._leaderboardLoaded = false;
+
+    this.publisher = new Publisher();
+  }
+
+  // запрашивает первую страницу с текущим поиском (сброс пагинации)
+  refresh() {
+    this._offset = 0;
+    this._emitFetch();
+  }
+
+  // задаёт поиск по имени и запрашивает список заново
+  setSearch(text) {
+    this._search = typeof text === 'string' ? text.trim() : '';
+    this._offset = 0;
+    this._emitFetch();
+  }
+
+  // подгружает следующую страницу
+  loadMore() {
+    this._offset += this._pageSize;
+    this._emitFetch();
+  }
+
+  // применяет ответ REST; append=false заменяет список, true — дополняет
+  setList({ total, servers } = {}, append = false) {
+    if (!append) {
+      this._servers.clear();
+      this._order = [];
+    }
+
+    this._total = total || 0;
+
+    (servers || []).forEach(server => {
+      if (!this._servers.has(server.hostId)) {
+        this._order.push(server.hostId);
+      }
+
+      // latency живёт в _latencies и переживает refresh/пагинацию
+      this._servers.set(server.hostId, {
+        ...server,
+        latency: this._latencies.get(server.hostId) ?? null,
+      });
+    });
+
+    this._emitList();
+  }
+
+  // пользователь выбрал сервер — во внешнего подписчика (P2P-подключение)
+  join(hostId) {
+    if (this._servers.has(hostId)) {
+      this.publisher.emit('join', hostId);
+    }
+  }
+
+  // готовит пинг видимого сервера; false — если пинговали недавно/сервер ушёл
+  pingHost(hostId, now) {
+    const last = this._lastPing.get(hostId);
+
+    if (last !== undefined && now - last < this._pingInterval) {
+      return false;
+    }
+
+    if (!this._servers.has(hostId)) {
+      return false;
+    }
+
+    this._lastPing.set(hostId, now);
+    this._pingCounter = (this._pingCounter + 1) >>> 0;
+
+    const pingId = this._pingCounter;
+
+    this._pending.set(pingId, { hostId, time: now });
+    this.publisher.emit('ping-request', { hostId, pingId });
+
+    return true;
+  }
+
+  // pong: считает приблизительную задержку, обновляет карточку
+  resolvePong(pingId, now) {
+    const pending = this._pending.get(pingId);
+
+    if (!pending) {
+      return;
+    }
+
+    this._pending.delete(pingId);
+
+    const server = this._servers.get(pending.hostId);
+
+    if (!server) {
+      return;
+    }
+
+    server.latency = Math.round(now - pending.time);
+    this._latencies.set(pending.hostId, server.latency);
+
+    this.publisher.emit('ping-update', {
+      hostId: pending.hostId,
+      latency: server.latency,
+    });
+  }
+
+  // топ-N рейтинга игры, применяется ответом GET /auth/leaderboard
+  setLeaderboard({ leaderboard, total } = {}) {
+    this._leaderboard = leaderboard || [];
+    this._leaderboardTotal = total || 0;
+    this._leaderboardLoaded = true;
+
+    this._scheduleLeaderboardEmit();
+  }
+
+  // позиция вызывающего, применяется ответом GET /auth/placement;
+  // placement === null — игрок ещё не ранжирован в этой игре
+  setPlacement({ placement, total, rank } = {}) {
+    this._myPlacement = { placement: placement ?? null, total: total || 0, rank: rank || 0 };
+
+    this._scheduleLeaderboardEmit();
+  }
+
+  // сбрасывает leaderboard/placement (main.js вызывает это перед fetch'ем
+  // новой игры — code review M1: иначе данные предыдущей игры «залипают»
+  // под заголовком новой, пока не придёт ответ, а при сетевом сбое остаются
+  // навсегда)
+  clearLeaderboard() {
+    this._leaderboard = [];
+    this._leaderboardTotal = 0;
+    this._myPlacement = null;
+    this._leaderboardLoaded = false;
+
+    this._scheduleLeaderboardEmit();
+  }
+
+  reset() {
+    this._servers.clear();
+    this._order = [];
+    this._total = 0;
+    this._offset = 0;
+    this._search = '';
+    this._pending.clear();
+    this._lastPing.clear();
+    this._latencies.clear();
+  }
+
+  _emitFetch() {
+    this.publisher.emit('fetch', {
+      offset: this._offset,
+      limit: this._pageSize,
+      search: this._search,
+      append: this._offset > 0,
+    });
+  }
+
+  _emitList() {
+    this.publisher.emit('list', {
+      servers: this._order.map(id => this._servers.get(id)),
+      hasMore: this._order.length < this._total,
+    });
+  }
+
+  // code review M2: setLeaderboard/setPlacement обычно приходят из одного
+  // Promise.all в main.js — без коалесинга каждый эмитил бы 'leaderboard'
+  // отдельно, и первый рендер уходил бы с новым списком, но ещё старым
+  // myPlacement. queueMicrotask (изоморфное API, разрешено в этом модуле)
+  // схлопывает оба вызова в один эмит на конец текущего таска
+  _scheduleLeaderboardEmit() {
+    if (this._leaderboardEmitScheduled) {
+      return;
+    }
+
+    this._leaderboardEmitScheduled = true;
+    queueMicrotask(() => {
+      this._leaderboardEmitScheduled = false;
+      this._emitLeaderboard();
+    });
+  }
+
+  _emitLeaderboard() {
+    this.publisher.emit('leaderboard', {
+      leaderboard: this._leaderboard,
+      total: this._leaderboardTotal,
+      myPlacement: this._myPlacement,
+      loaded: this._leaderboardLoaded,
+    });
+  }
+}

package/src/client/components/model/LobbyAuth.js

@@ -0,0 +1,161 @@
+import Publisher from '../../../lib/Publisher.js';
+import { decodeJwtPayload } from '../../../lib/jwt.js';
+
+// Singleton LobbyAuthModel
+
+let lobbyAuthModel;
+
+// Модель логина лобби (Этап B2): OAuth-редирект на central auth-сервис
+// (packages/auth), выбор ника при первом входе, identity JWT в localStorage.
+// Хранит состояние сессии и делает единственный сетевой вызов сама (POST
+// /nick) — в отличие от Lobby/Auth-моделей это простой fetch без сигнального
+// сокета, отдельный REST-канал к другому домену.
+export default class LobbyAuthModel {
+  constructor(config) {
+    if (lobbyAuthModel) {
+      return lobbyAuthModel;
+    }
+
+    lobbyAuthModel = this;
+
+    this._config = config;
+    this._pendingToken = null;
+    this._identityToken = null;
+    this._nick = null;
+
+    this.publisher = new Publisher();
+  }
+
+  // разбирает query-параметры OAuth-редиректа (?token=/?pendingToken=/
+  // ?authError=); при их отсутствии — восстанавливает сессию из localStorage.
+  // Возвращает true, если параметры были найдены и вызывающий должен
+  // подчистить адресную строку (history.replaceState)
+  boot(search) {
+    const { queryParams, tokenStorageKey } = this._config;
+    const params = new URLSearchParams(search);
+
+    const error = params.get(queryParams.error);
+    const token = params.get(queryParams.token);
+    const pendingToken = params.get(queryParams.pendingToken);
+
+    if (error) {
+      this.publisher.emit('login-error', error);
+      this._restore(tokenStorageKey);
+      return true;
+    }
+
+    if (token) {
+      this._setIdentity(token, tokenStorageKey);
+      return true;
+    }
+
+    if (pendingToken) {
+      this._pendingToken = pendingToken;
+      this.publisher.emit('nick-required');
+      return true;
+    }
+
+    this._restore(tokenStorageKey);
+    return false;
+  }
+
+  // URL редиректа на старт OAuth-потока auth-сервиса; вызывающий должен сам
+  // сделать переход (window.location.href) — модель не трогает location
+  loginUrl(provider) {
+    const returnUrl = `${window.location.origin}${window.location.pathname}`;
+
+    return `${this._config.serviceUrl}/oauth/${provider}/start?returnUrl=${encodeURIComponent(returnUrl)}`;
+  }
+
+  async submitNick(nick) {
+    if (!this._pendingToken) {
+      this.publisher.emit('nick-error', 'sessionExpired');
+      return;
+    }
+
+    let res;
+    let data;
+
+    try {
+      res = await fetch(`${this._config.serviceUrl}/nick`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          Authorization: `Bearer ${this._pendingToken}`,
+        },
+        body: JSON.stringify({ nick }),
+      });
+      data = await res.json().catch(() => ({}));
+    } catch {
+      this.publisher.emit('nick-error', 'network');
+      return;
+    }
+
+    if (!res.ok) {
+      this.publisher.emit('nick-error', data.error || 'unknown');
+      return;
+    }
+
+    this._pendingToken = null;
+    this._setIdentity(data.token, this._config.tokenStorageKey);
+  }
+
+  logout() {
+    delete localStorage[this._config.tokenStorageKey];
+
+    this._identityToken = null;
+    this._nick = null;
+
+    this.publisher.emit('login-required', this._config.providers);
+  }
+
+  getToken() {
+    return this._identityToken;
+  }
+
+  getNick() {
+    return this._nick;
+  }
+
+  _restore(tokenStorageKey) {
+    const token = localStorage[tokenStorageKey];
+
+    if (token) {
+      this._setIdentity(token, tokenStorageKey, false);
+    } else {
+      this.publisher.emit('login-required', this._config.providers);
+    }
+  }
+
+  // payload JWT не проверяется подписью на клиенте (только для отображения
+  // ника) — авторитетная проверка по /jwks на хосте (Этап B3). exp
+  // проверяется (F5 кодревью) — иначе восстановленная из localStorage сессия
+  // показывает «залогинен» токеном, который хост уже отклонит при входе в игру
+  _setIdentity(token, tokenStorageKey, persist = true) {
+    const payload = decodeJwtPayload(token);
+    const isExpired = typeof payload?.exp === 'number' && Date.now() >= payload.exp * 1000;
+
+    if (!payload || !payload.nick || isExpired) {
+      delete localStorage[tokenStorageKey];
+
+      // Тихое восстановление из localStorage (persist === false): просроченный/
+      // битый токен — штатная ситуация возврата на сайт, не ошибка. login-error
+      // — только на интерактивном пути.
+      if (persist) {
+        this.publisher.emit('login-error', isExpired ? 'tokenExpired' : 'invalidToken');
+      }
+
+      this.publisher.emit('login-required', this._config.providers);
+      return;
+    }
+
+    this._identityToken = token;
+    this._nick = payload.nick;
+
+    if (persist) {
+      localStorage[tokenStorageKey] = token;
+    }
+
+    this.publisher.emit('authenticated', { nick: this._nick });
+  }
+}

package/src/client/components/model/Panel.js

@@ -0,0 +1,70 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton PanelModel
+
+let panelModel;
+
+export default class PanelModel {
+  // keys — маппинг wire-ключей на имена полей (h → health, wa → activeWeapon);
+  // fields — схема полей игры: форматирование задаёт type, а не имя поля
+  constructor(keys, fields = []) {
+    if (panelModel) {
+      return panelModel;
+    }
+
+    panelModel = this;
+
+    this._keys = keys;
+    this._types = Object.fromEntries(
+      fields.map(field => [field.name, field.type]),
+    );
+    this.publisher = new Publisher();
+  }
+
+  // обновляет данные панели пользователя
+  // данные - это массив из строковых значение с разделителем ":"
+  // [‘h:100’, ’t:54’, ’w1:39’, ‘wa:w1’]
+  // или без разделителя:
+  // [’t:54’, 't' ’w1’, ‘w2’]
+  // первое значение - название поля или действие:
+  // h - health
+  // t - time
+  // w - weapon
+  // wa - active weapon (действие сменить активное оружие)
+  // если второе значение есть, оно передаётся в поле,
+  // если нет, то поле скрывается
+  update(arr) {
+    for (let i = 0, len = arr.length; i < len; i += 1) {
+      const data = arr[i].split(':');
+      const name = this._keys[data[0]]; // h -> health, wa -> activeWeapon
+      let value = data[1];
+
+      if (!value) {
+        this.publisher.emit('hide', name);
+      } else {
+        // если смена активного оружия
+        // value здесь - это ключ оружия, например 'w1'
+        // нужно получить имя панели, например 'bullet'
+        if (name === 'activeWeapon') {
+          this.publisher.emit('activeWeapon', this._keys[value]);
+        } else {
+          value = Number(value);
+
+          if (this._types[name] === 'time') {
+            value = this.formatTime(value);
+          }
+
+          this.publisher.emit('data', { name, value });
+        }
+      }
+    }
+  }
+
+  // задаёт формат времени
+  formatTime(time) {
+    const min = ~~(time / 60);
+    const sec = time % 60 || 0;
+
+    return sec < 10 ? `${min}:0${sec}` : `${min}:${sec}`;
+  }
+}