Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
Glodenox authored Sep 24, 2020
1 parent fc78975 commit 7ac38a0
Showing 1 changed file with 29 additions and 8 deletions.
37 changes: 29 additions & 8 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,34 @@
# Twitch Chat Monitor

Code for a simple web page that just shows the chat messages of a Twitch channel in a bigger font so it can be easily displayed on a big monitor for room-scale Twitch streaming.
Code for a web page that shows the activity in a Twitch channel in a bigger font, so it can be easily displayed on a big monitor for room-scale Twitch streaming. Because many features in the chat are not needed for a monitor, it was possible to display the same information better with less than half of the CPU and only a tenth of the working memory.

Variant of https://github.com/paul-lrr/nifty-chat-monitor that uses the Twitch API instead of relying on the embed page.
This has the advantage of not requiring updates every now and then when the layout changes slightly, causes less stuff to be loaded and gives full control over the layout.
This page is based on the [Nifty Chat Monitor userscript](https://github.com/paul-lrr/nifty-chat-monitor), but uses the Twitch WebSocket API directly instead of relying on the Twitch chat embed page. This has the advantage of not requiring updates every now and then when the layout changes slightly, causes less stuff to be loaded in the background and gives full control over the layout.

At the moment this script is geared towards only LoadingReadyRun, but all implemented features are potentially useful for all channels.
This tool can be used for any Twitch channel and can be configured in whichever way works best for you.

Currently still missing features compared to the nifty-chat-monitor userscript:
- Customisability as a whole, the settings button doesn't work yet
- Showing inline images
- Showing any messages other than regular messages (bits, subscriptions, raids, ...)
## Supported features (non-exhaustive list)

Note that all these features can be enabled or disabled.

* Smooth scrolling of chat messages to improve readability of a fast-flowing chat
* Fully customizable color pallette
* New messages can be set to appear at the top or the bottom of the screen
* Show or hide moderator actions
* Highlight messages based on the username or certain keyphrases
* Immediately show the images posted by users
* Load Twitter messages linked to by users
* Shorten links posted in chat
* Store settings over sessions or adjust default settings in the HTML page for portability

Several more features are in the pipeline!

## How to use

The project consists of 4 files:

* *index.html*: the web page you want to open in a browser to see the chat
* *main.js*: main JavaScript file
* *tmi.js*: a copy of the [tmi.js JavaScript library for Twitch](https://github.com/tmijs/tmi.js)
* *style.css*: CSS styles are stored here

All you need to is copy these files to a folder and open the index.html file. Alternatively you could host these files on a static web server and open that page.

0 comments on commit 7ac38a0

Please sign in to comment.