OGS-Main
/
ogs-site
2
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

M-4.1

master
Михаил Капелько 2 years ago
parent
a532817e45
commit
8a0577ecc2
45 changed files with 2158 additions and 18 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +49
    -0
      M/4.1/игра.html
  2. +10
    -0
      M/4.1/игра/050.Заголовок.js
  3. +28
    -0
      M/4.1/игра/070.Виды.js
  4. +77
    -0
      M/4.1/игра/075.Анимация.js
  5. +48
    -0
      M/4.1/игра/080.Анимации.js
  6. +183
    -0
      M/4.1/игра/100.Изображения.js
  7. +28
    -0
      M/4.1/игра/120.Физика.js
  8. +149
    -0
      M/4.1/игра/140.Тела.js
  9. +119
    -0
      M/4.1/игра/160.Слежение.js
  10. +170
    -0
      M/4.1/игра/180.Объекты.js
  11. +31
    -0
      M/4.1/игра/190.Состояния.js
  12. +190
    -0
      M/4.1/игра/200.Сцена.js
  13. +16
    -0
      M/4.1/игра/220.Мышь.js
  14. +60
    -0
      M/4.1/игра/240.Столкновения.js
  15. +58
    -0
      M/4.1/игра/260.Подсказки.js
  16. +104
    -0
      M/4.1/игра/280.Меню.js
  17. +69
    -0
      M/4.1/игра/300.Реплики.js
  18. +92
    -0
      M/4.1/игра/700.Игра.js
  19. +1
    -0
      M/4.1/игра/matter-js
  20. +1
    -0
      M/4.1/игра/uikit
  21. +31
    -0
      M/4.1/общее/100.События.js
  22. +68
    -0
      M/4.1/общее/150.Состояние.js
  23. +91
    -0
      M/4.1/общее/200.функции.js
  24. +1
    -0
      M/4.1/общее/base64-js
  25. +1
    -0
      M/4.1/общее/pako
  26. +114
    -0
      M/4.1/редактор.html
  27. +127
    -0
      M/4.1/редактор/100.Редактор.js
  28. +53
    -0
      M/4.1/редактор/200.Пульт.js
  29. +13
    -0
      M/4.1/редактор/700.Муром.js
  30. +1
    -0
      M/4.1/редактор/ace
  31. +1
    -0
      M/4.1/редактор/uikit
  32. BIN
      M/doc/res/основа.jpg
  33. BIN
      M/doc/res/персонаж/sw.sk.outline.png
  34. +122
    -0
      M/doc/ru/animations.html
  35. +31
    -0
      M/doc/ru/animations.md
  36. +2
    -2
      M/doc/ru/bodies.html
  37. +2
    -2
      M/doc/ru/images.html
  38. +2
    -2
      M/doc/ru/item.template
  39. +3
    -2
      M/doc/ru/keys.html
  40. +2
    -0
      M/doc/ru/keys.md
  41. +2
    -2
      M/doc/ru/objects.html
  42. +2
    -2
      M/doc/ru/physics.html
  43. +2
    -2
      M/doc/ru/styles.html
  44. +2
    -2
      M/doc/ru/title.html
  45. +2
    -2
      M/doc/ru/tracking.html

+ 49
- 0
M/4.1/игра.html View File

@@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="общее/base64-js/base64js.min.js"></script>
<script src="общее/pako/pako.min.js"></script>
<script src="игра/matter-js/matter.min.js"></script>
<link rel="stylesheet" type="text/css" href="игра/uikit/uikit.min.css" />
<script src="игра/uikit/uikit.min.js"></script>
<script src="игра/uikit/uikit-icons.min.js"></script>
<style>
body {
}
#корень
{
position: relative;
}
</style>
</head>
<body>
<div id="заставка"></div>
<div id="корень"></div>
<div id="отладка"></div>

<script src="общее/100.События.js"></script>
<script src="общее/150.Состояние.js"></script>
<script src="общее/200.функции.js"></script>
<script src="игра/050.Заголовок.js"></script>
<script src="игра/070.Виды.js"></script>
<script src="игра/075.Анимация.js"></script>
<script src="игра/080.Анимации.js"></script>
<script src="игра/100.Изображения.js"></script>
<script src="игра/120.Физика.js"></script>
<script src="игра/140.Тела.js"></script>
<script src="игра/160.Слежение.js"></script>
<script src="игра/180.Объекты.js"></script>
<script src="игра/190.Состояния.js"></script>
<script src="игра/200.Сцена.js"></script>
<script src="игра/220.Мышь.js"></script>
<script src="игра/240.Столкновения.js"></script>
<script src="игра/260.Подсказки.js"></script>
<script src="игра/280.Меню.js"></script>
<script src="игра/300.Реплики.js"></script>
<script src="игра/700.Игра.js"></script>
<script>
var игра = new Игра();
</script>
</body>
</html>

+ 10
- 0
M/4.1/игра/050.Заголовок.js View File

@@ -0,0 +1,10 @@
function Заголовок()
{
this.обработатьКлюч = function(ключ, путь, значение)
{
if (ключ == "заголовок")
{
document.title = значение;
}
}
}

+ 28
- 0
M/4.1/игра/070.Виды.js View File

@@ -0,0 +1,28 @@
function Виды(события)
{
this.создать = function()
{
this.задано = {};
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "виды")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

события.уведомить(`виды/${имя}`);
};

// Конструктор.
this.создать();
};

+ 77
- 0
M/4.1/игра/075.Анимация.js View File

@@ -0,0 +1,77 @@
function Анимация(элемент, параметры)
{
this.запустить = function()
{
let п = параметры;
let воспроизведений = Number(п["воспроизведений"]);
let скорость = Number(п["скорость"]);
let к0 = Number(п["кадр.0"]);
let к1 = Number(п["кадр.1"]);
let д0 = Number(п["диапазон.0"]);
let д1 = Number(п["диапазон.1"]);
let д2 = Number(п["диапазон.2"]);
let д3 = Number(п["диапазон.3"]);

if (
воспроизведений == null ||
скорость == null ||
к0 == null ||
к1 == null ||
д0 == null ||
д1 == null ||
д2 == null ||
д3 == null
) {
return;
}

let ширинаДиапазона = Math.abs(д2 - д0);
let высотаДиапазона = Math.abs(д3 - д1);
let ширинаКадра = Math.abs(к0);
let высотаКадра = Math.abs(к1);
let кадровПоГоризонтали = Math.floor(ширинаДиапазона / ширинаКадра);
let кадровПоВертикали = Math.floor(высотаДиапазона / высотаКадра);

this.номерВоспроизведения = 0;
this.колвоВоспроизведений = воспроизведений;
this.размерКадра = [к0, к1];
this.поГоризонтали = кадровПоГоризонтали > кадровПоВертикали;
this.номерКадра = 0;
this.колвоКадров = this.поГоризонтали ? кадровПоГоризонтали : кадровПоВертикали;
// Возможно, в будущем стоит заменить частные таймеры на один общий.
// Вдруг в браузерах есть ограничение на количество таймеров от одной страницы.
this.таймер = setInterval(() => { this.анимировать(); }, скорость);
};

this.остановить = function()
{
if (this.таймер)
{
clearInterval(this.таймер);
}
};

this.анимировать = function()
{
this.номерКадра += 1;
if (this.номерКадра >= this.колвоКадров)
{
this.номерВоспроизведения += 1;
this.номерКадра = 0;
if (
this.колвоВоспроизведений > 0 &&
this.номерВоспроизведения >= this.колвоВоспроизведений
) {
this.остановить();
return;
}
}

let x = this.поГоризонтали ? this.номерКадра * this.размерКадра[0] : 0;
let y = this.поГоризонтали ? 0 : this.номерКадра * this.размерКадра[1];
элемент.style.backgroundPosition = `${x}px ${y}px`;
};

// Конструктор.
this.запустить();
}

+ 48
- 0
M/4.1/игра/080.Анимации.js View File

