Исправить опечатку | Fix typo

0000

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

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

@@ -0,0 +1,366 @@
+
+
+// // // //
+
+
+ЗадатьПораженческоеСодержимоеОкнуОкончания = мир =>
+{
+    $(`#${мир.окна.окончание.указатель}-содержимое`).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() {
+        мир.уведомить("кнопка раскладки 😭");
+    });
+};
+
+
+// // // //
+
+
+СоздатьХранилищеОкон = мир =>
+{
+    мир.окна = {};
+};
+

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

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

пуск|run.js

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

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

@@ -1,9 +1,3 @@
 пуск маджонга
     задать заголовок браузера
-    создать хранилище окон
-    создать реестр раскладок
-    создать реестр тем фишек
     запустить модули маджонга
-    
-изменили размер окна браузера
-    вывести размер окна браузера

тема|theme.js

@@ -41,9 +41,9 @@
 ЗагрузитьСледующуюТекстуруТемыФишекМаджонга = мир =>
 {
     const загрузка = мир.загрузкаТемыФишек;
-    var тема = мир.реестрТемФишек[загрузка.имя];
+    var тема = мир.темыФишек[загрузка.имя];
-    var имяМодуляРесурсов = тема["🗿"];
+    var указательМодуляРесурсов = тема["📦"];
-    var модуль = мир.модули.модульПоИмени(имяМодуляРесурсов);
+    var модуль = мир.модули.модульПоУказателю(указательМодуляРесурсов);
     var ресурс = тема[загрузка.номер];
     var содержимое = модуль.содержимое[ресурс];
     var b64 = base64js.fromByteArray(new Uint8Array(содержимое));
@@ -73,7 +73,7 @@
     мир.загрузкаТемыФишек = {
         "номер": 1,
         "всего": 42,
-        "имя": мир.выбраннаяТема,
+        "имя": мир.темаФишек,
     };
     мир.текстурыТемФишек = {};
     мир.текстурыТемФишек[мир.загрузкаТемыФишек.имя] = {};

функции|functions.js

@@ -0,0 +1,17 @@
+
+
+// // // //
+
+
+добавитьОкно = (id, html, css) =>
+{
+    var окно = document.createElement("div");
+    окно.id = id;
+    окно.innerHTML = html;
+    var вид = document.createElement("style");
+    вид.innerHTML = css;
+    document.body.appendChild(окно);
+    document.head.appendChild(вид);
+    return окно;
+};
+