mahjong/mahjong-osnova-base
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Изменения от Главреда ГитЖС | Changes of GitJS Glavred

Browse Source
This commit is contained in:
Главред | Glavred
2020-09-30 14:32:23 +03:00
parent 3a8ccac72e
commit 6f6252e0f0
5 changed files with 10 additions and 447 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
0000
View File

@@ -2,8 +2,6 @@
1.0.0
https://git.opengamestudio.org/mahjong/mahjong-osnova-base
x /интерфейс|ui.js
/интерфейс|ui.череда
x /пуск|run.js
/пуск|run.череда
x /тема|theme.js

418
интерфейс|ui.js
View File

@@ -1,418 +0,0 @@
// // // //
СоздатьЭлементыУправленияМасштабом = мир =>
{
var элементы = document.createElement("div");
элементы.innerHTML = `
<ul class="uk-iconnav uk-iconnav-vertical">
<li><a id="увеличить-масштаб" uk-icon="icon: plus; ratio: 2"></a></li>
<li><a id="уменьшить-масштаб" uk-icon="icon: minus; ratio: 2"></a></li>
</ul>
`;
элементы.style = `
position: fixed;
right: 0;
top: 50%;
transform: translateX(-50%) translateY(-50%);
`;
мир.окна.управление.элемент.appendChild(элементы);
$(`#увеличить-масштаб`).click(function() {
мир.уведомить("кнопка увеличения масштаба");
});
$(`#уменьшить-масштаб`).click(function() {
мир.уведомить("кнопка уменьшения масштаба");
});
};
// // // //
СоздатьОкноУправления = мир =>
{
мир.окна.управление = {
"указатель": "окно-управления",
};
var окно = document.createElement("div");
окно.id = мир.окна.управление.указатель;
document.body.appendChild(окно);
окно.style = `
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
`;
мир.окна.управление.элемент = окно;
};
// // // //
ЗадатьПораженческоеСодержимоеОкнуОкончания = мир =>
{
$(`#${мир.окна.окончание.указатель}-содержимое`).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%
{
opacity: 1;
}
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";
};
// // // //
ВыбратьРаскладкуПровальную = мир =>
{
мир.выбраннаяРаскладка = "😭";
мир.уведомить("выбрали раскладку");
};
// // // //
ВыбратьРаскладкуУспешную = мир =>
{
мир.выбраннаяРаскладка = "😀";
мир.уведомить("выбрали раскладку");
};
// // // //
ВыбратьРаскладкуX = мир =>
{
мир.выбраннаяРаскладка = "X";
мир.уведомить("выбрали раскладку");
};
// // // //
ПлавноСкрытьОкноПриветствия = мир =>
{
const css = `
#${мир.окна.приветствие.указатель}
{
opacity: 1;
animation: ${мир.окна.приветствие.указатель}ПлавноСкрыть 0.5s ease;
animation-fill-mode: forwards;
animation-delay: 0.1s;
}
`;
мир.окна.приветствие.анимация.innerHTML = css;
мир.окна.приветствие.показываем = false;
};
// // // //
ПлавноПоказатьОкноПриветствия = мир =>
{
const css = `
#${мир.окна.приветствие.указатель}
{
opacity: 0;
animation: ${мир.окна.приветствие.указатель}ПлавноПоказать 1s ease;
animation-fill-mode: forwards;
}
`;
мир.окна.приветствие.анимация.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%
{
opacity: 0;
}
100%
{
opacity: 1;
}
}
`;
var вид = document.createElement("style");
вид.innerHTML = css;
document.head.appendChild(вид);
};
// // // //
СоздатьОкноПриветствия = мир =>
{
мир.окна.приветствие = {
"указатель": "окно-приветствия",
};
const html = `
<div id="${мир.окна.приветствие.указатель}-тело">
<center>
<p>
<span class="uk-text-large">Маджонг</span>
⚬ <span class="uk-text-large uk-text-bold">麻将</span> ⚬
<span class="uk-text-large">Mahjong</span>
</p>
<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>
</p>
</center>
</div>
`;
var окно = document.createElement("div");
окно.id = мир.окна.приветствие.указатель;
окно.innerHTML = html;
document.body.appendChild(окно);
окно.style.display = "none";
мир.окна.приветствие.элемент = окно;
$(`#${мир.окна.приветствие.указатель}-X`).click(function() {
мир.уведомить("кнопка раскладки X");
});
$(`#${мир.окна.приветствие.указатель}-😀`).click(function() {
мир.уведомить("кнопка раскладки 😀");
});
$(`#${мир.окна.приветствие.указатель}-😭`).click(function() {
мир.уведомить("кнопка раскладки 😭");
});
};
// // // //
СоздатьХранилищеОкон = мир =>
{
мир.окна = {};
};

27
интерфейс|ui.череда
View File

@@ -1,27 +0,0 @@
пуск модулей маджонга
создать хранилище окон
создать окно управления
создать элементы управления масштабом
создать окно приветствия
задать вид и анимацию окна приветствия
подготовить анимацию окна приветствия
создать окно окончания
задать вид и анимацию окна окончания
подготовить анимацию окна окончания
плавно показать окно приветствия
кнопка раскладки X
выбрать раскладку X
кнопка раскладки 😀
выбрать раскладку успешную
кнопка раскладки 😭
выбрать раскладку провальную
выбрали раскладку
плавно скрыть окно приветствия
плавно скрыли окно приветствия
отключить окно приветствия
победа
задать победное содержимое окну окончания
плавно показать окно окончания
поражение
задать пораженческое содержимое окну окончания
плавно показать окно окончания

9
пуск|run.js
View File

@@ -3,6 +3,15 @@
// // // //
СоздатьХранилищеОкон = мир =>
{
мир.окна = {};
};
// // // //
ВывестиРазмерОкнаБраузера = мир =>
{
console.debug("размер окна:", window.innerWidth, window.innerHeight);

1
пуск|run.череда
View File

@@ -1,5 +1,6 @@
пуск маджонга
задать заголовок браузера
создать хранилище окон
запустить модули маджонга
изменили размер окна браузера