Макет интерфейса UIK (Основан на UIkit) | UIK interface template (Based on UIkit)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

211 lines
6.0KB

  1. const ИМЯ = "UIK";
  2. // // // //
  3. ВыбратьПервыйПунктМенюДокументации = мир =>
  4. {
  5. мир.номерВыбранногоПунктаДокументации = 0;
  6. мир.уведомить("выбрали пункт меню документации");
  7. };
  8. // // // //
  9. ОтобразитьСодержимоеВыбранногоПунктаМенюДокументации = мир =>
  10. {
  11. $(`#${мир.макет.константы.содержимое}`).html(`<h1>Выбрали пункт меню #${мир.номерВыбранногоПунктаДокументации}</h1>`);
  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. };
  97. // // // //
  98. УстановитьМакетUIK = мир =>
  99. {
  100. document.body.innerHTML = мир.макет.структура;
  101. var вид = document.createElement("style");
  102. document.head.appendChild(вид);
  103. вид.innerHTML = мир.макет.вид;
  104. };
  105. // // // //
  106. НастроитьМакетUIK = мир =>
  107. {
  108. var название = "пример";
  109. var html = мир.макет.структура;
  110. var css = мир.макет.вид;
  111. // Вырезаем тело из макета.
  112. var начало = html.indexOf("<!-- МАКЕТ_НАЧАЛО -->");
  113. var конец = html.indexOf("<!-- МАКЕТ_КОНЕЦ -->");
  114. html = html.substring(начало, конец);
  115. мир.макет.константы = {
  116. "заголовокЛево": `${название}-заголовокЛево`,
  117. "заголовокПраво": `${название}-заголовокПраво`,
  118. "меню": `${название}-меню`,
  119. "содержимое": `${название}-содержимое`,
  120. };
  121. // Заменяем константы в макете.
  122. for (var константа in мир.макет.константы)
  123. {
  124. var старое = "${" + константа + "}";
  125. var новое = мир.макет.константы[константа];
  126. html = html.replace(старое, новое);
  127. css = css.replace(старое, новое);
  128. }
  129. мир.макет.структура = html;
  130. мир.макет.вид = css;
  131. };
  132. // // // //
  133. ЗагрузитьМакетUIK = мир =>
  134. {
  135. var м = мир.модули.модульПоИмени(ИМЯ);
  136. мир.макет = {
  137. "структура": м.содержимое["/макет|template.html"],
  138. "вид": м.содержимое["/макет|template.css"],
  139. };
  140. };
  141. // // // //
  142. ВывестиПриветствиеОтUIK = мир =>
  143. {
  144. console.debug("Привет от UIK");
  145. };