@@ -0,0 +1,48 @@
function Анимации(события)
{
this.создать = function()
{
this.задано = {};
this.анимации = {};
};

this.запустить = function(имя, элемент)
{
// Останавливаем прошлый экземпляр этой анимации на том же элементе.
this.остановить(имя, элемент);
// Запускаем новый экземпляр анимации на том же элементе.
let ключ = `${элемент.id}`;//-${имя}`;
this.анимации[ключ] = new Анимация(элемент, this.задано[имя]);
}

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "анимации")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

события.уведомить(`анимации/${имя}`);
};

this.остановить = function(имя, элемент)
{
let ключ = `${элемент.id}`;//-${имя}`;
if (ключ in this.анимации)
{
this.анимации[ключ].остановить();
delete this.анимации[ключ];
}
}

// Конструктор.
this.создать();
};

+ 183
- 0
M/4.1/игра/100.Изображения.js View File

@@ -0,0 +1,183 @@
function Изображения(события, виды, анимации, корень)
{
this.создать = function()
{
this.умолчание = {
пр: [0, 0, 100, 100],
угол: 0,
};
this.задано = {};
this.элементы = {};
события.подписать(this);
};

// Ключи и события.

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] == "изображения")
{
var имя = путь[1];
var свойство = путь.slice(2).join(".");
this.обновитьЭлемент(имя, свойство, значение);
}
};

this.обработатьСобытие = function(событие)
{
let в = "виды/";
let а = "анимации/";
if (событие.startsWith(в))
{
let вид = событие.substring(в.length);
this.обновитьЭлементыВида(вид);
}
else if (событие.startsWith(а))
{
let анимация = событие.substring(а.length);
this.обновитьЭлементыАнимации(анимация);
}
};

this.обновитьЭлементыАнимации = function(анимация)
{
for (let имя in this.задано)
{
let за = this.задано[имя];
let зан = за["анимация"];
if (зан && зан == анимация)
{
this.обновитьВидАнимацию(имя, за["вид"], за["анимация"]);
}
}
};

this.обновитьЭлементыВида = function(вид)
{
for (let имя in this.задано)
{
let за = this.задано[имя];
let заданныйВид = за["вид"];
if (заданныйВид && заданныйВид == вид)
{
this.обновитьВидАнимацию(имя, за["вид"], за["анимация"]);
}
}
};

// Без вида и анимации.

this.обновитьПозициюРазмерЭлемента = function(имя, эл)
{
let пр = this.пр(имя);
эл.style.left = `${пр[0]}px`;
эл.style.top = `${пр[1]}px`;
эл.style.width = `${пр[2]}px`;
эл.style.height = `${пр[3]}px`;
};

this.пр = function(имя)
{
let за = this.задано[имя];
let пр = this.умолчание.пр;
return [
за["пр.0"] ? за["пр.0"] : пр[0],
за["пр.1"] ? за["пр.1"] : пр[1],
за["пр.2"] ? за["пр.2"] : пр[2],
за["пр.3"] ? за["пр.3"] : пр[3],
];
};

this.создатьИлиПолучитьЭлемент = function(имя)
{
var эл = this.элементы[имя];
if (эл)
{
return эл;
}

var ум = this.умолчание;
эл = document.createElement("div");
эл.id = `изображения-${имя}`;
эл.style.position = "absolute";
эл.style.display = "block";
// Свойства по умолчанию.
this.обновитьПозициюРазмерЭлемента(имя, эл);
эл.style.transform = `rotate(${ум.угол}rad)`;
this.элементы[имя] = эл;
корень.appendChild(эл);
return эл;
};

// Вид и анимация.

this.обновитьУгол = function(имя)
{
var за = this.задано[имя];
var ум = this.умолчание;
var эл = this.элементы[имя];

var угол = за.угол ? за.угол : ум.угол;
var transform = `rotate(${угол}deg) `;

let вид = за["вид"];
if (вид)
{
let виза = виды.задано[вид];
if (виза && виза["transform"])
{
transform += виза["transform"];
}
}

эл.style.transform = transform;
};


this.обновитьВидАнимацию = function(имя, вид, анимация)
{
var эл = this.создатьИлиПолучитьЭлемент(имя);

if (вид)
{
let за = виды.задано[вид];
for (let параметр in за)
{
эл.style.setProperty(параметр, за[параметр]);
}
}

if (анимация)
{
анимации.запустить(анимация, эл);
}

this.обновитьУгол(имя);
};

this.обновитьЭлемент = function(имя, свойство, значение)
{
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;
var за = this.задано[имя];
var эл = this.создатьИлиПолучитьЭлемент(имя);

if (свойство.startsWith("пр"))
{
this.обновитьПозициюРазмерЭлемента(имя, эл);
}
else if (
(свойство == "угол") ||
(свойство == "вид") ||
(свойство == "анимация")
) {
this.обновитьВидАнимацию(имя, за["вид"], за["анимация"]);
}
};

// Конструктор.
this.создать();
}

+ 28
- 0
M/4.1/игра/120.Физика.js View File

@@ -0,0 +1,28 @@
function Физика(события)
{
this.создать = function()
{
this.задано = {};
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "физика")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

события.уведомить(`физика/${имя}`);
};

// Конструктор.
this.создать();
};

+ 149
- 0
M/4.1/игра/140.Тела.js View File

@@ -0,0 +1,149 @@
function Тела(события, физика, физмир)
{
this.создать = function()
{
this.умолчание = {
пр: [0, 0, 40, 20],
части: [],
часть: false,
};

this.задано = {};
this.тела = {};
this.имена = {};
события.подписать(this);
};

this.именаЧастей = function(за)
{
var имена = [];
for (var ключ in за)
{
if (ключ.startsWith("части"))
{
имена.push(за[ключ]);
}
}
return имена;
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "тела")
{
return;
}

var имя = путь[1];
var свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

this.пересоздатьТело(имя);
};

this.обработатьСобытие = function(событие)
{
let префикс = "физика/";
if (событие.startsWith(префикс))
{
let физ = событие.substring(префикс.length);
this.пересоздатьТелаФизики(физ);
}
};

this.пересоздатьТелаФизики = function(физ)
{
for (let имя in this.задано)
{
let заданнаяФизика = this.задано[имя]["физика"];
if (заданнаяФизика && заданнаяФизика == физ)
{
this.пересоздатьТело(имя);
}
}
};

this.пересоздатьТело = function(имя)
{
// Удаляем старое тело.
if (имя in this.тела)
{
var тело = this.тела[имя];
delete this.имена[тело.id];
// Всегда удаляем из мира: и составные, и несоставные тела.
Matter.Composite.remove(физмир, тело);
}

var за = this.задано[имя];
var ум = this.умолчание;
let пр = this.пр(имя);
// Переводим x,y из левого верхнего угла в центр.
пр[0] = пр[0] + пр[2] / 2.0;
пр[1] = пр[1] + пр[3] / 2.0;
// Параметры тела.
var параметры = {};
if (за.физика)
{
let заф = физика.задано[за.физика];
for (let параметр in заф)
{
мир.задатьПолныйКлюч(параметры, параметр, заф[параметр]);
}
}

var тело = null;
// Создаём новое составное тело.
if (за["части.0"])
{
параметры["parts"] = this.телаЧастей(this.именаЧастей(за));
тело = Matter.Body.create(параметры);
}
// Создаём новое несоставное тело.
// Вполне может быть частью другого составного тела.
else
{
тело = Matter.Bodies.rectangle(пр[0], пр[1], пр[2], пр[3], параметры);
}
this.тела[имя] = тело;
this.имена[тело.id] = имя;

// Добавляем тело в физический мир, если оно не является частью другого составного тела.
var часть = за.часть ? за.часть : ум.часть;
if (!часть)
{
Matter.Composite.add(физмир, тело);
}
};

this.пр = function(имя)
{
let за = this.задано[имя];
let пр = this.умолчание.пр;
return [
за["пр.0"] ? за["пр.0"] : пр[0],
за["пр.1"] ? за["пр.1"] : пр[1],
за["пр.2"] ? за["пр.2"] : пр[2],
за["пр.3"] ? за["пр.3"] : пр[3],
];
};

