uik/пример|sample.js

const ИМЯ = "UIK";

// Переместить в отдельный файл. JSON?

const разделМеню = `
<ul class="uk-nav uk-nav-default tm-nav">
    <li class="uk-nav-header">%название%</li>
    %содержимое%
</ul>
`;

const пунктМеню = `
<li id="%id%"><a id="%id%-ссылка">%название%</a></li>
`;


// // // //


ВыбратьПервыйПунктМенюДокументации = мир =>
{
    мир.номерВыбранногоПунктаДокументации = 0;
    мир.уведомить("выбрали пункт меню документации");
};


// // // //


ОтобразитьСодержимоеВыбранногоПунктаМенюДокументации = мир =>
{
    $(`#${мир.макет.константы.содержимое}`).html(`<p>Выбрали пункт меню #${мир.номерВыбранногоПунктаДокументации}`);
};


// // // //


ОтобразитьВыборПунктаМенюДокументации = мир =>
{
    const id = мир.макет.константы.документация;
    // Очищаем прошлый выбор.
    for (var номер in мир.пунктыДокументации)
    {
        $(`#${id}-${номер}`).removeClass("uk-active");
    }
    
    // Задаём новый выбор.
    $(`#${id}-${мир.номерВыбранногоПунктаДокументации}`).addClass("uk-active");
};


// // // //


ОтслеживатьВыборПунктаМенюДокументации = мир =>
{
    for (var номер in мир.пунктыДокументации)
    {
        const номерПункта = номер;
        const id = `${мир.макет.константы.документация}-${номер}-ссылка`;
        $(`#${id}`).click(function() {
            мир.номерВыбранногоПунктаДокументации = номерПункта;
            мир.уведомить("выбрали пункт меню документации");
        });
    }
};


// // // //


СоздатьРазделМенюДокументации = мир =>
{
    мир.макет.константы.документация = "документация";
    
    var содержимое = "";
    for (var номер in мир.пунктыДокументации)
    {
        var название = мир.пунктыДокументации[номер];
        var id = `${мир.макет.константы.документация}-${номер}`;
        var пункт = пунктМеню
            .replace("%название%", название)
            .replace(/%id%/g, id)
            ;
        содержимое += пункт;
    }
    
    var раздел = разделМеню
        .replace("%название%", мир.макет.константы.документация)
        .replace("%содержимое%", содержимое)
        ;
    
    $(`#${мир.макет.константы.меню}`).append(раздел);
};


// // // //


ЗадатьПунктыРазделаМенюДокументации = мир =>
{
    мир.пунктыДокументации = [
        "Описание",
        "Ещё что-то",
    ];
};


// // // //


ЗадатьЗаголовок = мир =>
{
    $(`#${мир.макет.константы.заголовокЛево}`).html(`
<span class="uk-navbar-item uk-logo">UIK</span>
    `);
};


// // // //


ОчиститьМакетUIKОтЗаглушек = мир =>
{
    $(`#${мир.макет.константы.заголовокЛево}`).text("");
    $(`#${мир.макет.константы.заголовокЦентр}`).text("");
    $(`#${мир.макет.константы.заголовокПраво}`).text("");
    $(`#${мир.макет.константы.меню}`).text("");
    $(`#${мир.макет.константы.содержимое}`).text("");
};


// // // //


УстановитьМакетUIK = мир =>
{
    document.body.innerHTML = мир.макет.структура;

    var вид = document.createElement("style");
    document.head.appendChild(вид);
    вид.innerHTML = мир.макет.вид;
};


// // // //


НастроитьПримерМакетаUIK = мир =>
{
    var название = "пример";
    var html = мир.макет.структура;
    var css = мир.макет.вид;
    
    // Вырезаем тело из макета.
    var начало = html.indexOf("<!-- МАКЕТ_НАЧАЛО -->");
    var конец = html.indexOf("<!-- МАКЕТ_КОНЕЦ -->");
    html = html.substring(начало, конец);

    мир.макет.константы = {
        "заголовокЛево": `${название}-заголовокЛево`,
        "заголовокЦентр": `${название}-заголовокЦентр`,
        "заголовокПраво": `${название}-заголовокПраво`,
        "меню": `${название}-меню`,
        "содержимое": `${название}-содержимое`,
    };
    // Заменяем константы в макете.
    for (var константа in мир.макет.константы)
    {
        var старое = "${" + константа + "}";
        var новое = мир.макет.константы[константа];
        html = html.replace(старое, новое);
        css = css.replace(старое, новое);
    }
    
    мир.макет.структура = html;
    мир.макет.вид = css;
};


// // // //


ЗагрузитьМакетUIK = мир =>
{
    var м = мир.модули.модульПоИмени(ИМЯ);
    мир.макет = {
        "структура": м.содержимое["/макет|template.html"],
        "вид": м.содержимое["/макет|template.css"],
    };    
};


// // // //


ВывестиПриветствиеОтUIK = мир =>
{
    console.debug("Привет от UIK");
};