Compare commits

9 Commits
master ... dev

4 changed files with 422 additions and 0 deletions

239
маджонг_2.0.0.html Normal file

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,58 @@
function showSplash()
{
var html =
`
<div id="mj-splash-body">
<center>
<h1 id="mj-splash-title">Маджонг</h1>
<strong>2.0.0</strong>
<p>Среда разработки</p>
</center>
</div>
`;
var css =
`
#mj-splash-title
{
font: bold 4em serif;
}
#mj-splash-body
{
position: absolute;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
pointer-events: none;
}
#mj-splash
{
opacity: 1;
background-color: white;
animation: mj-splash-fade-out 1s ease;
animation-fill-mode: forwards;
}
@keyframes mj-splash-fade-out
{
0%
{
opacity: 1;
}
60%
{
opacity: 1;
}
100%
{
opacity: 0;
}
}
`;
var screen = addScreen("mj-splash", html, css);
screen.onanimationend = function(){
document.body.removeChild(screen);
};
}
var показатьЗаставку = showSplash;
when(murom.modeEditor, showSplash);

View File

@@ -0,0 +1,96 @@
var скрытьНастройки = new Уведомитель();
var hideSettings = скрытьНастройки;
function создатьЭкранНастроек()
{
var html =
`
<p>Настройки</p>
<div class="uk-container">
<ul class="uk-child-width-expand" uk-tab>
<li class="uk-active"><a>Раскладка</a></li>
<li><a>Тема</a></li>
</ul>
<ul class="uk-switcher uk-margin">
<li>
<div id="мж-настройки-раскладки" class="uk-panel uk-panel-scrollable uk-width-1-3">
<ul class="uk-list">
<li>Раскладка-1</li>
<li>Раскладка-2</li>
<li>Раскладка-3</li>
<li>Раскладка-4</li>
<li>Раскладка-5</li>
<li>Раскладка-6</li>
<li>Раскладка-7</li>
<li>Раскладка-8</li>
<li>Раскладка-9</li>
<li>Раскладка-10</li>
<li>Раскладка-11</li>
<li>Раскладка-12</li>
</ul>
</div>
</li>
<li>
<div class="uk-child-width-1-2@s" uk-grid>
<div>
<div class="uk-card uk-card-default uk-card-small uk-card-body">
<h3 class="uk-card-title">Small</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
<div>
<div class="uk-card uk-card-default uk-card-large uk-card-body">
<h3 class="uk-card-title">Large</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
</div>
</li>
</ul>
</div>
<button id="мж-настройки-скрыть" class="uk-close-large" type="button" uk-close></button>
`;
var css =
`
#мж-настройки
{
background-color: white;
}
#мж-настройки-скрыть
{
position: absolute;
left: 1.5em;
bottom: 1.5em;
}
#мж-настройки-раскладки
{
height: 50%;
}
`;
var экран = добавитьЭкран("мж-настройки", html, css);
экран.hidden = true;
var скрыть = эл("мж-настройки-скрыть").onclick = function(){
скрытьНастройки.уведомить();
};
}
function показатьЭкранНастроек()
{
var экран = эл("мж-настройки");
экран.hidden = false;
экран.classList.add("uk-animation-fade", "uk-animation-fast");
}
function скрытьЭкранНастроек()
{
var экран = эл("мж-настройки");
экран.className = "";
экран.hidden = true;
}
при(показатьНастройки, показатьЭкранНастроек);
при(скрытьНастройки, скрытьЭкранНастроек);
при(муром.режимПросмотра, создатьЭкранНастроек);

View File

@@ -0,0 +1,29 @@
var показатьНастройки = new Уведомитель();
var showSettings = показатьНастройки;
function создатьЭкранОсновной()
{
var html =
`
<p>Основной</p>
<a id="мж-основной-настройки" class="uk-icon-button" uk-icon="cog"></a>
`;
var css =
`
#мж-основной-настройки
{
position: absolute;
bottom: 1em;
left: 1em;
}
`;
добавитьЭкран("мж-основной", html, css);
эл("мж-основной-настройки").onclick = function(){
показатьНастройки.уведомить();
};
}
var createScreenMain = создатьЭкранОсновной;
при(муром.режимПросмотра, создатьЭкранОсновной);