Изменения от Главреда ГитЖС | Changes of GitJS Glavred
This commit is contained in:
241
интерфейс|ui.js
241
интерфейс|ui.js
@@ -3,6 +3,213 @@
|
||||
// // // //
|
||||
|
||||
|
||||
ОкончательноСкрытьОкноПриветствияПослеСкрытия = мир =>
|
||||
{
|
||||
if (мир.путьАнимацииОкнаПриветствия != "скрытие")
|
||||
{
|
||||
return;
|
||||
}
|
||||
мир.окноПриветствия.style.display = "none";
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ВыбратьРаскладкуПровальную = мир =>
|
||||
{
|
||||
мир.выбраннаяРаскладка = "😭";
|
||||
мир.уведомить("выбрали раскладку");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ВыбратьРаскладкуУспешную = мир =>
|
||||
{
|
||||
мир.выбраннаяРаскладка = "😀";
|
||||
мир.уведомить("выбрали раскладку");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ВыбратьРаскладкуX = мир =>
|
||||
{
|
||||
мир.выбраннаяРаскладка = "X";
|
||||
мир.уведомить("выбрали раскладку");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ВывестиФактЗавершенияАнимацииОкнаПриветствия = мир =>
|
||||
{
|
||||
console.debug("завершили анимацию окна приветствия");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПлавноСкрытьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const css = `
|
||||
|
||||
#${указатель}
|
||||
{
|
||||
opacity: 1;
|
||||
animation: ${указатель}FadeOut 1s ease;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 0.2s;
|
||||
}
|
||||
@keyframes ${указатель}FadeOut
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
мир.анимацияОкнаПриветствия.innerHTML = css;
|
||||
мир.путьАнимацииОкнаПриветствия = "скрытие";
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПлавноПоказатьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const css = `
|
||||
|
||||
#${указатель}
|
||||
{
|
||||
opacity: 0;
|
||||
animation: ${указатель}FadeIn 1s ease;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
@keyframes ${указатель}FadeIn
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
мир.анимацияОкнаПриветствия.innerHTML = css;
|
||||
мир.путьАнимацииОкнаПриветствия = "отображение";
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПодготовитьАнимациюОкнаПриветствия = мир =>
|
||||
{
|
||||
мир.анимацияОкнаПриветствия = document.createElement("style");
|
||||
document.head.appendChild(мир.анимацияОкнаПриветствия);
|
||||
|
||||
мир.окноПриветствия.addEventListener(
|
||||
"animationend",
|
||||
function()
|
||||
{
|
||||
мир.уведомить("завершили анимацию окна приветствия");
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ЗадатьВидОкнаПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const css = `
|
||||
|
||||
#${указатель}-тело
|
||||
{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
#${указатель}
|
||||
{
|
||||
background-color: white;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
`;
|
||||
var вид = document.createElement("style");
|
||||
вид.innerHTML = css;
|
||||
document.head.appendChild(вид);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const html = `
|
||||
|
||||
<div id="${указатель}-тело">
|
||||
<center>
|
||||
<h1>Маджонг | 麻将 | Mahjong</h1>
|
||||
<hr class="uk-divider-icon">
|
||||
<p uk-margin>
|
||||
<p>Выберите раскладку | 选择布局 | Select layout</p>
|
||||
<button id="${указатель}-X" class="uk-button uk-button-default">X</button>
|
||||
<button id="${указатель}-😀" class="uk-button uk-button-default">😀</button>
|
||||
<button id="${указатель}-😭" class="uk-button uk-button-default">😭</button>
|
||||
</p>
|
||||
</center>
|
||||
</div>
|
||||
|
||||
`;
|
||||
var окно = document.createElement("div");
|
||||
окно.id = указатель;
|
||||
окно.innerHTML = html;
|
||||
document.body.appendChild(окно);
|
||||
мир.окноПриветствия = окно;
|
||||
|
||||
$(`#${указатель}-X`).click(function() {
|
||||
мир.уведомить("кнопка раскладки X");
|
||||
});
|
||||
$(`#${указатель}-😀`).click(function() {
|
||||
мир.уведомить("кнопка раскладки 😀");
|
||||
});
|
||||
$(`#${указатель}-😭`).click(function() {
|
||||
мир.уведомить("кнопка раскладки 😭");
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьОкноПоражения = мир =>
|
||||
{
|
||||
var структура = `
|
||||
@@ -55,13 +262,6 @@
|
||||
}
|
||||
|
||||
`;
|
||||
мир.окноПоражения = добавитьОкно("окно-поражения", структура, вид);
|
||||
$("#перезапустить-раскладку-решаемую").click(function() {
|
||||
мир.уведомить("кнопка перезапуска с решаемой раскладкой");
|
||||
});
|
||||
$("#перезапустить-раскладку-нерешаемую").click(function() {
|
||||
мир.уведомить("кнопка перезапуска с нерешаемой раскладкой");
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@@ -121,31 +321,4 @@
|
||||
|
||||
`;
|
||||
мир.окноПобеды = добавитьОкно("окно-победы", структура, вид);
|
||||
$("#перезапустить-раскладку-решаемую").click(function() {
|
||||
мир.уведомить("кнопка перезапуска с решаемой раскладкой");
|
||||
});
|
||||
$("#перезапустить-раскладку-нерешаемую").click(function() {
|
||||
мир.уведомить("кнопка перезапуска с нерешаемой раскладкой");
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьГлавноеОкно = мир =>
|
||||
{
|
||||
мир.главноеОкно = document.createElement("div");
|
||||
мир.главноеОкно.id = "главное-окно"
|
||||
мир.главноеОкно.style.cssText = `
|
||||
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
pointer-events: all;
|
||||
|
||||
`;
|
||||
document.body.appendChild(мир.главноеОкно);
|
||||
};
|
||||
Reference in New Issue
Block a user