this.телаЧастей = function(имена)
{
var тела = [];
for (var н in имена)
{
var имя = имена[н];
var тело = this.тела[имя];
тела.push(тело);
}
return тела;
};

// Конструктор.
this.создать();
}


+ 119
- 0
M/4.1/игра/160.Слежение.js View File

@@ -0,0 +1,119 @@
function Слежение(состояние, изображения, тела)
{
this.создать = function()
{
this.умолчание = {
смещение: [0, 0],
скорость: 1,
предел: 0,
};
this.задано = {};
};

this.обновить = function()
{
for (var имя in this.задано)
{
this.расположитьИзображение(имя);
}
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "слежение")
{
return;
}

var имя = путь[1];
var свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;
};

this.расположитьИзображение = function(имя)
{
let за = this.задано[имя];
let тело = тела.тела[за.тело];
let элемент = изображения.элементы[за.изображение];
if (!тело || !элемент)
{
return;
}

let ум = this.умолчание;

// Параметры.
var скорость = за.скорость ? за.скорость : ум.скорость;
var смещениеX = за["смещение.0"] ? за["смещение.0"] : ум.смещение[0];
var смещениеY = за["смещение.1"] ? за["смещение.1"] : ум.смещение[1];
var предел = за.предел ? за.предел : ум.предел;

// Текущая позиция.
var x0 = 0;
if (элемент.dataset.слежениеX)
{
x0 = элемент.dataset.слежениеX;
}
var y0 = 0;
if (элемент.dataset.слежениеY)
{
y0 = элемент.dataset.слежениеY;
}

// Целевая позиция.
var x1 = тело.position.x + смещениеX;
var y1 = тело.position.y + смещениеY;
// Radians -> Degrees.
var угол = тело.angle * 180 / Math.PI;

// Устанавливаемая плавно позиция.
var x = this.lerp(x0, x1, скорость, предел);
var y = this.lerp(y0, y1, скорость, предел);

// Ничего не делаем, если разница ничтожна.
let ничтожно = 0.00001;
if (
элемент.dataset.слежениеX != null &&
элемент.dataset.слежениеY != null &&
элемент.dataset.слежениеУгол != null &&
Math.abs(элемент.dataset.слежениеX - x) < ничтожно &&
Math.abs(элемент.dataset.слежениеY - y) < ничтожно &&
Math.abs(элемент.dataset.слежениеУгол - угол) < ничтожно
) {
return;
}

// Иначе применяем новые значения.
элемент.dataset.слежениеX = x;
элемент.dataset.слежениеY = y;
элемент.dataset.слежениеУгол = угол;
var описание = {
пр: [x, y],
угол: угол,
};
состояние.разобрать({
изображения: {
[за.изображение]: описание,
},
});
};

this.lerp = function(v0, v1, t, предел) {
// Убираем мельтешение в случае наличия предела.
if (предел)
{
var delta = Math.abs(v0 - v1);
if (delta < предел) {
return v0;
}
}
return v0 * (1 - t) + v1 * t;
};

// Конструктор.
this.создать();
};

+ 170
- 0
M/4.1/игра/180.Объекты.js View File

@@ -0,0 +1,170 @@
function Объекты(состояние, события)
{
this.создать = function()
{
this.умолчание = {
пр: [0, 0, 40, 20],
};
this.задано = {};
события.подписать(this);
};

// Ключи и события.

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "объекты")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

let производноеИмя = `объекты-${имя}`;

if (свойство.startsWith("пр."))
{
let пр = this.пр(имя);
this.обновитьПозициюРазмер(производноеИмя, пр);
this.обновитьСлежение(производноеИмя, пр);
let вид = this.задано[имя]["вид"];
let анимация = this.задано[имя]["анимация"];
this.обновитьИзображение(производноеИмя, пр, вид, анимация);
}
else if (свойство == "физика")
{
this.обновитьФизику(производноеИмя, значение);
}
else if (
свойство == "вид" ||
свойство == "анимация"
) {
let вид = this.задано[имя]["вид"];
let анимация = this.задано[имя]["анимация"];
this.обновитьИзображение(производноеИмя, null, вид, анимация);
}
};

this.обработатьСобытие = function(событие)
{
let в = "виды/";
let а = "анимации/";
if (событие.startsWith(в))
{
let вид = событие.substring(в.length);
this.обновитьОбъектыВида(вид);
}
else if (событие.startsWith(а))
{
let анимация = событие.substring(а.length);
this.обновитьОбъектыАнимации(анимация);
}
};

this.обновитьОбъектыАнимации = function(анимация)
{
for (let имя in this.задано)
{
let за = this.задано[имя];
let зан = за["анимация"];
if (зан && зан == анимация)
{
this.обновитьВидАнимацию(имя);
}
}
};

this.обновитьОбъектыВида = function(вид)
{
for (let имя in this.задано)
{
let за = this.задано[имя];
let зви = за["вид"];
if (зви && зви == вид)
{
this.обновитьВидАнимацию(имя);
}
}
};

this.обновитьВидАнимацию = function(имя)
{
let вид = this.задано[имя]["вид"];
let анимация = this.задано[имя]["анимация"];
let производноеИмя = `объекты-${имя}`;
this.обновитьИзображение(производноеИмя, null, вид, анимация);
};

this.обновитьИзображение = function(имя, пр, вид, анимация)
{
var описание = {
вид: вид,
анимация: анимация,
};
if (пр)
{
описание["пр"] = пр;
}
состояние.разобрать({
изображения: {
[имя]: описание,
},
});
};

this.обновитьПозициюРазмер = function(имя, пр)
{
состояние.разобрать({
тела: {
[имя]: {
пр: пр,
},
},
});
};

this.обновитьСлежение = function(имя, пр)
{
состояние.разобрать({
слежение: {
[имя]: {
изображение: имя,
тело: имя,
смещение: [-пр[2] / 2, -пр[3] / 2],
},
},
});
};

this.обновитьФизику = function(имя, значение)
{
состояние.разобрать({
тела: {
[имя]: {
физика: значение,
},
},
});
};

this.пр = function(имя)
{
let за = this.задано[имя];
let пр = this.умолчание.пр;
return [
за["пр.0"] ? за["пр.0"] : пр[0],
за["пр.1"] ? за["пр.1"] : пр[1],
за["пр.2"] ? за["пр.2"] : пр[2],
за["пр.3"] ? за["пр.3"] : пр[3],
];
};

// Конструктор.
this.создать();
};

+ 31
- 0
M/4.1/игра/190.Состояния.js View File

@@ -0,0 +1,31 @@
function Состояния(состояние)
{
this.создать = function()
{
this.задано = {};
};

this.применить = function(имя)
{
состояние.разобратьВыпрямленный(this.задано[имя]);
}

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "состояния")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;
};

// Конструктор.
this.создать();
};

+ 190
- 0
M/4.1/игра/200.Сцена.js View File

