monad-faucet-test/script.js at main · futreall/monad-faucet-test · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
let score = 0;

// При загрузке сразу генерируем пузырьки (по 20 каждого типа)
for (let i = 0; i < 20; i++) {
  createBubble('whale');
  createBubble('cypherpepe');
  createBubble('lastking');
}

// Функция создания пузырька
function createBubble(type = 'random') {
  const bubble = document.createElement('div');

  // Определяем тип
  if (type === 'random') {
    const bubbleType = Math.random();
    if (bubbleType < 0.33) {
      bubble.classList.add('bubble', 'whale');
    } else if (bubbleType < 0.66) {
      bubble.classList.add('bubble', 'cypherpepe');
    } else {
      bubble.classList.add('bubble', 'lastking');
    }
  } else {
    bubble.classList.add('bubble', type);
  }

  // Случайное начальное положение
  bubble.style.top = `${Math.random() * 80}vh`;
  bubble.style.left = `${Math.random() * 80}vw`;
  document.querySelector('.bubble-container').appendChild(bubble);

  // Случайная скорость
  let deltaX = (Math.random() * 0.89 + 0.44) * (Math.random() > 0.5 ? 1 : -1);
  let deltaY = (Math.random() * 0.89 + 0.44) * (Math.random() > 0.5 ? 1 : -1);

  // Движение
  function moveBubble() {
    let bubbleRect = bubble.getBoundingClientRect();
    let containerRect = document.querySelector('.bubble-container').getBoundingClientRect();

    // Отталкивание от краёв
    if (bubbleRect.left <= containerRect.left) {
      deltaX = Math.abs(deltaX);
    } else if (bubbleRect.right >= containerRect.right) {
      deltaX = -Math.abs(deltaX);
    }
    if (bubbleRect.top <= containerRect.top) {
      deltaY = Math.abs(deltaY);
    } else if (bubbleRect.bottom >= containerRect.bottom) {
      deltaY = -Math.abs(deltaY);
    }

    bubble.style.left = `${bubble.offsetLeft + deltaX}px`;
    bubble.style.top = `${bubble.offsetTop + deltaY}px`;

    if (!bubble.classList.contains('pop')) {
      requestAnimationFrame(moveBubble);
    }
  }
  moveBubble();

  // Клик по пузырьку
  bubble.addEventListener('click', () => {
    bubble.classList.add('pop');

    // Звук и очки
    if (bubble.classList.contains('whale')) {
      playSound('whale_pop.mp3');
      score++;
    } else if (bubble.classList.contains('cypherpepe')) {
      playSound('cypherpepe_pop.mp3');
      score++;
    } else if (bubble.classList.contains('lastking')) {
      playSound('lastking_pop.mp3');
      score++;
    }

    document.getElementById('score').textContent = score;

    // Удаляем и снова создаём пузырёк того же типа
    setTimeout(() => {
      bubble.remove();
      createBubble(type);
    }, 300);
  });
}

// Функция воспроизведения звука
function playSound(soundFile) {
  const audio = new Audio(soundFile);
  audio.play();
}

// Элементы меню
const menu = document.querySelector('.menu');
const startBtn = document.getElementById('startBtn');
const settingsBtn = document.getElementById('settingsBtn');

// Элементы модалки настроек
const settingsModal = document.getElementById('settingsModal');
const closeSettingsBtn = document.getElementById('closeSettingsBtn');

// При нажатии Start — звук + скрыть меню
startBtn.addEventListener('click', () => {
  playSound('whale_pop.mp3');
  menu.style.display = 'none';
});

// При нажатии Settings — звук + показать модалку
settingsBtn.addEventListener('click', () => {
  playSound('whale_pop.mp3');
  settingsModal.style.display = 'block';
});

// Кнопка "Close" в модалке
closeSettingsBtn.addEventListener('click', () => {
  settingsModal.style.display = 'none';
});