vimp-engine 0.7.2 → 0.9.0

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

@@ -0,0 +1,77 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton StatModel
+
+let statModel;
+
+export default class StatModel {
+  constructor(data) {
+    if (statModel) {
+      return statModel;
+    }
+
+    statModel = this;
+
+    this._heads = data.heads;
+    this._bodies = data.bodies;
+    this._sortList = data.sortList;
+    this.publisher = new Publisher();
+  }
+
+  // открывает статистику
+  open() {
+    this.publisher.emit('open');
+    this.publisher.emit('mode', { name: 'stat', status: 'opened' });
+  }
+
+  // закрывает статистику
+  close() {
+    this.publisher.emit('close');
+    this.publisher.emit('mode', { name: 'stat', status: 'closed' });
+  }
+
+  // обновляет данные статистики
+  update(data) {
+    const tBodiesData = data[0];
+    const tHeadData = data[1];
+    const fullStatFlag = data[2];
+
+    // если обновление полное, требуется очистить таблицы <tbody>
+    // очищать <thead> не требуется, в tHeadData есть актуальные данные
+    if (fullStatFlag === true) {
+      this.publisher.emit('clearBodies', Object.values(this._bodies));
+    }
+
+    // если есть данные для <tbody>
+    if (tBodiesData) {
+      for (let i = 0, len = tBodiesData.length; i < len; i += 1) {
+        const tableId = this._bodies[tBodiesData[i][1]];
+
+        if (tableId) {
+          this.publisher.emit('tBody', {
+            id: tBodiesData[i][0],
+            tableId,
+            cellsData: tBodiesData[i][2],
+            sortData: this._sortList[tableId],
+            bodyNumber: tBodiesData[i][3] || 0,
+          });
+        }
+      }
+    }
+
+    // если есть данные для <thead>
+    if (tHeadData) {
+      for (let i = 0, len = tHeadData.length; i < len; i += 1) {
+        const tableId = this._heads[tHeadData[i][0]];
+
+        if (tableId) {
+          this.publisher.emit('tHead', {
+            tableId,
+            cellsData: tHeadData[i][1],
+            rowNumber: tHeadData[i][2] || 0,
+          });
+        }
+      }
+    }
+  }
+}

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