@@ -0,0 +1,190 @@
function Сцена(состояние, состояниЯ, события, тела, адресИгры)
{
this.создать = function()
{
this.задано = {};
this.сцены = null;
this.состояниеИгрока = null;
события.подписать(this);
};

this.загрузитьСцену = function(имя)
{
let z64 = this.сцены[имя];
window.location = адресИгры + z64;
};

this.загрузитьОглавление = function(адрес)
{
var тут = this;
var запрос = new XMLHttpRequest();
запрос.onreadystatechange = function()
{
if (this.readyState == 4)
{
if (this.status == 200)
{
тут.разобратьОглавление(this.responseText);
}
else
{
console.error("Не удалось загрузить оглавление сцен:", this.status);
}
}
}
запрос.open("GET", адрес);
запрос.send();
};

this.задатьСостояниеИгрока = function(идёт, направление)
{
let стоятьЛ = this.задано["игрок.стоять.0"];
let стоятьП = this.задано["игрок.стоять.1"];
let идтиЛ = this.задано["игрок.идти.0"];
let идтиП = this.задано["игрок.идти.1"];
if (!стоятьЛ || !стоятьП || !идтиЛ || !идтиП)
{
return;
}

var название = идтиЛ;
if (идёт && направление > 0)
{
название = идтиП;
}
else if (!идёт && направление < 0)
{
название = стоятьЛ;
}
else if (!идёт && направление > 0)
{
название = стоятьП;
}

if (this.состояниеИгрока != название)
{
состояниЯ.применить(название);
this.состояниеИгрока = название;
}
};

this.обновить = function()
{
this.переместитьИгрока();
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "сцена")
{
return;
}

var свойство = путь.slice(1).join(".");
this.задано[свойство] = значение;
if (свойство == "оглавление")
{
this.загрузитьОглавление(значение);
}
};
this.обработатьНажатиеМышиУказатьИНажать = function(x, y, указатель)
{
let цель = this.задано["цель"];
if (!this.типИгрыУказатьИНажать() || !цель)
{
return;
}
let тело = тела.тела[цель];
if (!тело)
{
return;
}

var пр = [
тело.bounds.min.x,
тело.bounds.min.y,
тело.bounds.max.x - тело.bounds.min.x,
тело.bounds.max.y - тело.bounds.min.y,
]
let ширина = пр[2];
пр[0] = x - ширина;

состояние.разобрать({
тела: {
[цель]: {
пр: пр,
},
},
});
};

this.обработатьСобытие = function(событие)
{
let мышь = "мышь/нажатие/";
let сцена = "сцена/";
if (событие.startsWith(мышь))
{
let значения = событие.substring(мышь.length).split("/");
let x = Number(значения[0]);
let y = Number(значения[1]);
let указатель = значения[2];
this.обработатьНажатиеМышиУказатьИНажать(x, y, указатель);
}
else if (событие.startsWith(сцена))
{
let название = событие.substring(сцена.length);
this.загрузитьСцену(название);
}
};

this.переместитьИгрока = function()
{
let цель = this.задано["цель"];
let объект = this.задано["игрок.объект"];
let скоростьX = this.задано["игрок.скорость.0"];
if (!this.типИгрыУказатьИНажать() || !цель || !объект || !скоростьX)
{
return;
}

let игрок = `объекты-${объект}`;
let телоЦели = тела.тела[цель];
let телоИгрока = тела.тела[игрок];
if (!телоЦели || !телоИгрока)
{
return;
}

let игрокX = телоИгрока.position.x;
let цельX = телоЦели.position.x;
let ширина = телоЦели.bounds.max.x - телоЦели.bounds.min.x;
let расстояние = цельX - игрокX;
let направление = расстояние > 0 ? 1 : -1;

if (Math.abs(расстояние) < ширина / 2)
{
this.задатьСостояниеИгрока(false, направление);
return;
}

this.задатьСостояниеИгрока(true, направление);
Matter.Sleeping.set(телоИгрока, false);
Matter.Body.setVelocity(телоИгрока, { x: скоростьX * направление, y: 0 });
};

this.разобратьОглавление = function(содержимое)
{
let код = "this.сцены = " + содержимое;
eval(код);
};

this.типИгрыУказатьИНажать = function()
{
var тип = this.задано["тип"];
return тип && тип == "указать и нажать";
};

// Конструктор.
this.создать();
};

+ 16
- 0
M/4.1/игра/220.Мышь.js View File

@@ -0,0 +1,16 @@
function Мышь(события)
{
this.создать = function()
{
window.addEventListener("click", function(o) {
события.уведомить(`мышь/нажатие/${o.clientX}/${o.clientY}/${o.target.id}`);
});
window.addEventListener("mousemove", function(o) {
события.уведомить(`мышь/перемещение/${o.clientX}/${o.clientY}/${o.target.id}`);
});
};

// Конструктор.
this.создать();
};


+ 60
- 0
M/4.1/игра/240.Столкновения.js View File

@@ -0,0 +1,60 @@
function Столкновения(события, тела, физдвижок)
{
this.создать = function()
{
this.задано = {};
Matter.Events.on(
физдвижок,
"collisionActive",
(событие) => { this.обработатьСтолкновение(событие) }
);
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "столкновения")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;
};

this.обработатьСтолкновение = function(событие)
{
for (var имя in this.задано)
{
var ст = this.задано[имя];
var имя1 = ст["тела.0"];
var имя2 = ст["тела.1"];
if (!имя1 || !имя2 || !ст.событие)
{
continue;
}

var пары = событие.pairs;
for (var номер in пары)
{
var пара = пары[номер];
var п1 = тела.имена[пара.bodyA.id];
var п2 = тела.имена[пара.bodyB.id];
if (
!((имя1 == п1) && (имя2 == п2)) &&
!((имя1 == п2) && (имя2 == п1))
) {
continue;
}
мир.события.уведомить(ст.событие);
}
}
};

// Конструктор.
this.создать();
};

+ 58
- 0
M/4.1/игра/260.Подсказки.js View File

@@ -0,0 +1,58 @@
function Подсказки()
{
this.создать = function()
{
this.задано = {};
};

this.задатьПодсказку = function(имя)
{
let за = this.задано[имя];
if (!за.элемент || !за.текст)
{
return;
}

let элемент = document.getElementById(за.элемент);
if (!элемент)
{
return;
}

элемент.setAttribute("uk-tooltip", `pos: right; title: ${за.текст}`);
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "подсказки")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;

this.задатьПодсказку(имя);
};

this.подсказкаДляЭлемента = function(элемент)
{
for (var имя in this.задано)
{
let подсказка = this.задано[имя];
if (подсказка.элемент == элемент)
{
return имя;
}
}
return null;
};

// Конструктор.
this.создать();
};

+ 104
- 0
M/4.1/игра/280.Меню.js View File

@@ -0,0 +1,104 @@
function Меню(события, подсказки, реплики)
{
this.создать = function()
{
события.подписать(this);
this.установитьМеню();
this.улавливатьВыбор();
};

this.обработатьСобытие = function(событие)
{
let мышь = "мышь/нажатие/";
let сами = "меню/";
if (событие.startsWith(мышь))
{
let значения = событие.substring(мышь.length).split("/");
let элемент = значения[2];
let имя = подсказки.подсказкаДляЭлемента(элемент);
if (имя && имя in реплики.задано)
{
this.отобразитьМеню(имя);
}
}
else if (событие.startsWith(сами))
{
UIkit.modal("#меню").hide();
}
};

this.отобразитьМеню = function(имя)
{
this.активнаяПодсказка = имя;
let подсказка = подсказки.задано[имя];
document.getElementById("меню-заголовок").innerHTML = подсказка.текст;
UIkit.modal("#меню").show();
};

this.улавливатьВыбор = function()
{
var тут = this;
let глаз = document.getElementById("меню-кнопка-глаз");
глаз.addEventListener(
"click",
function() {
события.уведомить(`меню/глаз/${тут.активнаяПодсказка}`);
}
);

let рука = document.getElementById("меню-кнопка-рука");
рука.addEventListener(
"click",
function() {
события.уведомить(`меню/рука/${тут.активнаяПодсказка}`);
}
);

let рот = document.getElementById("меню-кнопка-рот");
рот.addEventListener(
"click",
function() {
события.уведомить(`меню/рот/${тут.активнаяПодсказка}`);
}
);

let нога = document.getElementById("меню-кнопка-нога");
нога.addEventListener(
"click",
function() {
события.уведомить(`меню/нога/${тут.активнаяПодсказка}`);
}
);
};

this.установитьМеню = function()
{
let html = `
<div id="меню" uk-modal>
<div class="uk-modal-dialog uk-modal-body">
<button class="uk-modal-close-default" type="button" uk-close></button>
<h2 id="меню-заголовок" class="uk-modal-title">Заголовок</h2>
<div class="uk-child-width-1-4 uk-text-center" uk-grid>
<div>
<div id="меню-кнопка-глаз" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">👁️</div>
</div>
<div>
<div id="меню-кнопка-рука" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🤚</div>
</div>
<div>
<div id="меню-кнопка-рот" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🗣</div>
</div>
<div>
<div id="меню-кнопка-нога" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🥾</div>
</div>
</div>
</div>
</div>
`;
document.body.insertAdjacentHTML("beforeend", html);
};

// Конструктор.
this.создать();
};


