Повторный пользовательский интерфейс | Repeating user interface
Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.

91 linhas
2.7KB

  1. ВыборныйСписок = function(элемент, настройки)
  2. {
  3. // Конструктор.
  4. this.отклик = {};
  5. if (!настройки)
  6. {
  7. настройки = {
  8. "макет": {
  9. "элемент": `
  10. <li id="%id%">
  11. <a id="%id%-ссылка">%название%</a>
  12. </li>
  13. `,
  14. },
  15. };
  16. }
  17. this.задатьЗаголовок = (заголовок) =>
  18. {
  19. this.заголовок = заголовок;
  20. this.__пересобрать();
  21. };
  22. this.задатьСписок = (список) =>
  23. {
  24. this.список = список;
  25. this.__пересобрать();
  26. };
  27. this.очиститьВыбор = () =>
  28. {
  29. for (var номер in this.список)
  30. {
  31. var id = `${элемент.id}-${номер}`;
  32. $(`#${id}`).removeClass("uk-active");
  33. }
  34. };
  35. this.выбратьЭлемент = (номер) =>
  36. {
  37. this.очиститьВыбор();
  38. $(`#${элемент.id}-${номер}`).addClass("uk-active");
  39. };
  40. this.__пересобрать = () =>
  41. {
  42. this.__задатьЗаголовокИСписок();
  43. this.__отслеживатьВыбор();
  44. }
  45. this.__задатьЗаголовокИСписок = () =>
  46. {
  47. var содержимое = "";
  48. for (var номер in this.список)
  49. {
  50. var название = this.список[номер];
  51. var id = `${элемент.id}-${номер}`;
  52. var пункт = настройки.макет.элемент
  53. .replace(/%название%/g, название)
  54. .replace(/%id%/g, id)
  55. ;
  56. содержимое += пункт;
  57. }
  58. if (this.заголовок && this.заголовок.length)
  59. {
  60. содержимое = `
  61. <li class="uk-nav-header">${this.заголовок}</li>
  62. ${содержимое}
  63. `;
  64. }
  65. элемент.innerHTML = содержимое;
  66. };
  67. this.__отслеживатьВыбор = () =>
  68. {
  69. var тут = this;
  70. for (var номер in this.список)
  71. {
  72. var id = `${элемент.id}-${номер}`;
  73. const номерПункта = номер;
  74. $(`#${id}-ссылка`).click(function() {
  75. if (тут.отклик && тут.отклик.выбор)
  76. {
  77. тут.отклик.выбор(номерПункта);
  78. }
  79. });
  80. }
  81. };
  82. };