From 010f25f882171be20113e76bd28722aab5be790f Mon Sep 17 00:00:00 2001
From: jahlib <60108339+jahlib@users.noreply.github.com>
Date: Tue, 11 Nov 2025 18:48:54 +0300
Subject: [PATCH] some changes
---
client/game.js | 127 ++++++++++++++++++++++++++++++-
client/index.html | 57 +++++++++++++-
client/night-mode.css | 169 ++++++++++++++++++++++++++++--------------
client/style.css | 150 ++++++++++++++++++++++++++++++++++++-
4 files changed, 441 insertions(+), 62 deletions(-)
diff --git a/client/game.js b/client/game.js
index b0997e2..892685e 100644
--- a/client/game.js
+++ b/client/game.js
@@ -181,8 +181,28 @@ class CardGame {
if (this.nightModeEnabled) {
document.body.classList.add('night-mode');
+ // Показываем настройку белых мастей
+ if (this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = 'flex';
+ }
+ // Восстанавливаем состояние белых мастей если оно было сохранено
+ const savedWhiteSuits = localStorage.getItem('whiteSuitsEnabled');
+ if (savedWhiteSuits === 'true') {
+ this.whiteSuitsEnabled = true;
+ if (this.whiteSuitsToggle) {
+ this.whiteSuitsToggle.checked = true;
+ }
+ document.body.classList.add('white-suits');
+ }
} else {
document.body.classList.remove('night-mode');
+ // Скрываем настройку белых мастей
+ if (this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = 'none';
+ }
+ // Выключаем белые масти
+ this.whiteSuitsEnabled = false;
+ document.body.classList.remove('white-suits');
}
this.updateNightModeButton();
@@ -194,8 +214,28 @@ class CardGame {
if (this.nightModeEnabled) {
document.body.classList.add('night-mode');
+ // Показываем настройку белых мастей
+ if (this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = 'flex';
+ }
+ // Восстанавливаем состояние белых мастей если оно было сохранено
+ const savedWhiteSuits = localStorage.getItem('whiteSuitsEnabled');
+ if (savedWhiteSuits === 'true') {
+ this.whiteSuitsEnabled = true;
+ if (this.whiteSuitsToggle) {
+ this.whiteSuitsToggle.checked = true;
+ }
+ document.body.classList.add('white-suits');
+ }
} else {
document.body.classList.remove('night-mode');
+ // Скрываем настройку белых мастей
+ if (this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = 'none';
+ }
+ // Выключаем белые масти
+ this.whiteSuitsEnabled = false;
+ document.body.classList.remove('white-suits');
}
// Синхронизируем с переключателем в настройках
@@ -222,6 +262,32 @@ class CardGame {
if (moonIcon) moonIcon.style.display = 'inline';
}
}
+
+ toggleWhiteSuits() {
+ this.whiteSuitsEnabled = this.whiteSuitsToggle.checked;
+ localStorage.setItem('whiteSuitsEnabled', this.whiteSuitsEnabled);
+
+ if (this.whiteSuitsEnabled) {
+ document.body.classList.add('white-suits');
+ } else {
+ document.body.classList.remove('white-suits');
+ }
+ }
+
+ setCardBackColor(color) {
+ this.cardBackColor = color;
+ localStorage.setItem('cardBackColor', color);
+ document.body.setAttribute('data-card-back', color);
+
+ // Обновляем выделение в селекторе
+ document.querySelectorAll('.card-back-option').forEach(opt => {
+ opt.classList.remove('selected');
+ });
+ const selectedOption = document.querySelector(`.card-back-option[data-back="${color}"]`);
+ if (selectedOption) {
+ selectedOption.classList.add('selected');
+ }
+ }
showAlert(message) {
if (!this.alertModal || !this.alertText) return;
@@ -279,8 +345,18 @@ class CardGame {
goToLobby() {
this.clearLocalStorage();
+
+ // Закрываем WebSocket соединение перед перезагрузкой
+ if (this.ws && this.ws.readyState === WebSocket.OPEN) {
+ this.ws.close();
+ }
+
window.history.pushState({}, '', '/');
- location.reload();
+
+ // Небольшая задержка чтобы сообщение успело отправиться
+ setTimeout(() => {
+ location.reload();
+ }, 40);
}
initElements() {
@@ -369,6 +445,8 @@ class CardGame {
this.animationsToggle = document.getElementById('animations-toggle');
this.proModeToggle = document.getElementById('pro-mode-toggle');
this.nightModeToggle = document.getElementById('night-mode-toggle');
+ this.whiteSuitsToggle = document.getElementById('white-suits-toggle');
+ this.whiteSuitsSetting = document.getElementById('white-suits-setting');
this.logToggle = document.getElementById('log-toggle');
// Leave game button and modal
@@ -397,6 +475,24 @@ class CardGame {
document.body.classList.add('night-mode');
}
+ // Инициализируем белые масти
+ const savedWhiteSuits = localStorage.getItem('whiteSuitsEnabled');
+ this.whiteSuitsEnabled = savedWhiteSuits === 'true';
+
+ // Показываем настройку белых мастей только если ночной режим включен
+ if (this.nightModeEnabled && this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = 'flex';
+ // Применяем белые масти если они были включены
+ if (this.whiteSuitsEnabled) {
+ document.body.classList.add('white-suits');
+ }
+ }
+
+ // Инициализируем цвет рубашки карт
+ const savedCardBack = localStorage.getItem('cardBackColor') || 'gray';
+ this.cardBackColor = savedCardBack;
+ document.body.setAttribute('data-card-back', savedCardBack);
+
// Обновляем иконку кнопки ночного режима
this.updateNightModeButton();
}
@@ -446,6 +542,7 @@ class CardGame {
this.animationsToggle.addEventListener('change', () => this.toggleAnimations());
this.proModeToggle.addEventListener('change', () => this.toggleProMode());
this.nightModeToggle.addEventListener('change', () => this.toggleNightMode());
+ this.whiteSuitsToggle.addEventListener('change', () => this.toggleWhiteSuits());
this.logToggle.addEventListener('change', () => this.toggleLog());
// Leave game button
@@ -509,6 +606,14 @@ class CardGame {
}
});
+ // Card back color selector
+ document.querySelectorAll('.card-back-option').forEach(option => {
+ option.addEventListener('click', (e) => {
+ const backColor = e.currentTarget.dataset.back;
+ this.setCardBackColor(backColor);
+ });
+ });
+
// Rules handlers
this.rulesBtn.addEventListener('click', () => this.openRules());
this.closeRulesBtn.addEventListener('click', () => this.closeRules());
@@ -1180,6 +1285,11 @@ class CardGame {
}
leaveRoom() {
+ // Отправляем сообщение о выходе из комнаты
+ if (this.ws && this.ws.readyState === WebSocket.OPEN) {
+ this.send({ type: 'leave_room' });
+ }
+
// Скрываем блок с ссылкой если он был показан
if (this.inviteLinkBlock) {
this.inviteLinkBlock.style.display = 'none';
@@ -1628,8 +1738,23 @@ class CardGame {
this.animationsToggle.checked = this.animationsEnabled;
this.proModeToggle.checked = this.proModeEnabled;
this.nightModeToggle.checked = this.nightModeEnabled;
+ this.whiteSuitsToggle.checked = this.whiteSuitsEnabled;
this.fullscreenToggle.checked = !!document.fullscreenElement;
+ // Показываем/скрываем настройку белых мастей в зависимости от ночного режима
+ if (this.whiteSuitsSetting) {
+ this.whiteSuitsSetting.style.display = this.nightModeEnabled ? 'flex' : 'none';
+ }
+
+ // Синхронизируем выбранный цвет рубашки
+ document.querySelectorAll('.card-back-option').forEach(opt => {
+ opt.classList.remove('selected');
+ });
+ const selectedOption = document.querySelector(`.card-back-option[data-back="${this.cardBackColor}"]`);
+ if (selectedOption) {
+ selectedOption.classList.add('selected');
+ }
+
// Синхронизируем состояние лога (проверяем есть ли класс hidden)
if (this.gameLog) {
this.logToggle.checked = !this.gameLog.classList.contains('hidden');
diff --git a/client/index.html b/client/index.html
index dedeebb..da06e56 100644
--- a/client/index.html
+++ b/client/index.html
@@ -248,17 +248,24 @@
-
-
-
+
+
+
+
+
+
+
+
+
+
@@ -266,9 +273,18 @@
+
+
+
+
+
+
+
+
+
@@ -418,6 +434,19 @@
+
+
+
🤍 Белые масти
+
+
+
+
📃 Показывать лог
@@ -430,6 +459,28 @@
+
+
+
+
🎴 Цвет рубашки карт
+
+