+ 69
- 0
M/4.1/игра/300.Реплики.js View File

@@ -0,0 +1,69 @@
function Реплики(события)
{
this.создать = function()
{
this.задано = {};
события.подписать(this);
};

this.номерРеплики = function(инструмент)
{
if (инструмент == "рука")
{
return 1;
}
else if (инструмент == "рот")
{
return 2;
}
else if (инструмент == "нога")
{
return 3;
}
// "глаз"
return 0;
};

this.обработатьКлюч = function(ключ, путь, значение)
{
if (путь[0] != "реплики")
{
return;
}

let имя = путь[1];
let свойство = путь.slice(2).join(".");
if (!this.задано[имя])
{
this.задано[имя] = {};
}
this.задано[имя][свойство] = значение;
};

this.обработатьСобытие = function(событие)
{
let меню = "меню/";
if (событие.startsWith(меню))
{
let значения = событие.substring(меню.length).split("/");
let инструмент = значения[0];
let подсказка = значения[1];
this.отобразитьРеплику(инструмент, подсказка);
}
};

this.отобразитьРеплику = function(инструмент, подсказка)
{
let номер = this.номерРеплики(инструмент);
let реплика = this.задано[подсказка][номер];
let частей = реплика.split(/ /);
let длительность = частей.length * 1000;
UIkit.notification({
message: реплика,
timeout: длительность,
});
};

// Конструктор.
this.создать();
};

+ 92
- 0
M/4.1/игра/700.Игра.js View File

@@ -0,0 +1,92 @@
function Игра()
{
this.создать = function()
{
мир.физдвижок = Matter.Engine.create({
enableSleeping: true,
gravity: {
y: 2,
},
});
var корень = document.getElementById("корень");
мир.события = new События();
мир.состояние = new Состояние();
мир.состояние.обработчик = (к, п, з) => { this.обработатьКлюч(к, п, з) };
мир.виды = new Виды(мир.события);
мир.анимации = new Анимации(мир.события);
мир.изображения = new Изображения(мир.события, мир.виды, мир.анимации, корень),
мир.физика = new Физика(мир.события);
мир.тела = new Тела(мир.события, мир.физика, мир.физдвижок.world);
мир.слежение = new Слежение(мир.состояние, мир.изображения, мир.тела);
мир.объекты = new Объекты(мир.состояние, мир.события);
мир.состояниЯ = new Состояния(мир.состояние);
let адресИгры = window.location.pathname + "/../игра.html?z64=";
мир.сцена = new Сцена(мир.состояние, мир.состояниЯ, мир.события, мир.тела, адресИгры);
мир.мышь = new Мышь(мир.события);
мир.столкновения = new Столкновения(мир.события, мир.тела, мир.физдвижок);
мир.подсказки = new Подсказки();
мир.реплики = new Реплики(мир.события);
мир.меню = new Меню(мир.события, мир.подсказки, мир.реплики);
this.ключники = [
new Заголовок(),
мир.виды,
мир.анимации,
мир.изображения,
мир.физика,
мир.тела,
мир.слежение,
мир.объекты,
мир.состояниЯ,
мир.сцена,
мир.столкновения,
мир.подсказки,
мир.реплики,
];

var z64 = мир.параметрыЗапуска()["z64"];
this.исполнитьКод(z64);
this.отслеживатьОбновленияКода();
this.обновить();
};

this.исполнитьКод = function(z64)
{
if (z64)
{
var код = мир.изZ64(z64);
eval(код);
}
};

this.обновить = function()
{
Matter.Engine.update(мир.физдвижок);
мир.слежение.обновить();
мир.сцена.обновить();

var тут = this;
requestAnimationFrame(function() {
тут.обновить();
});
};

this.обработатьКлюч = function(ключ, путь, значение)
{
for (var номер in this.ключники)
{
var ключник = this.ключники[номер];
ключник.обработатьКлюч(ключ, путь, значение);
}
};

this.отслеживатьОбновленияКода = function()
{
var тут = this;
window.addEventListener("message", function(событие) {
тут.исполнитьКод(событие.data);
});
};

// Конструктор.
this.создать();
}

+ 1
- 0
M/4.1/игра/matter-js View File

@@ -0,0 +1 @@
../../стороннее/matter-js

+ 1
- 0
M/4.1/игра/uikit View File

@@ -0,0 +1 @@
../../стороннее/uikit

+ 31
- 0
M/4.1/общее/100.События.js View File

@@ -0,0 +1,31 @@
function События()
{
this.создать = function()
{
this.обработчики = [];
};

this.подписать = function(обработчик)
{
this.обработчики.push(обработчик);
};

this.отписать = function(обработчик) {
var номер = this.обработчики.indexOf(обработчик);
if (номер != -1)
{
this.обработчики.splice(номер, 1);
}
};

this.уведомить = function(событие) {
for (var номер in this.обработчики)
{
var обработчик = this.обработчики[номер];
обработчик.обработатьСобытие(событие);
}
};

// Конструктор.
this.создать();
}

+ 68
- 0
M/4.1/общее/150.Состояние.js View File

@@ -0,0 +1,68 @@
function Состояние()
{
this.создать = function()
{
this.обработчик = null;
this.значения = {};
};

this.выпрямить = function(obj)
{
// https://stackoverflow.com/a/42121920
var newObj = {};
for (var key in obj)
{
if (typeof obj[key] === 'object' && obj[key] !== null)
{
var temp = this.выпрямить(obj[key])
for (var key2 in temp)
{
newObj[key + "." + key2] = temp[key2];
}
}
else
{
newObj[key] = obj[key];
}
}
return newObj;
};

this.лишьНовыеЗначения = function(значения)
{
var новые = {};
for (var ключ in значения)
{
var было = this.значения[ключ];
var стало = значения[ключ];
if (!(было != null && было == стало))
{
новые[ключ] = стало;
this.значения[ключ] = стало;
}
}
return новые;
};

this.разобрать = function(словарь)
{
this.разобратьВыпрямленный(this.выпрямить(словарь));
};

this.разобратьВыпрямленный = function(выпрямленныйСловарь)
{
var значения = this.лишьНовыеЗначения(выпрямленныйСловарь);
for (var ключ in значения)
{
var путь = ключ.split(".");
var значение = значения[ключ];
if (this.обработчик)
{
this.обработчик(ключ, путь, значение);
}
}
}

// Конструктор.
this.создать();
}

+ 91
- 0
M/4.1/общее/200.функции.js View File

@@ -0,0 +1,91 @@
var мир = {};

мир.uuid = function()
{
// https://stackoverflow.com/a/2117523
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(
/[xy]/g,
function(c)
{
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
}
);
};

мир.вZ64 = function(строка)
{
var байты = new TextEncoder("utf-8").encode(строка);
var архив = pako.deflate(байты, { to: 'string' });
return base64js.fromByteArray(архив);
};

мир.изZ64 = function(строка)
{
var архив = base64js.toByteArray(строка);
var байты = pako.inflate(архив);
return new TextDecoder("utf-8").decode(байты);
};

мир.задатьПолныйКлюч = function(словарь, полныйКлюч, значение) {
var путь = полныйКлюч.split(".");
var пройти = путь.length - 1;
var вложенность = словарь;
for (var номер = 0; номер < пройти; ++номер)
{
var ключ = путь[номер];
if (!(ключ in вложенность))
{
вложенность[ключ] = {};
вложенность = вложенность[ключ];
}
}
// Значение в конце вложенности.
var ключ = путь[пройти];
вложенность[ключ] = значение;
};

мир.назначитьКнопкамСобытия = function(события, список)
{
for (var номер in список)
{
const пара = список[номер];
var кнопка = document.getElementById(пара[0]);
кнопка.addEventListener("click", function(_) {
события.уведомить(пара[1]);
});
}
};