@@ -0,0 +1,216 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton VoteModel
+
+let voteModel;
+
+export default class VoteModel {
+  constructor(data) {
+    if (voteModel) {
+      return voteModel;
+    }
+
+    voteModel = this;
+
+    this._formatMessage = data.formatMessage;
+
+    this._menu = data.menu; // меню
+    this._templates = data.templates; // шаблоны голосований
+
+    this._type = ''; // тип ('menu', 'vote')
+    this._waitingValues = false; // ожидания значений
+
+    this._time = data.time || 10000; // время жизни голосования
+    this._timerId = null; // id таймера
+
+    this._timeOff = false; // флаг отключения времени жизни голосования
+
+    this._voteName = ''; // название голосования
+
+    this._title = null; // заголовок голосования
+    this._values = []; // все значения голосования
+
+    this._back = false; // флаг back
+    this._more = false; // флаг more
+    this._currentPage = 0; // текущая страница вывода значений
+    this._currentValues = []; // значения текущей страницы
+
+    this.publisher = new Publisher();
+  }
+
+  // открывает голосование
+  open() {
+    this.publisher.emit('mode', { name: 'vote', status: 'opened' });
+  }
+
+  createWithTemplate({ name, params, values }) {
+    const templateArr = this._templates[name];
+
+    if (templateArr) {
+      let title = templateArr[0];
+      values = values || templateArr[1];
+      const timeOff = templateArr[2] ? true : false;
+
+      if (params) {
+        title = this._formatMessage(title, params);
+      }
+
+      this.createVote(name, title, values, timeOff);
+    }
+  }
+
+  // создает голосование
+  createVote(name, title, values, timeOff) {
+    if (this._waitingValues) {
+      return;
+    }
+
+    this._type = 'vote';
+    this._back = false;
+    this._more = false;
+    this._currentPage = 0;
+
+    this._voteName = name;
+    this._timeOff = timeOff;
+    this._title = title;
+
+    if (typeof values === 'string') {
+      this._waitingValues = true;
+      this.publisher.emit('socket', values);
+    } else {
+      this._values = values;
+      this.show();
+    }
+  }
+
+  // создает меню
+  createMenu() {
+    if (this._waitingValues) {
+      return;
+    }
+
+    this._timeOff = false;
+
+    this._type = 'menu';
+    this._back = false;
+    this._more = false;
+    this._currentPage = 0;
+
+    this._title = 'Menu';
+    this._values = [];
+    this._voteName = '';
+
+    for (let i = 0, len = this._menu.length; i < len; i += 1) {
+      this._values.push(this._menu[i][1][0]);
+    }
+
+    this.show();
+  }
+
+  // обновляет массив значений
+  updateValues(values) {
+    if (this._waitingValues) {
+      this._values = values;
+      this._waitingValues = false;
+      this.show();
+    }
+  }
+
+  // обновляет голосование
+  update(keyCode) {
+    let number;
+
+    if (this._waitingValues) {
+      return;
+    }
+
+    // если keyCode это число от 0 до 9
+    if (48 <= keyCode && keyCode <= 57) {
+      number = String.fromCharCode(keyCode);
+      number = parseInt(number, 10);
+
+      // exit
+      if (number === 0) {
+        this.complete();
+        // back
+      } else if (number === 8) {
+        if (this._back) {
+          this._currentPage -= 1;
+          this.show();
+        }
+        // more
+      } else if (number === 9) {
+        if (this._more) {
+          this._currentPage += 1;
+          this.show();
+        }
+
+        // иначе, число от 1 до 7
+      } else {
+        number = number - 1;
+
+        // если тип данных для голосования это массив
+        if (this._type === 'menu') {
+          const data = this._menu[number];
+
+          // если число есть в массиве значений
+          if (data) {
+            const [name, [title, values, timeOff]] = data;
+
+            this.createVote(name, title, values, timeOff);
+          }
+
+          // иначе, если тип данных для голосования это объект
+        } else if (this._type === 'vote') {
+          const value = this._currentValues[number];
+
+          if (value) {
+            this.publisher.emit('socket', [this._voteName, value]);
+            this.complete();
+          }
+        }
+      }
+    }
+  }
+
+  // отображает голосование
+  show() {
+    const begin = this._currentPage * 7;
+    const max = begin + 7;
+    let currentValues = [];
+
+    this._currentValues = this._values.slice(begin, max);
+    this._back = this._currentPage > 0 ? true : false;
+    this._more = this._values.length > max ? true : false;
+
+    if (this._type === 'vote') {
+      for (let i = 0, len = this._currentValues.length; i < len; i += 1) {
+        currentValues.push(this._currentValues[i]);
+      }
+    } else {
+      currentValues = this._currentValues;
+    }
+
+    this.publisher.emit('clear', this._timerId);
+
+    this.publisher.emit('vote', {
+      title: this._title,
+      list: currentValues,
+      back: this._back,
+      more: this._more,
+      time: this._timeOff === true ? null : this._time,
+    });
+  }
+
+  // завершает голосование
+  complete() {
+    this._waitingValues = false;
+    this.publisher.emit('clear', this._timerId);
+    this.publisher.emit('mode', { name: 'vote', status: 'closed' });
+  }
+
+  // добавляет id таймера голосования
+  assignTimer(timerId) {
+    this._timerId = timerId || null;
+  }
+}

package/src/client/components/view/Auth.js

