Проверить Matter.js
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

98 rindas
3.2KB

  1. function Изображения(корень)
  2. {
  3. this.создать = function()
  4. {
  5. this.умолчание = {
  6. x: 0,
  7. y: 0,
  8. ширина: 100,
  9. высота: 100,
  10. угол: 0,
  11. };
  12. this.задано = {};
  13. this.элементы = {};
  14. };
  15. this.обработатьКлюч = function(ключ, путь, значение)
  16. {
  17. var имя = путь[1];
  18. var свойство = путь.slice(2).join(".");
  19. this.обновитьЭлемент(имя, свойство, значение);
  20. };
  21. this.создатьИлиПолучитьЭлемент = function(имя)
  22. {
  23. var эл = this.элементы[имя];
  24. if (эл)
  25. {
  26. return эл;
  27. }
  28. var ум = this.умолчание;
  29. эл = document.createElement("div");
  30. эл.id = `изображения-${имя}`;
  31. эл.style.position = "absolute";
  32. эл.style.display = "block";
  33. // Свойства по умолчанию.
  34. эл.style.width = `${ум.ширина}px`;
  35. эл.style.height = `${ум.высота}px`;
  36. эл.style.transform = `translate(${ум.x}px, ${ум.y}px) rotate(${ум.угол}rad)`;
  37. this.элементы[имя] = эл;
  38. корень.appendChild(эл);
  39. return эл;
  40. };
  41. this.обновитьЭлемент = function(имя, свойство, значение)
  42. {
  43. if (!this.задано[имя])
  44. {
  45. this.задано[имя] = {};
  46. }
  47. this.задано[имя][свойство] = значение;
  48. var за = this.задано[имя];
  49. var эл = this.создатьИлиПолучитьЭлемент(имя);
  50. if (свойство == "ширина")
  51. {
  52. эл.style.width = `${за.ширина}px`;
  53. }
  54. else if (свойство == "высота")
  55. {
  56. эл.style.height = `${за.высота}px`;
  57. }
  58. else if (
  59. (свойство == "x") ||
  60. (свойство == "y") ||
  61. (свойство == "угол") ||
  62. (свойство == "вид.transform")
  63. ) {
  64. var ум = this.умолчание;
  65. var x = за.x ? за.x : ум.x;
  66. var y = за.y ? за.y : ум.y;
  67. var угол = за.угол ? за.угол : ум.угол;
  68. this.обновитьРасположение(имя, x, y, угол);
  69. }
  70. else if (свойство.startsWith("вид"))
  71. {
  72. var параметр = свойство.substring(4);
  73. эл.style.setProperty(параметр, значение);
  74. }
  75. };
  76. this.обновитьРасположение = function(имя, x, y, угол)
  77. {
  78. var за = this.задано[имя];
  79. var эл = this.элементы[имя];
  80. var transform = `translate(${x}px, ${y}px) rotate(${угол}deg) `;
  81. if (за["вид.transform"])
  82. {
  83. transform += за["вид.transform"];
  84. }
  85. эл.style.transform = transform;
  86. };
  87. // Конструктор.
  88. this.создать();
  89. }