мир.параметрыЗапуска = function()
{
var параметры = {};
var запрос = window.location.search.substring(1);
var аргументы = запрос.split("&");
for (var номер in аргументы)
{
var арг = аргументы[номер];
var позицияЗнака = арг.indexOf("=");
// Лишь ключ.
if (позицияЗнака == -1)
{
var ключ = decodeURIComponent(арг);
параметры[ключ] = null;
}
// Ключ со значением.
else
{
var сыройКлюч = арг.slice(0, позицияЗнака);
var сыроеЗначение = арг.slice(позицияЗнака + 1);
var ключ = decodeURIComponent(сыройКлюч);
var значение = decodeURIComponent(сыроеЗначение);
параметры[ключ] = значение;
}
}
return параметры;
};

мир.разобрать = function(словарь)
{
мир.состояние.разобрать(словарь);
};

+ 1
- 0
M/4.1/общее/base64-js View File

@@ -0,0 +1 @@
../../стороннее/base64-js

+ 1
- 0
M/4.1/общее/pako View File

@@ -0,0 +1 @@
../../стороннее/pako

+ 114
- 0
M/4.1/редактор.html View File

@@ -0,0 +1,114 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>M-4.1</title>

<script src="общее/base64-js/base64js.min.js"></script>
<script src="общее/pako/pako.min.js"></script>
<script src="редактор/ace/ace.js"></script>
<script src="редактор/ace/mode-javascript.js"></script>
<script src="редактор/ace/worker-javascript.js"></script>
<link rel="stylesheet" type="text/css" href="редактор/uikit/uikit.min.css" />
<script src="редактор/uikit/uikit.min.js"></script>
<script src="редактор/uikit/uikit-icons.min.js"></script>

<style>
#редактор
{
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: calc(50% - 2em);
}
#пульт
{
position: absolute;
left: calc(50% - 2em);
top: 0;
bottom: 0;
width: 4em;
display: flex;
flex-direction: column;
border: 1px dashed gainsboro;
}
#проигрыватель
{
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: calc(50% - 2em);
height: 100%;
border: 0px none;
}

.впульте
{
margin: 0 auto;
}
</style>
</head>
<body>
<div id="редактор"></div>
<div id="пульт">
<span id="ошибка" class="впульте">&nbsp;</span>
<a id="перезапустить" class="впульте uk-icon-button uk-margin-top" uk-icon="refresh" uk-tooltip="Перезапустить"></a>
<a id="отдельно" class="впульте uk-icon-button uk-margin-top" uk-icon="desktop" uk-tooltip="Запустить в отдельной вкладке"></a>
<a id="ссылка" class="впульте uk-icon-button uk-margin-top" uk-icon="link" uk-tooltip="Скопировать ссылку"></a>
<a id="документация" class="впульте uk-icon-button uk-margin-top" uk-icon="question" uk-tooltip="Документация"></a>
<a id="версия" class="впульте uk-icon-button uk-margin-top" uk-icon="git-branch" uk-tooltip="Версия"></a>
<div uk-dropdown="mode: click">
<table class="uk-table">
<tbody>
<tr>
<td>4.1</td>
<td>анимации, подсказки, реплики, состояния, столкновения, сцена</td>
</tr>
<tr>
<td><a href="../4.0/редактор.html">4.0</a></td>
<td>виды, физика; переработанные объекты, изображения, тела</td>
</tr>
<tr>
<td><a href="../3.5/редактор.html">3.5</a></td>
<td>объекты</td>
</tr>
<tr>
<td><a href="../3.4/редактор.html">3.4</a></td>
<td>Документация</td>
</tr>
<tr>
<td><a href="../3.3/редактор/index.html">3.3</a></td>
<td>тела, слежение</td>
</tr>
<tr>
<td><a href="../3.2/редактор/index.html">3.2</a></td>
<td>мир.параметрыЗапуска, мир.разобрать, заголовок, изображения, состояние, физика</td>
</tr>
<tr>
<td><a href="../3.1/редактор/index.html">3.1</a></td>
<td>Кнопки перезапуска, копирования ссылки, запуска в отдельной вкладке</td>
</tr>
<tr>
<td><a href="../3.0/редактор/index.html">3.0</a></td>
<td>Проверка введённого кода на отсутствие синтаксических ошибок</td>
</tr>
</tbody>
</table>
</div>
</div>

<iframe id="проигрыватель" name="проигрыватель"></iframe>
<script src="общее/100.События.js"></script>
<script src="общее/150.Состояние.js"></script>
<script src="общее/200.функции.js"></script>
<script src="редактор/100.Редактор.js"></script>
<script src="редактор/200.Пульт.js"></script>
<script src="редактор/700.Муром.js"></script>
<script>
var муром = new Муром();
</script>
</body>
</html>

+ 127
- 0
M/4.1/редактор/100.Редактор.js View File

@@ -0,0 +1,127 @@
function Редактор(события, имяРедактора)
{
this.создать = function()
{
this.первоначальныйЗаголовок = document.title;
this.установитьAce();
this.улавливатьЗавершениеРедактирования();
this.задатьКодПриЗапуске();
события.подписать(this);
};

this.задатьКодПриЗапуске = function()
{
var z64 = мир.параметрыЗапуска()["z64"];
if (z64)
{
var код = мир.изZ64(z64);
this.ace.session.setValue(код);
}
};

this.запуститьОтдельно = function()
{
var содержимое = this.ace.session.getValue();
var z64 = мир.вZ64(содержимое);
var путь = window.location.pathname + "/../игра.html?z64=" + z64;
window.open(путь);
};

this.исполнитьКод = function()
{
var содержимое = this.ace.session.getValue();
var z64 = мир.вZ64(содержимое);
// Исполняем явно код лишь первый раз.
var проигрыватель = document.getElementById("проигрыватель");
if (!проигрыватель.src)
{
проигрыватель.src = "игра.html?z64=" + z64;
}
// После запуска уведомляем iframe о новом коде без перезагрузки.
else
{
window.frames.проигрыватель.postMessage(z64, "*");
}
};

this.обновитьАдреснуюСтрокуИЗаголовок = function()
{
var содержимое = this.ace.session.getValue();
var z64 = мир.вZ64(содержимое);
var путь = window.location.pathname + "?z64=" + z64;
history.pushState(null, "", путь);
document.title = `${this.первоначальныйЗаголовок} ${z64.length}:${z64.slice(z64.length - 5)}`;
};

this.обработатьСобытие = function(событие)
{
if (событие == "завершили редактирование")
{
this.обновитьАдреснуюСтрокуИЗаголовок();
this.проверитьКорректностьКода();
}
else if (событие == "код корректен")
{
this.исполнитьКод();
}
else if (событие == "перезапустить")
{
this.перезапуститьКод();
}
else if (событие == "запустить отдельно")
{
this.запуститьОтдельно();
}
};

this.перезапуститьКод = function()
{
var содержимое = this.ace.session.getValue();
var z64 = мир.вZ64(содержимое);
var проигрыватель = document.getElementById("проигрыватель");
проигрыватель.src = "игра.html?z64=" + z64;
};

this.проверитьКорректностьКода = function()
{
try
{
eval(this.ace.session.getValue());
события.уведомить("код корректен");
}
catch (ошибка)
{
события.уведомить("код некорректен");
}
};

this.улавливатьЗавершениеРедактирования = function()
{
var тут = this;
this.ace.session.on("change", function(дельта) {
const билет = мир.uuid();
тут.билет = билет;
setTimeout(
function()
{
if (билет == тут.билет)
{
события.уведомить("завершили редактирование");
}
},
300
);
});
};

this.установитьAce = function()
{
var область = document.getElementById(имяРедактора);
this.ace = window.ace.edit(имяРедактора);
this.ace.session.setMode("ace/mode/javascript");
this.ace.session.setUseWrapMode(true);
};

// Конструктор.
this.создать();
}

+ 53
- 0
M/4.1/редактор/200.Пульт.js View File

