Super-Sonic Electronic Genius Mind - Code zu Version 2

Da der Quellcode sicherlich eine gute Ausgangsbasis für die Programmierung ähnlicher Spiele oder für Verbesserungen darstellt: 

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Guess the Code</title>

    <style>

        body {

            font-family: Arial, sans-serif;

            text-align: center;

        }

        h1 {

            margin-top: 50px;

        }

        form {

            margin-top: 20px;

        }

        input[type="text"], input[type="number"] {

            padding: 8px;

            font-size: 16px;

        }

        input[type="submit"] {

            padding: 8px 16px;

            font-size: 16px;

            background-color: #4CAF50;

            color: white;

            border: none;

            cursor: pointer;

        }

        input[type="submit"]:hover {

            background-color: #45a049;

        }

        #feedback {

            margin-top: 20px;

            font-size: 18px;

        }

        #revealButton {

            margin-top: 20px;

            font-size: 16px;

            background-color: #008CBA;

            color: white;

            border: none;

            cursor: pointer;

        }

        #startNewButton {

            margin-top: 20px;

            font-size: 16px;

            background-color: #f44336;

            color: white;

            border: none;

            cursor: pointer;

        }

        #guesses {

            text-align: left;

            font-size: 14px;

            margin-top: 10px;

        }

        #guessForm {

            display: inline-block;

        }

        #instructions {

            margin-top: 20px;

            font-style: italic;

        }

        #inputButtons {

            margin-top: 10px;

        }

    </style>

</head>

