An open API service indexing awesome lists of open source software.

https://github.com/mkultra6969/danmakuchat

Simple Danmaku style chat-overlay for Streams
https://github.com/mkultra6969/danmakuchat

bilibili chat-overlay danmaku obs real-time-chat stream-customization streaming-tools twitch youtube

Last synced: 29 days ago
JSON representation

Simple Danmaku style chat-overlay for Streams

Awesome Lists containing this project

README

          

[🇺🇸English](https://github.com/MKultra6969/DanmakuChat/blob/main/README_ENG.md)

# Twitch Danmaku Chat Overlay (DCO)🌟

Этот проект представляет собой красивый и настраиваемый оверлей для чата Twitch, который можно использовать в стримах. Оверлей поддерживает анимации, кастомные шрифты, эмодзи и бейджи. 🎉

## Особенности ✨

- **Анимации сообщений**: Поддержка нескольких анимаций для сообщений чата.
- **Кастомные шрифты**: Возможность использовать разные шрифты для имен пользователей и текста сообщений.
- **Эмодзи**: Автоматическая замена текстовых эмодзи на изображения.
- **Бейджи**: Отображение бейджей пользователей (например, модератор, стример и т.д.).
- **Случайные цвета**: Каждое сообщение имеет случайный цвет текста.

## Установка 🛠️

1. Склонируйте репозиторий:

```bash
git clone https://github.com/MKultra6969/DanmakuChat
```

2. Перейдите в директорию проекта:

```bash
cd DanmakuChat
```

3. Откройте файл `index.html` в браузере. Либо добавте `index.html` как источник в OBS

## Настройка ⚙️

### Шрифты

Вы можете изменить шрифты для имен пользователей и текста сообщений в файле `config.js`:

```javascript
const config = {
fonts: {
username: 'Roboto, sans-serif',
messageText: 'Hachi Maru Pop, cursive',
},
// ...
};
```

### Анимации

В файле `config.js` также можно выбрать анимацию для сообщений:

```javascript
const config = {
animations: {
1: 'slide-left 15s linear forwards',
2: 'slide-left 15s linear forwards, fade-out 15s linear forwards',
3: 'slide-left-bounce 15s linear forwards',
4: 'slide-left-liquid 15s linear forwards',
},
selectedAnimation: 1, // Выберите анимацию от 1 до 4
// ...
};
```

### Канал Twitch

В файле `script.js` укажите канал, к которому хотите подключиться:

```javascript
const client = new tmi.Client({
connection: { reconnect: true },
channels: ['NICKNAME'], // NICKNAME заменить на ваш ник
});
```

## Использование 🚀

1. Запустите файл `index.html` в браузере.
2. Настройте OBS или другую программу для стриминга, чтобы добавить окно браузера с оверлеем.
3. Наслаждайтесь красивым чатом на вашем стриме! 🎥

## Примеры анимаций 🎮

- **slide-left**: Сообщение плавно движется слева направо.
- **fade-out**: Сообщение постепенно исчезает.
- **slide-left-bounce**: Сообщение движется с эффектом "отскока".
- **slide-left-liquid**: Сообщение движется с эффектом "волны".

## Лицензия 📜

Этот проект распространяется под лицензией WTFPL АХАХАХАХАХ. Подробнее см. в файле [LICENSE](https://github.com/MKultra6969/DanmakuChat/blob/main/LICENSE.md).

---

Создано с НЕНАВИСТЬЮ К ЛЮДЯМ [mkultra6969](https://github.com/mkultra6969). Если у вас есть вопросы или предложения, не стесняйтесь И НИКОГДА ИХ НЕ ПИШИТЕ ПОТОМУ ЧТО МНЕ АБСОЛЮТНО ПОХУЙ! 😊