Akamaru/PonyWave-Tools
1
0
Fork 0
Code Issues Activity

Solitaire: Man kann jetzt aufgeben

Browse Source
This commit is contained in:
Akamaru
2025-03-05 14:22:38 +01:00
parent 06cd8e5e83
commit dc2b59c282
1 changed files with 49 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
solitaire/index.html
View File

@ -326,6 +326,21 @@
.modal.show .modal-content { .modal.show .modal-content {
animation: fadeIn 0.3s ease-out; animation: fadeIn 0.3s ease-out;
} }
.modal-buttons {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 20px;
}
.give-up-btn {
background: #e74c3c;
}
.give-up-btn:hover {
background: #c0392b;
}
</style> </style>
</head> </head>
<body> <body>
@ -343,6 +358,7 @@
<button onclick="newGame()">Neues Spiel</button> <button onclick="newGame()">Neues Spiel</button>
<button onclick="showHighscores()">Highscores</button> <button onclick="showHighscores()">Highscores</button>
<button onclick="takeScreenshot()">Screenshot</button> <button onclick="takeScreenshot()">Screenshot</button>
<button onclick="showGiveUpConfirmation()" class="give-up-btn">Aufgeben</button>
</div> </div>
</div> </div>
<div class="game-board" id="gameBoard"> <div class="game-board" id="gameBoard">
@ -372,6 +388,7 @@
<li>Foundation-Stapel werden mit Assen begonnen und in aufsteigender Reihenfolge mit gleicher Farbe aufgebaut</li> <li>Foundation-Stapel werden mit Assen begonnen und in aufsteigender Reihenfolge mit gleicher Farbe aufgebaut</li>
<li>Durch Klick auf den Kartenstapel werden neue Karten aufgedeckt</li> <li>Durch Klick auf den Kartenstapel werden neue Karten aufgedeckt</li>
<li>Wenn der Kartenstapel leer ist, können die Karten vom Ablagestapel wieder verwendet werden</li> <li>Wenn der Kartenstapel leer ist, können die Karten vom Ablagestapel wieder verwendet werden</li>
<li>Bei vorzeitiger Aufgabe des Spiels werden die erspielten Punkte halbiert</li>
</ul> </ul>
<button onclick="closeRules()">Verstanden</button> <button onclick="closeRules()">Verstanden</button>
</div> </div>
@ -386,6 +403,19 @@
</div> </div>
</div> </div>
<div class="modal" id="giveUpModal">
<div class="modal-content">
<h2>Spiel aufgeben?</h2>
<p>Möchtest du das Spiel wirklich aufgeben?</p>
<p style="color: #e74c3c; margin-top: 10px;">Achtung: Bei Aufgabe werden deine Punkte halbiert!</p>
<p style="margin-top: 10px;">Der finale Punktestand wird als Highscore gespeichert.</p>
<div class="modal-buttons">
<button onclick="giveUp()">Ja, aufgeben</button>
<button onclick="closeGiveUpModal()">Nein, weiterspielen</button>
</div>
</div>
</div>
<script> <script>
// Spielvariablen // Spielvariablen
let score = 0; let score = 0;
@ -728,7 +758,7 @@
list.innerHTML = highscores.map((score, index) => ` list.innerHTML = highscores.map((score, index) => `
<div class="highscore-entry"> <div class="highscore-entry">
<span>${index + 1}. ${score.score} Punkte</span> <span>${index + 1}. ${score.score} Punkte</span>
<span>${Math.floor(score.time / 60)}:${(score.time % 60).toString().padStart(2, '0')} - ${score.moves} Züge</span> <span>&nbsp;&nbsp;${Math.floor(score.time / 60)}:${(score.time % 60).toString().padStart(2, '0')} - ${score.moves} Züge</span>
</div> </div>
`).join(''); `).join('');
@ -946,6 +976,24 @@
} }
} }
function showGiveUpConfirmation() {
const modal = document.getElementById('giveUpModal');
modal.classList.add('show');
}
function closeGiveUpModal() {
document.getElementById('giveUpModal').classList.remove('show');
}
function giveUp() {
clearInterval(timerInterval);
const finalScore = Math.floor(score / 2); // Halbiere den Score beim Aufgeben
updateHighscores(finalScore);
closeGiveUpModal();
showHighscores();
newGame();
}
// Spiel initialisieren // Spiel initialisieren
newGame(); newGame();
showRules(); // Zeige Spielregeln beim Start showRules(); // Zeige Spielregeln beim Start