<body>

    <form id="inputButtons">

        <label for="mode">Modus:</label>

        <select id="mode">

            <option value="numbers">Zahlen</option>

            <option value="letters">Buchstaben</option>

        </select>

        <label for="codeLength">Codelänge:</label>

        <input type="number" id="codeLength" min="1">

        <input type="submit" value="Start">

    </form>

    <form id="languageForm">

        <label for="language">Sprache:</label>

        <select id="language">

            <option value="de" selected>Deutsch</option>

            <option value="en">English</option>

        </select>

        <input type="submit" value="Change">

    </form>

    <div id="instructions">

        <p>Erlebe eine moderne Interpretation des klassischen Spiels Super-Sonic Electronic Mastermind! Teste deine Fähigkeiten in diesem aufregenden Zahlenspiel, das die traditionelle Codeknackerei auf ein neues Level bringt. Mit der erweiterten Codelänge bietet dieses Spiel eine noch größere Herausforderung für deine Denkfähigkeiten.</p>

        <p>Tüftle an deinen Strategien, um den geheimen Code zu knacken und deine mentale Stärke zu beweisen. Bei jedem Rätsel wirst du Feedback erhalten, das dir hilft, deine nächsten Schritte zu planen. Ein 'richtiger' Tipp bedeutet, dass ein Zeichen an der richtigen Position steht, während ein 'halbrichtiger' Tipp anzeigt, dass ein Zeichen im Code vorkommt, aber an einer anderen Position ist.</p>

        <p>Verbessere deine Logik und dein Problemlösungsvermögen, während du dich durch die verschiedenen Schwierigkeitsstufen arbeitest. Fordere deine Freunde heraus und sieh, wer am besten ist, wenn es darum geht, das ultimative Geheimnis zu enthüllen. Genieße stundenlangen Spaß und Herausforderungen mit diesem modernen Twist des zeitlosen Klassikers!</p>

    </div>

    <div id="gameContainer" style="display: none;">

        <form id="guessForm">

            <label for="guessInput" id="guessLabel">Enter your guess:</label>

            <input type="text" id="guessInput" required>

            <input type="submit" value="Submit Guess">

        </form>

        <div id="feedback"></div>

        <button id="revealButton" onclick="revealSolution()">Reveal Solution</button>

        <button id="startNewButton" onclick="startNewGame()">Start New</button>

        <div id="guesses"></div>

    </div>

 

    <script>

        var secretCode;

        var numDigits;

        var guessCount = 1;

        var language = 'de';

        var mode = 'numbers';

 

        document.getElementById("inputButtons").addEventListener("submit", function(event) {

            event.preventDefault();

            numDigits = document.getElementById("codeLength").value;

            mode = document.getElementById("mode").value;

            startGame();

        });

 

        document.getElementById("languageForm").addEventListener("submit", function(event) {

            event.preventDefault();

            language = document.getElementById("language").value;

            updateLanguage();

        });

 

        function startGame() {

            document.getElementById("instructions").style.display = "none";

            document.getElementById("inputButtons").style.display = "none";

            document.getElementById("languageForm").style.display = "none";

            document.getElementById("gameContainer").style.display = "block";

            secretCode = generateSecretCode(numDigits, mode);

            updateLanguage(); // Update language for game elements

        }

 

        function generateSecretCode(length, mode) {

            var code = "";

            var characters = mode === 'numbers' ? '0123456789' : 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';

            for (var i = 0; i < length; i++) {

                code += characters.charAt(Math.floor(Math.random() * characters.length));

            }

            return code;

        }

 

        function updateLanguage() {

            var instructions = document.getElementById("instructions");

            var guessLabel = document.getElementById("guessLabel");

            var guessSubmit = document.querySelector("#guessForm input[type='submit']");

            var revealButton = document.getElementById("revealButton");

            var startNewButton = document.getElementById("startNewButton");

 

            if (language === 'de') {

                instructions.innerHTML = "<p>Erlebe eine moderne Interpretation des klassischen Spiels Super-Sonic Electronic Mastermind! Teste deine Fähigkeiten in diesem aufregenden Zahlenspiel, das die traditionelle Codeknackerei auf ein neues Level bringt. Mit der erweiterten Codelänge bietet dieses Spiel eine noch größere Herausforderung für deine Denkfähigkeiten.</p><p>Tüftle an deinen Strategien, um den geheimen Code zu knacken und deine mentale Stärke zu beweisen. Bei jedem Rätsel wirst du Feedback erhalten, das dir hilft, deine nächsten Schritte zu planen. Ein 'richtiger' Tipp bedeutet, dass ein Zeichen an der richtigen Position steht, während ein 'halbrichtiger' Tipp anzeigt, dass ein Zeichen im Code vorkommt, aber an einer anderen Position ist.</p><p>Verbessere deine Logik und dein Problemlösungsvermögen, während du dich durch die verschiedenen Schwierigkeitsstufen arbeitest. Fordere deine Freunde heraus und sieh, wer am besten ist, wenn es darum geht, das ultimative Geheimnis zu enthüllen. Genieße stundenlangen Spaß und Herausforderungen mit diesem modernen Twist des zeitlosen Klassikers!</p>";

                guessLabel.textContent = "Gib deinen Tipp ein:";

                guessSubmit.value = "Tipp einreichen";

                revealButton.textContent = "Lösung anzeigen";

                startNewButton.textContent = "Neues Spiel starten";

            } else {

                instructions.innerHTML = "<p>Experience a modern interpretation of the classic game Super-Sonic Electronic Mastermind! Test your skills in this exciting number game that takes traditional code-breaking to a new level. With the extended code length, this game offers an even greater challenge for your thinking skills.</p><p>Tinker with your strategies to crack the secret code and prove your mental strength. With each puzzle, you'll receive feedback to help you plan your next moves. A 'correct' guess means a character is in the right position, while a 'semi-correct' guess indicates a character is in the code but in a different position.</p><p>Improve your logic and problem-solving abilities as you work through the various difficulty levels. Challenge your friends and see who's the best when it comes to revealing the ultimate secret. Enjoy hours of fun and challenges with this modern twist on the timeless classic!</p>";

                guessLabel.textContent = "Enter your guess:";

                guessSubmit.value = "Submit Guess";

                revealButton.textContent = "Reveal Solution";

                startNewButton.textContent = "Start New";

            }

        }

 

        function playSuccessSound() {

            var audioContext = new (window.AudioContext || window.webkitAudioContext)();

            var oscillator = audioContext.createOscillator();

            oscillator.type = 'sine';

            oscillator.frequency.setValueAtTime(1000, audioContext.currentTime);

            oscillator.connect(audioContext.destination);

            oscillator.start();

            setTimeout(function() {

                oscillator.stop();

            }, 1500); // Der Ton wird für 1,5 Sekunden abgespielt

        }

 

        function evaluateGuess() {

            var guess = document.getElementById("guessInput").value.toUpperCase();

            if (guess.length !== parseInt(numDigits)) {

                alert(language === 'de' ? "Die Eingabe muss " + numDigits + " Zeichen lang sein." : "The input must be " + numDigits + " characters long.");

                return;

            }

 

            var correctCount = 0;

            var semiCorrectCount = 0;

            var secretCodeCharacters = Array.from(secretCode);

            var guessCharacters = Array.from(guess);

 

            // Count correct characters

            for (var i = 0; i < parseInt(numDigits); i++) {

                if (guessCharacters[i] === secretCodeCharacters[i]) {

                    correctCount++;

                    // Mark the correct character in both arrays as 'null' to avoid counting it again

                    secretCodeCharacters[i] = null;

                    guessCharacters[i] = null;

                }

            }

 

            // Count semi-correct characters

            for (var i = 0; i < parseInt(numDigits); i++) {

                if (guessCharacters[i] !== null) {

                    var index = secretCodeCharacters.indexOf(guessCharacters[i]);

                    if (index !== -1) {

                        semiCorrectCount++;

                        // Mark the semi-correct character in the secret code array as 'null' to avoid counting it again

                        secretCodeCharacters[index] = null;

                    }

                }

            }

 

            var feedback = (language === 'de' ? "Tipp " : "Guess ") + (guessCount < 10 ? "0" : "") + guessCount + ": " + guess + "&nbsp;&nbsp;&nbsp;&nbsp;" + correctCount + " | " + semiCorrectCount;

            document.getElementById("feedback").innerHTML = feedback;

            guessCount++;

 

            if (correctCount === parseInt(numDigits)) {

                document.getElementById("feedback").innerHTML += "<br>" + (language === 'de' ? "Herzlichen Glückwunsch! Sie haben den richtigen Code erraten." : "Congratulations! You guessed the correct code.");

                playSuccessSound();

            }

 

            document.getElementById("guessInput").value = "";

            document.getElementById("guesses").innerHTML += feedback + "<br>";

        }

 

        function revealSolution() {

            document.getElementById("feedback").innerHTML = (language === 'de' ? "Lösung: " : "Solution: ") + secretCode;

            document.getElementById("guesses").innerHTML += (language === 'de' ? "Lösung angezeigt" : "Solution Revealed") + "<br>";

        }

 

        function startNewGame() {

            document.getElementById("instructions").style.display = "block";

            document.getElementById("inputButtons").style.display = "block";

            document.getElementById("languageForm").style.display = "block";

            document.getElementById("gameContainer").style.display = "none";

            document.getElementById("feedback").innerHTML = "";

            document.getElementById("guesses").innerHTML = "";

            guessCount = 1;

        }

 

        document.getElementById("guessForm").addEventListener("submit", function(event) {

            event.preventDefault();

            evaluateGuess();

        });

    </script>

</body>

</html>


0 Kommentare:

Kommentar veröffentlichen

Kommentare verfassen ist hier sehr einfach, man kann sogar ohne Anmeldung anonym Kommentare hinterlassen. Also, zeig' uns deine Meinung ...

Kontakt

Name

E-Mail *

Nachricht *

Haftungsausschluss

disclaimer