4 changed files with 124 additions and 0 deletions
Unified View
Diff Options
-
+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
View File
| @@ -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
View File
| @@ -2,11 +2,13 @@ function Игра() | |||||
| { | { | ||||
| this.создать = function() | this.создать = function() | ||||
| { | { | ||||
| var корень = document.getElementById("корень"); | |||||
| мир.события = new События(); | мир.события = new События(); | ||||
| мир.состояние = new Состояние(); | мир.состояние = new Состояние(); | ||||
| мир.состояние.обработчик = (к, п, з) => { this.обработатьКлюч(к, п, з) }; | мир.состояние.обработчик = (к, п, з) => { this.обработатьКлюч(к, п, з) }; | ||||
| this.ключники = [ | this.ключники = [ | ||||
| new Заголовок(), | new Заголовок(), | ||||
| new Изображения(корень), | |||||
| ]; | ]; | ||||
| var z64 = мир.параметрыЗапуска()["z64"]; | var z64 = мир.параметрыЗапуска()["z64"]; | ||||
+ 17
- 0
3.2/проигрыватель/index.html
View File
| @@ -6,6 +6,22 @@ | |||||
| <script src="../общее/pako/pako.min.js"></script> | <script src="../общее/pako/pako.min.js"></script> | ||||
| <script src="matter-js/matter.min.js"></script> | <script src="matter-js/matter.min.js"></script> | ||||
| <style> | <style> | ||||
| /* | |||||
| html, body { | |||||
| margin: 0; | |||||
| padding: 0; | |||||
| overflow: hidden; | |||||
| } | |||||
| body { | |||||
| height: 100vh; | |||||
| width: 100vw; | |||||
| } | |||||
| */ | |||||
| #корень | |||||
| { | |||||
| position: relative; | |||||
| } | |||||
| </style> | </style> | ||||
| </head> | </head> | ||||
| <body> | <body> | ||||
| @@ -17,6 +33,7 @@ | |||||
| <script src="../общее/150.Состояние.js"></script> | <script src="../общее/150.Состояние.js"></script> | ||||
| <script src="../общее/200.функции.js"></script> | <script src="../общее/200.функции.js"></script> | ||||
| <script src="050.Заголовок.js"></script> | <script src="050.Заголовок.js"></script> | ||||
| <script src="100.Изображения.js"></script> | |||||
| <script src="700.Игра.js"></script> | <script src="700.Игра.js"></script> | ||||
| <script> | <script> | ||||
| var игра = new Игра(); | var игра = new Игра(); | ||||
+ 1
- 0
3.2/редактор/index.html
View File
| @@ -40,6 +40,7 @@ | |||||
| top: 0; | top: 0; | ||||
| bottom: 0; | bottom: 0; | ||||
| width: calc(50% - 2em); | width: calc(50% - 2em); | ||||
| height: 100%; | |||||
| border: 0px none; | border: 0px none; | ||||
| } | } | ||||