function Изображения(корень) { this.создать = function() { this.умолчание = { x: 0, y: 0, ширина: 100, высота: 100, угол: 0, }; this.задано = {}; this.элементы = {}; }; this.обработатьКлюч = function(ключ, путь, значение) { var имя = путь[1]; var свойство = путь.slice(2).join("."); this.обновитьЭлемент(имя, свойство, значение); }; this.создатьИлиПолучитьЭлемент = function(имя) { var эл = this.элементы[имя]; if (эл) { return эл; } var ум = this.умолчание; эл = document.createElement("div"); эл.id = `изображения-${имя}`; эл.style.position = "absolute"; эл.style.display = "block"; // Свойства по умолчанию. эл.style.width = `${ум.ширина}px`; эл.style.height = `${ум.высота}px`; эл.style.transform = `translate(${ум.x}px, ${ум.y}px) 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.элементы[имя]; var transform = `translate(${x}px, ${y}px) rotate(${угол}deg) `; if (за["вид.transform"]) { transform += за["вид.transform"]; } эл.style.transform = transform; }; // Конструктор. this.создать(); }