{"id":296,"date":"2026-01-30T06:27:36","date_gmt":"2026-01-30T06:27:36","guid":{"rendered":"https:\/\/radiohy.eu\/?page_id=296"},"modified":"2026-01-30T17:39:04","modified_gmt":"2026-01-30T17:39:04","slug":"radio-hy-chat","status":"publish","type":"page","link":"https:\/\/radiohy.eu\/hu\/radio-hy-chat\/","title":{"rendered":"Radio Hy Chat"},"content":{"rendered":"\n<!-- R\u00c1DI\u00d3 HY CHAT - K\u00c9TNYELV\u0170 (HU\/EN) -->\n<div id=\"tarsalgo-chat\" style=\"font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, Cantarell, sans-serif; max-width: 900px; margin: 0 auto; background: #000000; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(255,215,0,0.2); color: #FFD700; border: 2px solid #FFD700;\">\n\n  <!-- Bel\u00e9p\u0151 k\u00e9perny\u0151 -->\n  <div id=\"login-screen\" style=\"padding: 40px; text-align: center; background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #000000 100%); min-height: 650px; display: flex; flex-direction: column; justify-content: center;\">\n    \n    <!-- Nyelvv\u00e1lt\u00f3 bel\u00e9p\u0151k\u00e9perny\u0151n -->\n    <div style=\"position: absolute; top: 20px; right: 20px; z-index: 10;\">\n      <button onclick=\"toggleLanguage()\" id=\"lang-btn-login\" style=\"background: rgba(255,215,0,0.1); border: 2px solid #FFD700; color: #FFD700; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 14px; display: flex; align-items: center; gap: 8px;\">\n        \ud83c\udded\ud83c\uddfa <span id=\"lang-text-login\">Magyar<\/span>\n      <\/button>\n    <\/div>\n\n    <div style=\"margin-bottom: 25px;\">\n      <div id=\"logo-preview\" style=\"width: 100px; height: 100px; margin: 0 auto 10px auto; background: linear-gradient(135deg, #FFD700, #FFA500); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 40px; border: 4px solid #FFD700; box-shadow: 0 0 30px rgba(255,215,0,0.5); color: #000;\">\n        \ud83d\udcfb\n      <\/div>\n      <label style=\"cursor: pointer; background: rgba(255,215,0,0.1); padding: 10px 20px; border-radius: 25px; color: #FFD700; font-size: 13px; display: inline-block; border: 2px dashed #FFD700;\">\n        \ud83d\uddbc\ufe0f <span data-lang=\"logo_upload\">Log\u00f3 felt\u00f6lt\u00e9se<\/span>\n        <input type=\"file\" id=\"logo-input\" accept=\"image\/*\" style=\"display: none;\" onchange=\"handleLogoUpload(this)\">\n      <\/label>\n    <\/div>\n\n    <h2 style=\"margin: 0 0 15px 0; font-size: 34px; color: #FFD700; text-shadow: 0 0 20px rgba(255,215,0,0.5); font-weight: 800;\">R\u00c1DI\u00d3 HY<\/h2>\n    <p style=\"margin-bottom: 25px; color: #FFA500; font-size: 14px; text-transform: uppercase; letter-spacing: 2px;\" data-lang=\"choose_status\">V\u00e1laszd ki a st\u00e1tuszod!<\/p>\n    \n    <input type=\"text\" id=\"username-input\" data-lang-placeholder=\"nickname\" placeholder=\"Beceneved...\" maxlength=\"20\" style=\"width: 100%; max-width: 300px; padding: 14px 24px; border: 2px solid #FFD700; border-radius: 30px; font-size: 16px; margin: 0 auto 20px auto; background: rgba(0,0,0,0.8); color: #FFD700; outline: none; text-align: center;\">\n\n    <!-- SZEREPK\u00d6R V\u00c1LASZT\u00c1S -->\n    <div style=\"margin-bottom: 20px; display: flex; flex-direction: column; gap: 10px; align-items: center;\">\n      \n      <!-- Sima felhaszn\u00e1l\u00f3 -->\n      <label style=\"display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,0.05); padding: 12px 20px; border-radius: 25px; border: 2px solid #444; cursor: pointer; width: 300px; transition: all 0.3s;\">\n        <input type=\"radio\" name=\"role\" id=\"role-user\" value=\"user\" checked style=\"width: 18px; height: 18px; accent-color: #FFD700;\">\n        <span style=\"font-size: 20px;\">\ud83d\udc64<\/span>\n        <div style=\"text-align: left;\">\n          <div style=\"font-weight: bold; color: #fff;\" data-lang=\"listener\">Hallgat\u00f3<\/div>\n          <div style=\"font-size: 11px; color: #888;\" data-lang=\"listener_desc\">Sima felhaszn\u00e1l\u00f3i m\u00f3d<\/div>\n        <\/div>\n      <\/label>\n\n      <!-- M\u0171sorvezet\u0151 -->\n      <label style=\"display: flex; align-items: center; gap: 10px; background: rgba(255,165,0,0.1); padding: 12px 20px; border-radius: 25px; border: 2px solid #FFA500; cursor: pointer; width: 300px; transition: all 0.3s;\">\n        <input type=\"radio\" name=\"role\" id=\"role-mod\" value=\"moderator\" style=\"width: 18px; height: 18px; accent-color: #FFA500;\">\n        <span style=\"font-size: 20px;\">\ud83c\udf99\ufe0f<\/span>\n        <div style=\"text-align: left;\">\n          <div style=\"font-weight: bold; color: #FFA500;\" data-lang=\"moderator\">M\u0171sorvezet\u0151<\/div>\n          <div style=\"font-size: 11px; color: #888;\" data-lang=\"password_required\">Jelsz\u00f3 sz\u00fcks\u00e9ges!<\/div>\n        <\/div>\n      <\/label>\n\n      <!-- Admin -->\n      <label style=\"display: flex; align-items: center; gap: 10px; background: rgba(255,0,0,0.1); padding: 12px 20px; border-radius: 25px; border: 2px solid #ff5252; cursor: pointer; width: 300px; transition: all 0.3s;\">\n        <input type=\"radio\" name=\"role\" id=\"role-admin\" value=\"admin\" style=\"width: 18px; height: 18px; accent-color: #ff5252;\">\n        <span style=\"font-size: 20px;\">\u2b50<\/span>\n        <div style=\"text-align: left;\">\n          <div style=\"font-weight: bold; color: #ff5252;\" data-lang=\"admin\">Admin<\/div>\n          <div style=\"font-size: 11px; color: #888;\" data-lang=\"password_required\">Jelsz\u00f3 sz\u00fcks\u00e9ges<\/div>\n        <\/div>\n      <\/label>\n\n      <!-- JELSZ\u00d3 MEZ\u0150 -->\n      <input type=\"password\" id=\"role-password\" data-lang-placeholder=\"enter_password\" placeholder=\"Add meg a jelszavad...\" style=\"margin-top: 10px; padding: 12px 20px; border-radius: 25px; border: 2px solid #FFD700; background: rgba(0,0,0,0.8); color: #FFD700; width: 280px; display: none; text-align: center; font-size: 14px; outline: none;\">\n      \n      <div id=\"password-hint\" style=\"font-size: 11px; color: #666; margin-top: 5px; display: none;\">\n        <span data-lang=\"mod_hint\">M\u0171sorvezet\u0151k: add meg a neved + jelszavad<\/span><br>\n        <span data-lang=\"admin_hint\">Admin: admin jelsz\u00f3<\/span>\n      <\/div>\n    <\/div>\n\n    <button onclick=\"login()\" style=\"background: linear-gradient(135deg, #FFD700, #FFA500); color: #000000; border: none; padding: 16px 50px; border-radius: 30px; font-size: 18px; font-weight: bold; cursor: pointer; box-shadow: 0 0 20px rgba(255,215,0,0.4);\" data-lang=\"join\">Csatlakoz\u00e1s \ud83c\udfa7<\/button>\n  <\/div>\n\n  <!-- Chat fel\u00fclet -->\n  <div id=\"chat-screen\" style=\"display: none; height: 700px; position: relative; flex-direction: column; background: #000000;\">\n    \n    <!-- Fejl\u00e9c -->\n    <div style=\"background: linear-gradient(180deg, #0a0a0a, #000000); padding: 12px 20px; border-bottom: 2px solid #FFD700; flex-shrink: 0;\">\n      <div style=\"display: flex; justify-content: space-between; align-items: center;\">\n        <div style=\"display: flex; align-items: center; gap: 12px;\">\n          <img decoding=\"async\" id=\"chat-logo\" src=\"\" style=\"width: 45px; height: 45px; border-radius: 50%; object-fit: cover; border: 3px solid #FFD700; display: none; box-shadow: 0 0 15px rgba(255,215,0,0.4);\">\n          <div style=\"width: 12px; height: 12px; background: #FFD700; border-radius: 50%; box-shadow: 0 0 15px #FFD700; animation: pulse 2s infinite;\"><\/div>\n          <div>\n            <div style=\"font-weight: 800; font-size: 20px; color: #FFD700;\">R\u00c1DI\u00d3 HY CHAT<\/div>\n            <div style=\"font-size: 11px; color: #FFA500;\" data-lang=\"legend\">\u2b50 Admin | \ud83c\udf99\ufe0f Moderator | \ud83d\udc64 Listener<\/div>\n          <\/div>\n        <\/div>\n        \n        <div style=\"display: flex; gap: 10px; align-items: center;\">\n          <!-- \ud83c\udf0d NYELVV\u00c1LT\u00d3 -->\n          <button onclick=\"toggleLanguage()\" id=\"lang-btn-chat\" style=\"background: rgba(255,215,0,0.1); border: 2px solid #FFD700; color: #FFD700; padding: 8px 12px; border-radius: 20px; cursor: pointer; font-size: 16px;\" title=\"Switch language\">\n            \ud83c\udded\ud83c\uddfa\n          <\/button>\n\n          <div style=\"background: rgba(255,215,0,0.1); padding: 8px 15px; border-radius: 20px; border: 1px solid #FFD700;\">\n            <span style=\"font-size: 12px; font-weight: 600;\">\ud83d\udc65 <span id=\"online-count-display\">0<\/span><\/span>\n          <\/div>\n          \n          <!-- \ud83d\udd0a HANGKAPCSOL\u00d3 -->\n          <button onclick=\"toggleSound()\" id=\"sound-toggle\" title=\"Notification sound\" style=\"background: rgba(255,215,0,0.15); color: #FFD700; border: 2px solid #FFD700; padding: 8px 16px; border-radius: 20px; font-size: 13px; cursor: pointer; opacity: 0.5;\">\ud83d\udd15<\/button>\n          \n          <button onclick=\"toggleUserList()\" data-lang-title=\"list\" title=\"Lista\" style=\"background: rgba(255,215,0,0.15); color: #FFD700; border: 2px solid #FFD700; padding: 8px 16px; border-radius: 20px; font-size: 13px; cursor: pointer;\">\n            <span data-lang=\"list\">Lista<\/span>\n          <\/button>\n          <button onclick=\"toggleAdminPanel()\" id=\"admin-panel-btn\" style=\"display: none; background: linear-gradient(135deg, #ff5252, #d32f2f); color: #fff; border: none; padding: 8px 16px; border-radius: 20px; font-size: 12px; cursor: pointer;\">\u2699\ufe0f <span data-lang=\"admin_panel\">Admin<\/span><\/button>\n          <button onclick=\"logout()\" style=\"background: transparent; color: #FFD700; border: 2px solid #FFD700; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 13px;\" data-lang=\"exit\">Kil\u00e9p\u00e9s<\/button>\n        <\/div>\n      <\/div>\n      \n      <!-- Online lista -->\n      <div id=\"user-list\" style=\"display: none; background: rgba(0,0,0,0.95); border-radius: 12px; padding: 15px; margin-top: 10px; border: 1px solid #FFD700; max-height: 250px; overflow-y: auto;\">\n        <div style=\"font-size: 12px; color: #FFD700; margin-bottom: 10px; font-weight: 600; border-bottom: 1px solid #FFD700; padding-bottom: 8px;\" data-lang=\"studio_members\">\n          St\u00fadi\u00f3 tagjai:\n        <\/div>\n        <div id=\"users-container\" style=\"display: flex; flex-wrap: wrap; gap: 8px;\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- Admin Panel -->\n    <div id=\"admin-panel\" style=\"display: none; background: linear-gradient(135deg, #1a1a1a, #000000); padding: 20px; border-bottom: 2px solid #FFD700;\">\n      <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;\">\n        <strong style=\"color: #FFD700; font-size: 16px;\">\u2b50 <span data-lang=\"admin_title\">Adminisztr\u00e1tori Panel<\/span><\/strong>\n        <button onclick=\"toggleAdminPanel()\" style=\"background: none; border: none; color: #FFD700; cursor: pointer; font-size: 24px;\">\u2715<\/button>\n      <\/div>\n      <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px;\">\n        <button onclick=\"clearAllMessages()\" style=\"background: linear-gradient(135deg, #ff5252, #d32f2f); color: white; border: none; padding: 15px; border-radius: 10px; cursor: pointer; font-weight: 600;\">\ud83d\uddd1\ufe0f <span data-lang=\"clear_chat\">Chat t\u00f6rl\u00e9se<\/span><\/button>\n        <button onclick=\"clearInactiveUsers()\" style=\"background: linear-gradient(135deg, #ff9800, #f57c00); color: white; border: none; padding: 15px; border-radius: 10px; cursor: pointer; font-weight: 600;\">\ud83e\uddf9 <span data-lang=\"clear_inactive\">Inakt\u00edvak t\u00f6rl\u00e9se<\/span><\/button>\n      <\/div>\n      <div style=\"background: rgba(255,0,0,0.1); border: 1px solid #ff5252; border-radius: 8px; padding: 12px;\">\n        <div style=\"color: #ff5252; font-weight: 600; margin-bottom: 8px; font-size: 13px;\">\ud83d\udeab <span data-lang=\"banned_users\">Kitiltottak:<\/span><\/div>\n        <div id=\"banned-list\" style=\"display: flex; flex-wrap: wrap; gap: 6px; font-size: 12px;\">\n          <span style=\"font-style: italic; opacity: 0.5;\" data-lang=\"no_banned\">Nincs kitiltott<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u00dczenetek -->\n    <div id=\"messages\" style=\"flex: 1; overflow-y: auto; padding: 20px; background: #000000; scroll-behavior: smooth; display: flex; flex-direction: column; gap: 8px;\">\n      <div style=\"text-align: center; color: #666; font-size: 13px; margin: 20px 0; padding: 20px; border: 1px dashed #333;\">\n        \ud83c\udfb5 <span style=\"color: #FFD700;\" data-lang=\"welcome\">\u00dcdv\u00f6z\u00f6l a R\u00e1di\u00f3 HY Chat!<\/span>\n      <\/div>\n    <\/div>\n\n    <!-- Input -->\n    <div style=\"background: linear-gradient(0deg, #0a0a0a, #000000); padding: 20px; border-top: 2px solid #FFD700; position: relative;\">\n      <div style=\"display: flex; gap: 12px; align-items: flex-end; background: rgba(255,255,255,0.05); padding: 10px; border-radius: 30px; border: 1px solid #333;\">\n        <button onclick=\"toggleEmoji()\" style=\"background: transparent; border: none; font-size: 26px; cursor: pointer; padding: 8px; color: #FFD700; border-radius: 50%; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;\">\ud83d\ude0a<\/button>\n        <button onclick=\"toggleGif()\" style=\"background: transparent; border: none; font-size: 15px; cursor: pointer; padding: 8px; font-weight: bold; color: #FFD700; border-radius: 50%; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;\">GIF<\/button>\n        <label style=\"cursor: pointer; font-size: 22px; color: #FFD700; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%;\">\n          \ud83d\udcce\n          <input type=\"file\" id=\"file-input\" accept=\"image\/*\" style=\"display: none;\" onchange=\"handleFileUpload(this)\">\n        <\/label>\n        <input type=\"text\" id=\"message-input\" data-lang-placeholder=\"type_message\" placeholder=\"\u00cdrj \u00fczenetet...\" maxlength=\"500\" onkeypress=\"handleKeyPress(event)\" style=\"flex: 1; background: transparent; border: none; padding: 12px 15px; color: #FFD700; font-size: 15px; outline: none;\">\n        <button onclick=\"sendMessage()\" style=\"background: linear-gradient(135deg, #FFD700, #FFA500); color: #000; border: none; border-radius: 50%; width: 46px; height: 46px; cursor: pointer; font-size: 20px; display: flex; align-items: center; justify-content: center; font-weight: bold;\">\u27a4<\/button>\n      <\/div>\n\n      <!-- Pickers -->\n      <div id=\"emoji-picker\" style=\"display: none; position: absolute; bottom: 90px; left: 20px; background: #1a1a1a; border-radius: 16px; box-shadow: 0 -4px 30px rgba(255,215,0,0.3); z-index: 1000; border: 2px solid #FFD700;\">\n        <emoji-picker style=\"width: 320px; height: 400px; --background: #1a1a1a;\"><\/emoji-picker>\n      <\/div>\n      <div id=\"gif-picker\" style=\"display: none; position: absolute; bottom: 90px; left: 70px; background: #000; border-radius: 16px; box-shadow: 0 -10px 40px rgba(0,0,0,0.8); z-index: 1000; width: 400px; max-height: 450px; border: 2px solid #FFD700; overflow: hidden; flex-direction: column;\">\n        <div style=\"padding: 15px; border-bottom: 1px solid #333; background: #0a0a0a;\">\n          <input type=\"text\" id=\"gif-search\" data-lang-placeholder=\"search_gif\" placeholder=\"Keress GIF-et...\" style=\"width: 100%; padding: 12px 18px; border-radius: 25px; border: 1px solid #FFD700; background: #000; color: #FFD700; outline: none;\" onkeyup=\"if(event.key==='Enter') searchGif(this.value)\">\n        <\/div>\n        <div style=\"padding: 12px 15px; background: #0a0a0a; border-bottom: 1px solid #333;\">\n          <div style=\"display: flex; gap: 8px;\">\n            <button onclick=\"loadGifCategory('trending')\" style=\"background: #FFD700; color: #000; border: none; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 12px; font-weight: bold;\">\ud83d\udd25 <span data-lang=\"popular\">N\u00e9pszer\u0171<\/span><\/button>\n            <button onclick=\"loadGifCategory('reactions')\" style=\"background: transparent; color: #FFD700; border: 1px solid #FFD700; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 12px;\">\ud83d\ude0a <span data-lang=\"reactions\">Reakci\u00f3k<\/span><\/button>\n            <button onclick=\"loadGifCategory('music')\" style=\"background: transparent; color: #FFD700; border: 1px solid #FFD700; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 12px;\">\ud83c\udfb5 <span data-lang=\"music\">Zene<\/span><\/button>\n          <\/div>\n        <\/div>\n        <div id=\"gif-results\" style=\"padding: 15px; overflow-y: auto; flex: 1; background: #000;\">\n          <div style=\"display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;\">\n            <div style=\"grid-column: 1 \/ -1; text-align: center; color: #666; padding: 40px;\" data-lang=\"choose\">V\u00e1lassz!<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<style>\n  @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }\n  @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\n  .message-anim { animation: fadeIn 0.3s ease-out forwards; }\n  .user-tag { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 20px; font-size: 13px; cursor: pointer; border: 1px solid; position: relative; }\n  .role-user { background: rgba(255,255,255,0.05); border-color: #666; color: #aaa; }\n  .role-moderator { background: rgba(255,165,0,0.15); border-color: #FFA500; color: #FFA500; box-shadow: 0 0 10px rgba(255,165,0,0.1); }\n  .role-admin { background: rgba(255,0,0,0.15); border-color: #ff5252; color: #ff5252; box-shadow: 0 0 10px rgba(255,0,0,0.2); }\n  .ban-btn { margin-left: 5px; color: #ff5252; cursor: pointer; font-size: 14px; }\n  ::-webkit-scrollbar { width: 8px; }\n  ::-webkit-scrollbar-track { background: #000; }\n  ::-webkit-scrollbar-thumb { background: #FFD700; border-radius: 4px; }\n<\/style>\n\n<script type=\"module\" src=\"https:\/\/cdn.jsdelivr.net\/npm\/emoji-picker-element@^1\/index.js\"><\/script>\n\n<script type=\"module\">\n  import { initializeApp } from 'https:\/\/www.gstatic.com\/firebasejs\/9.22.0\/firebase-app.js';\n  import { getDatabase, ref, push, onChildAdded, onChildRemoved, onValue, remove, set, update, onDisconnect } from 'https:\/\/www.gstatic.com\/firebasejs\/9.22.0\/firebase-database.js';\n\n  const firebaseConfig = {\n    apiKey: \"AIzaSyAQFst-Oo7YrIaBZTgnYwGV_857TCDdCcU\",\n    authDomain: \"radio-hy-chat.firebaseapp.com\",\n    databaseURL: \"https:\/\/radio-hy-chat-default-rtdb.europe-west1.firebasedatabase.app\",\n    projectId: \"radio-hy-chat\",\n    storageBucket: \"radio-hy-chat.firebasestorage.app\",\n    messagingSenderId: \"252526281612\",\n    appId: \"1:252526281612:web:0ac57a8ac3f8098f79cca9\"\n  };\n\n  const GIPHY_API_KEY = 'jcPTl2f6Vm8msSqiQNaqnYWalbhOvcHm';\n  const ADMIN_PASSWORD = 'admin123';\n  \n  const MODERATORS = {\n    'jani': 'jelszo123',\n    'pista': 'radio456',\n    'risa': 'musor789',\n  };\n\n  \/\/ \ud83c\udf0d FORD\u00cdT\u00c1SOK\n  const translations = {\n    hu: {\n      logo_upload: \"Log\u00f3 felt\u00f6lt\u00e9se\",\n      choose_status: \"V\u00e1laszd ki a st\u00e1tuszod!\",\n      nickname: \"Beceneved...\",\n      listener: \"Hallgat\u00f3\",\n      listener_desc: \"Sima felhaszn\u00e1l\u00f3i m\u00f3d\",\n      moderator: \"M\u0171sorvezet\u0151\",\n      admin: \"Admin\",\n      password_required: \"Jelsz\u00f3 sz\u00fcks\u00e9ges!\",\n      enter_password: \"Add meg a jelszavad...\",\n      mod_hint: \"M\u0171sorvezet\u0151k: add meg a neved + jelszavad\",\n      admin_hint: \"Admin: admin jelsz\u00f3\",\n      join: \"Csatlakoz\u00e1s \ud83c\udfa7\",\n      legend: \"\u2b50 Admin | \ud83c\udf99\ufe0f Moderator | \ud83d\udc64 Listener\",\n      list: \"Lista\",\n      admin_panel: \"Admin\",\n      exit: \"Kil\u00e9p\u00e9s\",\n      studio_members: \"St\u00fadi\u00f3 tagjai:\",\n      admin_title: \"Adminisztr\u00e1tori Panel\",\n      clear_chat: \"Chat t\u00f6rl\u00e9se\",\n      clear_inactive: \"Inakt\u00edvak t\u00f6rl\u00e9se\",\n      banned_users: \"Kitiltottak:\",\n      no_banned: \"Nincs kitiltott\",\n      welcome: \"\u00dcdv\u00f6z\u00f6l a R\u00e1di\u00f3 HY Chat!\",\n      type_message: \"\u00cdrj \u00fczenetet...\",\n      search_gif: \"Keress GIF-et...\",\n      popular: \"N\u00e9pszer\u0171\",\n      reactions: \"Reakci\u00f3k\",\n      music: \"Zene\",\n      choose: \"V\u00e1lassz!\",\n      connected_msg: \"csatlakozott\",\n      joined_as: \"Csatlakozott:\",\n      banned: \"Ki vagy tiltva!\",\n      delete_confirm: \"T\u00f6rl\u00f6d?\",\n      clear_all_confirm: \"T\u00f6rl\u00f6d az \u00d6SSZES \u00fczenetet?\",\n      inactive_deleted: \"inakt\u00edv t\u00f6r\u00f6lve\",\n      enter_nickname: \"Add meg a neved!\",\n      wrong_password: \"Hib\u00e1s jelsz\u00f3!\",\n      wrong_mod_password: \"Hib\u00e1s n\u00e9v vagy jelsz\u00f3!\",\n      max_size_500: \"Maximum 500KB!\",\n      max_size_3mb: \"Maximum 3MB!\",\n      notification_on: \"\u00c9rtes\u00edt\u0151 hang: BE\",\n      notification_off: \"\u00c9rtes\u00edt\u0151 hang: KI\"\n    },\n    en: {\n      logo_upload: \"Upload logo\",\n      choose_status: \"Choose your status!\",\n      nickname: \"Nickname...\",\n      listener: \"Listener\",\n      listener_desc: \"Standard user mode\",\n      moderator: \"Moderator\",\n      admin: \"Admin\",\n      password_required: \"Password required!\",\n      enter_password: \"Enter password...\",\n      mod_hint: \"Moderators: enter your name + password\",\n      admin_hint: \"Admin: admin password\",\n      join: \"Join \ud83c\udfa7\",\n      legend: \"\u2b50 Admin | \ud83c\udf99\ufe0f Moderator | \ud83d\udc64 Listener\",\n      list: \"List\",\n      admin_panel: \"Admin\",\n      exit: \"Exit\",\n      studio_members: \"Studio members:\",\n      admin_title: \"Administration Panel\",\n      clear_chat: \"Clear chat\",\n      clear_inactive: \"Clear inactive\",\n      banned_users: \"Banned users:\",\n      no_banned: \"No banned users\",\n      welcome: \"Welcome to Radio HY Chat!\",\n      type_message: \"Type a message...\",\n      search_gif: \"Search GIF...\",\n      popular: \"Popular\",\n      reactions: \"Reactions\",\n      music: \"Music\",\n      choose: \"Choose!\",\n      connected_msg: \"joined\",\n      joined_as: \"Joined as:\",\n      banned: \"You are banned!\",\n      delete_confirm: \"Delete?\",\n      clear_all_confirm: \"Delete ALL messages?\",\n      inactive_deleted: \"inactive users deleted\",\n      enter_nickname: \"Enter your nickname!\",\n      wrong_password: \"Wrong password!\",\n      wrong_mod_password: \"Wrong name or password!\",\n      max_size_500: \"Max 500KB!\",\n      max_size_3mb: \"Max 3MB!\",\n      notification_on: \"Sound: ON\",\n      notification_off: \"Sound: OFF\"\n    }\n  };\n\n  let app, db, currentUser = null, messagesRef, presenceRef, activityInterval;\n  let userLogo = null;\n  let bannedUsers = new Set();\n  \n  \/\/ \ud83d\udd0a HANG\u00c9RTES\u00cdT\u00c9S V\u00c1LTOZ\u00d3K\n  let soundEnabled = false;\n  let audioContext = null;\n  let lastMessageTimestamp = 0;\n  let isReconnecting = false;\n\n  \/\/ \ud83c\udf0d NYELV V\u00c1LTOZ\u00d3 - alapb\u00f3l magyar\n  let currentLang = localStorage.getItem('radiohy_lang') || 'hu';\n\n  const ROLES = {\n    user: { \n      icon: '\ud83d\udc64', \n      color: '#FFD700', \n      name: { hu: 'Hallgat\u00f3', en: 'Listener' }, \n      class: 'role-user' \n    },\n    moderator: { \n      icon: '\ud83c\udf99\ufe0f', \n      color: '#FFA500', \n      name: { hu: 'M\u0171sorvezet\u0151', en: 'Moderator' }, \n      class: 'role-moderator' \n    },\n    admin: { \n      icon: '\u2b50', \n      color: '#ff5252', \n      name: { hu: 'Admin', en: 'Admin' }, \n      class: 'role-admin' \n    }\n  };\n\n  \/\/ \ud83c\udf0d NYELV LEK\u00c9RDEZ\u0150 F\u00dcGGV\u00c9NY\n  function t(key) {\n    return translations[currentLang][key] || key;\n  }\n\n  \/\/ \ud83c\udf0d UI FRISS\u00cdT\u00c9SE A NYELV ALAPJ\u00c1N\n  function updateLanguageUI() {\n    \/\/ Sz\u00f6vegek friss\u00edt\u00e9se\n    document.querySelectorAll('[data-lang]').forEach(elem => {\n      const key = elem.getAttribute('data-lang');\n      if (translations[currentLang][key]) {\n        elem.textContent = translations[currentLang][key];\n      }\n    });\n\n    \/\/ Placeholderek friss\u00edt\u00e9se\n    document.querySelectorAll('[data-lang-placeholder]').forEach(elem => {\n      const key = elem.getAttribute('data-lang-placeholder');\n      if (translations[currentLang][key]) {\n        elem.placeholder = translations[currentLang][key];\n      }\n    });\n\n    \/\/ Title attrib\u00fatumok\n    document.querySelectorAll('[data-lang-title]').forEach(elem => {\n      const key = elem.getAttribute('data-lang-title');\n      if (translations[currentLang][key]) {\n        elem.title = translations[currentLang][key];\n      }\n    });\n\n    \/\/ Nyelvv\u00e1lt\u00f3 gomb friss\u00edt\u00e9se\n    const langBtn = document.getElementById('lang-btn-chat') || document.getElementById('lang-btn-login');\n    const langText = document.getElementById('lang-text-login');\n    \n    if (currentLang === 'hu') {\n      if (langBtn) {\n        langBtn.innerHTML = '\ud83c\udded\ud83c\uddfa <span id=\"lang-text-login\">Magyar<\/span>';\n      }\n    } else {\n      if (langBtn) {\n        langBtn.innerHTML = '\ud83c\uddec\ud83c\udde7 <span id=\"lang-text-login\">English<\/span>';\n      }\n    }\n\n    \/\/ Rendszer\u00fczenetek \u00fajraford\u00edt\u00e1sa ha van akt\u00edv felhaszn\u00e1l\u00f3\n    if (currentUser) {\n      \/\/ Friss\u00edtj\u00fck a legend sz\u00f6veget\n      const legend = document.querySelector('[data-lang=\"legend\"]');\n      if (legend) legend.textContent = t('legend');\n    }\n  }\n\n  \/\/ \ud83c\udf0d NYELV V\u00c1LT\u00c1SA\n  window.toggleLanguage = function() {\n    currentLang = currentLang === 'hu' ? 'en' : 'hu';\n    localStorage.setItem('radiohy_lang', currentLang);\n    updateLanguageUI();\n  };\n\n  \/\/ \ud83d\udd0a AUDIO INICIALIZ\u00c1L\u00c1SA\n  function initAudio() {\n    if (!audioContext) {\n      audioContext = new (window.AudioContext || window.webkitAudioContext)();\n    }\n    if (audioContext.state === 'suspended') {\n      audioContext.resume();\n    }\n  }\n\n  \/\/ \ud83d\udd0a \u00c9RTES\u00cdT\u0150 HANG\n  function playNotificationSound() {\n    if (!soundEnabled || !audioContext) return;\n    \n    try {\n      const now = audioContext.currentTime;\n      const osc1 = audioContext.createOscillator();\n      const gain1 = audioContext.createGain();\n      \n      osc1.type = 'sine';\n      osc1.frequency.setValueAtTime(800, now);\n      osc1.frequency.exponentialRampToValueAtTime(400, now + 0.15);\n      \n      gain1.gain.setValueAtTime(0, now);\n      gain1.gain.linearRampToValueAtTime(0.15, now + 0.01);\n      gain1.gain.exponentialRampToValueAtTime(0.01, now + 0.15);\n      \n      osc1.connect(gain1);\n      gain1.connect(audioContext.destination);\n      \n      const osc2 = audioContext.createOscillator();\n      const gain2 = audioContext.createGain();\n      \n      osc2.type = 'sine';\n      osc2.frequency.setValueAtTime(1200, now);\n      osc2.frequency.exponentialRampToValueAtTime(600, now + 0.1);\n      \n      gain2.gain.setValueAtTime(0, now);\n      gain2.gain.linearRampToValueAtTime(0.05, now + 0.005);\n      gain2.gain.exponentialRampToValueAtTime(0.01, now + 0.1);\n      \n      osc2.connect(gain2);\n      gain2.connect(audioContext.destination);\n      \n      osc1.start(now);\n      osc1.stop(now + 0.2);\n      osc2.start(now);\n      osc2.stop(now + 0.15);\n      \n    } catch (e) {\n      console.error('Hang lej\u00e1tsz\u00e1si hiba:', e);\n    }\n  }\n\n  \/\/ \ud83d\udd0a HANG KAPCSOL\u00d3\n  window.toggleSound = function() {\n    soundEnabled = !soundEnabled;\n    const btn = document.getElementById('sound-toggle');\n    \n    if (soundEnabled) {\n      initAudio();\n      btn.innerHTML = '\ud83d\udd14';\n      btn.style.opacity = '1';\n      btn.style.background = 'rgba(255,215,0,0.3)';\n      btn.title = t('notification_on');\n    } else {\n      btn.innerHTML = '\ud83d\udd15';\n      btn.style.opacity = '0.5';\n      btn.style.background = 'rgba(255,215,0,0.15)';\n      btn.title = t('notification_off');\n    }\n    \n    localStorage.setItem('radiohy_sound', soundEnabled ? 'on' : 'off');\n  };\n\n  \/\/ Jelsz\u00f3 mez\u0151 megjelen\u00edt\u00e9se\n  document.querySelectorAll('input[name=\"role\"]').forEach(radio => {\n    radio.addEventListener('change', (e) => {\n      const passField = document.getElementById('role-password');\n      const hint = document.getElementById('password-hint');\n      \n      if (e.target.value === 'user') {\n        passField.style.display = 'none';\n        hint.style.display = 'none';\n      } else {\n        passField.style.display = 'block';\n        hint.style.display = 'block';\n        passField.value = '';\n        passField.focus();\n        \n        if (e.target.value === 'moderator') {\n          passField.placeholder = t('enter_password');\n        } else {\n          passField.placeholder = t('enter_password');\n        }\n      }\n    });\n  });\n\n  try {\n    app = initializeApp(firebaseConfig);\n    db = getDatabase(app);\n    messagesRef = ref(db, 'messages');\n  } catch (e) { console.error(e); }\n\n  window.handleLogoUpload = function(input) {\n    const file = input.files[0];\n    if (!file) return;\n    if (file.size > 500 * 1024) { alert(t('max_size_500')); return; }\n    const reader = new FileReader();\n    reader.onload = function(e) {\n      userLogo = e.target.result;\n      document.getElementById('logo-preview').innerHTML = `<img decoding=\"async\" src=\"${userLogo}\" style=\"width: 100%; height: 100%; object-fit: cover;\">`;\n    };\n    reader.readAsDataURL(file);\n  };\n\n  window.login = function() {\n    const username = document.getElementById('username-input').value.trim().toLowerCase();\n    const selectedRole = document.querySelector('input[name=\"role\"]:checked').value;\n    const password = document.getElementById('role-password').value;\n    \n    if (!username) { alert(t('enter_nickname')); return; }\n    if (bannedUsers.has(username)) { alert(t('banned')); return; }\n    \n    if (selectedRole === 'admin') {\n      if (password !== ADMIN_PASSWORD) {\n        alert(t('wrong_password'));\n        return;\n      }\n    } else if (selectedRole === 'moderator') {\n      if (!MODERATORS[username] || MODERATORS[username] !== password) {\n        alert(t('wrong_mod_password'));\n        return;\n      }\n    }\n    \n    const userId = 'user_' + Date.now() + '_' + Math.random().toString(36).substr(2, 5);\n    \n    currentUser = { \n      name: username, \n      role: selectedRole,\n      id: userId,\n      logo: userLogo\n    };\n    \n    localStorage.setItem('radiohy_chat_user', JSON.stringify(currentUser));\n    \n    setupPresence();\n    \n    \/\/ \ud83c\udf0d Nyelvf\u00fcgg\u0151 csatlakoz\u00e1si \u00fczenet\n    const roleName = ROLES[selectedRole].name[currentLang];\n    addSystemMessage(`${ROLES[selectedRole].icon} ${username} (${roleName}) ${t('connected_msg')}!`);\n  };\n\n  \/\/ \ud83d\udd04 AUTOMATIKUS VISSZACSATLAKOZ\u00c1S\n  function checkAutoLogin() {\n    const savedData = localStorage.getItem('radiohy_chat_user');\n    if (savedData) {\n      try {\n        const userData = JSON.parse(savedData);\n        if (userData && userData.name) {\n          isReconnecting = true;\n          currentUser = {\n            name: userData.name,\n            role: userData.role || 'user',\n            logo: userData.logo || null,\n            id: 'user_' + Date.now() + '_' + Math.random().toString(36).substr(2, 5)\n          };\n          userLogo = currentUser.logo;\n          \n          document.getElementById('login-screen').style.display = 'none';\n          document.getElementById('chat-screen').style.display = 'flex';\n          \n          if (userLogo) {\n            document.getElementById('chat-logo').src = userLogo;\n            document.getElementById('chat-logo').style.display = 'block';\n          }\n          \n          if (currentUser.role === 'admin') {\n            document.getElementById('admin-panel-btn').style.display = 'block';\n          }\n          \n          setupPresenceAfterReload();\n        }\n      } catch (e) {\n        console.error('Hiba az automatikus bel\u00e9p\u00e9sn\u00e9l:', e);\n        localStorage.removeItem('radiohy_chat_user');\n      }\n    }\n  }\n\n  function setupPresence() {\n    document.getElementById('login-screen').style.display = 'none';\n    document.getElementById('chat-screen').style.display = 'flex';\n    \n    if (userLogo) {\n      document.getElementById('chat-logo').src = userLogo;\n      document.getElementById('chat-logo').style.display = 'block';\n    }\n    \n    if (currentUser.role === 'admin') {\n      document.getElementById('admin-panel-btn').style.display = 'block';\n    }\n    \n    presenceRef = ref(db, 'presence\/' + currentUser.id);\n    onDisconnect(presenceRef).remove();\n    \n    set(presenceRef, {\n      name: currentUser.name,\n      role: currentUser.role,\n      color: ROLES[currentUser.role].color,\n      lastActive: Date.now(),\n      status: 'online',\n      logo: userLogo || null\n    });\n    \n    activityInterval = setInterval(() => {\n      if (currentUser) update(presenceRef, { lastActive: Date.now() });\n    }, 30000);\n    \n    ['mousemove', 'keydown', 'click'].forEach(event => {\n      window.addEventListener(event, () => {\n        if (currentUser && presenceRef) update(presenceRef, { lastActive: Date.now(), status: 'online' });\n      }, { passive: true });\n    });\n    \n    initOnlineListener();\n    loadGifCategory('trending');\n  }\n\n  function setupPresenceAfterReload() {\n    if (!currentUser) return;\n    \n    presenceRef = ref(db, 'presence\/' + currentUser.id);\n    onDisconnect(presenceRef).remove();\n    \n    set(presenceRef, {\n      name: currentUser.name,\n      role: currentUser.role,\n      color: ROLES[currentUser.role].color,\n      lastActive: Date.now(),\n      status: 'online',\n      logo: currentUser.logo || null\n    });\n    \n    activityInterval = setInterval(() => {\n      if (currentUser && presenceRef) update(presenceRef, { lastActive: Date.now() });\n    }, 30000);\n    \n    ['mousemove', 'keydown', 'click'].forEach(event => {\n      window.addEventListener(event, () => {\n        if (currentUser && presenceRef) update(presenceRef, { lastActive: Date.now(), status: 'online' });\n      }, { passive: true });\n    });\n    \n    initOnlineListener();\n    loadGifCategory('trending');\n    \n    lastMessageTimestamp = Date.now();\n    const savedSound = localStorage.getItem('radiohy_sound');\n    if (savedSound === 'on') {\n      soundEnabled = true;\n      document.getElementById('sound-toggle').innerHTML = '\ud83d\udd14';\n      document.getElementById('sound-toggle').style.opacity = '1';\n    }\n  }\n\n  function initOnlineListener() {\n    onValue(ref(db, 'presence'), (snapshot) => {\n      renderUsers(snapshot.val());\n    });\n  }\n\n  function renderUsers(presenceData) {\n    const container = document.getElementById('users-container');\n    const countDisplay = document.getElementById('online-count-display');\n    \n    if (!container) return;\n    container.innerHTML = '';\n    \n    if (!presenceData) {\n      countDisplay.textContent = '0';\n      return;\n    }\n    \n    const now = Date.now();\n    const users = Object.entries(presenceData);\n    let activeCount = 0;\n    \n    users.forEach(([userId, userData]) => {\n      if (!userData || !userData.name) return;\n      \n      const inactiveTime = now - (userData.lastActive || 0);\n      if (inactiveTime > 300000) {\n        remove(ref(db, 'presence\/' + userId));\n        return;\n      }\n      \n      let statusColor = '#00c853';\n      if (inactiveTime > 120000) statusColor = '#ff5252';\n      else if (inactiveTime > 60000) statusColor = '#ffc107';\n      else activeCount++;\n      \n      if (userId === currentUser?.id) return;\n      \n      const roleConfig = ROLES[userData.role] || ROLES.user;\n      \/\/ \ud83c\udf0d Nyelvf\u00fcgg\u0151 szerepn\u00e9v\n      const roleName = roleConfig.name[currentLang];\n      \n      const userTag = document.createElement('div');\n      userTag.className = `user-tag ${roleConfig.class}`;\n      userTag.innerHTML = `\n        <span style=\"font-size: 16px;\">${roleConfig.icon}<\/span>\n        <span style=\"font-weight: 600; color: ${roleConfig.color};\" onclick=\"mentionUser('${userData.name}')\">${userData.name}<\/span>\n        <span style=\"font-size: 10px; opacity: 0.7; background: rgba(0,0,0,0.3); padding: 2px 6px; border-radius: 10px;\">${roleName}<\/span>\n        <span style=\"width: 8px; height: 8px; background: ${statusColor}; border-radius: 50%;\"><\/span>\n        ${currentUser?.role === 'admin' ? `<span class=\"ban-btn\" onclick=\"banUser('${userData.name}', '${userId}')\" title=\"KITILT\">\ud83d\udeab<\/span>` : ''}\n      `;\n      container.appendChild(userTag);\n    });\n    \n    countDisplay.textContent = activeCount;\n  }\n\n  window.banUser = function(username, userId) {\n    if(currentUser?.role !== 'admin') return;\n    if(confirm(`Ban ${username}?`)) {\n      set(ref(db, 'banned\/' + username), true);\n      remove(ref(db, 'presence\/' + userId));\n    }\n  };\n\n  window.mentionUser = function(userName) {\n    const input = document.getElementById('message-input');\n    input.value = `@${userName} `;\n    input.focus();\n    document.getElementById('user-list').style.display = 'none';\n  };\n\n  window.toggleUserList = function() {\n    const list = document.getElementById('user-list');\n    list.style.display = list.style.display === 'none' ? 'block' : 'none';\n  };\n\n  window.logout = function() {\n    if (presenceRef) remove(presenceRef);\n    if (activityInterval) clearInterval(activityInterval);\n    localStorage.removeItem('radiohy_chat_user');\n    soundEnabled = false;\n    location.reload();\n  };\n\n  window.sendMessage = function() {\n    const input = document.getElementById('message-input');\n    const text = input.value.trim();\n    if (!text || !currentUser) return;\n    \n    if(bannedUsers.has(currentUser.name)) {\n      alert(t('banned'));\n      logout();\n      return;\n    }\n    \n    push(messagesRef, {\n      text: text,\n      user: currentUser.name,\n      role: currentUser.role,\n      color: ROLES[currentUser.role].color,\n      timestamp: Date.now(),\n      type: 'text'\n    });\n    \n    if (presenceRef) update(presenceRef, { lastActive: Date.now(), status: 'online' });\n    input.value = '';\n    closePickers();\n  };\n\n  window.handleKeyPress = function(e) { \n    if (e.key === 'Enter') sendMessage(); \n  };\n\n  window.displayMessage = function(key, msg) {\n    if(msg.user && bannedUsers.has(msg.user.toLowerCase())) {\n      remove(ref(db, 'messages\/' + key));\n      return;\n    }\n    \n    const container = document.getElementById('messages');\n    const isOwn = msg.user === currentUser?.name;\n    const msgRole = msg.role || 'user';\n    const roleConfig = ROLES[msgRole];\n    \n    const div = document.createElement('div');\n    div.id = 'msg-' + key;\n    div.className = 'message-anim';\n    \n    if (msg.type === 'system') {\n      div.innerHTML = `<div style=\"width: 100%; text-align: center; color: ${roleConfig?.color || '#FFD700'}; font-size: 12px; margin: 15px 0; font-style: italic;\">${msg.text}<\/div>`;\n      container.appendChild(div);\n      container.scrollTop = container.scrollHeight;\n      return;\n    }\n\n    const time = new Date(msg.timestamp).toLocaleTimeString(currentLang === 'hu' ? 'hu-HU' : 'en-US', {hour: '2-digit', minute:'2-digit'});\n    let processedText = escapeHtml(msg.text);\n    processedText = processedText.replace(\/@([^\\s]+)\/g, `<span style=\"background: rgba(255,215,0,0.3); color: #FFD700; font-weight: bold; padding: 2px 6px; border-radius: 4px; border: 1px solid #FFD700;\">$&<\/span>`);\n    \n    let content = '';\n    if (msg.type === 'image') content = `<img decoding=\"async\" src=\"${msg.text}\" style=\"max-width: 260px; border-radius: 12px; border: 2px solid ${roleConfig.color};\" onclick=\"window.open(this.src)\">`;\n    else if (msg.type === 'gif') content = `<img decoding=\"async\" src=\"${msg.text}\" style=\"max-width: 280px; border-radius: 12px; border: 2px solid ${roleConfig.color};\">`;\n    else content = `<div style=\"word-break: break-word; line-height: 1.6; font-size: 15px;\">${processedText}<\/div>`;\n    \n    const showRole = msgRole !== 'user';\n    \/\/ \ud83c\udf0d Nyelvf\u00fcgg\u0151 szerepn\u00e9v megjelen\u00edt\u00e9se\n    const roleName = roleConfig.name[currentLang];\n    const roleBadge = showRole ? `<span style=\"font-size: 11px; background: ${roleConfig.color}; color: #000; padding: 2px 8px; border-radius: 12px; font-weight: bold; margin-right: 6px;\">${roleConfig.icon} ${roleName}<\/span>` : '';\n    \n    const adminDel = currentUser?.role === 'admin' ? `<button onclick=\"deleteMessage('${key}')\" style=\"background: rgba(255,82,82,0.7); border: none; color: white; padding: 2px 8px; border-radius: 4px; cursor: pointer; font-size: 11px; margin-left: 8px;\">\ud83d\uddd1\ufe0f<\/button>` : '';\n    \n    const bubbleColor = isOwn ? 'linear-gradient(135deg, #FFD700, #FFA500)' : (msgRole === 'admin' ? 'rgba(255,0,0,0.2)' : (msgRole === 'moderator' ? 'rgba(255,165,0,0.15)' : '#1a1a1a'));\n    const textColor = isOwn ? '#000' : roleConfig.color;\n    \n    div.style.cssText = `display: flex; ${isOwn ? 'justify-content: flex-end' : 'justify-content: flex-start'}; margin-bottom: 12px;`;\n    div.innerHTML = `\n      <div style=\"max-width: 75%; background: ${bubbleColor}; color: ${textColor}; padding: 14px 20px; border-radius: 20px; border: 2px solid ${roleConfig.color}; ${isOwn ? 'border-bottom-right-radius: 6px' : 'border-bottom-left-radius: 6px'};\">\n        <div style=\"font-size: 12px; font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px;\">\n          ${roleBadge}\n          <span>${msg.user}<\/span>\n          <span style=\"margin-left: auto; font-size: 10px; opacity: 0.6;\">${time}<\/span>\n        <\/div>\n        <div style=\"display: flex; align-items: center; flex-wrap: wrap; gap: 8px;\">\n          ${content}\n          ${adminDel}\n        <\/div>\n      <\/div>\n    `;\n    \n    container.appendChild(div);\n    container.scrollTop = container.scrollHeight;\n  };\n\n  onChildAdded(messagesRef, (snapshot) => {\n    const msg = snapshot.val();\n    \n    if (soundEnabled && \n        msg.user !== currentUser?.name && \n        msg.type !== 'system' &&\n        msg.timestamp > lastMessageTimestamp) {\n      playNotificationSound();\n    }\n    \n    displayMessage(snapshot.key, msg);\n  });\n\n  onChildRemoved(messagesRef, (snapshot) => {\n    const el = document.getElementById('msg-' + snapshot.key);\n    if (el) el.remove();\n  });\n\n  function addSystemMessage(text) {\n    push(messagesRef, { text: text, type: 'system', timestamp: Date.now() });\n  }\n\n  window.deleteMessage = function(key) {\n    if (currentUser?.role !== 'admin') return;\n    if (confirm(t('delete_confirm'))) remove(ref(db, 'messages\/' + key));\n  };\n\n  window.clearAllMessages = function() {\n    if (currentUser?.role !== 'admin') return;\n    if (confirm(t('clear_all_confirm'))) set(messagesRef, null);\n  };\n\n  window.clearInactiveUsers = function() {\n    if (currentUser?.role !== 'admin') return;\n    onValue(ref(db, 'presence'), (snapshot) => {\n      const now = Date.now();\n      let count = 0;\n      snapshot.forEach(child => {\n        if ((now - (child.val().lastActive || 0)) > 300000) {\n          remove(ref(db, 'presence\/' + child.key));\n          count++;\n        }\n      });\n      alert(`${count} ${t('inactive_deleted')}!`);\n    }, { onlyOnce: true });\n  };\n\n  window.toggleAdminPanel = function() {\n    const panel = document.getElementById('admin-panel');\n    panel.style.display = panel.style.display === 'none' ? 'block' : 'none';\n  };\n\n  window.toggleEmoji = function() {\n    const picker = document.getElementById('emoji-picker');\n    picker.style.display = picker.style.display === 'none' ? 'block' : 'none';\n    document.getElementById('gif-picker').style.display = 'none';\n  };\n\n  window.toggleGif = function() {\n    const picker = document.getElementById('gif-picker');\n    const isHidden = picker.style.display === 'none' || picker.style.display === '';\n    picker.style.display = isHidden ? 'flex' : 'none';\n    if (isHidden) loadGifCategory('trending');\n  };\n\n  function closePickers() {\n    document.getElementById('emoji-picker').style.display = 'none';\n    document.getElementById('gif-picker').style.display = 'none';\n  }\n\n  window.loadGifCategory = async function(category) {\n    const resultsContainer = document.querySelector('#gif-results > div');\n    resultsContainer.innerHTML = '<div style=\"grid-column: 1 \/ -1; text-align: center; color: #FFD700; padding: 40px;\">\u23f3...<\/div>';\n    \n    try {\n      \/\/ \ud83c\udf0d Nyelvf\u00fcgg\u0151 keres\u00e9si kifejez\u00e9sek\n      const terms = { \n        'hu': { 'trending': 'trending', 'reactions': 'reaction', 'music': 'music' },\n        'en': { 'trending': 'trending', 'reactions': 'reaction', 'music': 'music' }\n      };\n      const searchTerm = terms[currentLang][category] || category;\n      \n      const response = await fetch(`https:\/\/api.giphy.com\/v1\/gifs\/search?q=${encodeURIComponent(searchTerm)}&api_key=${GIPHY_API_KEY}&limit=8&rating=pg-13`);\n      const data = await response.json();\n      \n      resultsContainer.innerHTML = data.data.map(gif => `\n        <div onclick=\"sendGif('${gif.images.original.url}')\" style=\"cursor: pointer; background: #1a1a1a; border-radius: 12px; overflow: hidden; height: 120px; border: 2px solid transparent;\" onmouseover=\"this.style.borderColor='#FFD700'\" onmouseout=\"this.style.borderColor='transparent'\">\n          <img decoding=\"async\" src=\"${gif.images.fixed_height_small.url}\" style=\"width: 100%; height: 100%; object-fit: cover;\" loading=\"lazy\">\n        <\/div>\n      `).join('');\n    } catch (e) {}\n  };\n\n  window.searchGif = async function(query) {\n    if (!query) return;\n    const resultsContainer = document.querySelector('#gif-results > div');\n    try {\n      const response = await fetch(`https:\/\/api.giphy.com\/v1\/gifs\/search?q=${encodeURIComponent(query)}&api_key=${GIPHY_API_KEY}&limit=8&rating=pg-13&lang=${currentLang}`);\n      const data = await response.json();\n      resultsContainer.innerHTML = data.data.map(gif => `\n        <div onclick=\"sendGif('${gif.images.original.url}')\" style=\"cursor: pointer; background: #1a1a1a; border-radius: 12px; overflow: hidden; height: 120px;\" onmouseover=\"this.style.border='2px solid #FFD700'\" onmouseout=\"this.style.border='2px solid transparent'\">\n          <img decoding=\"async\" src=\"${gif.images.fixed_height_small.url}\" style=\"width: 100%; height: 100%; object-fit: cover;\" loading=\"lazy\">\n        <\/div>\n      `).join('');\n    } catch (e) {}\n  };\n\n  window.sendGif = function(url) {\n    if (!currentUser) return;\n    push(messagesRef, { text: url, user: currentUser.name, role: currentUser.role, color: ROLES[currentUser.role].color, timestamp: Date.now(), type: 'gif' });\n    closePickers();\n  };\n\n  window.handleFileUpload = function(input) {\n    const file = input.files[0];\n    if (!file || !currentUser) return;\n    if (file.size > 3 * 1024 * 1024) { alert(t('max_size_3mb')); return; }\n    const reader = new FileReader();\n    reader.onload = function(e) {\n      push(messagesRef, { text: e.target.result, user: currentUser.name, role: currentUser.role, color: ROLES[currentUser.role].color, timestamp: Date.now(), type: 'image' });\n    };\n    reader.readAsDataURL(file);\n    input.value = '';\n  };\n\n  document.addEventListener('emoji-click', event => {\n    const input = document.getElementById('message-input');\n    input.value += event.detail.unicode;\n    input.focus();\n  });\n\n  document.addEventListener('click', (e) => {\n    if (!e.target.closest('#emoji-picker') && !e.target.closest('button[onclick=\"toggleEmoji()\"]')) document.getElementById('emoji-picker').style.display = 'none';\n    if (!e.target.closest('#gif-picker') && !e.target.closest('button[onclick=\"toggleGif()\"]')) document.getElementById('gif-picker').style.display = 'none';\n    if (!e.target.closest('#user-list') && !e.target.closest('button[onclick=\"toggleUserList()\"]')) document.getElementById('user-list').style.display = 'none';\n    \n    if (!audioContext && soundEnabled) {\n      initAudio();\n    }\n  });\n\n  function escapeHtml(text) {\n    const div = document.createElement('div');\n    div.textContent = text;\n    return div.innerHTML;\n  }\n  \n  \/\/ Tiltottak figyel\u00e9se\n  onValue(ref(db, 'banned'), (snapshot) => {\n    bannedUsers.clear();\n    if(snapshot.exists()) {\n      Object.keys(snapshot.val()).forEach(name => bannedUsers.add(name.toLowerCase()));\n    }\n  });\n  \n  \/\/ \ud83d\ude80 IND\u00cdT\u00c1S - nyelv be\u00e1ll\u00edt\u00e1sa \u00e9s automatikus bel\u00e9p\u00e9s ellen\u0151rz\u00e9se\n  window.addEventListener('load', () => {\n    updateLanguageUI(); \/\/ \ud83c\udf0d Nyelv alkalmaz\u00e1sa\n    \n    setTimeout(() => {\n      checkAutoLogin();\n      lastMessageTimestamp = Date.now();\n    }, 500);\n  });\n  \n  window.addEventListener('beforeunload', () => {\n    if (presenceRef) {\n      remove(presenceRef);\n    }\n  });\n<\/script>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ud83c\udded\ud83c\uddfa Magyar \ud83d\udcfb \ud83d\uddbc\ufe0f Log\u00f3 felt\u00f6lt\u00e9se R\u00c1DI\u00d3 HY V\u00e1laszd ki a st\u00e1tuszod! \ud83d\udc64 Hallgat\u00f3 Sima felhaszn\u00e1l\u00f3i m\u00f3d \ud83c\udf99\ufe0f M\u0171sorvezet\u0151 Jelsz\u00f3 sz\u00fcks\u00e9ges! \u2b50 Admin Jelsz\u00f3 sz\u00fcks\u00e9ges M\u0171sorvezet\u0151k: add meg a neved + jelszavad Admin: admin jelsz\u00f3 Csatlakoz\u00e1s \ud83c\udfa7 R\u00c1DI\u00d3 HY CHAT \u2b50 Admin | \ud83c\udf99\ufe0f Moderator | \ud83d\udc64 Listener \ud83c\udded\ud83c\uddfa \ud83d\udc65 0 \ud83d\udd15 Lista \u2699\ufe0f Admin [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-296","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/pages\/296","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/comments?post=296"}],"version-history":[{"count":23,"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/pages\/296\/revisions"}],"predecessor-version":[{"id":323,"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/pages\/296\/revisions\/323"}],"wp:attachment":[{"href":"https:\/\/radiohy.eu\/hu\/wp-json\/wp\/v2\/media?parent=296"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}