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

0000

@@ -1,11 +1,14 @@
 Морда Маджонга
-0.1.1
+0.2.0
 https://git.opengamestudio.org/MAOH/MOPMA
 
 x /⨐.js
+/🎛️.css
+/🎛️.html
+/🎞️.css
 x /🎬.js
 /🎬.череда
+/📍.css
 /📍.html
-x /📍.js
-/📍.череда
+x /📖.js
 /🙈.css

⨐.js

@@ -1,11 +1,26 @@
-создатьОкноСОтступами = (id) =>
+создатьОкно = (мир, id, файлHTML = null, файлCSS = null) =>
 {
+    // Структура.
     var окно = document.createElement("div");
     окно.id = id;
     окно.style.display = "none";
-    окно.classList.add("окно-с-отступами");
     document.body.appendChild(окно);
+    // Вид.
+    if (файлHTML || файлCSS)
+    {
+        var м = мир.модули.модульПоУказателю(УКАЗАТЕЛЬ_ЭТОГО_МОДУЛЯ);
+        if (файлHTML)
+        {
+            окно.innerHTML = м.содержимое[файлHTML];
+        }
+        if (файлCSS)
+        {
+            добавитьCSS(м.содержимое[файлCSS]);
+        }
+    }
+    // Функциональность.
     окно.плавно = new ПлавноОтобразитьСкрыть(окно);
+
     return окно;
 };
 

🎛️.css

@@ -0,0 +1,16 @@
+#окно-управления
+{
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+}
+
+#кнопка-раскладки-отобразить
+{
+    position: fixed;
+    right: 0;
+    bottom: 0;
+    margin: 1em;
+}

🎛️.html

@@ -0,0 +1 @@
+<a id="кнопка-раскладки-отобразить" uk-icon="icon: thumbnails; ratio: 2"></a>

🎞️.css

@@ -0,0 +1,10 @@
+#окно-подложка
+{
+    position: fixed;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    background-color: white;
+    pointer-events: none;
+}

🎬.js

@@ -1,11 +1,91 @@
-СоздатьОкнаМаджонга = мир =>
+СкрытьОкноУправления = мир =>
 {
-    /*
-    мир.уведомить("надо создать окно управления");
-    мир.уведомить("надо создать окно раскладок");
-    мир.уведомить("надо создать окно тем");
-    мир.уведомить("надо создать окно окончания");
-    */
+    мир.окноУправления.плавно.скрыть();
+};
+
+
+// // // //
+
+
+ОтобразитьОкноУправления = мир =>
+{
+    мир.окноУправления.плавно.отобразить();
+};
+
+
+// // // //
+
+
+СкрытьОкноПодложку = мир =>
+{
+    мир.окноПодложка.плавно.скрыть();
+};
+
+
+// // // //
+
+
+ОтобразитьОкноПодложку = мир =>
+{
+    мир.окноПодложка.плавно.отобразить();
+};
+
+
+// // // //
+
+
+СкрытьОкноРаскладок = мир =>
+{
+    мир.окноРаскладок.плавно.скрыть();
+};
+
+
+// // // //
+
+
+ОтобразитьОкноРаскладок = мир =>
+{
+    мир.окноРаскладок.плавно.отобразить();
+};
+
+
+// // // //
+
+
+СоздатьОкноРаскладок = мир =>
+{
+    мир.окноРаскладок = создатьОкно(мир, "окно-раскладки", "/📍.html", "/📍.css");
+    мир.таблицаОкнаРаскладок = new Таблица("окно-раскладки-список");
+    $("#кнопка-раскладки-скрыть").click(function() {
+        мир.уведомить("кнопка раскладки скрыть");
+    });
+};
+
+
+// // // //
+
+
+СоздатьОкноПодложку = мир =>
+{
+    мир.окноПодложка = создатьОкно(мир, "окно-подложка", null, "/🎞️.css")
+    мир.окноПодложка.плавно = new ПлавноОтобразитьСкрыть(
+        мир.окноПодложка,
+        {
+            "прозрачность": 0.5,
+        }
+    );
+};
+
+
+// // // //
+
+
+СоздатьОкноУправления = мир =>
+{
+    мир.окноУправления = создатьОкно(мир, "окно-управления", "/🎛️.html", "/🎛️.css")
+    $("#кнопка-раскладки-отобразить").click(function() {
+        мир.уведомить("кнопка раскладки отобразить");
+    });;
 };
 
 

🎬.череда

@@ -1,3 +1,14 @@
-#ручной пуск
-#    задать стили морды маджонга
-#    создать окна маджонга
+ручной пуск
+    задать стили морды маджонга
+    создать окно управления
+    создать окно подложку
+    создать окно раскладок
+    
+кнопка раскладки отобразить
+    отобразить окно подложку
+    отобразить окно раскладок
+    скрыть окно управления
+кнопка раскладки скрыть
+    скрыть окно подложку
+    скрыть окно раскладок
+    отобразить окно управления

📍.css

@@ -0,0 +1,16 @@
+#окно-раскладки
+{
+    position: fixed;
+    left: 1em;
+    top: 1em;
+    bottom: 1em;
+    right: 1em;
+}
+
+#кнопка-раскладки-скрыть
+{
+    position: fixed;
+    right: 0;
+    bottom: 0;
+    margin: 1em;
+}

📍.html

@@ -4,6 +4,6 @@
     <span class="uk-text-large">Layouts</span>
 </center>
 <div class="прокрутка ширина-по-содержимому">
-    <table id="окна-раскладки-список" class="uk-table uk-table-divider"></table>
+    <table id="окно-раскладки-список" class="uk-table uk-table-divider"></table>
 </div>
 <a id="кнопка-раскладки-скрыть" uk-icon="icon: close; ratio: 2"></a>

📖.js

@@ -0,0 +1,4 @@
+ОтобразитьОкноУправления = мир =>
+{
+    мир.окноУправления.плавно.отобразить();
+}