NoTwich

HTML CSS JS Tidy

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>NoTwich</title>
    <style>
        body {
            background: linear-gradient(135deg, #1a1a2e, #16213e);
            font-family: 'Arial', sans-serif;
            color: white;
            margin: 0;
            padding: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            overflow: hidden;
        }

.chat-container {
            width: 600px;
            height: 700px;
            background: rgba(0, 0, 0, 0.7);
            border-radius: 50px;
            border: 3px solid #9147ff;
            box-shadow: 0 0 30px rgba(145, 71, 255, 0.5);
            display: flex;
            flex-direction: column;
            overflow: hidden;
            position: relative;
        }

.chat-header {
            background: linear-gradient(90deg, #9147ff, #772ce8);
            padding: 15px;
            text-align: center;
            font-weight: bold;
            font-size: 20px;
            border-bottom: 2px solid #5c16c5;
        }

.chat-messages {
            flex: 1;
            padding: 15px;
            overflow-y: auto;
            scrollbar-width: thin;
            scrollbar-color: #9147ff #000;
        }

.chat-messages::-webkit-scrollbar {
            width: 8px;
        }

.chat-messages::-webkit-scrollbar-track {
            background: #000;
        }

.chat-messages::-webkit-scrollbar-thumb {
            background-color: #9147ff;
            border-radius: 4px;
        }

.message {
            margin-bottom: 10px;
            line-height: 1.4;
            animation: fadeIn 0.3s ease-out;
            display: flex;
            align-items: flex-start;
        }

.user-avatar {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            margin-right: 10px;
            flex-shrink: 0;
            background-size: cover;
            background-position: center;
        }

.message-content {
            flex: 1;
        }

.username {
            font-weight: bold;
            margin-right: 5px;
            display: inline-block;
        }

.chat-input {
            display: flex;
            padding: 15px;
            background: rgba(0, 0, 0, 0.8);
            border-top: 2px solid #333;
        }

.chat-input input {
            flex: 1;
            padding: 10px 15px;
            border: none;
            border-radius: 20px;
            background: rgba(255, 255, 255, 0.1);
            color: white;
            font-size: 16px;
            outline: none;
        }

.chat-input button {
            margin-left: 10px;
            padding: 10px 20px;
            background: #9147ff;
            color: white;
            border: none;
            border-radius: 20px;
            cursor: pointer;
            font-weight: bold;
            transition: background 0.2s;
        }

.chat-input button:hover {
            background: #772ce8;
        }

@keyframes fadeIn {
            from { opacity: 0; transform: translateY(5px); }
            to { opacity: 1; transform: translateY(0); }
        }

@keyframes pulse {
            0% { transform: scale(1); }
            50% { transform: scale(1.05); }
            100% { transform: scale(1); }
        }

.event-message {
            background: rgba(145, 71, 255, 0.2);
            padding: 10px;
            border-radius: 5px;
            margin: 10px 0;
            text-align: center;
            border-left: 3px solid #9147ff;
            animation: pulse 1.5s infinite;
        }

.emote {
            height: 24px;
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <div class="chat-container">
        <div class="chat-header">
            🎮 NoTwich 🎮
        </div>
        <div class="chat-messages" id="chat-messages">
            
        </div>
        <div class="chat-input">
            <input type="text" id="message-input" placeholder="Напишите сообщение..." maxlength="200">
            <button id="send-button">Отправить</button>
        </div>
    </div>

// База данных сообщений
        const messages = [
            "Привет, как дела?",
            "Крутой стрим!",
            "LUL",
            "Когда следующий стрим?",
            "Я подписался на канал!",
            "Кто играет?",
            "GG",
            "WP",
            "Ого, крутое прохождение!",
            "Сколько часов в игре?",
            "Можно вопрос?",
            "Покажи инвентарь",
            "Я новичок, что делать сначала?",
            "Это лучший стрим на твиче!",
            "Кто еще смотрит этот стрим?",
            "Какой у тебя ПК?",
            "Можно дуэль?",
            "Я донатил 100 рублей!",
            "Когда будешь играть в {игра}?",
            "Покажи скины",
            "Какой твой ник в игре?",
            "Сколько FPS?",
            "Какая настройка графики?",
            "Почему ты выбрал этого персонажа?",
            "Какой сложности играешь?",
            "Сколько времени ушло на это?",
            "Можно совет по игре?",
            "Какой твой рекорд?",
            "Ты профессионал!",
            "Я тоже хочу так играть!",
            "Это мой любимый стример!",
            "Когда будешь стримить снова?",
            "Какой твой расписание?",
            "Сколько подписчиков?",
            "Какой следующий челлендж?",
            "Можно запрос на игру?",
            "Какой твой ник в Steam?",
            "Какая твоя любимая игра?",
            "Как долго ты стримишь?",
            "Как начать стримить?",
            "Какой микрофон используешь?",
            "Какая камера?",
            "Какой софт для стрима?",
            "Почему ты решил стать стримером?",
            "Какой самый сложный момент в игре?",
            "Какой совет новичкам?",
            "Какая твоя цель в игре?",
            "Какой самый эпичный момент?",
            "Кто твой любимый стример?",
                "Какой билд сейчас самый мета?",
            "Почему ты выбрал именно эту тактику?",
            "Сколько стоит твоя мышь?",
            "Какой клавиатурой пользуешься?",
            "Какие наушники посоветуешь?",
            "Как настроить чувствительность мыши?",
            "Как избежать лагов в игре?",
            "Какой сервер самый стабильный?",
            "Кто в твоей команде?",
            "Как научиться быстрее реагировать?",
            "Какие горячие клавиши используешь?",
            "Какой скин твой любимый?",
            "Почему не играешь в {игра}?",
            "Какой самый сложный босс?",
            "Сколько раз умирал на этом уровне?",
            "Как пройти эту локацию?",
            "Где найти этот предмет?",
            "Как качать этого персонажа?",
            "Какой класс самый сильный?",
            "За кого играть новичку?",
            "Как фармить быстрее?",
            "Где лучшие лутаются луты?",
            "Как победить этого противника?",
            "Какой спелл самый полезный?",
            "Как избежать багов в игре?",
            "Что будешь делать после стрима?",
            "Какой твой К/Д соотношение?",
            "Сколько голов сегодня забил?",
            "Какой рекорд по убийствам?",
            "Как улучшить прицеливание?",
            "Какие настройки графики оптимальны?",
            "Как настроить звук для лучшего геймплея?",
            "Какой монитор используешь?",
            "Какое разрешение экрана?",
            "Как часто обновляешь железо?",
            "Какой процессор в твоем ПК?",
            "Какая видеокарта лучше для этой игры?",
            "Сколько оперативки нужно для комфортной игры?",
            "Как охлаждаешь систему?",
            "Какая у тебя скорость интернета?",
            "Как уменьшить пинг?",
            "Как играть без лагов?",
            "Как настроить стрим для слабого ПК?",
            "Какой софт для записи геймплея?",
            "Как монетизировать стримы?",
            "Сколько зарабатываешь на стримах?",
            "Как набрать первых подписчиков?",
            "Какие плагины используешь для стрима?",
            "Как сделать такие же оверлеи?",
            "Где взять хорошие алярмы для донатов?",
            "Как настроить чат-бота?",
            "Какие моды используешь?",
            "Как установить этот мод?",
            "Где скачать эти текстуры?",
            "Как сделать свой сервер?",
            "Как пригласить друзей в игру?",
            "Есть ли у тебя дискорд?",
            "Как попасть в твой клан?",
            "Какие правила в твоем комьюнити?",
            "Как стать модератором?",
            "Почему забанили этого зрителя?",
            "Как пожаловаться на игрока?",
            "Как избежать читеров в матчах?",
            "Как работает античит в этой игре?",
            "Как узнать, что игрок читерит?",
            "Как защитить аккаунт от взлома?",
            "Что делать, если украли аккаунт?",
            "Как восстановить прогресс?",
            "Где посмотреть статистику матчей?",
            "Какой сайт с лучшими гайдами?",
            "Где найти тир-лист персонажей?",
            "Какой канал на ютубе посоветуешь?",
            "Кто лучший стример по этой игре?",
            "Как попасть в киберспортивную команду?",
            "Какие турниры самые престижные?",
            "Как тренироваться для турниров?",
            "Какие навыки нужны для киберспорта?",
            "Сколько часов в день ты тренируешься?",
            "Как не выгорать от игры?",
            "Что делать при туннельном синдроме?",
            "Какие упражнения для рук посоветуешь?",
            "Как сохранить зрение при долгих играх?",
            "Какой режим дня у про геймера?",
            "Что кушать во время марафонских стримов?",
            "Как совмещать игры и учебу/работу?",
            "Как объяснить родителям, что стриминг - это работа?",
            "Как перестать тильтовать?",
            "Как контролировать эмоции в игре?",
            "Что делать при проигрышной серии?",
            "Как мотивировать себя играть лучше?",
            "Как относишься к токсикам в чате?",
            "Как реагировать на хейтеров?",
            "Как создать дружелюбное комьюнити?",
            "Какие мемы сейчас популярны в комьюнити?",
            "Какой твой любимый игровой мем?",
            "Какая самая смешная ситуация была на стриме?",
            "Что самое странное тебе писали в чат?",
            "Какой самый нелепый баг ты видел?",
            "Какая самая эпичная победа у тебя была?",
            "Какой самый обидный проигрыш запомнился?",
            "Во что играешь кроме стримов?",
            "Какая игра детства тебя вдохновила?",
            "Какую игру ты ждешь больше всего?",
            "Какой игровой момент изменил твое отношение к играм?",
            "Какая игра научила тебя чему-то важному?",
            "Как относишься к ремейкам классических игр?",
            "Какая игра, по-твоему, недооценена?",
            "Какой жанр игр тебе ближе всего?",
            "Почему выбрал именно эту платформу для стримов?",
            "Какой совет дашь начинающим стримерам?",
            "Что самое сложное в работе стримера?",
            "Как придумываешь контент для стримов?",
            "Как вести себя перед камерой?",
            "Как побороть страх живого эфира?",
            "Как реагируешь на критику?",
            "Как развивать личный бренд?",
            "Что важнее: развлекать или обучать зрителей?",
            "Как находить баланс между игрой и общением с чатом?",
            "Как реагируешь на спойлеры в чате?",
            "Как модераторы помогают в управлении чатом?",
            "Какие правила в твоем чате?",
            "Как относишься к backseating'у?",
            "Какой донат был самым неожиданным?",
            "Что самое ценное тебе писали в чат?",
            "Бро, ты играешь как будто у тебя клава на татарск*м! 😭",
            "Эт чо за х*йня? Ты умер от моба 1 лвла! 💀",
            "Скилл ишью (skill issue) такой, что даже чат плачет...",
            "Твой дпс как моя зарплата — ниже плинтуса 🤑",
            "Чел, ты проиграл так, что даже бабка в деревне астономировалась!",
            "Где хитбокс? В отпуске? Или ты его 'потерял'? 🎯",
            "Фармишь как бомж у метро — медленно и печально...",
            "Это не баг, это фича (на самом деле баг) 🐛",
            "Ты бегаешь как будто тебе ж*** залили бетоном! 🏗️",
            "ФПС ниже, чем мои шансы на личную жизнь 📉",

// Мемные реакции
            "АХАХАХ, ЧТО ЭТО БЫЛО?! Я В ШОКЕ! 🤯",
            "Стоп, ты серьёзно? Это самый туп*** способ умереть!",
            "Братан, ты только что сломал мне мозг... КАК?! 💢",
            "Я в а*уе с этого поворота событий 🌀",
            "Чат, мы только что видели исторический момент! 📜",
            "Он умер так эпично, что Голливуд уже звонит 🎥",
            "Когда выиграл 1vs5: 'Это я не играл, это рука бога' ✝️",
            "Я валяюсь под столом! Это легендарно! 🤣",
            "Спасибо, поржал как конь 🐴",
            "Ты — ходячий мем, вот это поворот! 🎭",

// Оскорбления light
            "Ну ты и лу*зер (лох), сорян 😅",
            "Даже моя бабка играет лучше, а ей 90! 👵",
            "Ты — живое доказательство, что матчмейкинг сломан 🎲",
            "Гляньте, это же пособие 'как не надо играть'! 📚",
            "Извини, но это не геймплей, а преступление 👮‍♂️",
            "Ты что, специально так играешь? Или это дар? 🙏",
            "Чел, ты — кринж сам по себе 🤡",
            "Стример, ты сегодня как слепой в тире 🎯",
            "Это не проигрыш, это... ладно, это проигрыш 😂",
            "Ты собрал все гранаты, чтобы устроить цирк? 🎪",

// С ошибками для реализма
            "Пашол нах*й! Ой, извините... 😳",
            "Какой же ты noob (нуб), мать твою! (сорян)",
            "Бля*ь, как же бесит этот баг! (извините)",
            "Чел, ты де*бил? А, нет, погодите... 🫢",
            "Это п*здец, а не патч... (ой, простите)",
            "Я в а*уе! (ой, цензура) 🤐",
            "Ну и х*йня этот новый апдейт! (сорян)",
            "Да е*ать этот баланс! (ой, модераторы) 💢",
            "Играешь как будто тебя в детстве дропали... (ой)",
            "Настолько туп*го геймплея я ещё не видел! (сорян)",

// Странные и абсурдные
            "Если бы глупость была электричеством, ты бы светил ярче солнца ☀️",
            "Ты играешь так, будто управляешь джойстиком ногами 🦶",
            "Это не провал, это 'креативное использование механик' 🎨",
            "Твой скилл — это как WiFi в метро: есть, но не ловит 📶",
            "Когда проиграл: 'Это был социальный эксперимент!' 🧪",
            "Ты умер так быстро, что даже deathcam не успела 😵",
            "Геймплей как у пьяного енота — мило, но бесполезно 🦝",
            "Ты что, играешь с завязанными глазами? 👁️‍🗨️",
            "Это не лаги, это ты вышел в астрал 🌀",
            "Чат, я только что видел, как его скилл сбежал в окно! 🪟",

// Донаты и подписки
            "Донат 50 руб: 'За такую игру тебе надо доплачивать!' 💸",
            "Подписка: 'Подписываюсь, чтобы страдать вместе с тобой' 😂",
            "Донат 100 руб: 'На новые руки, пожалуйста!' ✋",
            "Подписка: 'Ты так плохо играешь, что это уже арт' 🎨",
            "Донат: 'Купи себе лучшее интернет-соединение!' 🌐",
            "Чел, я бы донатил, но боюсь, ты потратишь на глупости 🤪",
            "Подписка: 'Подписываюсь из жалости' 🥺",
            "Донат 200 руб: 'На уроки игры, пожалуйста!' 🎓",
            "Подписка: 'Ты — живое доказательство, что надежда есть у всех' 🙏",
            "Донат: 'За то, что терпишь нас в чате' 💖",

// Реакции на стримера
            "Стример, ты сегодня как сонный муравьед 🐜",
            "Бро, ты орёшь как будто тебя режут, а это просто катка 😱",
            "Когда стример делает facepalm: 'Можно уже руку пришить?' 🤦",
            "Ты смеёшься как телепузик, который увидел мем 👾",
            "Стример, твоя реакция — это 80% контента здесь 😂",
            "Когда проиграл: 'Виноват контроллер/мышь/сосед/погода!' 🌧️",
            "Ты орёшь так, будто у тебя забрали последнюю печеньку 🍪",
            "Стример, твоё лицо, когда проиграл — новый мем 😶",
            "Когда чисто выиграл: 'Да я так и планировал!' 🧠",
            "Ты сегодня как кот, который пытается играть в шахматы 🐱♟️",

// Абсурдный сленг
            "Чел, ты че, в танке родился? 🚜",
            "Это не fail, это 'креативный подход' 🧠",
            "Ты играешь как будто у тебя лапки 🐾",
            "Когда проиграл: 'Я просто тестировал чат на токсичность' 🧪",
            "Ты — ходячий баг-репорт 🐞",
            "Геймплей как у слепого крота 🕳️",
            "Это не лаги, это 'альтернативный стиль игры' 🌀",
            "Ты что, играешь через торрент? 🧲",
            "Твой ПК звучит как пылесос 90-х 🌀",
            "Чел, ты че, на печатной машинке играешь? ⌨️",

// Дополнительные с ошибками
            "Аааа, бл**ь! Ой, сорян... 😅",
            "Какой же ты лу*зер (ну ладно, good game)",
            "Это п**здец! Ой, простите мой французский... 🇫🇷",
            "Чел, ты де*би... ой, то есть 'оригинально играешь'!",
            "Настолько туп*го... ой, 'нестандартного' геймплея я не видел!",
            "Играешь как будто тебя в детстве... кхм, 'учили по-особенному'",
            "Бля*ь, ну как так... ой, 'вот это поворот'!",
            "Да е*ать... то есть 'давайте без эмоций'! 🧘",
            "Это не лаги, это... ладно, это лаги! 😂",
            "Ты че, с луны свалил... ой, 'интересный подход'! 🌕",
            "Какой твой любимый момент в игре?"
        ];

// База данных никнеймов
        const nicknames = [
            "GamerPro", "StreamKing", "CyberWarrior", "PixelHero", "TwitchMaster",
            "GameLord", "NoobDestroyer", "EpicPlayer", "LagFree", "PingMaster",
            "FastFinger", "QuickShot", "HeadHunter", "SniperElite", "StealthNinja",
            "ShadowWalker", "DragonSlayer", "MagicCaster", "IronTank", "SwiftRunner",
            "DarkKnight", "LightBringer", "FireMage", "IceQueen", "ThunderGod",
            "WindRider", "EarthShaker", "WaterBender", "SpaceExplorer", "TimeTraveler",
            "CosmicHero", "GalacticLord", "StarChaser", "MoonWalker", "SunKing",
            "PlanetDestroyer", "BlackHole", "Nebula", "Comet", "Meteor",
            "Supernova", "Pulsar", "Quasar", "VoidWalker", "Infinity",
            "Eternal", "Immortal", "Legendary", "Mythic", "Divine"
        ];

// База данных эмоций
        const emotes = [
            "😀", "😁", "😂", "🤣", "😃", "😄", "😅", "😆", "😉", "😊",
            "😋", "😎", "😍", "😘", "😜", "😝", "😏", "😒", "😔", "😖",
            "😤", "😭", "😱", "😳", "😴", "🤔", "🤗", "🤩", "🤪", "🤯",
            "🥳", "🥺", "🧐", "👀", "👋", "👌", "👍", "👎", "👏", "👻",
            "💀", "💋", "💔", "💖", "💘", "💙", "💚", "💛", "💜", "💝",
            "💯", "🔥", "🌟", "✨", "🎉", "🎮", "🎯", "🏆", "🏅", "🍕",
            "🍺", "🎂", "🎁", "🎈", "🎊", "🎶", "🎵", "🏆", "⚡", "🌈"
        ];

// База данных событий
        const events = [
            { text: "Пользователь {user} подписался на канал! 🎉", type: "subscription" },
            { text: "{user} донатил 100 рублей! 💖", type: "donation" },
            { text: "Новый рекорд: {user} достиг {number} уровня! 🏆", type: "achievement" },
            { text: "Стрим достиг {number} зрителей! 🎊", type: "milestone" },
            { text: "{user} получил дроп! 🎁", type: "drop" },
            { text: "Стример запускает конкурс! Участвуйте! 🏅", type: "contest" },
            { text: "Новый модератор: {user}! 👑", type: "moderator" },
            { text: "Розыгрыш начался! Участвуйте! 🎰", type: "giveaway" },
            { text: "Стрим продлится еще {number} часов! ⏳", type: "extension" },
            { text: "Специальный гость присоединился к стриму! 🎤", type: "guest" }
        ];

// Функция для получения случайного элемента из массива
        function getRandomElement(array) {
            return array[Math.floor(Math.random() * array.length)];
        }

// Функция для генерации случайного числа
        function getRandomNumber(min, max) {
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }

// Функция для добавления сообщения в чат
        function addMessage(user, message, isEvent = false) {
            const chatMessages = document.getElementById('chat-messages');
            const messageElement = document.createElement('div');
            
            if (isEvent) {
                messageElement.className = 'event-message';
                messageElement.innerHTML = message;
            } else {
                messageElement.className = 'message';
                messageElement.innerHTML = `
                    <div class="user-avatar" style="background-image: url('${user.avatar}')"></div>
                    <div class="message-content">
                        <span class="username" style="color: ${user.color}">${user.name}</span>
                        <span class="message-text">${message}</span>
                    </div>
                `;
            }
            
            chatMessages.appendChild(messageElement);
            chatMessages.scrollTop = chatMessages.scrollHeight;
            
            // Анимация "оживления" пользователя
            if (!isEvent) {
                setTimeout(() => {
                    const avatar = messageElement.querySelector('.user-avatar');
                    avatar.style.transform = 'scale(1.1)';
                    setTimeout(() => {
                        avatar.style.transform = 'scale(1)';
                    }, 300);
                }, 100);
            }
        }

// Функция для генерации случайного сообщения
        function generateRandomMessage() {
            const user = getRandomElement(users);
            let message = getRandomElement(messages);
            
            // Заменяем плейсхолдеры в сообщениях
            message = message.replace("{игра}", getRandomElement(["Dota 2", "CS:GO", "Valorant", "Minecraft", "Fortnite", "GTA V", "Apex Legends", "League of Legends"]));
            
            // Добавляем случайные эмоции с вероятностью 30%
            if (Math.random() < 0.3) {
                message += " " + getRandomElement(emotes);
                // С вероятностью 10% добавляем вторую эмоцию
                if (Math.random() < 0.1) {
                    message += " " + getRandomElement(emotes);
                }
            }
            
            addMessage(user, message);
        }

// Функция для генерации случайного события
        function generateRandomEvent() {
            const event = getRandomElement(events);
            const user = getRandomElement(users);
            let eventText = event.text;
            
            // Заменяем плейсхолдеры
            eventText = eventText.replace("{user}", `<span style="color: ${user.color}">${user.name}</span>`);
            eventText = eventText.replace("{number}", getRandomNumber(1, 100));
            
            addMessage(null, eventText, true);
        }

// Функция для обработки отправки сообщения пользователем
        function handleSendMessage() {
            const input = document.getElementById('message-input');
            const message = input.value.trim();
            
            if (message) {
                const user = {
                    name: "Вы",
                    color: "#9147ff",
                    avatar: "https://i.pravatar.cc/150?img=11"
                };
                
                addMessage(user, message);
                input.value = '';
                
                // Генерируем ответы от других пользователей
                setTimeout(() => {
                    generateRandomMessage();
                }, 1000);
                
                // С вероятностью 20% генерируем событие после сообщения пользователя
                if (Math.random() < 0.2) {
                    setTimeout(() => {
                        generateRandomEvent();
                    }, 2000);
                }
            }
        }

// Инициализация чата
        function initChat() {
            // Добавляем начальные сообщения
            for (let i = 0; i < 10; i++) {
                setTimeout(() => {
                    generateRandomMessage();
                }, i * 800);
            }
            
            // Добавляем начальное событие
            setTimeout(() => {
                generateRandomEvent();
            }, 5000);
            
            // Настраиваем интервал для новых сообщений
            setInterval(() => {
                if (Math.random() < 0.7) { // 70% вероятность нового сообщения
                    generateRandomMessage();
                }
            }, 3000);
            
            // Настраиваем интервал для новых событий
            setInterval(() => {
                if (Math.random() < 0.3) { // 30% вероятность нового события
                    generateRandomEvent();
                }
            }, 10000);
            
            // Настраиваем обработчики событий
            document.getElementById('send-button').addEventListener('click', handleSendMessage);
            document.getElementById('message-input').addEventListener('keypress', (e) => {
                if (e.key === 'Enter') {
                    handleSendMessage();
                }
            });
        }

// Запускаем чат при загрузке страницы
        window.onload = initChat;
    </script>
</body>
</html>

HTML CSS JS Tidy

NoTwich

>_Console

Leave a Comment Cancel reply

>_Console

File Setting

Code Playground Setting

Add External Stylesheets and Script

Leave a Comment Cancel reply