@@ -0,0 +1,167 @@
+import Publisher from '../../../lib/Publisher.js';
+import { buildForm, reportFormValidity } from '../../lib/formBuilder.js';
+
+// Singleton AuthView
+
+let authView;
+
+export default class AuthView {
+  // texts — игровые тексты формы (authSchema.texts: title, sections);
+  // сам каркас (auth.pug) нейтрален и текстов игры не содержит.
+  // params — та же дескрипторная схема формы, что и у room-формы
+  // (docs/en/plugin-api.md "Form schema"), едет по сети в PS_AUTH_DATA
+  constructor(model, elems, texts = null, params = null) {
+    if (authView) {
+      return authView;
+    }
+
+    authView = this;
+
+    this._mPublic = model.publisher;
+
+    this._auth = document.getElementById(elems.authId);
+    this._error = document.getElementById(elems.errorId);
+    this._enter = document.getElementById(elems.enterId);
+    this._fieldsContainer = document.getElementById(elems.fieldsId);
+    this._fields = new Map();
+
+    this.publisher = new Publisher();
+
+    this._renderTexts(elems, texts);
+    this._renderFields(elems, params);
+
+    // форма заполнена; нативная проверка (pattern/required) — сервер всё
+    // равно валидирует своими validators (renderError), это лишь UX-фильтр
+    // до отправки
+    this._enter.onclick = () => {
+      if (reportFormValidity(this._fieldsContainer)) {
+        authView.publisher.emit('enter');
+      }
+    };
+
+    this._mPublic.on('form', 'renderData', this);
+    this._mPublic.on('error', 'renderError', this);
+    this._mPublic.on('ok', 'hideAuth', this);
+  }
+
+  // строит контролы формы игрока из той же дескрипторной схемы, что и
+  // room-форма (единый formBuilder, docs/en/plugin-api.md "Form schema")
+  _renderFields(elems, params) {
+    if (!Array.isArray(params)) {
+      return;
+    }
+
+    const container = document.getElementById(elems.fieldsId);
+
+    if (!container) {
+      return;
+    }
+
+    // param.options — дескриптор-хвост (control/label/min/max/... —
+    // "options" здесь ключ протокола PS_AUTH_DATA, не список выбора select
+    const descriptors = params.map(({ name, value, options: descriptorRest }) => ({
+      name,
+      default: value,
+      ...descriptorRest,
+    }));
+
+    this._fields = buildForm(descriptors, container, {}, ({ name, value }) => {
+      this.publisher.emit('input', { name, value });
+    });
+  }
+
+  // заполняет нейтральный каркас текстами игры: заголовок и help-секции
+  // (sections: [{ heading, lines: [{ keys, text, last? } | { separator }] }])
+  _renderTexts(elems, texts) {
+    if (!texts) {
+      return;
+    }
+
+    const title = document.getElementById(elems.titleId);
+    const informs = document.getElementById(elems.informsId);
+
+    if (title && texts.title) {
+      title.textContent = texts.title;
+    }
+
+    if (!informs || !Array.isArray(texts.sections)) {
+      return;
+    }
+
+    informs.textContent = '';
+
+    for (const section of texts.sections) {
+      const block = document.createElement('div');
+
+      block.className = 'auth-inform';
+
+      if (section.heading) {
+        const heading = document.createElement('h4');
+
+        heading.textContent = section.heading;
+        block.appendChild(heading);
+      }
+
+      for (const line of section.lines || []) {
+        if (line.separator) {
+          block.appendChild(document.createElement('hr'));
+          continue;
+        }
+
+        const p = document.createElement('p');
+
+        if (line.last) {
+          p.className = 'last';
+        }
+
+        const keys = document.createElement('b');
+
+        keys.textContent = line.keys;
+        p.appendChild(keys);
+        p.appendChild(document.createTextNode(` - ${line.text}`));
+        block.appendChild(p);
+      }
+
+      informs.appendChild(block);
+    }
+  }
+
+  // показывает форму
+  showAuth() {
+    this._auth.style.display = 'block';
+  }
+
+  // скрывает форму
+  hideAuth(data) {
+    if (data) {
+      data.forEach(item => {
+        localStorage[item.name] = item.value;
+      });
+    }
+
+    this._auth.style.display = 'none';
+  }
+
+  // обновляет форму
+  renderData(data) {
+    const { name, value } = data;
+
+    this._error.textContent = '';
+    this._fields.get(name)?.setValue(value);
+  }
+
+  // отображает ошибки
+  renderError(data) {
+    this._error.textContent = '';
+
+    data.forEach(item => {
+      const name = item.name.toUpperCase();
+      const err = item.error;
+      const line = document.createElement('div');
+
+      line.textContent = err ? `${name}: ${err}` : `${name} is not correctly!`;
+
+      this._error.appendChild(line);
+    });
+  }
+}

package/src/client/components/view/CanvasManager.js

@@ -0,0 +1,44 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton CanvasManagerView
+
+let canvasManagerView;
+
+export default class CanvasManagerView {
+  constructor(model, apps) {
+    if (canvasManagerView) {
+      return canvasManagerView;
+    }
+
+    canvasManagerView = this;
+
+    this._model = model;
+    this._apps = apps;
+
+    this.publisher = new Publisher();
+
+    this._mPublic = this._model.publisher;
+
+    this._mPublic.on('resize', 'resize', this);
+    this._mPublic.on('updateCoords', 'updateCoords', this);
+  }
+
+  // изменяет размеры canvas
+  resize({ id, sizes }) {
+    const app = this._apps[id];
+
+    app.renderer.resize(sizes.width, sizes.height);
+  }
+
+  // вычисляет координаты для отображения и обновляет полотно
+  updateCoords({ id, coords, scale }) {
+    const app = this._apps[id];
+    const { width, height } = app.canvas;
+    const x = width / 2 - coords.x * scale;
+    const y = height / 2 - coords.y * scale;
+
+    app.stage.position.set(x, y);
+    app.stage.scale.set(scale);
+    app.render();
+  }
+}