@@ -0,0 +1,53 @@
function Пульт(события, имяОшибки, имяПерезапуска, имяОтдельно, имяСсылки, имяДокументации)
{
this.создать = function()
{
var ошибка = document.getElementById(имяОшибки);
мир.назначитьКнопкамСобытия(
события,
[
[имяПерезапуска, "перезапустить"],
[имяОтдельно, "запустить отдельно"],
[имяСсылки, "скопировать ссылку"],
[имяДокументации, "открыть документацию"],
]
);
события.подписать(this);
};

this.обработатьСобытие = function(событие)
{
if (событие == "код корректен")
{
this.показатьОшибку(false);
}
else if (событие == "код некорректен")
{
this.показатьОшибку(true);
}
else if (событие == "скопировать ссылку")
{
navigator.clipboard.writeText(window.location)
.then(() => {
UIkit.notification("Скопировали ссылку", { status: "success", timeout: 1000 });
})
.catch(err => {
UIkit.notification("Не удалось скопировать ссылку :(", { status: "danger", timeout: 5000 });
});
}
else if (событие == "открыть документацию")
{
var путь = window.location.pathname + "/../../doc/ru/index.html";
window.open(путь);
}
};


this.показатьОшибку = function(показать)
{
ошибка.innerHTML = показать ? "<span uk-icon=\"icon: warning\"></span>" : "&nbsp;";
};

// Конструктор.
this.создать();
}

+ 13
- 0
M/4.1/редактор/700.Муром.js View File

@@ -0,0 +1,13 @@
function Муром()
{
this.создать = function()
{
мир.события = new События();
мир.состояние = new Состояние();
мир.редактор = new Редактор(мир.события, "редактор");
мир.пульт = new Пульт(мир.события, "ошибка", "перезапустить", "отдельно", "ссылка", "документация");
};

// Конструктор.
this.создать();
}

+ 1
- 0
M/4.1/редактор/ace View File

@@ -0,0 +1 @@
../../стороннее/ace

+ 1
- 0
M/4.1/редактор/uikit View File

@@ -0,0 +1 @@
../../стороннее/uikit

BIN
M/doc/res/основа.jpg View File

Before After
Width: 8  |  Height: 8  |  Size: 1.2KB

BIN
M/doc/res/персонаж/sw.sk.outline.png View File

Before After
Width: 87  |  Height: 10622  |  Size: 314KB

+ 122
- 0
M/doc/ru/animations.html View File

