This commit is contained in:
He4eT 2017-05-07 21:14:43 +05:00
commit ec2b5e02c6
3 changed files with 56 additions and 32 deletions

View file

@ -4,6 +4,10 @@
100% { opacity: 1; } 100% { opacity: 1; }
} }
* {
outline: none;
}
html, body { html, body {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -23,11 +27,13 @@ body {
.wrap { .wrap {
animation: load 0.4s ease-in; animation: load 0.4s ease-in;
font-family: monospace;
padding: 10vh; padding: 10vh;
background-color: #fff; background-color: #fff;
background-color: #424242; background-color: #424242;
box-shadow: 0 0 6vh 0.5vh #ff3000; box-shadow: 0 0 6vh 0.5vh #ff3000;
border: 2px solid #ffa52e; border: 2px solid #ffa52e;
color: orange;
} }
.logo { .logo {
@ -81,7 +87,6 @@ body {
font-size: 2rem; font-size: 2rem;
background-color: #616161; background-color: #616161;
color: #ffa52e; color: #ffa52e;
font-family: monospace;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
text-shadow: #ff3000 0px 0px 10px; text-shadow: #ff3000 0px 0px 10px;
@ -96,8 +101,8 @@ ul {
.data { .data {
background-color: inherit; background-color: inherit;
line-height: 2.5vh; /*line-height: 2.5vh;
font-size: 1.5rem; font-size: 1.5rem;*/
color: orange; color: orange;
border: none; border: none;
} }
@ -107,12 +112,28 @@ ul {
padding: 2vh 3vh; padding: 2vh 3vh;
color: orange; color: orange;
text-align: center; text-align: center;
font-size: 2rem;
cursor: pointer; cursor: pointer;
} }
.start:hover { .start:hover {
border-color: red; border-color: red;
color: red; color: red;
text-align: center; }
.slot-wrap {
overflow: hidden;
}
.welcome {
display: flex;
flex-direction: row;
flex: 0 1 0 0;
}
.welcome .description {
margin-right: 5rem;
}
.welcome .settimgs {
} }

View file

@ -2,41 +2,44 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Init Slot Machine</title> <title>BAD BAR Slots</title>
<link rel="stylesheet" href="css/style.css" type='text/css'> <link rel="stylesheet" href="css/style.css" type='text/css'>
</head> </head>
<body> <body>
<div class="wrap"> <div class="wrap welcome">
<textarea name="" class="data" cols="20" rows="24">{"number": <div class="description">
<div class="logo">
<img src="img/logo.svg" alt="">
</div>
</div>
<div class="settings">
<textarea name="" class="data" cols="20" rows="20" autofocus="">{"number":
3 3
,"items": [ ,"items": [
"Водка",
"Джин", "Водка",
"Тоник",
"Гренадин",
"Пусиджус",
"Сопли", "Сопли",
"Блю кюрасао", "Пусиджус",
"Яблочный",
"Апельсиновый",
"Вишнёвый",
"Ничего"]}</textarea> "Ничего"]}</textarea>
<div class="start"> <div class="start">
OK Поехали!
</div> </div>
</div> </div>
</div>
<form action="slots.html" method="get">
<input type="hidden" name='params' class="params">
</form>
<script src="js/jquery.min.js"></script> <script src="js/jquery.min.js"></script>
<script> <script>
$(".start").on('click', () => { $(".start").on('click', () => {
try { try {
let data = JSON.parse($(".data").val()) let data = JSON.parse($(".data").val())
let params = encodeURI(JSON.stringify(data)) let params = encodeURIComponent(JSON.stringify(data))
let newUrl = location.href.replace("index.html", "slots.html") $('.params').val(params)
location.href = newUrl + "?" + params $('form').submit()
} catch (e) { } catch (e) {
alert(e) alert(e)
} }

View file

@ -2,8 +2,7 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Slot Machine</title> <title>BAD BAR Slots</title>
<link rel="stylesheet" href="css/style.css" type='text/css'> <link rel="stylesheet" href="css/style.css" type='text/css'>
</head> </head>
@ -12,19 +11,21 @@
<div class="logo"> <div class="logo">
<img src="img/logo.svg" alt=""> <img src="img/logo.svg" alt="">
</div> </div>
<div class="slot-wrap">
<ul class="slot"> <ul class="slot">
<!-- <li>Гренадин</li>
<li>Пусиджус</li>
<li>Сопли</li> -->
</ul> </ul>
</div> </div>
</div>
<script src="js/jquery.min.js"></script> <script src="js/jquery.min.js"></script>
<!-- <script src="js/jquery.easing.1.3.js"></script> --> <!-- <script src="js/jquery.easing.1.3.js"></script> -->
<script src="js/jquery.jSlots.min.js"></script> <script src="js/jquery.jSlots.min.js"></script>
<script> <script>
let params = location.search.substr(1) let params = location.search.split('=')[1]
let data = JSON.parse(decodeURI(params)) let data = JSON.parse(
decodeURIComponent(
decodeURIComponent(params)
))
let items = data.items let items = data.items
.reduce((sum, cur) => sum + `<li>${cur}</li>`, '') .reduce((sum, cur) => sum + `<li>${cur}</li>`, '')
@ -41,7 +42,6 @@
spinner : '#playNormal', spinner : '#playNormal',
onStart: playSound, onStart: playSound,
time : 6000, time : 6000,
// winnerNumber : 7
}); });
</script> </script>