Пользовательский интерфейс Маджонга | Mahjong user interface
Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

раскладки|layouts.js 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. // // // //
  2. ОтобразитьВыбраннуюРаскладкуВТаблице = мир =>
  3. {
  4. var таблица = мир.окна.раскладки.таблица;
  5. // Очистить выбор.
  6. for (var номер in таблица.строки)
  7. {
  8. var элемент = таблица.элемент(номер);
  9. элемент.removeClass("выбранная-раскладка");
  10. }
  11. // Задать выбор.
  12. var элемент = таблица.элемент(мир.номерВыбраннойРаскладки);
  13. элемент.addClass("выбранная-раскладка");
  14. };
  15. // // // //
  16. ОтслеживатьВыборРаскладки = мир =>
  17. {
  18. const строки = мир.окна.раскладки.таблица.строки;
  19. мир.окна.раскладки.таблица.выбор = (номер) =>
  20. {
  21. мир.выбраннаяРаскладка = строки[номер][1];
  22. мир.номерВыбраннойРаскладки = номер;
  23. мир.уведомить("выбрали раскладку");
  24. };
  25. };
  26. // // // //
  27. ЗадатьСписокРаскладок = мир =>
  28. {
  29. var раскладки = Object.keys(мир.реестрРаскладок).sort();
  30. var список = [];
  31. for (var номер in раскладки)
  32. {
  33. var число = Number(номер) + 1;
  34. var название = раскладки[номер];
  35. список.push([число, название]);
  36. }
  37. мир.окна.раскладки.таблица.задатьЗаголовки(["№", "Название ⚬ 标题 ⚬ Name"]);
  38. мир.окна.раскладки.таблица.задатьСтроки(список);
  39. };
  40. // // // //
  41. ПлавноСкрытьОкноРаскладок = мир =>
  42. {
  43. мир.окна.раскладки.плавно.скрыть();
  44. };
  45. // // // //
  46. ПлавноПоказатьОкноРаскладок = мир =>
  47. {
  48. мир.окна.раскладки.плавно.отобразить();
  49. };
  50. // // // //
  51. ЗадатьВидОкнаРаскладок = мир =>
  52. {
  53. var вид = document.createElement("style");
  54. document.head.appendChild(вид);
  55. вид.innerHTML = `
  56. #${мир.окна.раскладки.указатель}
  57. {
  58. position: fixed;
  59. left: 1em;
  60. top: 1em;
  61. bottom: 1em;
  62. right: 1em;
  63. }
  64. #скрыть-раскладки
  65. {
  66. position: fixed;
  67. right: 0.5em;
  68. bottom: 0.5em;
  69. }
  70. .прокрутка
  71. {
  72. overflow: auto;
  73. height: 100%;
  74. }
  75. .ширина-по-содержимому
  76. {
  77. display: inline-block;
  78. }
  79. .выбранная-раскладка
  80. {
  81. background: #eeeeee;
  82. }
  83. `;
  84. };
  85. // // // //
  86. СоздатьОкноРаскладок = мир =>
  87. {
  88. var окно = document.createElement("div");
  89. окно.id = "окно-раскладки";
  90. окно.style.display = "none";
  91. document.body.appendChild(окно);
  92. мир.окна.раскладки = {
  93. "указатель": окно.id,
  94. "элемент": окно,
  95. "плавно": new ПлавноОтобразитьСкрыть(окно),
  96. "список": `${окно.id}-список`,
  97. };
  98. окно.innerHTML = `
  99. <center>
  100. <span class="uk-text-large">Раскладки</span>
  101. ⚬ <span class="uk-text-large uk-text-bold">键盘布局</span> ⚬
  102. <span class="uk-text-large">Layouts</span>
  103. </center>
  104. <div class="прокрутка ширина-по-содержимому">
  105. <table id="${мир.окна.раскладки.список}" class="uk-table uk-table-divider"></table>
  106. </div>
  107. <a id="скрыть-раскладки" uk-icon="icon: close; ratio: 2"></a>
  108. `;
  109. мир.окна.раскладки.таблица = new Таблица(мир.окна.раскладки.список);
  110. $("#скрыть-раскладки").click(function() {
  111. мир.уведомить("кнопка скрыть раскладки");
  112. });
  113. };