Изменения от Главреда ГитЖС | Changes of GitJS Glavred
This commit is contained in:
447
интерфейс|ui.js
447
интерфейс|ui.js
@@ -3,13 +3,156 @@
|
||||
// // // //
|
||||
|
||||
|
||||
ОкончательноСкрытьОкноПриветствияПослеСкрытия = мир =>
|
||||
ЗадатьПораженческоеСодержимоеОкнуОкончания = мир =>
|
||||
{
|
||||
if (мир.путьАнимацииОкнаПриветствия != "скрытие")
|
||||
$(`#${мир.окна.окончание.указатель}-содержимое`).html(`
|
||||
|
||||
<span class="uk-text-large">Поражение</span>
|
||||
⚬ <span class="uk-text-large uk-text-bold">失败</span> ⚬
|
||||
<span class="uk-text-large">Defeat</span>
|
||||
|
||||
`);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ЗадатьПобедноеСодержимоеОкнуОкончания = мир =>
|
||||
{
|
||||
$(`#${мир.окна.окончание.указатель}-содержимое`).html(`
|
||||
|
||||
<span class="uk-text-large">Победа</span>
|
||||
⚬ <span class="uk-text-large uk-text-bold">胜利</span> ⚬
|
||||
<span class="uk-text-large">Victory</span>
|
||||
|
||||
`);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПлавноПоказатьОкноОкончания = мир =>
|
||||
{
|
||||
const css = `
|
||||
|
||||
#${мир.окна.окончание.указатель}
|
||||
{
|
||||
opacity: 0;
|
||||
animation: ${мир.окна.окончание.указатель}ПлавноПоказать 0.5s ease;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
`;
|
||||
мир.окна.окончание.анимация.innerHTML = css;
|
||||
мир.окна.окончание.элемент.style.display = "block";
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПодготовитьАнимациюОкнаОкончания = мир =>
|
||||
{
|
||||
мир.окна.окончание.анимация = document.createElement("style");
|
||||
document.head.appendChild(мир.окна.окончание.анимация);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ЗадатьВидИАнимациюОкнаОкончания = мир =>
|
||||
{
|
||||
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;
|
||||
}
|
||||
|
||||
@keyframes ${мир.окна.окончание.указатель}ПлавноСкрыть
|
||||
{
|
||||
0%
|
||||
{
|
||||
return;
|
||||
opacity: 1;
|
||||
}
|
||||
мир.окноПриветствия.style.display = "none";
|
||||
100%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ${мир.окна.окончание.указатель}ПлавноПоказать
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
var вид = document.createElement("style");
|
||||
вид.innerHTML = css;
|
||||
document.head.appendChild(вид);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьОкноОкончания = мир =>
|
||||
{
|
||||
мир.окна.окончание = {
|
||||
"указатель": "окно-окончания",
|
||||
};
|
||||
const html = `
|
||||
|
||||
<div id="${мир.окна.окончание.указатель}-тело">
|
||||
<center>
|
||||
<span id="${мир.окна.окончание.указатель}-содержимое">
|
||||
</span>
|
||||
<hr class="uk-divider-icon">
|
||||
<p>
|
||||
<a href="https://twitter.com/opengamestudio" target="_blank" class="uk-icon-button" uk-icon="twitter"></a>
|
||||
</p>
|
||||
</center>
|
||||
</div>
|
||||
|
||||
`;
|
||||
|
||||
var окно = document.createElement("div");
|
||||
окно.id = мир.окна.окончание.указатель;
|
||||
окно.innerHTML = html;
|
||||
document.body.appendChild(окно);
|
||||
окно.style.display = "none";
|
||||
мир.окна.окончание.элемент = окно;
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ОтключитьОкноПриветствия = мир =>
|
||||
{
|
||||
мир.окна.приветствие.элемент.style.display = "none";
|
||||
};
|
||||
|
||||
|
||||
@@ -46,42 +189,21 @@
|
||||
// // // //
|
||||
|
||||
|
||||
ВывестиФактЗавершенияАнимацииОкнаПриветствия = мир =>
|
||||
{
|
||||
console.debug("завершили анимацию окна приветствия");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПлавноСкрытьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const css = `
|
||||
|
||||
#${указатель}
|
||||
#${мир.окна.приветствие.указатель}
|
||||
{
|
||||
opacity: 1;
|
||||
animation: ${указатель}FadeOut 1s ease;
|
||||
animation: ${мир.окна.приветствие.указатель}ПлавноСкрыть 0.5s ease;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 0.2s;
|
||||
}
|
||||
@keyframes ${указатель}FadeOut
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
animation-delay: 0.1s;
|
||||
}
|
||||
|
||||
`;
|
||||
мир.анимацияОкнаПриветствия.innerHTML = css;
|
||||
мир.путьАнимацииОкнаПриветствия = "скрытие";
|
||||
мир.окна.приветствие.анимация.innerHTML = css;
|
||||
мир.окна.приветствие.показываем = false;
|
||||
};
|
||||
|
||||
|
||||
@@ -90,16 +212,83 @@
|
||||
|
||||
ПлавноПоказатьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
const css = `
|
||||
|
||||
#${указатель}
|
||||
#${мир.окна.приветствие.указатель}
|
||||
{
|
||||
opacity: 0;
|
||||
animation: ${указатель}FadeIn 1s ease;
|
||||
animation: ${мир.окна.приветствие.указатель}ПлавноПоказать 1s ease;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
@keyframes ${указатель}FadeIn
|
||||
|
||||
`;
|
||||
мир.окна.приветствие.анимация.innerHTML = css;
|
||||
мир.окна.приветствие.показываем = true;
|
||||
мир.окна.приветствие.элемент.style.display = "block";
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПодготовитьАнимациюОкнаПриветствия = мир =>
|
||||
{
|
||||
мир.окна.приветствие.анимация = document.createElement("style");
|
||||
document.head.appendChild(мир.окна.приветствие.анимация);
|
||||
мир.окна.приветствие.показываем = true;
|
||||
мир.окна.приветствие.элемент.addEventListener(
|
||||
"animationend",
|
||||
function()
|
||||
{
|
||||
if (мир.окна.приветствие.показываем)
|
||||
{
|
||||
мир.уведомить("плавно показали окно приветствия");
|
||||
}
|
||||
else {
|
||||
мир.уведомить("плавно скрыли окно приветствия");
|
||||
}
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ЗадатьВидИАнимациюОкнаПриветствия = мир =>
|
||||
{
|
||||
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;
|
||||
}
|
||||
|
||||
@keyframes ${мир.окна.приветствие.указатель}ПлавноСкрыть
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ${мир.окна.приветствие.указатель}ПлавноПоказать
|
||||
{
|
||||
0%
|
||||
{
|
||||
@@ -111,55 +300,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
мир.анимацияОкнаПриветствия.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;
|
||||
@@ -172,36 +312,44 @@
|
||||
|
||||
СоздатьОкноПриветствия = мир =>
|
||||
{
|
||||
const указатель = "окно-приветствия";
|
||||
мир.окна.приветствие = {
|
||||
"указатель": "окно-приветствия",
|
||||
};
|
||||
const html = `
|
||||
|
||||
<div id="${указатель}-тело">
|
||||
<div id="${мир.окна.приветствие.указатель}-тело">
|
||||
<center>
|
||||
<h1>Маджонг | 麻将 | Mahjong</h1>
|
||||
<span>
|
||||
<span class="uk-text-large">Маджонг</span>
|
||||
⚬ <span class="uk-text-large uk-text-bold">麻将</span> ⚬
|
||||
<span class="uk-text-large">Mahjong</span>
|
||||
</span>
|
||||
<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>
|
||||
<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 = указатель;
|
||||
окно.id = мир.окна.приветствие.указатель;
|
||||
окно.innerHTML = html;
|
||||
document.body.appendChild(окно);
|
||||
мир.окноПриветствия = окно;
|
||||
окно.style.display = "none";
|
||||
мир.окна.приветствие.элемент = окно;
|
||||
|
||||
$(`#${указатель}-X`).click(function() {
|
||||
$(`#${мир.окна.приветствие.указатель}-X`).click(function() {
|
||||
мир.уведомить("кнопка раскладки X");
|
||||
});
|
||||
$(`#${указатель}-😀`).click(function() {
|
||||
$(`#${мир.окна.приветствие.указатель}-😀`).click(function() {
|
||||
мир.уведомить("кнопка раскладки 😀");
|
||||
});
|
||||
$(`#${указатель}-😭`).click(function() {
|
||||
$(`#${мир.окна.приветствие.указатель}-😭`).click(function() {
|
||||
мир.уведомить("кнопка раскладки 😭");
|
||||
});
|
||||
};
|
||||
@@ -210,115 +358,8 @@
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьОкноПоражения = мир =>
|
||||
СоздатьХранилищеОкон = мир =>
|
||||
{
|
||||
var структура = `
|
||||
|
||||
<div id="окно-поражения-тело">
|
||||
<center>
|
||||
<h1>Поражение</h1>
|
||||
<hr class="uk-divider-icon">
|
||||
<p uk-margin>
|
||||
<p>Перезапустить игру с раскладкой:</p>
|
||||
<button id="перезапустить-раскладку-решаемую" class="uk-button uk-button-default">Решаемой</button>
|
||||
<button id="перезапустить-раскладку-нерешаемую" class="uk-button uk-button-default">Нерешаемой</button>
|
||||
</p>
|
||||
</center>
|
||||
</div>
|
||||
|
||||
`;
|
||||
var вид = `
|
||||
|
||||
#окно-поражение-тело
|
||||
{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
pointer-events: all;
|
||||
}
|
||||
#окно-победы
|
||||
{
|
||||
opacity: 0;
|
||||
background-color: white;
|
||||
animation: fadeInОкноПоражения 1s ease;
|
||||
animation-fill-mode: forwards;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
@keyframes fadeInОкноПоражения
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
мир.окна = {};
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
СоздатьОкноПобеды = мир =>
|
||||
{
|
||||
var структура = `
|
||||
|
||||
<div id="окно-победы-тело">
|
||||
<center>
|
||||
<h1>Победа</h1>
|
||||
<hr class="uk-divider-icon">
|
||||
<p uk-margin>
|
||||
<p>Перезапустить игру с раскладкой:</p>
|
||||
<button id="перезапустить-раскладку-решаемую" class="uk-button uk-button-default">Решаемой</button>
|
||||
<button id="перезапустить-раскладку-нерешаемую" class="uk-button uk-button-default">Нерешаемой</button>
|
||||
</p>
|
||||
</center>
|
||||
</div>
|
||||
|
||||
`;
|
||||
var вид = `
|
||||
|
||||
#окно-победы-тело
|
||||
{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
pointer-events: all;
|
||||
}
|
||||
#окно-победы
|
||||
{
|
||||
opacity: 0;
|
||||
background-color: white;
|
||||
animation: fadeInОкноПобеды 1s ease;
|
||||
animation-fill-mode: forwards;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
@keyframes fadeInОкноПобеды
|
||||
{
|
||||
0%
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
100%
|
||||
{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
`;
|
||||
мир.окноПобеды = добавитьОкно("окно-победы", структура, вид);
|
||||
};
|
||||
@@ -1,11 +1,12 @@
|
||||
пуск модулей маджонга
|
||||
создать хранилище окон
|
||||
создать окно приветствия
|
||||
задать вид окна приветствия
|
||||
задать вид и анимацию окна приветствия
|
||||
подготовить анимацию окна приветствия
|
||||
создать окно окончания
|
||||
задать вид и анимацию окна окончания
|
||||
подготовить анимацию окна окончания
|
||||
плавно показать окно приветствия
|
||||
завершили анимацию окна приветствия
|
||||
вывести факт завершения анимации окна приветствия
|
||||
окончательно скрыть окно приветствия после скрытия
|
||||
кнопка раскладки X
|
||||
выбрать раскладку X
|
||||
кнопка раскладки 😀
|
||||
@@ -14,7 +15,11 @@
|
||||
выбрать раскладку провальную
|
||||
выбрали раскладку
|
||||
плавно скрыть окно приветствия
|
||||
плавно скрыли окно приветствия
|
||||
отключить окно приветствия
|
||||
победа
|
||||
создать окно победы
|
||||
задать победное содержимое окну окончания
|
||||
плавно показать окно окончания
|
||||
поражение
|
||||
создать окно поражения
|
||||
задать пораженческое содержимое окну окончания
|
||||
плавно показать окно окончания
|
||||
24
пуск|run.js
24
пуск|run.js
@@ -3,28 +3,6 @@
|
||||
// // // //
|
||||
|
||||
|
||||
ПерезапуститьСРешаемойРаскладкой = мир =>
|
||||
{
|
||||
задатьПараметрВСтрокеПоиска("🚧", "😀");
|
||||
document.location.reload();
|
||||
console.debug("Перезапустить РЕШ");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ПерезапуститьСНерешаемойРаскладкой = мир =>
|
||||
{
|
||||
задатьПараметрВСтрокеПоиска("🚧", "😭");
|
||||
document.location.reload();
|
||||
console.debug("Перезапустить НЕРЕШ");
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
ЗапуститьМодулиМаджонга = мир =>
|
||||
{
|
||||
мир.уведомить("пуск модулей маджонга");
|
||||
@@ -36,7 +14,7 @@
|
||||
|
||||
ЗадатьЗаголовокБраузера = мир =>
|
||||
{
|
||||
document.title = "🀄 红龙";
|
||||
document.title = "🀄 麻将";
|
||||
console.debug("задать заголовок");
|
||||
};
|
||||
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
пуск маджонга
|
||||
задать заголовок браузера
|
||||
запустить модули маджонга
|
||||
кнопка перезапуска с решаемой раскладкой
|
||||
перезапустить с решаемой раскладкой
|
||||
кнопка перезапуска с нерешаемой раскладкой
|
||||
перезапустить с нерешаемой раскладкой
|
||||
запустить модули маджонга
|
||||
@@ -1,4 +1,5 @@
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
@@ -14,40 +15,3 @@
|
||||
return окно;
|
||||
};
|
||||
|
||||
|
||||
// // // //
|
||||
|
||||
|
||||
задатьПараметрВСтрокеПоиска = (ключПараметра, значениеПараметра) =>
|
||||
{
|
||||
var строкаПоиска = decodeURI(window.location.search);
|
||||
var текущийАдрес = decodeURI(window.location.href);
|
||||
|
||||
// Заменить параметр.
|
||||
if (строкаПоиска.includes(`${ключПараметра}=`))
|
||||
{
|
||||
var части = строкаПоиска.split(/[\?&]/);
|
||||
for (var номер in части)
|
||||
{
|
||||
var часть = части[номер];
|
||||
if (часть.startsWith(`${ключПараметра}=`))
|
||||
{
|
||||
var значение = часть.split("=")[1];
|
||||
var адрес = текущийАдрес.replace(значение, значениеПараметра);
|
||||
history.pushState(null, "", адрес);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
// Добавить параметр.
|
||||
else
|
||||
{
|
||||
var префикс = "?";
|
||||
if (строкаПоиска.startsWith("?"))
|
||||
{
|
||||
префикс = "&";
|
||||
}
|
||||
var адрес = текущийАдрес + префикс + `${ключПараметра}=` + значениеПараметра;
|
||||
history.pushState(null, "", адрес);
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user