Пользовательский интерфейс Маджонга | Mahjong user interface
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

120 Zeilen
3.0KB

  1. // // // //
  2. ОтслеживатьВыборРаскладки = мир =>
  3. {
  4. const список = мир.окна.раскладки.выборныйСписок;
  5. список.отклик.выбор = function(номер) {
  6. мир.выбраннаяРаскладка = список.список[номер];
  7. мир.уведомить("выбрали раскладку");
  8. };
  9. };
  10. // // // //
  11. ЗадатьСписокРаскладок = мир =>
  12. {
  13. var раскладки = Object.keys(мир.реестрРаскладок).sort();
  14. мир.окна.раскладки.выборныйСписок.задатьСписок(раскладки);
  15. };
  16. // // // //
  17. ПлавноСкрытьОкноРаскладок = мир =>
  18. {
  19. мир.окна.раскладки.плавно.скрыть();
  20. };
  21. // // // //
  22. ПлавноПоказатьОкноРаскладок = мир =>
  23. {
  24. мир.окна.раскладки.плавно.отобразить();
  25. };
  26. // // // //
  27. ЗадатьВидОкнаРаскладок = мир =>
  28. {
  29. var вид = document.createElement("style");
  30. document.head.appendChild(вид);
  31. вид.innerHTML = `
  32. #${мир.окна.раскладки.указатель}
  33. {
  34. position: fixed;
  35. left: 1em;
  36. top: 1em;
  37. bottom: 1em;
  38. right: 1em;
  39. }
  40. #скрыть-раскладки
  41. {
  42. position: fixed;
  43. right: 0.5em;
  44. bottom: 0.5em;
  45. }
  46. #${мир.окна.раскладки.список}
  47. {
  48. display: table;
  49. }
  50. #${мир.окна.раскладки.список} > li > a
  51. {
  52. text-decoration: none;
  53. }
  54. `;
  55. };
  56. // // // //
  57. СоздатьОкноРаскладок = мир =>
  58. {
  59. var окно = document.createElement("div");
  60. окно.id = "окно-раскладки";
  61. окно.style.display = "none";
  62. document.body.appendChild(окно);
  63. мир.окна.раскладки = {
  64. "указатель": окно.id,
  65. "элемент": окно,
  66. "плавно": new ПлавноОтобразитьСкрыть(окно),
  67. "список": `${окно.id}-список`,
  68. };
  69. окно.innerHTML = `
  70. <center>
  71. <span class="uk-text-large">Раскладки</span>
  72. ⚬ <span class="uk-text-large uk-text-bold">键盘布局</span> ⚬
  73. <span class="uk-text-large">Layouts</span>
  74. </center>
  75. <div id="${мир.окна.раскладки.список}-прокрутка">
  76. <ul id="${мир.окна.раскладки.список}" class="uk-list uk-list-divider uk-list-decimal">
  77. </ul>
  78. </div>
  79. <a id="скрыть-раскладки" uk-icon="icon: close; ratio: 2"></a>
  80. `;
  81. var элементСписок = document.getElementById(мир.окна.раскладки.список);
  82. мир.окна.раскладки.выборныйСписок = new ВыборныйСписок(элементСписок);
  83. $("#скрыть-раскладки").click(function() {
  84. мир.уведомить("кнопка скрыть раскладки");
  85. });
  86. };