Freitag, 26 September 2025

Top 5 diese Woche

Ähnliche Tutorials

Cafeteria KI Chat

Erlebe mit unserem Script dein eigenes virtuelles Cafe, in dem du mit einem KI Kumpel plaudern kannst, wie mit einem alten Freund am Nachbartisch. Unser Chat-System unterstützt mehrere Tische gleichzeitig, sodass jede Gruppe ihren eigenen Chatverlauf hat.

Die KI liefert echte Antworten dank OpenAI, während verrückte Cafe Events, Emoji-Animationen und kleine Überraschungen für eine lebendige Atmosphäre sorgen. Tisch-Notizen können gespeichert werden, Themenwechsel verändern das visuelle Setting, und Mini-Interaktionen bringen zusätzlichen Spaß.

Ideal für Unterhaltung, Brainstorming oder einfach, um eine humorvolle, chaotische Chat Atmosphäre zu genießen. 😉

Features:

  • Mehrere Tische mit separaten Chatverläufen
  • KI Kumpel mit echten Antworten von OpenAI
  • Verrückte Cafe Events und Emoji Animationen
  • Stimmungsmodifikator für witzige oder verrückte Antworten
  • Tisch-Notizen speichern
  • Themenwechsel für Hintergrund und Stimmung
<?php
session_start();
define('OPENAI_API_KEY', 'DEIN_OPENAI_API_KEY'); // OpenAI API-Key hier einsetzen

