105 lines
3.9 KiB
JavaScript
105 lines
3.9 KiB
JavaScript
function Меню(события, подсказки, реплики)
|
|
{
|
|
this.создать = function()
|
|
{
|
|
события.подписать(this);
|
|
this.установитьМеню();
|
|
this.улавливатьВыбор();
|
|
};
|
|
|
|
this.обработатьСобытие = function(событие)
|
|
{
|
|
let мышь = "мышь/нажатие/";
|
|
let сами = "меню/";
|
|
if (событие.startsWith(мышь))
|
|
{
|
|
let значения = событие.substring(мышь.length).split("/");
|
|
let элемент = значения[2];
|
|
let имя = подсказки.подсказкаДляЭлемента(элемент);
|
|
if (имя && имя in реплики.задано)
|
|
{
|
|
this.отобразитьМеню(имя);
|
|
}
|
|
}
|
|
else if (событие.startsWith(сами))
|
|
{
|
|
UIkit.modal("#меню").hide();
|
|
}
|
|
};
|
|
|
|
this.отобразитьМеню = function(имя)
|
|
{
|
|
this.активнаяПодсказка = имя;
|
|
let подсказка = подсказки.задано[имя];
|
|
document.getElementById("меню-заголовок").innerHTML = подсказка.текст;
|
|
UIkit.modal("#меню").show();
|
|
};
|
|
|
|
this.улавливатьВыбор = function()
|
|
{
|
|
var тут = this;
|
|
let глаз = document.getElementById("меню-кнопка-глаз");
|
|
глаз.addEventListener(
|
|
"click",
|
|
function() {
|
|
события.уведомить(`меню/глаз/${тут.активнаяПодсказка}`);
|
|
}
|
|
);
|
|
|
|
let рука = document.getElementById("меню-кнопка-рука");
|
|
рука.addEventListener(
|
|
"click",
|
|
function() {
|
|
события.уведомить(`меню/рука/${тут.активнаяПодсказка}`);
|
|
}
|
|
);
|
|
|
|
let рот = document.getElementById("меню-кнопка-рот");
|
|
рот.addEventListener(
|
|
"click",
|
|
function() {
|
|
события.уведомить(`меню/рот/${тут.активнаяПодсказка}`);
|
|
}
|
|
);
|
|
|
|
let нога = document.getElementById("меню-кнопка-нога");
|
|
нога.addEventListener(
|
|
"click",
|
|
function() {
|
|
события.уведомить(`меню/нога/${тут.активнаяПодсказка}`);
|
|
}
|
|
);
|
|
};
|
|
|
|
this.установитьМеню = function()
|
|
{
|
|
let html = `
|
|
<div id="меню" uk-modal>
|
|
<div class="uk-modal-dialog uk-modal-body">
|
|
<button class="uk-modal-close-default" type="button" uk-close></button>
|
|
<h2 id="меню-заголовок" class="uk-modal-title">Заголовок</h2>
|
|
<div class="uk-child-width-1-4 uk-text-center" uk-grid>
|
|
<div>
|
|
<div id="меню-кнопка-глаз" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">👁️</div>
|
|
</div>
|
|
<div>
|
|
<div id="меню-кнопка-рука" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🤚</div>
|
|
</div>
|
|
<div>
|
|
<div id="меню-кнопка-рот" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🗣</div>
|
|
</div>
|
|
<div>
|
|
<div id="меню-кнопка-нога" class="uk-card uk-card-small uk-card-hover uk-card-default uk-card-body">🥾</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
document.body.insertAdjacentHTML("beforeend", html);
|
|
};
|
|
|
|
// Конструктор.
|
|
this.создать();
|
|
};
|
|
|