diff --git a/0000 b/0000 index 603a892..9c33842 100644 --- a/0000 +++ b/0000 @@ -2,6 +2,8 @@ 1.0.0 https://git.opengamestudio.org/mahjong/mahjong-ui +x /меню|menu.js +/меню|menu.череда x /окончание|ending.js /окончание|ending.череда x /приветствие|welcome.js diff --git a/меню|menu.js b/меню|menu.js new file mode 100644 index 0000000..04bcf92 --- /dev/null +++ b/меню|menu.js @@ -0,0 +1,120 @@ + + +// // // // + + +ПлавноПоказатьОкноМеню = мир => +{ + const css = ` + +#${мир.окна.меню.указатель} +{ + opacity: 0; + animation: ${мир.окна.меню.указатель}ПлавноПоказать 0.5s ease; + animation-fill-mode: forwards; +} + + `; + мир.окна.меню.анимация.innerHTML = css; + мир.окна.меню.элемент.style.display = "block"; +}; + + +// // // // + + +ПодготовитьАнимациюОкнаМеню = мир => +{ + мир.окна.меню.анимация = document.createElement("style"); + document.head.appendChild(мир.окна.меню.анимация); +}; + + +// // // // + + +ЗадатьВидИАнимациюОкнаМеню = мир => +{ + /* +#${мир.окна.меню.указатель}-тело +{ + position: absolute; + left: 50%; + top: 50%; + transform: translateX(-50%) translateY(-50%); +} + */ + const css = ` + +#${мир.окна.меню.указатель} +{ + 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 = `Меню`; +/* +
+
+ + +
+

+ +

+
+
+ + `; + */ + + var окно = document.createElement("div"); + окно.id = мир.окна.меню.указатель; + окно.innerHTML = html; + окно.style.display = "none"; + мир.окна.меню.элемент = окно; + мир.окна.управление.элемент.appendChild(окно); +}; \ No newline at end of file diff --git a/меню|menu.череда b/меню|menu.череда new file mode 100644 index 0000000..3aa6829 --- /dev/null +++ b/меню|menu.череда @@ -0,0 +1,6 @@ +надо создать окно меню + создать окно меню + задать вид и анимацию окна меню + подготовить анимацию окна меню +кнопка меню + плавно показать окно меню \ No newline at end of file diff --git a/пуск|run.js b/пуск|run.js index a5eac5d..f5df8bf 100644 --- a/пуск|run.js +++ b/пуск|run.js @@ -6,6 +6,7 @@ СоздатьОкнаМаджонга = мир => { мир.уведомить("надо создать окно управления"); + мир.уведомить("надо создать окно меню"); мир.уведомить("надо создать окно приветствия"); мир.уведомить("надо создать окно окончания"); }; \ No newline at end of file diff --git a/управление|controls.js b/управление|controls.js index b18bfbb..80960be 100644 --- a/управление|controls.js +++ b/управление|controls.js @@ -3,6 +3,29 @@ // // // // +СоздатьКнопкуМеню = мир => +{ + var меню = document.createElement("div"); + меню.innerHTML = ` + + `; + меню.style = ` +position: fixed; +left: 0; +top: 0; +margin: 0.5em; + `; + мир.окна.управление.элемент.appendChild(меню); + + $(`#открыть-меню`).click(function() { + мир.уведомить("кнопка меню"); + }); +}; + + +// // // // + + СообщитьТекущееЗначениеМасштаба = мир => { var масштаб = мир.масштаб * 100; diff --git a/управление|controls.череда b/управление|controls.череда index 5fc8022..582cd53 100644 --- a/управление|controls.череда +++ b/управление|controls.череда @@ -1,6 +1,7 @@ надо создать окно управления создать окно управления создать элементы управления масштабом + создать кнопку меню выбрали раскладку показать окно управления кнопка увеличения масштаба