sunmeat · August 31, 2025 12:11
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html lang="">
 <head>
  <meta charset="UTF-8">
  <title>Ігровий автомат</title>
  <style>
    body {
      background-color: #9acd32;
      font-family: sans-serif;
      text-align: center;
      margin: 0;
      padding: 0;
    }
    .message {
      margin: 20px auto;
      padding: 20px;
      width: 600px;
      background-color: #AAAACC;
      border: 2px solid #8888AA;
      font-size: 20px;
      color: purple;
    }
    .bandit-container {
      display: flex;
      justify-content: center;
      gap: 10px;
      margin-bottom: 20px;
    }
    .slot {
      width: 100px;
      height: 100px;
      border: 3px solid #555;
      background-color: #ccc;
      font-size: 28px;
      font-weight: bold;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s;
      border-radius: 10px;
    }
    .arm {
      padding: 10px 20px;
      font-size: 16px;
      background-color: #9999BB;
      color: #003399;
      border: 2px solid #777799;
      cursor: pointer;
      border-radius: 8px;
    }
    .arm:disabled {
      background-color: #bbb;
      color: #888;
      cursor: not-allowed;
    }
    .tokens {
      margin-top: 10px;
      font-size: 18px;
    }
  </style>
 </head>
 <body>

 <div class="message" id="message">Автомат</div>

 <div class="bandit-container">
  <div class="slot" id="slot0">❓</div>
  <div class="slot" id="slot1">❓</div>
  <div class="slot" id="slot2">❓</div>
 </div>

 <button class="arm" id="spinBtn">SPIN</button>
 <div class="tokens">Фішки: <span id="tokens">5</span></div>

 <script>
  const choices = ["🍒", "🍌", "🍏", "🍒", "🍋", "🍒", "🍌", "7️⃣", "🍌", "🍋", "🍏", "777", "💎", "🍏", "🍋"];
  const slots = [document.getElementById('slot0'), document.getElementById('slot1'), document.getElementById('slot2')];
  const spinBtn = document.getElementById('spinBtn');
  const message = document.getElementById('message');
  const tokensDisplay = document.getElementById('tokens');
  let tokens = 5;

  function randomChoice() {
    return choices[Math.floor(Math.random() * choices.length)];
  }

  function spin() {
    if (tokens <= 0) {
      alert("Нема фішек!");
      return;
    }
    tokens--;
    updateTokens();
    spinBtn.disabled = true;
    message.textContent = "Крутимо...";

    let results = [];

    let delay = 0;
    for (let i = 0; i < slots.length; i++) {
      setTimeout(() => {
        let finalSymbol = randomChoice();
        results[i] = finalSymbol;
        animateSlot(slots[i], finalSymbol);
        if (i === slots.length - 1) {
          setTimeout(() => {
            payout(results);
            spinBtn.disabled = false;
          }, 600);
        }
      }, delay);
      delay += 300;
    }
  }

  function animateSlot(slot, finalSymbol) {
    let count = 0;
    const interval = setInterval(() => {
      slot.textContent = randomChoice();
      if (count++ > 10) {
        clearInterval(interval);
        slot.textContent = finalSymbol;
      }
    }, 50);
  }

  function updateTokens() {
    tokensDisplay.textContent = tokens;
  }

  function payout(result) {
    const [a, b, c] = result;

    let win = 0;
    let cherries = result.filter(s => s === "🍒").length;
    let apples = result.filter(s => s === "🍏").length;
    let bananas = result.filter(s => s === "🍌").length;
    let sevens = result.filter(s => s === "7️⃣").length;
    let triples = result.filter(s => s === "777").length;
    let bars = result.filter(s => s === "💎").length;

    if (bars === 3) win = 500;
    else if (triples === 3) win = 250;
    else if (sevens === 3) win = 125;
    else if (triples === 2 && sevens === 1) win = 50;
    else if (triples === 1 && sevens === 2) win = 40;
    else if (cherries === 3) win = 25;
    else if (apples === 3 || bananas === 3) win = 25;
    else if (cherries === 2) win = 15;
    else if ((apples === 2 || bananas === 2) && cherries === 1) win = 25;
    else if (triples === 2 || sevens === 2) win = 35;
    else if (cherries === 1) win = 1;

    if (win > 0) {
      tokens += win;
      message.textContent = `ВИГРАВ ${win} фішек! 🎉`;
    } else {
      message.textContent = `Пусто. Хай щастить наступного разу.`;
    }
    updateTokens();
  }

  spinBtn.addEventListener('click', spin);
 </script>

 </body>
 </html>
	<!DOCTYPE html>
	<html lang="">
	<head>
	<meta charset="UTF-8">
	<title>Ігровий автомат</title>
	<style>
	body {
	background-color: #9acd32;
	font-family: sans-serif;
	text-align: center;
	margin: 0;
	padding: 0;
	}
	.message {
	margin: 20px auto;
	padding: 20px;
	width: 600px;
	background-color: #AAAACC;
	border: 2px solid #8888AA;
	font-size: 20px;
	color: purple;
	}
	.bandit-container {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-bottom: 20px;
	}
	.slot {
	width: 100px;
	height: 100px;
	border: 3px solid #555;
	background-color: #ccc;
	font-size: 28px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s;
	border-radius: 10px;
	}
	.arm {
	padding: 10px 20px;
	font-size: 16px;
	background-color: #9999BB;
	color: #003399;
	border: 2px solid #777799;
	cursor: pointer;
	border-radius: 8px;
	}
	.arm:disabled {
	background-color: #bbb;
	color: #888;
	cursor: not-allowed;
	}
	.tokens {
	margin-top: 10px;
	font-size: 18px;
	}
	</style>
	</head>
	<body>

	<div class="message" id="message">Автомат</div>

	<div class="bandit-container">
	<div class="slot" id="slot0">❓</div>
	<div class="slot" id="slot1">❓</div>
	<div class="slot" id="slot2">❓</div>
	</div>

	<button class="arm" id="spinBtn">SPIN</button>
	<div class="tokens">Фішки: <span id="tokens">5</span></div>

	<script>
	const choices = ["🍒", "🍌", "🍏", "🍒", "🍋", "🍒", "🍌", "7️⃣", "🍌", "🍋", "🍏", "777", "💎", "🍏", "🍋"];
	const slots = [document.getElementById('slot0'), document.getElementById('slot1'), document.getElementById('slot2')];
	const spinBtn = document.getElementById('spinBtn');
	const message = document.getElementById('message');
	const tokensDisplay = document.getElementById('tokens');
	let tokens = 5;

	function randomChoice() {
	return choices[Math.floor(Math.random() * choices.length)];
	}

	function spin() {
	if (tokens <= 0) {
	alert("Нема фішек!");
	return;
	}
	tokens--;
	updateTokens();
	spinBtn.disabled = true;
	message.textContent = "Крутимо...";

	let results = [];

	let delay = 0;
	for (let i = 0; i < slots.length; i++) {
	setTimeout(() => {
	let finalSymbol = randomChoice();
	results[i] = finalSymbol;
	animateSlot(slots[i], finalSymbol);
	if (i === slots.length - 1) {
	setTimeout(() => {
	payout(results);
	spinBtn.disabled = false;
	}, 600);
	}
	}, delay);
	delay += 300;
	}
	}

	function animateSlot(slot, finalSymbol) {
	let count = 0;
	const interval = setInterval(() => {
	slot.textContent = randomChoice();
	if (count++ > 10) {
	clearInterval(interval);
	slot.textContent = finalSymbol;
	}
	}, 50);
	}

	function updateTokens() {
	tokensDisplay.textContent = tokens;
	}

	function payout(result) {
	const [a, b, c] = result;

	let win = 0;
	let cherries = result.filter(s => s === "🍒").length;
	let apples = result.filter(s => s === "🍏").length;
	let bananas = result.filter(s => s === "🍌").length;
	let sevens = result.filter(s => s === "7️⃣").length;
	let triples = result.filter(s => s === "777").length;
	let bars = result.filter(s => s === "💎").length;

	if (bars === 3) win = 500;
	else if (triples === 3) win = 250;
	else if (sevens === 3) win = 125;
	else if (triples === 2 && sevens === 1) win = 50;
	else if (triples === 1 && sevens === 2) win = 40;
	else if (cherries === 3) win = 25;
	else if (apples === 3 \|\| bananas === 3) win = 25;
	else if (cherries === 2) win = 15;
	else if ((apples === 2 \|\| bananas === 2) && cherries === 1) win = 25;
	else if (triples === 2 \|\| sevens === 2) win = 35;
	else if (cherries === 1) win = 1;

	if (win > 0) {
	tokens += win;
	message.textContent = `ВИГРАВ ${win} фішек! 🎉`;
	} else {
	message.textContent = `Пусто. Хай щастить наступного разу.`;
	}
	updateTokens();
	}

	spinBtn.addEventListener('click', spin);
	</script>

	</body>
	</html>