Переглянути джерело

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

master
Главред | Glavred 4 роки тому
джерело
коміт
e35d252b52
7 змінених файлів з 55 додано та 153 видалено
  1. +0
    -1
      0000
  2. +9
    -12
      окончание|ending.js
  3. +0
    -103
      плавное-отображение-скрытие|smooth-show-hide.js
  4. +14
    -17
      приветствие|welcome.js
  5. +4
    -5
      раскладки|layouts.js
  6. +19
    -12
      управление|controls.js
  7. +9
    -3
      управление|controls.череда

+ 0
- 1
0000 Переглянути файл

@@ -4,7 +4,6 @@ https://git.opengamestudio.org/mahjong/mahjong-ui

x /окончание|ending.js
/окончание|ending.череда
x /плавное-отображение-скрытие|smooth-show-hide.js
x /приветствие|welcome.js
/приветствие|welcome.череда
x /пуск|run.js


+ 9
- 12
окончание|ending.js Переглянути файл

@@ -75,11 +75,18 @@

СоздатьОкноОкончания = мир =>
{
var окно = document.createElement("div");
окно.id = "окно-окончания";
окно.style.display = "none";
document.body.appendChild(окно);
мир.окна.окончание = {
"указатель": "окно-окончания",
"указатель": окно.id,
"элемент": окно,
"плавно": new ПлавноОтобразитьСкрыть(окно),
};
const html = `

окно.innerHTML = `
<div id="${мир.окна.окончание.указатель}-тело">
<center>
<span id="${мир.окна.окончание.указатель}-содержимое">
@@ -90,15 +97,5 @@
</p>
</center>
</div>

`;

var окно = document.createElement("div");
окно.id = мир.окна.окончание.указатель;
окно.innerHTML = html;
окно.style.display = "none";
document.body.appendChild(окно);
мир.окна.окончание.элемент = окно;
мир.окна.окончание.плавно = new ПлавноеОтображениеИСкрытиеЭлемента(окно);
};

+ 0
- 103
плавное-отображение-скрытие|smooth-show-hide.js Переглянути файл

@@ -1,103 +0,0 @@
function ПлавноеОтображениеИСкрытиеЭлемента(элемент, настройки)
{

if (!настройки)
{
настройки = {
"прозрачность": 1,
};
}
this.отобразить = () =>
{
this.показываем = true;
элемент.style.display = "block";
this.преобразования.innerHTML = `
#${элемент.id}
{
opacity: 0;
animation: ${элемент.id}ПлавноОтобразить 0.4s ease;
animation-fill-mode: forwards;
}
`;
};
this.скрыть = () =>
{
this.показываем = false;
this.преобразования.innerHTML = `
#${элемент.id}
{
opacity: ${настройки.прозрачность};
animation: ${элемент.id}ПлавноСкрыть 0.4s ease;
animation-fill-mode: forwards;
}
`;
};
this.__создатьКадры = () =>
{
this.кадры = document.createElement("style");
document.head.appendChild(this.кадры);
this.кадры.innerHTML = `
@keyframes ${элемент.id}ПлавноОтобразить
{
0%
{
opacity: 0;
}
100%
{
opacity: ${настройки.прозрачность};
}
}
@keyframes ${элемент.id}ПлавноСкрыть
{
0%
{
opacity: ${настройки.прозрачность};
}
100%
{
opacity: 0;
}
}
`;
};
this.__создатьПреобразования = () =>
{
this.преобразования = document.createElement("style");
document.head.appendChild(this.преобразования);
};
this.__отслеживатьЗавершениеАнимации = () =>
{
this.отклик = {};
this.показываем = true;
var тут = this;
элемент.addEventListener(
"animationend",
function()
{
if (тут.показываем && тут.отклик.отображение)
{
тут.отклик.отображение();
}
else if (!тут.показываем)
{
элемент.style.display = "none";
if (тут.отклик.скрытие)
{
тут.отклик.скрытие();
}
}
}
);
};
// Конструктор.
this.__создатьКадры();
this.__создатьПреобразования();
this.__отслеживатьЗавершениеАнимации();
};

+ 14
- 17
приветствие|welcome.js Переглянути файл

@@ -84,12 +84,19 @@

СоздатьОкноПриветствия = мир =>
{
var окно = document.createElement("div");
окно.id = "окно-приветствия";
окно.style.display = "none";
document.body.appendChild(окно);
мир.окна.приветствие = {
"указатель": "окно-приветствия",
"указатель": окно.id,
"элемент": окно,
"плавно": new ПлавноОтобразитьСкрыть(окно),
};
const html = `

<div id="${мир.окна.приветствие.указатель}-тело">
окно.innerHTML = `
<div id="${окно.id}-тело">
<center>
<p>
<span class="uk-text-large">Маджонг</span>
@@ -100,24 +107,14 @@
<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="${окно.id}-X" class="uk-button uk-button-default">X</button>
<button id="${окно.id}-😀" class="uk-button uk-button-default">😀</button>
<button id="${окно.id}-😭" class="uk-button uk-button-default">😭</button>
</p>
</center>
</div>

`;

var окно = document.createElement("div");
окно.id = мир.окна.приветствие.указатель;
окно.innerHTML = html;
окно.style.display = "none";
document.body.appendChild(окно);
мир.окна.приветствие.элемент = окно;
мир.окна.приветствие.плавно = new ПлавноеОтображениеИСкрытиеЭлемента(окно);

$(`#${мир.окна.приветствие.указатель}-X`).click(function() {
мир.уведомить("кнопка раскладки X");
});


+ 4
- 5
раскладки|layouts.js Переглянути файл

@@ -31,7 +31,7 @@
left: 0;
top: 0;
bottom: 0;
width: 50%;
/*width: 50%;*/
}

