<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Adam Asmaca - Dinamik</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #f0f2f5;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
margin: 0;
color: #333;
}
.game-container {
background: white;
padding: 30px;
border-radius: 12px;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
text-align: center;
max-width: 600px;
width: 100%;
box-sizing: border-box;
}
h1 {
margin-top: 0;
color: #2c3e50;
}
.category-container {
margin-bottom: 20px;
}
select {
padding: 10px;
font-size: 16px;
border-radius: 6px;
border: 1px solid #ccc;
width: 80%;
max-width: 300px;
cursor: pointer;
outline: none;
}
canvas {
background-color: #fafafa;
border-radius: 8px;
border: 1px solid #eee;
margin: 0 auto;
display: block;
}
.word-display {
font-size: 36px;
letter-spacing: 12px;
margin: 20px 0;
font-weight: bold;
min-height: 50px;
word-break: break-all;
}
.keyboard {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
margin-top: 20px;
}
.key {
padding: 12px 16px;
font-size: 18px;
font-weight: bold;
border: none;
border-radius: 6px;
background-color: #e0e0e0;
cursor: pointer;
transition: all 0.2s;
user-select: none;
}
.key:hover:not(:disabled) {
background-color: #c0c0c0;
}
.key:disabled {
cursor: not-allowed;
opacity: 0.9;
}
.key.correct {
background-color: #4caf50;
color: white;
}
.key.wrong {
background-color: #f44336;
color: white;
}
#message {
font-size: 22px;
font-weight: bold;
margin-top: 20px;
min-height: 30px;
}
.next-btn {
margin-top: 20px;
padding: 12px 30px;
font-size: 18px;
font-weight: bold;
background-color: #2196f3;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
display: none;
transition: background-color 0.2s;
margin-left: auto;
margin-right: auto;
}
.next-btn:hover {
background-color: #1976d2;
}
</style>
</head>
<body>
<div class="game-container">
<h1>Adam Asmaca</h1>
<div class="category-container">
<select id="categorySelect" onchange="startNewGame()">
</select>
</div>
<canvas id="hangmanCanvas" width="200" height="250"></canvas>
<div class="word-display" id="wordDisplay"></div>
<div class="keyboard" id="keyboard"></div>
<div id="message"></div>
<button class="next-btn" id="nextBtn" onclick="startNewGame()">Sonraki Kelime</button>
</div>
<script>
const categories = {
"Karışık Kelimeler": ["BİLGİSAYAR", "TELEFON", "KLAVYE", "YAZILIM", "TARAYICI", "GELİŞTİRİCİ", "SUNUCU", "VERİTABANI"],
"Şehir ve İlçe İsimleri": ["İSTANBUL", "ANKARA", "İZMİR", "KADIKÖY", "ÇANKAYA", "ANTALYA", "BODRUM", "TRABZON"],
"Tıp Terimleri": ["AMELİYAT", "STETOSKOP", "REÇETE", "ANESTEZİ", "ENJEKSİYON", "ANTİBİYOTİK", "TANSİYON", "SENDROM"],
"Tarih Terimleri": ["İMPARATORLUK", "SADRAZAM", "ANTLAŞMA", "RÖNESANS", "İNKILAP", "CUMHURİYET", "PADİŞAH", "MÜTAREKE"],
"Ülke İsimleri": ["TÜRKİYE", "JAPONYA", "BREZİLYA", "İTALYA", "KANADA", "İSPANYA", "NORVEÇ", "AVUSTRALYA"],
"İnsan İsimleri": ["ÖZGÜR", "MURAT", "AHMET", "MEHMET", "AYŞE", "FATMA", "MUSTAFA", "ZEYNEP", "KEMAL"],
"Hayvan İsimleri": ["ASLAN", "KAPLAN", "FİL", "ZÜRAFA", "KARTAL", "YUNUS", "PENGUEN", "KANGURU"]
};
const turkishAlphabet = "ABCÇDEFGĞHIİJKLMNOÖPRSŞTUÜVYZ".split("");
let chosenWord = "";
let guessedLetters = [];
let mistakes = 0;
const maxMistakes = 6;
function init() {
const select = document.getElementById("categorySelect");
for (let category in categories) {
let option = document.createElement("option");
option.value = category;
option.textContent = category;
select.appendChild(option);
}
startNewGame();
}
function startNewGame() {
const category = document.getElementById("categorySelect").value;
const wordList = categories[category];
chosenWord = wordList[Math.floor(Math.random() * wordList.length)];
guessedLetters = [];
mistakes = 0;
document.getElementById("message").textContent = "";
document.getElementById("message").style.color = "#333";
document.getElementById("nextBtn").style.display = "none";
drawHangman(0);
createKeyboard();
updateWordDisplay();
}
function createKeyboard() {
const keyboardDiv = document.getElementById("keyboard");
keyboardDiv.innerHTML = "";
turkishAlphabet.forEach(letter => {
const btn = document.createElement("button");
btn.textContent = letter;
btn.className = "key";
btn.onclick = () => handleGuess(letter, btn);
keyboardDiv.appendChild(btn);
});
}
function handleGuess(letter, btn) {
btn.disabled = true;
guessedLetters.push(letter);
if (chosenWord.includes(letter)) {
btn.classList.add("correct");
updateWordDisplay();
checkWin();
} else {
btn.classList.add("wrong");
mistakes++;
drawHangman(mistakes);
checkLoss();
}
}
function updateWordDisplay() {
const display = document.getElementById("wordDisplay");
let displayText = "";
for (let letter of chosenWord) {
if (guessedLetters.includes(letter)) {
displayText += letter;
} else {
displayText += "_";
}
}
display.textContent = displayText;
}
function checkWin() {
let hasWon = true;
for (let letter of chosenWord) {
if (!guessedLetters.includes(letter)) {
hasWon = false;
break;
}
}
if (hasWon) {
endGame(true);
}
}
function checkLoss() {
if (mistakes >= maxMistakes) {
endGame(false);
}
}
function endGame(isWin) {
const messageDiv = document.getElementById("message");
if (isWin) {
messageDiv.textContent = "Tebrikler, Kazandınız! 🎉";
messageDiv.style.color = "#4caf50";
} else {
messageDiv.textContent = `Oyun Bitti! Kelime: ${chosenWord}`;
messageDiv.style.color = "#f44336";
document.getElementById("wordDisplay").textContent = chosenWord;
}
// Klavyeyi devre dışı bırak
const keys = document.querySelectorAll(".key");
keys.forEach(key => key.disabled = true);
// Sonraki kelime butonunu göster
document.getElementById("nextBtn").style.display = "block";
}
function drawHangman(step) {
const canvas = document.getElementById("hangmanCanvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 4;
ctx.strokeStyle = "#333";
// Tuvali temizle (başlangıçta hiçbir şey çizilmez)
ctx.clearRect(0, 0, canvas.width, canvas.height);
// Adım adım inşa et (boş çerçeve bile başlangıçta görünmez)
if (step >= 1) { // Hata 1: Taban ve Direk
ctx.beginPath(); ctx.moveTo(20, 230); ctx.lineTo(180, 230); ctx.stroke(); // Taban
ctx.beginPath(); ctx.moveTo(50, 230); ctx.lineTo(50, 20); ctx.stroke(); // Direk
}
if (step >= 2) { // Hata 2: Üst Direk ve İp
ctx.beginPath(); ctx.moveTo(50, 20); ctx.lineTo(120, 20); ctx.stroke(); // Üst direk
ctx.beginPath(); ctx.moveTo(120, 20); ctx.lineTo(120, 50); ctx.stroke(); // İp
}
if (step >= 3) { // Hata 3: Kafa
ctx.beginPath(); ctx.arc(120, 70, 20, 0, Math.PI * 2); ctx.stroke();
}
if (step >= 4) { // Hata 4: Gövde
ctx.beginPath(); ctx.moveTo(120, 90); ctx.lineTo(120, 150); ctx.stroke();
}
if (step >= 5) { // Hata 5: Kollar
ctx.beginPath(); ctx.moveTo(120, 100); ctx.lineTo(90, 130); ctx.stroke(); // Sol Kol
ctx.beginPath(); ctx.moveTo(120, 100); ctx.lineTo(150, 130); ctx.stroke(); // Sağ Kol
}
if (step >= 6) { // Hata 6: Bacaklar
ctx.beginPath(); ctx.moveTo(120, 150); ctx.lineTo(90, 190); ctx.stroke(); // Sol Bacak
ctx.beginPath(); ctx.moveTo(120, 150); ctx.lineTo(150, 190); ctx.stroke(); // Sağ Bacak
}
}
// Oyunu başlat
window.onload = init;
</script>
</body>
</html> 
Selamlar geliştirmek size kalmış kodları verdim yapay zeka ile yapıldı adam asmaca oyunu iyi forumlar