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

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

@@ -3,32 +3,165 @@
 // // // //
 
 
-ОкончательноСкрытьОкноПриветствияПослеСкрытия = мир =>
+ЗадатьПораженческоеСодержимоеОкнуОкончания = мир =>
 {
-    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%
+    {
+        opacity: 1;
+    }
+    100%
     {
-        return;
+        opacity: 0;
+    }
+}
+
+@keyframes ${мир.окна.окончание.указатель}ПлавноПоказать
+{
+    0%
+    {
+        opacity: 0;
+    }
+    100%
+    {
+        opacity: 1;
     }
-    мир.окноПриветствия.style.display = "none";
+}
+
+    `;
+    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";
+};
+
+
+// // // //
+
+
+ВыбратьРаскладкуПровальную = мир =>
+{
+    мир.выбраннаяРаскладка = "😭";
     мир.уведомить("выбрали раскладку");
 };
 
@@ -36,9 +169,9 @@
 // // // //
 
 
-ВыбратьРаскладкуX = мир =>
+ВыбратьРаскладкуУспешную = мир =>
 {
-    мир.выбраннаяРаскладка = "X";
+    мир.выбраннаяРаскладка = "😀";
     мир.уведомить("выбрали раскладку");
 };
 
@@ -46,9 +179,10 @@
 // // // //
 
 
-ВывестиФактЗавершенияАнимацииОкнаПриветствия = мир =>
+ВыбратьРаскладкуX = мир =>
 {
-    console.debug("завершили анимацию окна приветствия");
+    мир.выбраннаяРаскладка = "X";
+    мир.уведомить("выбрали раскладку");
 };
 
 
@@ -57,31 +191,19 @@
 
 ПлавноСкрытьОкноПриветствия = мир =>
 {
-    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,30 +212,19 @@
 
 ПлавноПоказатьОкноПриветствия = мир =>
 {
-    const указатель = "окно-приветствия";
     const css = `
 
-#${указатель}
+#${мир.окна.приветствие.указатель}
 {
     opacity: 0;
-    animation: ${указатель}FadeIn 1s ease;
+    animation: ${мир.окна.приветствие.указатель}ПлавноПоказать 1s ease;
     animation-fill-mode: forwards;
 }
-@keyframes ${указатель}FadeIn
-{
-    0%
-    {
-        opacity: 0;
-    }
-    100%
-    {
-        opacity: 1;
-    }
-}
 
     `;
-    мир.анимацияОкнаПриветствия.innerHTML = css;
-    мир.путьАнимацииОкнаПриветствия = "отображение";
+    мир.окна.приветствие.анимация.innerHTML = css;
+    мир.окна.приветствие.показываем = true;
+    мир.окна.приветствие.элемент.style.display = "block";
 };
 
 
@@ -122,14 +233,20 @@
 
 ПодготовитьАнимациюОкнаПриветствия = мир =>
 {
-    мир.анимацияОкнаПриветствия = document.createElement("style");
-    document.head.appendChild(мир.анимацияОкнаПриветствия);
-    
-    мир.окноПриветствия.addEventListener(
+    мир.окна.приветствие.анимация = document.createElement("style");
+    document.head.appendChild(мир.окна.приветствие.анимация);
+    мир.окна.приветствие.показываем = true;
+    мир.окна.приветствие.элемент.addEventListener(
         "animationend",
         function()
         {
-            мир.уведомить("завершили анимацию окна приветствия");
+            if (мир.окна.приветствие.показываем)
+            {
+                мир.уведомить("плавно показали окно приветствия");
+            }
+            else {
+                мир.уведомить("плавно скрыли окно приветствия");
+            }
         }
     );
 };
@@ -138,19 +255,18 @@
 // // // //
 
 
-ЗадатьВидОкнаПриветствия = мир =>
+ЗадатьВидИАнимациюОкнаПриветствия = мир =>
 {
-    const указатель = "окно-приветствия";
     const css = `
 
-#${указатель}-тело
+#${мир.окна.приветствие.указатель}-тело
 {
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translateX(-50%) translateY(-50%);
 }
-#${указатель}
+#${мир.окна.приветствие.указатель}
 {
     background-color: white;
     position: fixed;
@@ -160,6 +276,30 @@
     bottom: 0;
 }
 
+@keyframes ${мир.окна.приветствие.указатель}ПлавноСкрыть
+{
+    0%
+    {
+        opacity: 1;
+    }
+    100%
+    {
+        opacity: 0;
+    }
+}
+
+@keyframes ${мир.окна.приветствие.указатель}ПлавноПоказать
+{
+    0%
+    {
+        opacity: 0;
+    }
+    100%
+    {
+        opacity: 1;
+    }
+}
+
     `;
     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;
-    }
-}
-
-    `;
-    мир.окноПобеды = добавитьОкно("окно-победы", структура, вид);
-};

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

@@ -1,11 +1,12 @@
 пуск модулей маджонга
+    создать хранилище окон
     создать окно приветствия
-    задать вид окна приветствия
+    задать вид и анимацию окна приветствия
     подготовить анимацию окна приветствия
+    создать окно окончания
+    задать вид и анимацию окна окончания
+    подготовить анимацию окна окончания
     плавно показать окно приветствия
-завершили анимацию окна приветствия
-    вывести факт завершения анимации окна приветствия
-    окончательно скрыть окно приветствия после скрытия
 кнопка раскладки X
     выбрать раскладку X
 кнопка раскладки 😀
@@ -14,7 +15,11 @@
     выбрать раскладку провальную
 выбрали раскладку
     плавно скрыть окно приветствия
+плавно скрыли окно приветствия
+    отключить окно приветствия
 победа
-    создать окно победы
+    задать победное содержимое окну окончания
+    плавно показать окно окончания
 поражение
-    создать окно поражения
+    задать пораженческое содержимое окну окончания
+    плавно показать окно окончания

пуск|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("задать заголовок");
 };
 

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

@@ -1,7 +1,3 @@
 пуск маджонга
     задать заголовок браузера
-    запустить модули маджонга
-кнопка перезапуска с решаемой раскладкой
-    перезапустить с решаемой раскладкой
-кнопка перезапуска с нерешаемой раскладкой
-    перезапустить с нерешаемой раскладкой
+    запустить модули маджонга

функции|functions.js

@@ -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, "", адрес);
-    }
-};