Макет интерфейса UIK (Основан на UIkit) | UIK interface template (Based on UIkit)
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

213 lignes
6.2KB

  1. const ИМЯ = "UIK";
  2. // // // //
  3. ВыбратьПервыйПунктМенюДокументации = мир =>
  4. {
  5. мир.номерВыбранногоПунктаДокументации = 0;
  6. мир.уведомить("выбрали пункт меню документации");
  7. };
  8. // // // //
  9. ОтобразитьСодержимоеВыбранногоПунктаМенюДокументации = мир =>
  10. {
  11. $(`#${мир.макет.константы.содержимое}`).html(`<p>Выбрали пункт меню #${мир.номерВыбранногоПунктаДокументации}`);
  12. };
  13. // // // //
  14. ОтобразитьВыборПунктаМенюДокументации = мир =>
  15. {
  16. const id = мир.макет.константы.документация;
  17. // Очищаем прошлый выбор.
  18. for (var номер in мир.пунктыДокументации)
  19. {
  20. $(`#${id}-${номер}`).removeClass("uk-active");
  21. }
  22. // Задаём новый выбор.
  23. $(`#${id}-${мир.номерВыбранногоПунктаДокументации}`).addClass("uk-active");
  24. };
  25. // // // //
  26. ОтслеживатьВыборПунктаМенюДокументации = мир =>
  27. {
  28. for (var номер in мир.пунктыДокументации)
  29. {
  30. const номерПункта = номер;
  31. const id = `${мир.макет.константы.документация}-${номер}-ссылка`;
  32. $(`#${id}`).click(function() {
  33. мир.номерВыбранногоПунктаДокументации = номерПункта;
  34. мир.уведомить("выбрали пункт меню документации");
  35. });
  36. }
  37. };
  38. // // // //
  39. СоздатьРазделМенюДокументации = мир =>
  40. {
  41. мир.макет.константы.документация = "документация";
  42. var содержимое = "";
  43. for (var номер in мир.пунктыДокументации)
  44. {
  45. var название = мир.пунктыДокументации[номер];
  46. var id = `${мир.макет.константы.документация}-${номер}`;
  47. var пункт = мир.макет.элементы.пунктМеню
  48. .replace("%название%", название)
  49. .replace(/%id%/g, id)
  50. ;
  51. содержимое += пункт;
  52. }
  53. var раздел = мир.макет.элементы.разделМеню
  54. .replace("%название%", мир.макет.константы.документация)
  55. .replace("%содержимое%", содержимое)
  56. ;
  57. $(`#${мир.макет.константы.меню}`).append(раздел);
  58. };
  59. // // // //
  60. ЗадатьПунктыРазделаМенюДокументации = мир =>
  61. {
  62. мир.пунктыДокументации = [
  63. "Описание",
  64. "Ещё что-то",
  65. ];
  66. };
  67. // // // //
  68. ЗадатьЗаголовок = мир =>
  69. {
  70. $(`#${мир.макет.константы.заголовокЛево}`).html(`
  71. <span class="uk-navbar-item uk-logo">UIK</span>
  72. `);
  73. };
  74. // // // //
  75. ЗадатьЭлементыМакета = мир =>
  76. {
  77. мир.макет.элементы = {
  78. "разделМеню": `
  79. <ul class="uk-nav uk-nav-default tm-nav">
  80. <li class="uk-nav-header">%название%</li>
  81. %содержимое%
  82. </ul>
  83. `,
  84. "пунктМеню": `
  85. <li id="%id%"><a id="%id%-ссылка">%название%</a></li>
  86. `,
  87. };
  88. }
  89. // // // //
  90. ОчиститьМакетUIKОтЗаглушек = мир =>
  91. {
  92. $(`#${мир.макет.константы.заголовокЛево}`).text("");
  93. $(`#${мир.макет.константы.заголовокЦентр}`).text("");
  94. $(`#${мир.макет.константы.заголовокПраво}`).text("");
  95. $(`#${мир.макет.константы.меню}`).text("");
  96. $(`#${мир.макет.константы.содержимое}`).text("");
  97. };
  98. // // // //
  99. УстановитьМакетUIK = мир =>
  100. {
  101. document.body.innerHTML = мир.макет.структура;
  102. var вид = document.createElement("style");
  103. document.head.appendChild(вид);
  104. вид.innerHTML = мир.макет.вид;
  105. };
  106. // // // //
  107. НастроитьПримерМакетаUIK = мир =>
  108. {
  109. var название = "пример";
  110. var html = мир.макет.структура;
  111. var css = мир.макет.вид;
  112. // Вырезаем тело из макета.
  113. var начало = html.indexOf("<!-- МАКЕТ_НАЧАЛО -->");
  114. var конец = html.indexOf("<!-- МАКЕТ_КОНЕЦ -->");
  115. html = html.substring(начало, конец);
  116. мир.макет.константы = {
  117. "заголовокЛево": `${название}-заголовокЛево`,
  118. "заголовокЦентр": `${название}-заголовокЦентр`,
  119. "заголовокПраво": `${название}-заголовокПраво`,
  120. "меню": `${название}-меню`,
  121. "содержимое": `${название}-содержимое`,
  122. };
  123. // Заменяем константы в макете.
  124. for (var константа in мир.макет.константы)
  125. {
  126. var старое = "${" + константа + "}";
  127. var новое = мир.макет.константы[константа];
  128. html = html.replace(старое, новое);
  129. css = css.replace(старое, новое);
  130. }
  131. мир.макет.структура = html;
  132. мир.макет.вид = css;
  133. };
  134. // // // //
  135. ЗагрузитьМакетUIK = мир =>
  136. {
  137. var м = мир.модули.модульПоИмени(ИМЯ);
  138. мир.макет = {
  139. "структура": м.содержимое["/макет|template.html"],
  140. "вид": м.содержимое["/макет|template.css"],
  141. };
  142. };
  143. // // // //
  144. ВывестиПриветствиеОтUIK = мир =>
  145. {
  146. console.debug("Привет от UIK");
  147. };