<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Spor Toto Tahmin Oluşturucu</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
:root {
--primary-color: #0d6efd;
--secondary-color: #6c757d;
--success-color: #198754;
--danger-color: #dc3545;
--light-color: #f8f9fa;
--dark-color: #212529;
--border-color: #dee2e6;
}
body {
font-family: 'Inter', sans-serif;
background-color: var(--light-color);
color: var(--dark-color);
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
}
.container {
max-width: 900px;
width: 100%;
background-color: #ffffff;
padding: 25px;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
header {
text-align: center;
border-bottom: 1px solid var(--border-color);
padding-bottom: 20px;
margin-bottom: 25px;
}
header h1 {
color: var(--dark-color);
margin: 0;
}
header p {
color: var(--secondary-color);
margin-top: 8px;
}
.section-title {
font-size: 1.5em;
font-weight: 700;
margin-bottom: 15px;
color: var(--primary-color);
}
.controls {
display: flex;
flex-wrap: wrap;
gap: 20px;
align-items: center;
padding: 20px;
background-color: var(--light-color);
border-radius: 8px;
margin-bottom: 25px;
}
.control-group {
display: flex;
flex-direction: column;
}
.control-group label {
font-weight: 600;
margin-bottom: 8px;
font-size: 0.9em;
}
.control-group input[type="number"],
.control-group select {
padding: 10px;
border-radius: 6px;
border: 1px solid var(--border-color);
font-size: 1em;
width: 150px;
}
.buttons {
display: flex;
gap: 10px;
margin-left: auto;
}
button {
padding: 10px 20px;
font-size: 1em;
font-weight: 600;
border-radius: 6px;
border: none;
cursor: pointer;
color: #fff;
transition: opacity 0.2s;
}
button:hover {
opacity: 0.85;
}
#generate-btn { background-color: var(--success-color); }
#clear-btn { background-color: var(--danger-color); }
table {
width: 100%;
border-collapse: collapse;
margin-top: 15px;
}
th, td {
padding: 12px 15px;
text-align: center;
border: 1px solid var(--border-color);
}
th {
background-color: var(--dark-color);
color: #fff;
font-weight: 600;
}
tr:nth-child(even) {
background-color: #f2f2f2;
}
.team-name {
text-align: left;
font-weight: 600;
}
.result-cell {
font-weight: 700;
font-size: 1.1em;
}
.update-info {
background-color: #fff3cd;
color: #664d03;
border: 1px solid #ffecb5;
padding: 15px;
border-radius: 8px;
margin-bottom: 25px;
text-align: center;
}
footer {
text-align: center;
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid var(--border-color);
font-size: 0.9em;
color: var(--secondary-color);
}
@media (max-width: 768px) {
.controls {
flex-direction: column;
align-items: stretch;
}
.buttons {
width: 100%;
margin-left: 0;
justify-content: stretch;
}
button {
flex-grow: 1;
}
.control-group input[type="number"],
.control-group select {
width: auto;
}
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>Spor Toto Tahmin Oluşturucu</h1>
<p>Haftalık bülten için akıllı tahmin kolonları oluşturun.</p>
</header>
<main>
<h2 class="section-title">Haftanın Maçları</h2>
<div class="update-info">
<strong>Önemli:</strong> Haftalık bülteni güncellemek için bu HTML dosyasını açın ve aşağıdaki JavaScript bölümündeki <code>haftalikBulten</code> listesini düzenleyin.
</div>
<div id="bulletin-container">
</div>
<h2 class="section-title" style="margin-top: 30px;">Tahmin Oluşturucu</h2>
<div class="controls">
<div class="control-group">
<label for="kolon-sayisi">Kolon Sayısı</label>
<input type="number" id="kolon-sayisi" value="3" min="1" max="50">
</div>
<div class="control-group">
<label for="tahmin-stratejisi">Tahmin Stratejisi</label>
<select id="tahmin-stratejisi">
<option value="random">Rastgele</option>
<option value="favorite" selected>Favori Ağırlıklı</option>
<option value="surprise">Sürpriz Ağırlıklı</option>
</select>
</div>
<div class="buttons">
<button id="generate-btn">Tahmin Oluştur</button>
<button id="clear-btn">Temizle</button>
</div>
</div>
<div id="results-container">
</div>
</main>
<footer>
Bu araç sadece eğlence amaçlıdır ve tahminlerin doğruluğu garanti edilmez.
</footer>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
// =================================================================================
// === DÜZENLENECEK ALAN: Haftalık Bülteni Buradan Güncelleyin ===
// =================================================================================
// Her hafta bu listeyi güncelleyin. 15 maç olmalıdır.
const haftalikBulten = [
{ evSahibi: 'Galatasaray', deplasman: 'Fenerbahçe' },
{ evSahibi: 'Beşiktaş', deplasman: 'Trabzonspor' },
{ evSahibi: 'Başakşehir', deplasman: 'Kasımpaşa' },
{ evSahibi: 'Sivasspor', deplasman: 'Kayserispor' },
{ evSahibi: 'Adana Demirspor', deplasman: 'Antalyaspor' },
{ evSahibi: 'Konyaspor', deplasman: 'Samsunspor' },
{ evSahibi: 'Gaziantep FK', deplasman: 'Pendikspor' },
{ evSahibi: 'Alanyaspor', deplasman: 'Ankaragücü' },
{ evSahibi: 'Karagümrük', deplasman: 'Çaykur Rizespor' },
{ evSahibi: 'Hatayspor', deplasman: 'İstanbulspor' },
{ evSahibi: 'Man City', deplasman: 'Liverpool' },
{ evSahibi: 'Real Madrid', deplasman: 'Barcelona' },
{ evSahibi: 'Bayern Münih', deplasman: 'Dortmund' },
{ evSahibi: 'Inter', deplasman: 'AC Milan' },
{ evSahibi: 'PSG', deplasman: 'Monaco' }
];
// =================================================================================
// === GÜNCELLEME ALANI BİTİŞ ===
// =================================================================================
const bulletinContainer = document.getElementById('bulletin-container');
const resultsContainer = document.getElementById('results-container');
const generateBtn = document.getElementById('generate-btn');
const clearBtn = document.getElementById('clear-btn');
const kolonSayisiInput = document.getElementById('kolon-sayisi');
const stratejiSelect = document.getElementById('tahmin-stratejisi');
// Maç listesini ekrana çizen fonksiyon
function renderBulletin() {
if (haftalikBulten.length !== 15) {
bulletinContainer.innerHTML = `<p style="color:red; text-align:center;">Hata: Maç listesi 15 maç içermelidir. Lütfen kodu kontrol edin.</p>`;
return;
}
let tableHTML = '<table><thead><tr><th>#</th><th>Ev Sahibi</th><th>Deplasman</th></tr></thead><tbody>';
haftalikBulten.forEach((mac, index) => {
tableHTML += `
<tr>
<td>${index + 1}</td>
<td class="team-name">${mac.evSahibi}</td>
<td class="team-name">${mac.deplasman}</td>
</tr>
`;
});
tableHTML += '</tbody></table>';
bulletinContainer.innerHTML = tableHTML;
}
// Tek bir maç için tahmin üreten fonksiyon
function getSinglePrediction(strategy) {
const rand = Math.random();
if (strategy === 'favorite') {
if (rand < 0.60) return '1'; // %60 şansla Ev Sahibi
if (rand < 0.85) return 'X'; // %25 şansla Beraberlik
return '2'; // %15 şansla Deplasman
} else if (strategy === 'surprise') {
if (rand < 0.30) return '1'; // %30 şansla Ev Sahibi
if (rand < 0.65) return 'X'; // %35 şansla Beraberlik
return '2'; // %35 şansla Deplasman
} else { // random
if (rand < 0.333) return '1';
if (rand < 0.666) return 'X';
return '2';
}
}
// Belirtilen sayıda kolonu oluşturan ana fonksiyon
function generateColumns() {
const kolonSayisi = parseInt(kolonSayisiInput.value, 10);
const strateji = stratejiSelect.value;
if (isNaN(kolonSayisi) || kolonSayisi < 1) {
alert("Lütfen geçerli bir kolon sayısı girin.");
return;
}
let columns = [];
for (let i = 0; i < kolonSayisi; i++) {
const yeniKolon = haftalikBulten.map(() => getSinglePrediction(strateji));
columns.push(yeniKolon);
}
renderResults(columns);
}
// Oluşturulan kolonları ekranda gösteren fonksiyon
function renderResults(columns) {
resultsContainer.innerHTML = '';
if (columns.length === 0) return;
let tableHTML = '<h2 class="section-title" style="margin-top: 30px;">Tahmin Sonuçları</h2>';
tableHTML += '<table><thead><tr><th>#</th>';
for (let i = 0; i < columns.length; i++) {
tableHTML += `<th>Kolon ${i + 1}</th>`;
}
tableHTML += '</tr></thead><tbody>';
for (let i = 0; i < 15; i++) {
tableHTML += `<tr><td>${i + 1}</td>`;
for (let j = 0; j < columns.length; j++) {
tableHTML += `<td class="result-cell">${columns[j][i]}</td>`;
}
tableHTML += `</tr>`;
}
tableHTML += '</tbody></table>';
resultsContainer.innerHTML = tableHTML;
}
// Sonuçları temizleyen fonksiyon
function clearResults() {
resultsContainer.innerHTML = '';
kolonSayisiInput.value = 3;
stratejiSelect.value = 'favorite';
}
// Olay dinleyicileri
generateBtn.addEventListener('click', generateColumns);
clearBtn.addEventListener('click', clearResults);
// Sayfa yüklendiğinde maç listesini oluştur
renderBulletin();
});
</script>
</body>
</html>
Selamlar gemini ile basit bir spor toto tahmin yazdık kodlar görseller yukarıda haftalık bülteni manuel kodun içinden değiştirip yapmanız gerekiyor iyi forumlar
