/** @jsxImportSource https://esm.sh/react@18.2.0 */ import React, { useState, useEffect } from "https://esm.sh/react@18.2.0"; import { createRoot } from "https://esm.sh/react-dom@18.2.0/client"; // Turkish day abbreviations const turkishDays = ['Paz', 'Pzt', 'Sal', 'Çar', 'Per', 'Cum', 'Cmt']; const turkishMonths = [ 'Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran', 'Temmuz', 'Ağustos', 'Eylül', 'Ekim', 'Kasım', 'Aralık' ]; // Expanded Codenames-style word cards with spy theme const codeNames = [ '🕵️ AJAN', '🔐 GİZLİ', '📡 OPERASYON', '🎯 GÖREV', '🔑 ANAHTAR', '📂 KOD', '📝 RAPOR', '🚨 MİSYON', '🧩 İPUCU', '🎲 HEDEF', '🤝 DESTEK', '🔍 KONTROL', '📡 İLETİŞİM', '📋 PLAN', '⏰ HAZIRLIK' ]; interface DateInfo { fullDate: Date; displayDate: string; dayName: string; monthName: string; } function generateNextFifteenDays(): DateInfo[] { const dates: DateInfo[] = []; for (let i = 1; i <= 15; i++) { // Start from 1 to skip today const fullDate = new Date(); fullDate.setDate(fullDate.getDate() + i); const displayDate = `${fullDate.getDate()} ${turkishMonths[fullDate.getMonth()]}`; const dayName = turkishDays[fullDate.getDay()]; const monthName = turkishMonths[fullDate.getMonth()]; dates.push({ fullDate, displayDate, dayName, monthName }); } return dates; } const gameStyles = { boardBackground: '#1A2238', // Deep navy blue cardBackground: '#394264', // Muted slate blue textColor: '#F4F4F4', // Off-white highlightColor: '#FF6A3D', // Bright orange-red borderColor: '#9DACCE', // Soft grayish blue fontFamily: "'Courier New', monospace", codeNameBackground: '#2C3E50' // Dark background for code name cards }; function CodeNameGrid() { return (

{codeNames.map((name, index) => (

{name}

))}

); } function App() { const [nickname, setNickname] = useState(''); const [dates] = useState(generateNextFifteenDays()); const [selectedDates, setSelectedDates] = useState([]); const handleDateToggle = (date: string) => { setSelectedDates(prev => prev.includes(date) ? prev.filter(d => d !== date) : [...prev, date] ); }; const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); if (!nickname || selectedDates.length === 0) { alert('🕵️ Lütfen takma ad ve tarih seçin'); return; } const response = await fetch('/submit-vote', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ nickname, dates: selectedDates }) }); if (response.ok) { window.location.href = '/results'; } }; const handleViewResults = () => { window.location.href = '/results'; }; return (

🕵️‍♀️ Codenames Gizli Görev Takvimi 🎲

setNickname(e.target.value)} style={{ width: '100%', padding: '10px', marginBottom: '15px', backgroundColor: gameStyles.boardBackground, color: gameStyles.textColor, border: `2px solid ${gameStyles.borderColor}`, borderRadius: '5px', fontStyle: 'italic' }} />

{dates.map(date => (

handleDateToggle(date.displayDate)} >

{date.dayName}

{date.displayDate}

{selectedDates.includes(date.displayDate) && (

)}

))}

); } function ResultsPage() { const [votes, setVotes] = useState([]); const [loading, setLoading] = useState(true); const [dateFrequency, setDateFrequency] = useState<{[key: string]: number}>({}); useEffect(() => { async function fetchVotes() { const response = await fetch('/get-votes'); const data = await response.json(); setVotes(data); const frequency = data.reduce((acc, vote) => { vote.dates.split(', ').forEach(date => { acc[date] = (acc[date] || 0) + 1; }); return acc; }, {}); setDateFrequency(frequency); setLoading(false); } fetchVotes(); }, []); const handleDeleteVote = async (id: number) => { const response = await fetch('/delete-vote', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ id }) }); if (response.ok) { setVotes(prev => prev.filter(vote => vote.id !== id)); } }; const handleBackToVote = () => { window.location.href = '/'; }; if (loading) return

🕵️ Yükleniyor...

; return (

🔍 Codenames Gizli Görev Sonuçları 📋

🎯 Tarih Popülerliği

{Object.entries(dateFrequency) .sort((a, b) => b[1] - a[1]) .map(([date, count]) => (

0 ? gameStyles.boardBackground : 'transparent', borderRadius: '5px', margin: '5px 0' }} > 📅 {date} 🏆 {count} oy

))}

🕵️ Bireysel Oylar

{votes.map(vote => (

🕴️ {vote.nickname}

📆 {vote.dates}

))}

); } function client() { const root = document.getElementById("root"); const path = window.location.pathname; if (path === '/results') { createRoot(root).render(); } else { createRoot(root).render(); } } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { const { sqlite } = await import("https://esm.town/v/stevekrouse/sqlite"); const KEY = new URL(import.meta.url).pathname.split("/").at(-1); const SCHEMA_VERSION = 10; await sqlite.execute(` CREATE TABLE IF NOT EXISTS ${KEY}_votes_${SCHEMA_VERSION} ( id INTEGER PRIMARY KEY AUTOINCREMENT, nickname TEXT NOT NULL, dates TEXT NOT NULL ) `); const url = new URL(request.url); if (request.method === 'POST' && url.pathname === '/submit-vote') { const { nickname, dates } = await request.json(); await sqlite.execute( `INSERT INTO ${KEY}_votes_${SCHEMA_VERSION} (nickname, dates) VALUES (?, ?)`, [nickname, dates.join(', ')] ); return new Response(null, { status: 302, headers: { Location: "/results" }}); } if (request.method === 'GET' && url.pathname === '/get-votes') { const result = await sqlite.execute(`SELECT * FROM ${KEY}_votes_${SCHEMA_VERSION}`); return Response.json(result.rows); } if (request.method === 'POST' && url.pathname === '/delete-vote') { const { id } = await request.json(); await sqlite.execute( `DELETE FROM ${KEY}_votes_${SCHEMA_VERSION} WHERE id = ?`, [id] ); return new Response('Silindi', { status: 200 }); } return new Response(` Codenames Gizli Görev Tercihi

`, { headers: { 'Content-Type': 'text/html' } }); }

safeBlushRabbit