<!doctype html><html lang="pl"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>CaraChat – czat Caramail z lat 2000, odtworzony w PHP (za darmo, online)</title> <meta name="description" content="CaraChat odtwarza w PHP klienta czatu Caramail z 2002 roku: pokoje, rozmowy prywatne, kolorowe nicki, tęczowy i falujący tekst oraz oryginalne, rysowane buźki. Za darmo, w przeglądarce."> <link rel="canonical" href="https://{{DOMAIN}}/pl/"> <link rel="alternate" hreflang="fr" href="https://{{DOMAIN}}/"> <link rel="alternate" hreflang="en" href="https://{{DOMAIN}}/en/"> <link rel="alternate" hreflang="es" href="https://{{DOMAIN}}/es/"> <link rel="alternate" hreflang="de" href="https://{{DOMAIN}}/de/"> <link rel="alternate" hreflang="it" href="https://{{DOMAIN}}/it/"> <link rel="alternate" hreflang="pt" href="https://{{DOMAIN}}/pt/"> <link rel="alternate" hreflang="nl" href="https://{{DOMAIN}}/nl/"> <link rel="alternate" hreflang="pl" href="https://{{DOMAIN}}/pl/"> <link rel="alternate" hreflang="ru" href="https://{{DOMAIN}}/ru/"> <link rel="alternate" hreflang="uk" href="https://{{DOMAIN}}/uk/"> <link rel="alternate" hreflang="tr" href="https://{{DOMAIN}}/tr/"> <link rel="alternate" hreflang="ja" href="https://{{DOMAIN}}/ja/"> <link rel="alternate" hreflang="zh" href="https://{{DOMAIN}}/zh/"> <link rel="alternate" hreflang="ko" href="https://{{DOMAIN}}/ko/"> <link rel="alternate" hreflang="x-default" href="https://{{DOMAIN}}/"> <link rel="icon" href="../images/favicon.png"> <meta property="og:type" content="website"> <meta property="og:title" content="CaraChat – czat Caramail z lat 2000"> <meta property="og:description" content="Pokoje, rozmowy prywatne, kolory, tęcza i oryginalne buźki: czat z 2002 roku odtworzony w PHP."> <meta property="og:url" content="https://{{DOMAIN}}/pl/"> <meta property="og:image" content="https://{{DOMAIN}}/images/og.png"> <meta property="og:locale" content="pl_PL"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="CaraChat – czat Caramail z lat 2000"> <meta name="twitter:description" content="Pokoje, rozmowy prywatne, kolory, tęcza i oryginalne buźki: czat z 2002 roku odtworzony w PHP."> <meta name="twitter:image" content="https://{{DOMAIN}}/images/og.png"> <script type="application/ld+json">{ "@context": "https://schema.org", "@type": "WebApplication", "name": "CaraChat", "description": "Klient czatu Caramail z 2002 roku odtworzony w PHP z JumPHP: pokoje, rozmowy prywatne, kolory, tęczowy i falujący tekst, oryginalne rysowane buźki.", "url": "https://{{DOMAIN}}/pl/", "applicationCategory": "CommunicationApplication", "operatingSystem": "Web browser, Linux, Windows, macOS", "image": "https://{{DOMAIN}}/images/og.png", "screenshot": ["https://{{DOMAIN}}/images/chat.png", "https://{{DOMAIN}}/images/rooms.png", "https://{{DOMAIN}}/images/search.png", "https://{{DOMAIN}}/images/private.png", "https://{{DOMAIN}}/images/phone.png", "https://{{DOMAIN}}/images/login.png"], "isAccessibleForFree": true, "offers": {"@type": "Offer", "price": "0", "priceCurrency": "EUR"}, "potentialAction": {"@type": "UseAction", "target": "https://{{DOMAIN}}/play/"}} </script> <script type="application/ld+json">{ "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ {"@type": "Question", "name": "Jak zrobić buźkę?", "acceptedAnswer": {"@type": "Answer", "text": "Tak jak w 2002 roku: oczy, nos i usta, na przykład :-) ;-) 8-) :o) albo :#) dla Świętego Mikołaja. Nos jest obowiązkowy. Cyfra po buźce zmienia jej kolor (:-)2), #c lub #d dodaje rękę. #00 do #14 to rysunki: #13 to serce."}}, {"@type": "Question", "name": "Czy potrzebny jest serwer?", "acceptedAnswer": {"@type": "Answer", "text": "Tak: serwer czatu CaraChat Serveur (PHP, bez bazy danych) uruchamia się w Dockerze na dowolnej maszynie, a potem podaje się jego adres i port (4500) w oknie logowania."}} ]} </script> <style> :root { --gris: #c0c0c0; --bleu: #0000ff; --nuit: #1a1a8c; --rose: #ff00c8; } * { box-sizing: border-box; } body { margin: 0; font-family: Helvetica, Arial, sans-serif; background: var(--gris); color: #000; line-height: 1.5; } header { background: #404040; color: #fff; padding: 12px 16px; } header .wrap { display: flex; align-items: center; gap: 12px; } header img { width: 40px; height: 40px; image-rendering: pixelated; } header strong { font-size: 1.4rem; color: #fff; } .wrap { max-width: 1040px; margin: 0 auto; } main { padding: 0 16px 40px; } .langs { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; margin: 10px 0 0; padding: 0; } .langs a { color: var(--nuit); } h1 { color: var(--bleu); font-size: 2.2rem; margin: 28px 0 8px; } h2 { color: var(--nuit); border-bottom: 2px solid #808080; padding-bottom: 4px; margin-top: 40px; } .lead { font-size: 1.15rem; max-width: 760px; } .play { display: inline-block; background: var(--bleu); color: #fff; font-weight: bold; font-size: 1.25rem; padding: 14px 28px; border-radius: 6px; text-decoration: none; margin: 12px 0 24px; } .play:hover { background: var(--nuit); } figure { margin: 0; background: #fff; border: 1px solid #808080; padding: 6px; } figure img { display: block; width: 100%; height: auto; } figcaption { font-size: .9rem; color: #646464; padding: 6px 2px 0; } .grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: start; } .card { background: #fff; border: 1px solid #808080; padding: 12px 16px; } code { background: #eeeeff; padding: 1px 4px; border-radius: 3px; } .help h3 { color: #990000; font-size: 1.05rem; margin: 18px 0 6px; } .help .note { color: #646464; font-size: .9rem; } .rainbow span:nth-child(9n+1) { color: #ff00c8 } .rainbow span:nth-child(9n+2) { color: #6e265f } .rainbow span:nth-child(9n+3) { color: #7d0000 } .rainbow span:nth-child(9n+4) { color: #1a1a8c } .rainbow span:nth-child(9n+5) { color: #0000ff } .rainbow span:nth-child(9n+6) { color: #147300 } .rainbow span:nth-child(9n+7) { color: #9b9b14 } .rainbow span:nth-child(9n+8) { color: #ff9d00 } .rainbow span:nth-child(9n) { color: #ff0000 } .shots { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; } .shots .phone img { max-width: 260px; margin: 0 auto; } @media (max-width: 720px) { .shots { grid-template-columns: 1fr; } } footer { font-size: .85rem; color: #404040; padding: 24px 16px; border-top: 1px solid #808080; } @media (max-width: 720px) { .grid { grid-template-columns: 1fr; } h1 { font-size: 1.7rem; } } </style></head><body><header><div class="wrap"><img src="../images/favicon.png" alt="Mrugająca buźka z apletu" width="40" height="40"><strong>CaraChat</strong></div></header><main class="wrap"> <nav class="langs" aria-label="Języki"> <a href="../" lang="fr" hreflang="fr">Français</a> <a href="../en/" lang="en" hreflang="en">English</a> <a href="../es/" lang="es" hreflang="es">Español</a> <a href="../de/" lang="de" hreflang="de">Deutsch</a> <a href="../it/" lang="it" hreflang="it">Italiano</a> <a href="../pt/" lang="pt" hreflang="pt">Português</a> <a href="../nl/" lang="nl" hreflang="nl">Nederlands</a> <strong lang="pl" aria-current="page">Polski</strong> <a href="../ru/" lang="ru" hreflang="ru">Русский</a> <a href="../uk/" lang="uk" hreflang="uk">Українська</a> <a href="../tr/" lang="tr" hreflang="tr">Türkçe</a> <a href="../ja/" lang="ja" hreflang="ja">日本語</a> <a href="../zh/" lang="zh" hreflang="zh">中文</a> <a href="../ko/" lang="ko" hreflang="ko">한국어</a> </nav> <h1>Czat z lat 2000 wraca</h1> <p class="lead">CaraChat odtwarza w PHP aplet czatu Caramail z 2002 roku: pokoje, rozmowy prywatne, różowe i niebieskie nicki, <span class="rainbow"><span>t</span><span>ę</span><span>c</span><span>z</span><span>o</span><span>w</span><span>y</span></span>i falujący tekst oraz buźki rysowane dokładnie tak jak kiedyś.</p> <a class="play" href="../play/?lang=pl">Wejdź na czat</a> <figure> <img src="../images/chat.png" alt="Pokój Accueil (Start) w CaraChat: kolorowe zdania, buźki, lista obecnych i zakładki" width="1024" height="700"> <figcaption>Pokój: kolorowe zdania, tęcza, buźki, obecni po prawej i rozmowa prywatna migająca na pomarańczowo.</figcaption> </figure> <h2>Zakładki apletu</h2> <div class="shots"> <figure><img src="../images/rooms.png" alt="Zakładka Salons: pokoje stałe, tworzenie pokoju publicznego lub prywatnego" width="1024" height="700" loading="lazy"><figcaption>Salons (pokoje): pokoje stałe i pokoje użytkowników, tworzenie pokoju.</figcaption></figure> <figure><img src="../images/search.png" alt="Zakładka Connecté(e)s: lista osób online i wyszukiwanie po nicku, wieku, płci" width="1024" height="700" loading="lazy"><figcaption>Connecté(e)s (online): wyszukiwanie po nicku albo po mieście, wieku i płci.</figcaption></figure> <figure><img src="../images/private.png" alt="Rozmowa prywatna z jej opcjami i paletą specjalnych buziek" width="1024" height="700" loading="lazy"><figcaption>Rozmowa prywatna, jej opcje i specjalne buźki.</figcaption></figure> <figure class="phone"><img src="../images/phone.png" alt="CaraChat na telefonie" width="390" height="760" loading="lazy"><figcaption>Na telefonie.</figcaption></figure> </div> <h2>Co wraca</h2> <div class="grid"> <div class="card"> <ul> <li><strong>Interfejs apletu</strong>, odrysowany identycznie: zakładki Salons (pokoje), Connecté(e)s (online), Options i Ami(e)s (znajomi), pokój i jedna zakładka na każdą rozmowę prywatną (maksymalnie 20), która robi się pomarańczowa, ramki « Dialogue » i « Membres du salon » (członkowie pokoju), « Message privé » (wiadomość prywatna), « Pas de nouveaux PVs » (brak nowych prywatnych), « Problème de comportement » (problem z zachowaniem).</li> <li><strong>Także na telefonie</strong> i w 14 językach (język przeglądarki, który zmienisz w zakładce Options).</li> <li><strong>Pokoje</strong> stałe i użytkowników, publiczne lub prywatne; pełny pokój (40 osób) przelewa się do « Salon* ».</li> <li><strong>Rozmowy prywatne</strong>: dwuklik na nicku albo <code>/nick wiadomość</code> z pokoju.</li> <li><strong>Wyszukiwanie</strong> po nicku albo po mieście, z przedziałem wiekowym i płcią.</li> <li><strong>Kolory</strong> (12, w tym tęcza) i rozmiary (w tym fala), nicki kolorowane według profilu, twój nick pogrubiony, gdy ktoś się do ciebie zwraca.</li> <li><strong>Moderacja</strong>: wyrzucanie, wezwanie moderatora, ignorowanie kogoś, « brak nowych prywatnych », zajęty.</li> </ul> </div> <figure> <img src="../images/login.png" alt="Okno logowania: nick, wiek, miasto, płeć i serwer" width="520" height="447"> <figcaption>Logowanie: twój profil i serwer.</figcaption> </figure> </div> <h2>Oryginalne buźki</h2> <p>To nie były obrazki, tylko kod rysujący: kod odczytano z apletu i odtworzono co do piksela. Oczy <code>:;8B%</code>, nos, który wybiera głowę <code>-o#!*$</code> (klown, Święty Mikołaj, kufel, maska…), usta <code>)(DPO|</code>: <code>:-)</code>, <code>;-)</code>, <code>8-)</code>, <code>:o)</code>, <code>:#)</code>. Cyfra koloruje twarz (<code>:-)2</code>), <code>#c</code> / <code>#d</code> dodają rękę, a <code>#00</code> do <code>#14</code> to rysunki: bomba, miś, choinka, delfin, serce <code>#13</code>… A 60 obrazków z palety « Smileys » (hamburger <code>@00</code>, serce <code>@11</code>, ciasto <code>@09</code>…) pochodzi z oryginalnego pliku <code>smiley.gif</code>.</p> <figure> <img src="../images/smileys.png" alt="Zdania z pokoju z rysowanymi buźkami: twarze, serce, choinka, nuta" width="900" height="319"> </figure> <h2>Oryginalna instrukcja</h2> <p>Pomoc online do czatu na żywo Caramail (1999), przejęta bez zmian, po francusku: <a href="../aide.html">czym jest czat na żywo, tworzenie pokoi publicznych lub prywatnych, wysyłanie wiadomości prywatnych (pomoc po francusku)</a>.</p> <h2>Serwer</h2> <p>Serwer <strong>CaraChat Serveur</strong> został napisany od nowa w PHP 8 na podstawie źródeł z 2012 roku, bez bazy danych, i działa w Dockerze na jumphp.net. Mówi dokładnie protokołem apletu (jedna linia na ramkę, pola oddzielone tabulatorami), przez TCP jak dawniej albo przez WebSocket na porcie 443 (<code>wss://caramail.jumphp.net/ws</code>): połączenie przechodzi wszędzie, nawet za zaporą sieciową.</p> <a class="play" href="../play/?lang=pl">Otwórz CaraChat</a></main><footer class="wrap">CaraChat to nieoficjalne odtworzenie, wykonane z JumPHP. Oryginalny aplet (net.spray.chat, 2002) i serwer PHP « NewCaraChat » (2012) należą do swoich autorów.</footer></body></html>