#скрыть-раскладки
@@ -56,13 +56,12 @@
окно.style.display = "none";
document.body.appendChild(окно);

var настройки = {
"прозрачность": 0.8,
};
мир.окна.раскладки = {
"указатель": окно.id,
"элемент": окно,
"плавно": new ПлавноеОтображениеИСкрытиеЭлемента(окно, настройки),
"плавно": new ПлавноОтобразитьСкрыть(окно, {
"прозрачность": 0.8,
}),
};

окно.innerHTML = `


+ 19
- 12
управление|controls.js Переглянути файл

@@ -36,13 +36,12 @@ opacity: 0.5;
display: none;
`;

var настройки = {
"прозрачность": 0.5,
};
мир.окна.подложка = {
"указатель": "окно-подложка",
"элемент": окно,
"плавно": new ПлавноеОтображениеИСкрытиеЭлемента(окно, настройки),
"плавно": new ПлавноОтобразитьСкрыть(окно, {
"прозрачность": 0.5,
}),
};
};

@@ -139,23 +138,27 @@ transform: translateX(-50%) translateY(-50%);
// // // //


ПоказатьОкноУправления = мир =>
ПлавноПоказатьОкноУправления = мир =>
{
мир.окна.управление.элемент.style.display = "block";
мир.окна.управление.плавно.отобразить();
};


// // // //


СоздатьОкноУправления = мир =>
ПлавноСкрытьОкноУправления = мир =>
{
мир.окна.управление = {
"указатель": "окно-управления",
};
мир.окна.управление.плавно.скрыть();
}

// // // //


СоздатьОкноУправления = мир =>
{
var окно = document.createElement("div");
окно.id = мир.окна.управление.указатель;
окно.id = "окно-управления";
document.body.appendChild(окно);
окно.style = `
position: absolute;
@@ -165,5 +168,9 @@ right: 0;
bottom: 0;
`;
окно.style.display = "none";
мир.окна.управление.элемент = окно;
мир.окна.управление = {
"указатель": окно.id,
"элемент": окно,
"плавно": new ПлавноОтобразитьСкрыть(окно),
};
};

+ 9
- 3
управление|controls.череда Переглянути файл

@@ -3,11 +3,17 @@
создать элементы управления масштабом
создать кнопку раскладки
создать подложку
выбрали раскладку
показать окно управления

кнопка увеличения масштаба
увеличить масштаб
кнопка уменьшения масштаба
уменьшить масштаб
изменили масштаб
сообщить текущее значение масштаба
сообщить текущее значение масштаба
выбрали раскладку
плавно показать окно управления
кнопка показать раскладки
плавно скрыть окно управления
кнопка скрыть раскладки
плавно показать окно управления

Завантаження…
Відмінити
Зберегти