@@ -0,0 +1,122 @@
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<style>
#header
{
background: #bababf;
padding: 0.7em;
text-align: left;
}
#header a
{
color: white;
text-decoration: none;
padding: 0.5em 1em 0.5em 1em;
}
#title
{
color: #433729;
}
html
{
font-family: sans-serif;
}
body
{
line-height: 1.5em;
}
body
{
background: #FAFAFA;
}
table
{
border-collapse: collapse;
width: 100%;
}
table, th, td
{
border: 1px solid #aaa;
padding: 0.5em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
code, pre
{
font-family: monospace, serif;
font-size: 1em;
color: #7f0a0c;
background: #f5f5f5;
white-space: pre-wrap;
}
video
{
width: 100%;
}
.contents
{
background: #FFFFFF;
width: 720px;
padding: 1em;
margin-top: 2em;
margin-bottom: 2em;
border: 1px solid #E0E0E0;
text-align: left;
color: #444;
}
#footer
{
text-align: center;
}
#lang
{
float: right;
}
</style>
<title>
Документация МУРОМа 4.1
</title>
</head>
<body>
<div id="header">
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a>
</div>
<center>
<h1>
анимации
</h1>
</center>
<center>
<div class="contents">
<ul>
<li>Анимации реализованы на JavaScript с помощью setInterval без CSS.</li>
<li>Так называемые спрайты (кадры) анимация берёт из <code>вида</code> изображения.</li>
<li>Одна анимация работает ровно с одним изображением/объектом, т.е. задать несколько анимаций для одного изображения/объекта нельзя.</li>
<li>Создать спрайты (кадры) для анимации можно <a href="https://superuser.com/a/316189">из отдельных изображений с помощью, например, ImageMagick</a>.</li>
</ul>
<p></div><div class="contents"></p>
<p>Пример № 1. Отображение бесконечной анимации на основе вертикальных кадров.</p>
<iframe style="width: 100%; height: 30em" src="../../MYPOM/4.1/редактор.html?z64=eJx9UstOwkAU3fsVk64gKTOlPjMudUtwa4yLAk0hwJTMtGFhSCoLN5oYd34GmiKV8PiFmT/yDsVHR3SSZl7n3jmPyoXMVIJVIidyJlfyRa/UWD2UbvYQDPkqM5mqe4ry/eZsLacqUbcAX0LZ2887PRpesxvwMGYtiqyY90rtKBoISkjQiXA48Fng9X0Rxa1OiEMekG7Imc85qV1e1GuV8/oZ4d6QNLjHmm3S90Tkc8J9Qcx3iRhi0cVhHPU6zMcDFpQt+4vJKF9uJ8AvQckCxN3BnP2nRz6D4ic1NnWBFytArcGiFfSYwX4qU/h053eKHLsIT+F4As1zZ5cUXTk2gNDJsY2qzpHrXhsFc4CmKgGghlTcqosPDg0QEJgDjURT0TlRtO/8KTr7zhRkbYiqx6J0uNO2TPWzhtz1hkrVcTTdLe+dnPKfBMI2nbQMXCEEzeRXxaf3O4MclU8/ABoeIWY="></iframe>
<p></div><div class="contents"></p>
<p>Пример № 2. Отображение конечной анимации.</p>
<iframe style="width: 100%; height: 30em" src="../../MYPOM/4.1/редактор.html?z64=eJx9UstOwkAU3fsVE1aQlJnSiJq61C3BrTEuCjSFAC2ZtmFhSCoLN5oYd34GmiKV8PiFmT/yDMUHIzqZybzOvXPOuSMWIpMJlYmYiJlYiRe1kmP5ULw5IGjiVWQilfc2yfebs7WYykTeAr5E2NvPO9UaTrPr8SD2WzYpxLxXbEfRILQZ8zoRDQau7zl9N4ziViegAfdYN+C+yzmrXV7Ua+Xz+hnjzpA1uOM326zvhJHLGXdDpr/LwiENuzSIo17Hd+nA90oF44vJKF9uJ+CXULKAuDvM2X96xDMUP8mxrgterIBaw6IVcsywn4oUQ2V+t0nF2IWnOJ4gee7s0iZXpkHQT44NUjGPLOtaC5gDmsoEQAUpWxWLHlY1EAjMQSNRVFSdbGKZ5p+qs++iQteGqXzc1Y475ctUvavpXW+4VEG5uqW9l1L+R1Br3ciChtupgeLxK+LT+r11HJVOPwAKGiE+"></iframe>
<p></div><div class="contents"></p>
<p>Пример № 3. Отображение анимации на объекте.</p>
<iframe style="width: 100%; height: 50em" src="../../MYPOM/4.1/редактор.html?z64=eJy9k01r2zAYx+/5FMLskEJiOW66DZed1mtoYadSBnFT47pJ7CDL9FACbjZaWAult36MLKRLluXlK0jfqH8l2RLbyQo7TCBLlp+X31/P44bDiYzFs7yWX2SM5x35QLRzzluhRanrcT1oOb5rN52QR2deoAfMpfWA+Q5jtHJ8dFgpHhx+pMy+pKfM9mvntGmH3GGUOaG2n8uJsRjKWEeKrhiIqfiudrIj7/NXOYIhemIo+vLOIov3+dkMPGCB+QRuP9a/qXFq1+ouCyL/zCLViDXyb66SEto0HYKGl3pY14OINzzf0Vu+u1Mt/AnaXm3FFE4TuPVE91/yrrnrF61NWZaL/ArhA8xRMhHidNQNZb+o4YWfuM29mkU4i5xtsaF4Av8x4txgHf7tcsUTrv9RdtKZoEBpmUHhdE7aE8+ij6ki/7SIUUia93HcRfBFmScWOTEKMCLv3xVIyXhrmp9TDlCHzDEMlUnRLJl6eS9lBIARMGKFoprGIrvGVtGqub4BcATLZD8NcDoWv+RDRuRsDgDMsmEozsUzjTrvUYto69XVUqSJcmrJKmqbW22kfg1c2VDebgfbVUjlvf+I9crft0IrloxlgTcWb8WXiphiTHarKlLG43eTZomxtHf2XwCqqPHz"></iframe>
<p></div></p>
</div>
</center>
<div id="footer">
Документация сгенерирована <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>
из <a href="https://git.opengamestudio.org/kornerr/MYPOM/src/branch/master/doc">
этого исходного кода</a>.
</div>
</body>
</html>


+ 31
- 0
M/doc/ru/animations.md View File

@@ -0,0 +1,31 @@
Title: анимации
Date: 2021-12-20 00:00
Category: Страница
Slug: animations
Lang: ru

* Анимации реализованы на JavaScript с помощью setInterval без CSS.
* Так называемые спрайты (кадры) анимация берёт из `вида` изображения.
* Одна анимация работает ровно с одним изображением/объектом, т.е. задать несколько анимаций для одного изображения/объекта нельзя.
* Создать спрайты (кадры) для анимации можно [из отдельных изображений с помощью, например, ImageMagick](https://superuser.com/a/316189).

</div><div class="contents">

Пример № 1. Отображение бесконечной анимации на основе вертикальных кадров.

<iframe style="width: 100%; height: 30em" src="../../MYPOM/4.1/редактор.html?z64=eJx9UstOwkAU3fsVk64gKTOlPjMudUtwa4yLAk0hwJTMtGFhSCoLN5oYd34GmiKV8PiFmT/yDsVHR3SSZl7n3jmPyoXMVIJVIidyJlfyRa/UWD2UbvYQDPkqM5mqe4ry/eZsLacqUbcAX0LZ2887PRpesxvwMGYtiqyY90rtKBoISkjQiXA48Fng9X0Rxa1OiEMekG7Imc85qV1e1GuV8/oZ4d6QNLjHmm3S90Tkc8J9Qcx3iRhi0cVhHPU6zMcDFpQt+4vJKF9uJ8AvQckCxN3BnP2nRz6D4ic1NnWBFytArcGiFfSYwX4qU/h053eKHLsIT+F4As1zZ5cUXTk2gNDJsY2qzpHrXhsFc4CmKgGghlTcqosPDg0QEJgDjURT0TlRtO/8KTr7zhRkbYiqx6J0uNO2TPWzhtz1hkrVcTTdLe+dnPKfBMI2nbQMXCEEzeRXxaf3O4MclU8/ABoeIWY="></iframe>

</div><div class="contents">

Пример № 2. Отображение конечной анимации.

<iframe style="width: 100%; height: 30em" src="../../MYPOM/4.1/редактор.html?z64=eJx9UstOwkAU3fsVE1aQlJnSiJq61C3BrTEuCjSFAC2ZtmFhSCoLN5oYd34GmiKV8PiFmT/yDMUHIzqZybzOvXPOuSMWIpMJlYmYiJlYiRe1kmP5ULw5IGjiVWQilfc2yfebs7WYykTeAr5E2NvPO9UaTrPr8SD2WzYpxLxXbEfRILQZ8zoRDQau7zl9N4ziViegAfdYN+C+yzmrXV7Ua+Xz+hnjzpA1uOM326zvhJHLGXdDpr/LwiENuzSIo17Hd+nA90oF44vJKF9uJ+CXULKAuDvM2X96xDMUP8mxrgterIBaw6IVcsywn4oUQ2V+t0nF2IWnOJ4gee7s0iZXpkHQT44NUjGPLOtaC5gDmsoEQAUpWxWLHlY1EAjMQSNRVFSdbGKZ5p+qs++iQteGqXzc1Y475ctUvavpXW+4VEG5uqW9l1L+R1Br3ciChtupgeLxK+LT+r11HJVOPwAKGiE+"></iframe>

</div><div class="contents">

Пример № 3. Отображение анимации на объекте.

<iframe style="width: 100%; height: 50em" src="../../MYPOM/4.1/редактор.html?z64=eJy9k01r2zAYx+/5FMLskEJiOW66DZed1mtoYadSBnFT47pJ7CDL9FACbjZaWAult36MLKRLluXlK0jfqH8l2RLbyQo7TCBLlp+X31/P44bDiYzFs7yWX2SM5x35QLRzzluhRanrcT1oOb5rN52QR2deoAfMpfWA+Q5jtHJ8dFgpHhx+pMy+pKfM9mvntGmH3GGUOaG2n8uJsRjKWEeKrhiIqfiudrIj7/NXOYIhemIo+vLOIov3+dkMPGCB+QRuP9a/qXFq1+ouCyL/zCLViDXyb66SEto0HYKGl3pY14OINzzf0Vu+u1Mt/AnaXm3FFE4TuPVE91/yrrnrF61NWZaL/ArhA8xRMhHidNQNZb+o4YWfuM29mkU4i5xtsaF4Av8x4txgHf7tcsUTrv9RdtKZoEBpmUHhdE7aE8+ij6ki/7SIUUia93HcRfBFmScWOTEKMCLv3xVIyXhrmp9TDlCHzDEMlUnRLJl6eS9lBIARMGKFoprGIrvGVtGqub4BcATLZD8NcDoWv+RDRuRsDgDMsmEozsUzjTrvUYto69XVUqSJcmrJKmqbW22kfg1c2VDebgfbVUjlvf+I9crft0IrloxlgTcWb8WXiphiTHarKlLG43eTZomxtHf2XwCqqPHz"></iframe>

</div>


+ 2
- 2
M/doc/ru/bodies.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/images.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/item.template View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 3
- 2
M/doc/ru/keys.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>
@@ -97,6 +97,7 @@
<p>Ниже представлены страницы с описанием каждого отдельного поддерживаемого ключа <p>Ниже представлены страницы с описанием каждого отдельного поддерживаемого ключа
и примерами их использования:</p> и примерами их использования:</p>
<ol> <ol>
<li><a href="animations.html">анимации</a></li>
<li><a href="styles.html">виды</a></li> <li><a href="styles.html">виды</a></li>
<li><a href="title.html">заголовок</a></li> <li><a href="title.html">заголовок</a></li>
<li><a href="images.html">изображения</a></li> <li><a href="images.html">изображения</a></li>


+ 2
- 0
M/doc/ru/keys.md View File

@@ -7,6 +7,7 @@ Lang: ru
Ниже представлены страницы с описанием каждого отдельного поддерживаемого ключа Ниже представлены страницы с описанием каждого отдельного поддерживаемого ключа
и примерами их использования: и примерами их использования:


1. [анимации][animations]
1. [виды][styles] 1. [виды][styles]
1. [заголовок][title] 1. [заголовок][title]
1. [изображения][images] 1. [изображения][images]
@@ -15,6 +16,7 @@ Lang: ru
1. [тела][bodies] 1. [тела][bodies]
1. [физика][physics] 1. [физика][physics]


[animations]: animations.html
[bodies]: bodies.html [bodies]: bodies.html
[images]: images.html [images]: images.html
[objects]: objects.html [objects]: objects.html


+ 2
- 2
M/doc/ru/objects.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/physics.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/styles.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/title.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


+ 2
- 2
M/doc/ru/tracking.html View File

@@ -78,12 +78,12 @@
} }
</style> </style>
<title> <title>
Документация МУРОМа 4.0
Документация МУРОМа 4.1
</title> </title>
</head> </head>
<body> <body>
<div id="header"> <div id="header">
<strong id="title">Документация МУРОМа 4.0</strong>
<strong id="title">Документация МУРОМа 4.1</strong>
<a href="http://opengamestudio.org/M">МУРОМ</a> <a href="http://opengamestudio.org/M">МУРОМ</a>
<a href="keys.html">Ключи (API)</a> <a href="keys.html">Ключи (API)</a>
</div> </div>


Write Preview
Loading…
Cancel
Save