Игра Маджонг | Mahjong game
25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

97 lines
3.2KB

  1. var скрытьНастройки = new Уведомитель();
  2. var hideSettings = скрытьНастройки;
  3. function создатьЭкранНастроек()
  4. {
  5. var html =
  6. `
  7. <p>Настройки</p>
  8. <div class="uk-container">
  9. <ul class="uk-child-width-expand" uk-tab>
  10. <li class="uk-active"><a>Раскладка</a></li>
  11. <li><a>Тема</a></li>
  12. </ul>
  13. <ul class="uk-switcher uk-margin">
  14. <li>
  15. <div id="мж-настройки-раскладки" class="uk-panel uk-panel-scrollable uk-width-1-3">
  16. <ul class="uk-list">
  17. <li>Раскладка-1</li>
  18. <li>Раскладка-2</li>
  19. <li>Раскладка-3</li>
  20. <li>Раскладка-4</li>
  21. <li>Раскладка-5</li>
  22. <li>Раскладка-6</li>
  23. <li>Раскладка-7</li>
  24. <li>Раскладка-8</li>
  25. <li>Раскладка-9</li>
  26. <li>Раскладка-10</li>
  27. <li>Раскладка-11</li>
  28. <li>Раскладка-12</li>
  29. </ul>
  30. </div>
  31. </li>
  32. <li>
  33. <div class="uk-child-width-1-2@s" uk-grid>
  34. <div>
  35. <div class="uk-card uk-card-default uk-card-small uk-card-body">
  36. <h3 class="uk-card-title">Small</h3>
  37. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  38. </div>
  39. </div>
  40. <div>
  41. <div class="uk-card uk-card-default uk-card-large uk-card-body">
  42. <h3 class="uk-card-title">Large</h3>
  43. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  44. </div>
  45. </div>
  46. </div>
  47. </li>
  48. </ul>
  49. </div>
  50. <button id="мж-настройки-скрыть" class="uk-close-large" type="button" uk-close></button>
  51. `;
  52. var css =
  53. `
  54. #мж-настройки
  55. {
  56. background-color: white;
  57. }
  58. #мж-настройки-скрыть
  59. {
  60. position: absolute;
  61. left: 1.5em;
  62. bottom: 1.5em;
  63. }
  64. #мж-настройки-раскладки
  65. {
  66. height: 50%;
  67. }
  68. `;
  69. var экран = добавитьЭкран("мж-настройки", html, css);
  70. экран.hidden = true;
  71. var скрыть = эл("мж-настройки-скрыть").onclick = function(){
  72. скрытьНастройки.уведомить();
  73. };
  74. }
  75. function показатьЭкранНастроек()
  76. {
  77. var экран = эл("мж-настройки");
  78. экран.hidden = false;
  79. экран.classList.add("uk-animation-fade", "uk-animation-fast");
  80. }
  81. function скрытьЭкранНастроек()
  82. {
  83. var экран = эл("мж-настройки");
  84. экран.className = "";
  85. экран.hidden = true;
  86. }
  87. при(показатьНастройки, показатьЭкранНастроек);
  88. при(скрытьНастройки, скрытьЭкранНастроек);
  89. при(муром.режимПросмотра, создатьЭкранНастроек);