Пользовательский интерфейс Маджонга | Mahjong user interface
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

147 行
3.3KB

  1. // // // //
  2. ЗадатьПораженческоеСодержимоеОкнуОкончания = мир =>
  3. {
  4. $(`#${мир.окна.окончание.указатель}-содержимое`).html(`
  5. <span class="uk-text-large">Поражение</span>
  6. ⚬ <span class="uk-text-large uk-text-bold">失败</span> ⚬
  7. <span class="uk-text-large">Defeat</span>
  8. `);
  9. };
  10. // // // //
  11. ЗадатьПобедноеСодержимоеОкнуОкончания = мир =>
  12. {
  13. $(`#${мир.окна.окончание.указатель}-содержимое`).html(`
  14. <span class="uk-text-large">Победа</span>
  15. ⚬ <span class="uk-text-large uk-text-bold">胜利</span> ⚬
  16. <span class="uk-text-large">Victory</span>
  17. `);
  18. };
  19. // // // //
  20. ПлавноПоказатьОкноОкончания = мир =>
  21. {
  22. const css = `
  23. #${мир.окна.окончание.указатель}
  24. {
  25. opacity: 0;
  26. animation: ${мир.окна.окончание.указатель}ПлавноПоказать 0.5s ease;
  27. animation-fill-mode: forwards;
  28. }
  29. `;
  30. мир.окна.окончание.анимация.innerHTML = css;
  31. мир.окна.окончание.элемент.style.display = "block";
  32. };
  33. // // // //
  34. ПодготовитьАнимациюОкнаОкончания = мир =>
  35. {
  36. мир.окна.окончание.анимация = document.createElement("style");
  37. document.head.appendChild(мир.окна.окончание.анимация);
  38. };
  39. // // // //
  40. ЗадатьВидИАнимациюОкнаОкончания = мир =>
  41. {
  42. const css = `
  43. #${мир.окна.окончание.указатель}-тело
  44. {
  45. position: absolute;
  46. left: 50%;
  47. top: 50%;
  48. transform: translateX(-50%) translateY(-50%);
  49. }
  50. #${мир.окна.окончание.указатель}
  51. {
  52. background-color: white;
  53. position: fixed;
  54. left: 0;
  55. top: 0;
  56. right: 0;
  57. bottom: 0;
  58. }
  59. @keyframes ${мир.окна.окончание.указатель}ПлавноСкрыть
  60. {
  61. 0%
  62. {
  63. opacity: 1;
  64. }
  65. 100%
  66. {
  67. opacity: 0;
  68. }
  69. }
  70. @keyframes ${мир.окна.окончание.указатель}ПлавноПоказать
  71. {
  72. 0%
  73. {
  74. opacity: 0;
  75. }
  76. 100%
  77. {
  78. opacity: 1;
  79. }
  80. }
  81. `;
  82. var вид = document.createElement("style");
  83. вид.innerHTML = css;
  84. document.head.appendChild(вид);
  85. };
  86. // // // //
  87. СоздатьОкноОкончания = мир =>
  88. {
  89. мир.окна.окончание = {
  90. "указатель": "окно-окончания",
  91. };
  92. const html = `
  93. <div id="${мир.окна.окончание.указатель}-тело">
  94. <center>
  95. <span id="${мир.окна.окончание.указатель}-содержимое">
  96. </span>
  97. <hr class="uk-divider-icon">
  98. <p>
  99. <a href="https://twitter.com/opengamestudio" target="_blank" class="uk-icon-button" uk-icon="twitter"></a>
  100. </p>
  101. </center>
  102. </div>
  103. `;
  104. var окно = document.createElement("div");
  105. окно.id = мир.окна.окончание.указатель;
  106. окно.innerHTML = html;
  107. document.body.appendChild(окно);
  108. окно.style.display = "none";
  109. мир.окна.окончание.элемент = окно;
  110. };