Feat/auto open settings

js/app.js

@@ -86,8 +86,7 @@ class MultiChatApp {
 
     if (openBtn) {
       openBtn.addEventListener('click', () => {
-        this.settings.populateForm();
-        modalEl.classList.remove('hidden');
+        this.openSettingsModal();
       });
     }
 
@@ -139,6 +138,19 @@ class MultiChatApp {
     });
 
     this.applyFontSettings(this.settings.settings.fontSize);
+
+    // Auto-open settings modal if no channel address is specified
+    if (!this.settings.hasAnyChannelConfigured()) {
+      this.openSettingsModal();
+    }
+  }
+
+  openSettingsModal() {
+    const modalEl = document.getElementById('settingsModal');
+    if (modalEl) {
+      this.settings.populateForm();
+      modalEl.classList.remove('hidden');
+    }
   }
 
   applyFontSettings(sizePx) {

js/settings.js

@@ -27,7 +27,21 @@ class SettingsManager {
     try {
       const saved = localStorage.getItem(STORAGE_KEY);
       if (saved) {
-        return { ...defaultSettings, ...JSON.parse(saved) };
+        const parsed = JSON.parse(saved);
+        const settings = { ...defaultSettings, ...parsed };
+        const stringFields = [
+          'twitchChannel',
+          'kickChannel',
+          'vkChannel',
+          'youtubeChannel',
+          'extraNicknames'
+        ];
+        stringFields.forEach(field => {
+          if (typeof settings[field] !== 'string') {
+            settings[field] = defaultSettings[field] || '';
+          }
+        });
+        return settings;
       }
     } catch (e) {
       console.error('[MultiChat Settings] Error reading settings from localStorage:', e);
@@ -45,28 +59,42 @@ class SettingsManager {
     }
   }
 
+  /**
+   * Returns true if at least one platform channel is configured.
+   */
+  hasAnyChannelConfigured() {
+    const s = this.settings;
+    return [
+      s.twitchChannel,
+      s.kickChannel,
+      s.vkChannel,
+      s.youtubeChannel
+    ].some(channel => typeof channel === 'string' && channel.trim().length > 0);
+  }
+
   /**
    * Returns a normalized array of all streamer nicknames
    * (channel names from all platforms + extra nicknames), stripping leading '@'.
    */
   getStreamerNicknames() {
     const names = new Set();
 
-    const cleanNick = (str) => (str || '').toLowerCase().trim().replace(/^@+/, '');
+    const cleanNick = (str) => (typeof str === 'string' ? str : '').toLowerCase().trim().replace(/^@+/, '');
+    const addIfNotEmpty = (str) => {
+      const cleaned = cleanNick(str);
+      if (cleaned) names.add(cleaned);
+    };
 
     // Add channel names
-    if (this.settings.twitchChannel) names.add(cleanNick(this.settings.twitchChannel));
-    if (this.settings.kickChannel) names.add(cleanNick(this.settings.kickChannel));
-    if (this.settings.vkChannel) names.add(cleanNick(this.settings.vkChannel));
-    if (this.settings.youtubeChannel) names.add(cleanNick(this.settings.youtubeChannel));
+    addIfNotEmpty(this.settings.twitchChannel);
+    addIfNotEmpty(this.settings.kickChannel);
+    addIfNotEmpty(this.settings.vkChannel);
+    addIfNotEmpty(this.settings.youtubeChannel);
 
     // Add extra nicknames
-    if (this.settings.extraNicknames) {
+    if (typeof this.settings.extraNicknames === 'string' && this.settings.extraNicknames) {
       const extraList = this.settings.extraNicknames.split(',');
-      extraList.forEach(n => {
-        const cleaned = cleanNick(n);
-        if (cleaned) names.add(cleaned);
-      });
+      extraList.forEach(n => addIfNotEmpty(n));
     }
 
     return Array.from(names);

readme.md

@@ -0,0 +1,48 @@
+# MultiChat
+
+Универсальный и легкий мультичат для стримеров на **HTML / CSS / JavaScript**, агрегирующий сообщения с нескольких стриминговых платформ в единую удобную ленту в реальном времени.
+
+![MultiChat Overview](index.html) *(Интерфейс мультичата готов к работе в браузере и OBS)*
+
+---
+
+## 🚀 Поддерживаемые платформы
+
+- **Twitch** — прямое подключение через WebSocket IRC (`wss://irc-ws.chat.twitch.tv:443`) с поддержкой IRC-тегов, бейджей и цветов чаттеров.
+- **Kick** — WebSocket-подключение через Pusher (`wss://ws-us2.pusher.com`).
+- **VK Play Live / VK Video Live** — WebSocket-подключение через Centrifugo (`wss://pubsub.live.vkvideo.ru`) с автоматическим получением гостевых токенов.
+- **YouTube Live** — автоматически находит активную трансляцию по хэндлу канала (`@channel`), URL видео или Video ID и подтягивает Live Chat.
+
+---
+
+## ✨ Ключевые возможности
+
+- **Единый поток сообщений**: Все чаты объединяются в одну ленту с цветовой индикацией платформ.
+- **Интеграция смайлов и бейджей**:
+  - Поддержка глобальных и канальных смайлов **7TV**, **BetterTTV (BTTV)** и **FrankerFaceZ (FFZ)**.
+  - Кастомные смайлики Kick и глобальные бейджи Twitch/Kick.
+- **Умная фильтрация «Чаттерсы общаются»**:
+  - Сообщения, адресованные другими зрителями друг другу, могут автоматически сворачиваться в кликабельные плашки `[чаттерсы общаются]`, не отвлекая стримера.
+  - Упоминания стримера **никогда не скрываются**.
+- **Автономность**:
+  - Не требует сложного бэкенда или баз данных. Настройки сохраняются локально в `localStorage`.
+  - Содержит встроенные механизмы смены CORS-прокси (`Corsproxy.io`, `AllOrigins`, `Codetabs`) и опциональный собственный `proxy.php`.
+
+---
+
+## 🛠️ Запуск и использование
+
+### Простой запуск (Браузер)
+1. Откройте `index.html` в любом современном веб-браузере.
+2. Нажмите на иконку ⚙️ **Настройки** в шапке.
+3. Укажите название ваших каналов для нужных платформ (Twitch, Kick, VK Live, YouTube).
+
+### Использование в качестве док-панели OBS Studio
+1. Укажите путь к локальному файлу `index.html` или URL вашего веб-сервера.
+2. Разместите панель в удобном месте, заполните адреса каналов.
+
+---
+
+## 📄 Лицензия
+
+MIT License. Свободно для использования и модификации.