Filters is a Twitch Extension that allows viewers to add and modify filters to the video of the stream.

Releases

Releases can be found on the Releases Page and are created using Git Tagging using any v* tags to correspond to a Release.

Issues / Bugs / Things People Are Mad About

Issues and bug reports can be filed on the GitHub Issues Page.

Contributing

Contributions are welcome! Get started by forking the repo, working on your contribution, and filing a pull request when you're ready.

Development

Environment Setup

1. Ensure NodeJS is installed on your system.
2. Run npm install to install dependencies.

Running The Local Dev Server

Local development uses Rspack Dev Server to allow for local development and uses Mirage JS for locally mocking calls to the Twitch API. The following commands are available:

• npm run dev
  • Spins up a local development server and have the overlay open in the browser.
• npm run dev:config
  • Does the same thing as npm run dev except opens the config page by default instead.

Localization

This extension uses @lit/localize to handle localization based on the configuration defined in the @lit/localize localization schema including what languages are supported. The following commands are available:

• npm run localize:extract
  • Extracts and updates strings marked for localization into .xlf files in the xliff directory.
  • This command will not replace existing translations in the .xlf files and only adds new strings.
• npm run localize:build
  • Uses the .xlf files build .ts files used by the build into the src/generated directory.

Build

This extension uses Rspack to handle building and packaging the extension and the following commands are available:

• npm run build
  • Builds the extension and puts the resulting build in the dist directory.
• npm run package
  • Packages the dist directory into a .zip file suitable for uploading into the Twitch Developer Console.
  • .zip file will be in the format of filters-twitch-extension-<VERSION>.zip.
• npm run prod
  • Runs npm run build followed by npm run package in one command.
• npm run clean
  • Deletes any existing build artifacts.
    • dist directory
    • filters-twitch-extension-<VERSION>.zip file

License

The source code is licensed under The MIT License. The Filters image is used under a purchased Royalty-Free Commercial License from The Noun Project.

About

Filters is cobbled together by Zac Lovoy (aka BigZoz on Twitch) and is the same goober who brought you YarpBot, which you should check out because it's cool and I don't have a Soundcloud to link to here.

Created for the Twitch Streamer Tools Hackathon 2024.