4 змінених файлів з 124 додано та 0 видалено
Розділений перегляд
Параметри порівняння
-
+104 -03.2/проигрыватель/100.Изображения.js
-
+2 -03.2/проигрыватель/700.Игра.js
-
+17 -03.2/проигрыватель/index.html
-
+1 -03.2/редактор/index.html
+ 104
- 0
3.2/проигрыватель/100.Изображения.js
Переглянути файл
| @@ -0,0 +1,104 @@ | |||
| function Изображения(корень) | |||
| { | |||
| this.создать = function() | |||
| { | |||
| this.умолчание = { | |||
| x: 0, | |||
| y: 0, | |||
| ширина: 100, | |||
| высота: 100, | |||
| угол: 0, | |||
| }; | |||
| this.задано = {}; | |||
| this.элементы = {}; | |||
| }; | |||
| this.создатьИлиПолучитьЭлемент = function(имя) | |||
| { | |||
| var эл = this.элементы[имя]; | |||
| if (эл) | |||
| { | |||
| return эл; | |||
| } | |||
| var ум = this.умолчание; | |||
| эл = document.createElement("div"); | |||
| эл.id = `изображения-${имя}`; | |||
| эл.style.position = "absolute"; | |||
| эл.style.display = "block"; | |||
| // Свойства по умолчанию. | |||
| эл.style.left = `${ум.x}px`; | |||
| эл.style.top = `${ум.y}px`; | |||
| эл.style.width = `${ум.ширина}px`; | |||
| эл.style.height = `${ум.высота}px`; | |||
| эл.style.transform = `rotate(${ум.угол}rad)`; | |||
| this.элементы[имя] = эл; | |||
| корень.appendChild(эл); | |||
| return эл; | |||
| }; | |||
| this.обновитьЭлемент = function(имя, свойство, значение) | |||
| { | |||
| if (!this.задано[имя]) | |||
| { | |||
| this.задано[имя] = {}; | |||
| } | |||
| this.задано[имя][свойство] = значение; | |||
| var за = this.задано[имя]; | |||
| var эл = this.создатьИлиПолучитьЭлемент(имя); | |||
| if (свойство == "ширина") | |||
| { | |||
| эл.style.width = `${за.ширина}px`; | |||
| } | |||
| else if (свойство == "высота") | |||
| { | |||
| эл.style.height = `${за.высота}px`; | |||
| } | |||
| else if ( | |||
| (свойство == "x") || | |||
| (свойство == "y") || | |||
| (свойство == "угол") || | |||
| (свойство == "вид.transform") | |||
| ) { | |||
| var ум = this.умолчание; | |||
| var x = за.x ? за.x : ум.x; | |||
| var y = за.y ? за.y : ум.y; | |||
| var угол = за.угол ? за.угол : ум.угол; | |||
| this.обновитьРасположение(имя, x, y, угол); | |||
| } | |||
| else if (свойство.startsWith("вид")) | |||
| { | |||
| var параметр = свойство.substring(4); | |||
| эл.style.setProperty(параметр, значение); | |||
| } | |||
| }; | |||
| this.обновитьРасположение = function(имя, x, y, угол) | |||
| { | |||
| var за = this.задано[имя]; | |||
| var эл = this.элементы[имя]; | |||
| эл.style.left = `${x}px`; | |||
| эл.style.top = `${y}px`; | |||
| var transform = `rotate(${угол}deg) `; | |||
| if (за["вид.transform"]) | |||
| { | |||
| transform += за["вид.transform"]; | |||
| } | |||
| эл.style.transform = transform; | |||
| }; | |||
| this.обработатьКлюч = function(ключ, путь, значение) | |||
| { | |||
| if (путь[0] == "изображения") | |||
| { | |||
| var имя = путь[1]; | |||
| var свойство = путь.slice(2).join("."); | |||
| this.обновитьЭлемент(имя, свойство, значение); | |||
| } | |||
| }; | |||
| // Конструктор. | |||
| this.создать(); | |||
| } | |||
+ 2
- 0
3.2/проигрыватель/700.Игра.js
Переглянути файл
| @@ -2,11 +2,13 @@ function Игра() | |||
| { | |||
| this.создать = function() | |||
| { | |||
| var корень = document.getElementById("корень"); | |||
| мир.события = new События(); | |||
| мир.состояние = new Состояние(); | |||
| мир.состояние.обработчик = (к, п, з) => { this.обработатьКлюч(к, п, з) }; | |||
| this.ключники = [ | |||
| new Заголовок(), | |||
| new Изображения(корень), | |||
| ]; | |||
| var z64 = мир.параметрыЗапуска()["z64"]; | |||
+ 17
- 0
3.2/проигрыватель/index.html
Переглянути файл
| @@ -6,6 +6,22 @@ | |||
| <script src="../общее/pako/pako.min.js"></script> | |||
| <script src="matter-js/matter.min.js"></script> | |||
| <style> | |||
| /* | |||
| html, body { | |||
| margin: 0; | |||
| padding: 0; | |||
| overflow: hidden; | |||
| } | |||
| body { | |||
| height: 100vh; | |||
| width: 100vw; | |||
| } | |||
| */ | |||
| #корень | |||
| { | |||
| position: relative; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| @@ -17,6 +33,7 @@ | |||
| <script src="../общее/150.Состояние.js"></script> | |||
| <script src="../общее/200.функции.js"></script> | |||
| <script src="050.Заголовок.js"></script> | |||
| <script src="100.Изображения.js"></script> | |||
| <script src="700.Игра.js"></script> | |||
| <script> | |||
| var игра = new Игра(); | |||
+ 1
- 0
3.2/редактор/index.html
Переглянути файл
| @@ -40,6 +40,7 @@ | |||
| top: 0; | |||
| bottom: 0; | |||
| width: calc(50% - 2em); | |||
| height: 100%; | |||
| border: 0px none; | |||
| } | |||