package/src/client/components/view/Chat.js

@@ -0,0 +1,90 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// Singleton ChatView
+
+let chatView;
+
+export default class ChatView {
+  constructor(model, elems) {
+    if (chatView) {
+      return chatView;
+    }
+
+    chatView = this;
+
+    this._chat = document.getElementById(elems.chatBox);
+    this._cmd = document.getElementById(elems.cmd);
+
+    this.publisher = new Publisher();
+
+    this._mPublic = model.publisher;
+
+    this._mPublic.on('open', 'openCmd', this);
+    this._mPublic.on('close', 'closeCmd', this);
+    this._mPublic.on('newLine', 'createLine', this);
+    this._mPublic.on('oldLine', 'removeLine', this);
+    this._mPublic.on('newTimer', 'createTimer', this);
+    this._mPublic.on('oldTimer', 'removeTimer', this);
+  }
+
+  // открывает командную строку
+  openCmd() {
+    this._cmd.value = '';
+    this._cmd.style.display = 'block';
+    this._cmd.focus();
+  }
+
+  // закрывает командную строку
+  closeCmd(success) {
+    if (success) {
+      this.publisher.emit('message', this._cmd.value);
+    }
+
+    this._cmd.style.display = 'none';
+    this._cmd.value = '';
+  }
+
+  // добавляет сообщение в чат-лист
+  createLine(data) {
+    const line = document.createElement('div');
+    const id = data.id;
+    const message = data.message;
+    const text = message[0];
+    const name = message[1] || 'System';
+    const type = typeof message[2] === 'number' ? message[2] : '';
+
+    line.id = `line_${id}`;
+    line.className = `line${type}`;
+    line.setAttribute('data-name', `${name}: `);
+    line.textContent = text;
+
+    this._chat.appendChild(line);
+  }
+
+  // удаляет сообщение в чат-листе
+  removeLine(id) {
+    const line = document.getElementById(`line_${id}`);
+
+    line.style.opacity = 0;
+
+    setTimeout(() => {
+      this._chat.removeChild(line);
+    }, 2000);
+  }
+
+  // устанавливает таймер
+  createTimer(data) {
+    const messageId = data.id;
+    const time = data.time;
+    const timerId = setTimeout(() => {
+      this.publisher.emit('oldTimer');
+    }, time);
+
+    this.publisher.emit('newTimer', { messageId, timerId });
+  }
+
+  // снимает таймер
+  removeTimer(timer) {
+    clearTimeout(timer);
+  }
+}

package/src/client/components/view/Controls.js

@@ -0,0 +1,30 @@
+// Singleton controlsView
+
+let controlsView;
+
+export default class ControlsView {
+  constructor(model) {
+    if (controlsView) {
+      return controlsView;
+    }
+
+    controlsView = this;
+
+    this._model = model;
+
+    this._cursorTimerId = null;
+  }
+
+  // показывает курсор и запускает таймер его скрытия
+  resetCursorHideTimer() {
+    // сбрасывает старый таймер
+    clearTimeout(this._cursorTimerId);
+
+    document.body.classList.remove('hide-cursor');
+
+    // запускает новый таймер через 3 секунды бездействия мыши
+    this._cursorTimerId = setTimeout(() => {
+      document.body.classList.add('hide-cursor');
+    }, 3000);
+  }
+}

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

@@ -0,0 +1,48 @@
+import Publisher from '../../../lib/Publisher.js';
+
+// GameView
+
+export default class GameView {
+  constructor(model, app) {
+    this._app = app;
+
+    this._model = model;
+
+    this.publisher = new Publisher();
+
+    // подписка на события модели
+    this._mPublic = this._model.publisher;
+
+    this._mPublic.on('create', 'add', this);
+    this._mPublic.on('createEffect', 'addEffect', this);
+    this._mPublic.on('remove', 'remove', this);
+  }
+
+  // создает экземпляр на полотне
+  add(instance) {
+    this._app.stage.addChild(instance);
+
+    this._app.stage.sortChildren((a, b) => {
+      if (a.layer < b.layer) {
+        return -1;
+      }
+
+      if (a.layer > b.layer) {
+        return 1;
+      }
+
+      return 0;
+    });
+  }
+
+  // создаёт эффект и запускает его
+  addEffect(instance) {
+    this.add(instance);
+    instance.run();
+  }
+
+  // удаляет экземпляр с полотна
+  remove(instance) {
+    instance.destroy();
+  }
+}