.da-wordle { γραμματοσειρά-οικογένεια: Arial, sans-serif; text-align: κέντρο; padding: 20px 10px; μέγιστο πλάτος: 500px; margin: 0 auto; } .da-wordle h3 { margin: 0 0 4px; μέγεθος-γραμματοσειράς: 28px; βάρος-γραμμής: 500; } .da-wordle-subtitle { margin: 0 0 18px; μέγεθος-γραμμής: 16px; } .da-wordle-grid { εμφάνιση: flex; flex-κατεύθυνση: στήλη; align-items: κέντρο; κενό: 5px; } .da-wordle-row { εμφάνιση: flex; κενό: 5px; } .da-wordle-tile { πλάτος: 42px; ύψος: 42px; περίγραμμα: 2px συμπαγές #d3d6da; εμφάνιση: flex; align-items: κέντρο; justify-content: κέντρο; μέγεθος-γραμματοσειράς: 22px; βάρος-γραμμής: έντονη; μετασχηματισμός-κειμένου: κεφαλαία; μέγεθος-πλαισίου: border-box; φόντο: #fff; } .da-wordle-tile.correct { φόντο: #6aaa64; χρώμα-border: #6aaa64; χρώμα: λευκό; } .da-wordle-tile.present { φόντο: #c9b458; χρώμα-border: #c9b458; χρώμα: λευκό; } .da-wordle-tile.absent { φόντο: #787c7e; χρώμα-border: #787c7e; χρώμα: λευκό; } .da-wordle-input-row { εμφάνιση: flex; justify-content: center; κενό: 5px; margin-top: 18px; } .da-wordle-input { πλάτος: 42px; ύψος: 42px; περίγραμμα: 2px συμπαγές #ccc; στοίχιση-κειμένου: center; μέγεθος-γραμμής: 22px; βάρος-γραμματοσειράς: έντονη γραφή; μετασχηματισμός-κειμένου: κεφαλαία; μέγεθος-πλαισίου: πλαίσιο-περιγράμματος; περίγραμμα: κανένα; } .da-wordle-input:focus { χρώμα-περιγράμματος: #777; } .da-wordle-button { περιθώριο-επάνω: 12px; συμπλήρωση: 9px 18px; περίγραμμα: κανένα; φόντο: #f1f1f1; μέγεθος-γραμμής: 16px; κέρσορας: δείκτης; } .da-wordle-button:hover { φόντο: #e5e5e5; } .da-wordle-message { ελάχιστο-ύψος: 24px; περιθώριο-επάνω: 12px; μέγεθος-γραμμής: 15px; } .da-wordle-result { βάρος-γραμμής: έντονη γραφή; } @media (μέγιστο-πλάτος: 480px) { .da-wordle-tile, .da-wordle-input { πλάτος: 36px; ύψος: 36px; μέγεθος-γραμματοσειράς: 19px; } .da-wordle-row, .da-wordle-input-row { κενό: 3px; } .da-wordle h3 { μέγεθος-γραμματοσειράς: 24px; } } (συνάρτηση () { /* ========================================== ΕΔΩ ΜΠΟΡΕΙΤΕ ΝΑ ΕΙΣΑΓΩΓΕΤΕ ΤΙΣ ΛΕΞΕΙΣ ΣΗΜΑΝΤΙΚΟ: Όλες οι λέξεις πρέπει να έχουν ακριβώς 6 γράμματα! ========================================= */ const words = [ "HEINER", "LILIEN", "BEMBEL", "HESSEN", "WOOGEN", "LOUISE", "MERCKS", "ENTEGA", "CAMPUSKULGANGANG", "CAMPUS" ]; /* ===================================== ΡΥΘΜΙΣΕΙΣ ============================================= */ const maxTries = 6; /* ================================================= ΠΡΟΣΔΙΟΡΙΣΜΟΣ ΛΕΞΗΣ ΤΗΣ ΗΜΕΡΑΣ =============================================== */ function getDayNumber() { const today = new Date(); const start = new Date( today.getFullYear(), 0, 0 ); const diff = today - start; const oneDay = 1000 * 60 * 60 * 24; return Math.floor(diff / oneDay); } const dayNumber = getDayNumber(); const λύση = λέξεις[ημέραΑριθμός% λέξεις.μήκος].toUpperCase(); const wordLength = λύση.μήκος; /* ============================================== ΣΤΟΙΧΕΙΑ ============================================ */ const grid = document.getElementById("πλέγμα-λέξεων"); const inputRow = document.getElementById("γραμμή-εισαγωγής-λέξεων"); const button = document.getElementById("κουμπί-λέξεων"); const μήνυμα = document.getElementById("μήνυμα-λέξεων"); const lengthDisplay = document.getElementById("μήκος-λέξεων"); lengthDisplay.textContent = wordLength; let tries = 0; let gameOver = false; const rows = []; const inputFields = []; /* ================================================= ΔΗΜΙΟΥΡΓΙΑ ΠΕΔΙΟΥ ΧΡΗΣΗΣ =========================================== */ for (let i = 0; i < maxTries; i++) { const row = document.createElement("div"); row.className = "da-wordle-tile"; for (let j = 0; j < wordLength; j++) { const tile = document.createElement("div"); tile.className = "da-wordle-tile"; row.appendChild(tile); } grid.appendChild(row); rows.push(row); } /* ============================================= ΠΕΔΙΑ ΕΙΣΟΔΟΥ =========================================== */ for (let i = 0; i < wordLength; i++) { const input = document.createElement("input"); input.type = "text"; input.maxLength = 1; input.className = "da-wordle-input"; input.autocomplete = "off"; input.autocapitalize = "characters"; input.addEventListener("input", function () { this.value = this.value.replace(/[^a-zA-ZÄÖÜäöü]/g, "") .toUpperCase(); if ( this.value && i 0 ) { inputFields[i - 1].focus(); } if (event.key === "Enter") { submitGuess(); } }); inputRow.appendChild(input); inputFields.push(input); } /* ================================================ ΑΞΙΟΛΟΓΗΣΗ ΓΡΑΜΜΑΤΩΝ ============================================== */ function evaluateGuess(guess) { const result = new Array(wordLength).fill("absent"); const remaining = solution.split(""); /* Ακριβώς σωστά γράμματα πρώτα */ for (let i = 0; i < wordLength; i++) { if (guess[i] === solution[i]) { result[i] = "correct"; remaining[i] = null; } } /* Στη συνέχεια, διορθώστε τα γράμματα σε λάθος θέση */ for (let i = 0; i input.value) .join("") .toUpperCase(); if (guess.length !== wordLength) { message.textContent = "Παρακαλώ συμπληρώστε όλα τα " + wordLength + " γράμματα."; return; } const row = rows[tries]; const result = evaluateGuess(guess); for (let i = 0; i < wordLength; i++) { const tile = row.children[i]; tile.textContent = guess[i]; tile.classList.add( result[i] ); } tryes++; /* ================================================ ΝΙΚΗΣΕ =========================================== */ αν (μαντέψτε === λύση) { gameOver = true; message.innerHTML = '🎉 Συγχαρητήρια! Μάντεψα στο ' + προσπάθειες + (προσπάθειες === 1 ; " Προσπάθεια." : " Προσπάθειες.") + ''; disableInputs(); return; } /* ========================================================================================== */ if (tries >= maxTries) { gameOver = true; message.innerHTML = '' + 'Δυστυχώς, δεν τα κατάφερα! Η λέξη ήταν: ' + λύση + ''; disableInputs(); return; } message.textContent = "Προσπάθειες: " + tries + " / " + maxTries; /* Εκκαθάριση εισόδου */ inputFields.forEach(function (input) { input.value = ""; }); inputFields[0].focus(); } /* ============================================== ΤΕΛΟΣ ΠΑΙΧΝΙΔΙΟΥ ============================================ */ function disableInputs() { inputFields.forEach(function (input) { input.disabled = true }); button.disabled = true; } /* ================================================== ΚΟΥΜΠΙ ================================================ */ button.addEventListener( "κλικ", submitGuess ); /* Ενεργοποίηση πρώτου πεδίου */ inputFields[0].focus(); })();