if (!isset($_SESSION['tables'])) { $_SESSION['tables'] = []; }
if (!isset($_SESSION['tableNotes'])) { $_SESSION['tableNotes'] = []; }

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $action = $_POST['action'];

    if ($action === 'createTable') {
        $tableName = $_POST['name'] ?: "Tisch " . (count($_SESSION['tables']) + 1);
        $_SESSION['tables'][$tableName] = [];
        $_SESSION['tableNotes'][$tableName] = "";
        echo json_encode(["success" => true, "name" => $tableName]);
        exit;
    }

    if ($action === 'sendMessage') {
        $table = $_POST['table'];
        $msg = htmlspecialchars($_POST['message']);
        $_SESSION['tables'][$table][] = ["user"=>"Du","msg"=>$msg,"avatar"=>"👤"];

        // OpenAI Anfrage
        $postData = [
            "model"=>"gpt-3.5-turbo",
            "messages"=>[
                ["role"=>"system","content"=>"Du bist ein freundlicher, humorvoller Kumpel in einem Café. Humorvoll, locker, kurze Sätze. Manchmal auch genervt, pampig und müde."],
                ["role"=>"user","content"=>$msg]
            ],
            "temperature"=>0.8
        ];

        $ch = curl_init("https://api.openai.com/v1/chat/completions");
        curl_setopt($ch, CURLOPT_HTTPHEADER, [
            "Content-Type: application/json",
            "Authorization: Bearer ".OPENAI_API_KEY
        ]);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_POST, true);
        curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($postData));
        $result = curl_exec($ch);
        curl_close($ch);

        $responseText = "Hmm, etwas ist schiefgelaufen 😅";
        if ($result) {
            $data = json_decode($result,true);
            if(isset($data['choices'][0]['message']['content'])){
                $responseText = trim($data['choices'][0]['message']['content']);
            }
        }

        $_SESSION['tables'][$table][] = ["user"=>"Kumpel","msg"=>$responseText,"avatar"=>"🤖","mood"=>"neutral"];

        // Verrückte Café-Events zufällig
        if(rand(1,10)==1){
            $_SESSION['tables'][$table][] = ["user"=>"Café-Event","msg"=>"🌟 Überraschung! Ein Kuchen fliegt durch die Luft! 🎂","avatar"=>"🎉","mood"=>"verrückt"];
        }

        echo json_encode(["success"=>true,"messages"=>$_SESSION['tables'][$table]]);
        exit;
    }

    if ($action === 'getMessages') {
        $table = $_POST['table'];
        echo json_encode(["success"=>true,"messages"=>$_SESSION['tables'][$table],"note"=>$_SESSION['tableNotes'][$table]]);
        exit;
    }

    if ($action === 'saveNote') {
        $table = $_POST['table'];
        $_SESSION['tableNotes'][$table] = htmlspecialchars($_POST['note']);
        echo json_encode(["success"=>true]);
        exit;
    }
}
?>

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Dreamcodes - Cafeteria-Chat – Echt & Verrückt</title>
<style>
body { font-family: Arial, sans-serif; background:#f7f3ed; }
.container { display:flex; }
.tables { width:240px; border-right:2px solid #ccc; padding:10px; }
.tables button { display:block; margin:5px 0; width:100%; }
.chat { flex:1; padding:10px; position:relative; }
.messages { height:400px; overflow-y:auto; border:1px solid #aaa; padding:10px; background:#fff; }
.msg-user { color:#2c3e50; font-weight:bold; }
.msg-bot { color:#16a085; font-weight:bold; }
.msg-crazy { color:#e74c3c; font-weight:bold; animation:wobble 0.5s, shake 0.5s; }
.msg-event { color:#d35400; font-weight:bold; animation:bounce 0.5s; }
@keyframes wobble {0%{transform:rotate(-10deg);}50%{transform:rotate(10deg);}100%{transform:rotate(0);}}
@keyframes shake {0%{transform:translateX(-5px);}50%{transform:translateX(5px);}100%{transform:translateX(0);}}
@keyframes bounce {0%{transform:translateY(-10px);}50%{transform:translateY(5px);}100%{transform:translateY(0);}}
.input-box { margin-top:10px; display:flex; gap:5px; }
#tableNote { width:100%; margin-top:10px; height:60px; }
.footer-note { margin-top:20px; font-size:12px; color:#555; text-align:center; }
.chat-theme { margin-top:5px; }
</style>
</head>
<body>
<h1>☕ Cafeteria-Chat – Echt & Verrückt</h1>
<div class="container">
    <div class="tables">
        <h3>Tische</h3>
        <div id="tableList"></div>
        <input type="text" id="newTableName" placeholder="Neuer Tischname">
        <button onclick="createTable()">➕ Tisch eröffnen</button>
    </div>
    <div class="chat">
        <h3 id="activeTableTitle">Kein Tisch ausgewählt</h3>
        <div class="messages" id="messages"></div>
        <div class="input-box">
            <input type="text" id="message" placeholder="Nachricht..." onkeydown="if(event.key==='Enter'){sendMessage()}">
            <button onclick="sendMessage()">Senden</button>
        </div>
        <div class="input-box">
            <button onclick="quickSend('😂')">😂</button>
            <button onclick="quickSend('☕')">☕</button>
            <button onclick="quickSend('💥')">💥</button>
        </div>
        <textarea id="tableNote" placeholder="Tisch-Notizen speichern..."></textarea>
        <button onclick="saveNote()">💾 Speichern</button>
    </div>
</div>

<p class="footer-note">
Hinweis: Gespräche laufen im Browser. Inhalte werden nicht ohne dein Zutun an einen Server gesendet.<br>
<a href="http://www.dreamcodes.net">Dreamcodes</a>
</p>

<script>
let activeTable=null;

function createTable(){
    let name=document.getElementById('newTableName').value;
    fetch('cafeteria_chat.php',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded'},body:'action=createTable&name='+encodeURIComponent(name)})
    .then(r=>r.json()).then(d=>{if(d.success) loadTables();});
}

function loadTables(){
    let list=document.getElementById('tableList'); list.innerHTML='';
    <?php foreach($_SESSION['tables'] as $name=>$msgs): ?>
    let btn=document.createElement('button'); btn.innerText="<?php echo $name; ?>"; btn.onclick=()=>selectTable("<?php echo $name; ?>"); list.appendChild(btn);
    <?php endforeach; ?>
}

function selectTable(name){
    activeTable=name; document.getElementById('activeTableTitle').innerText=name;
    fetch('cafeteria_chat.php',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded'},body:'action=getMessages&table='+encodeURIComponent(name)})
    .then(r=>r.json()).then(d=>{
        if(d.success){ renderMessages(d.messages); document.getElementById('tableNote').value=d.note; }
    });
}

function sendMessage(){
    if(!activeTable) return alert("Bitte zuerst einen Tisch auswählen!");
    let msg=document.getElementById('message').value; document.getElementById('message').value='';
    fetch('cafeteria_chat.php',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded'},body:'action=sendMessage&table='+encodeURIComponent(activeTable)+'&message='+encodeURIComponent(msg)})
    .then(r=>r.json()).then(d=>{if(d.success) renderMessages(d.messages);});
}

function quickSend(icon){ document.getElementById('message').value=icon; sendMessage(); }

function saveNote(){
    let note=document.getElementById('tableNote').value;
    fetch('cafeteria_chat.php',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded'},body:'action=saveNote&table='+encodeURIComponent(activeTable)+'&note='+encodeURIComponent(note)})
    .then(r=>r.json()).then(d=>{if(d.success)alert("Notiz gespeichert!");});
}

function renderMessages(msgs){
    let box=document.getElementById('messages'); box.innerHTML='';
    msgs.forEach(m=>{
        let spanClass=(m.user==='Du')?'msg-user':(m.mood==='verrückt'||m.user==='Café-Event')?'msg-crazy':'msg-bot';
        if(m.user==='Café-Event') spanClass='msg-event';
        let div=document.createElement('div');
        div.innerHTML='<span class="'+spanClass+'">'+m.avatar+' '+m.user+':</span> '+m.msg;
        box.appendChild(div);
    });
    box.scrollTop=box.scrollHeight;
}

loadTables();
</script>
</body>
</html>
Vorheriges Tutorial
Nächstes Tutorial

Hier etwas für dich dabei?