* Added: Setting to hide the "Not Live" bar beneath videos and clips that appears when the channel is currently live. * Fixed: Handling of `https://www.twitch.tv/<channel>/clip/<slug>` urls for rich chat embeds and rich link tool-tips. * Fixed: Lower the priority of custom highlight terms so they will not break links. * Fixed: Holding multiple modifier keys to display in-line chat actions. * Fixed: Clean up out-dated avatar display setting for the directory. * API Added: Allow add-ons to access the Popper JS library via `FrankerFaceZ.utilities.popper`. * API Added: `<icon-picker />` Vue component for selecting an icon. * API Added: `<react-link />` Vue component for creating links that cause the React app to navigate without a page load. * API Added: `<t-list />` Vue component for translating text including Vue elements. * API Added: `maybeLoad(icon)` function for font awesome to only load the font if the icon is from font awesome. * API Added: `generateUUID()` function to `FrankerFaceZ.utilities.object` * API Added: The `vue-observe-visibility` module is now loaded with Vue and made available in all Vue contexts. |
||
---|---|---|
.github/ISSUE_TEMPLATE | ||
res | ||
socketserver | ||
src | ||
styles | ||
.babelrc | ||
.eslintrc.js | ||
.gitignore | ||
changelog.html | ||
jsconfig.json | ||
LICENSE | ||
old_changes.html | ||
package-lock.json | ||
package.json | ||
README.md | ||
webpack.clips.babel.js | ||
webpack.clips.common.js | ||
webpack.clips.dev.js | ||
webpack.clips.prod.js | ||
webpack.common.js | ||
webpack.web.babel.js | ||
webpack.web.common.js | ||
webpack.web.dev.babel.js | ||
webpack.web.dev.js | ||
webpack.web.prod.js |
FrankerFaceZ
Copyright (c) 2018 Dan Salvato LLC
Licensed under the Apache License, Version 2.0. See LICENSE.
Developing
FrankerFaceZ uses node.js to manage development dependencies and to run an HTTP server for development. To get everything you need:
- Install node.js and npm
- Run
npm install
within the FrankerFaceZ directory.
From there, you can use npm to build FrankerFaceZ from source simply by
running npm run build
. For development, you can instruct gulp to watch
the source files for changes and re-build automatically with npm start
FrankerFaceZ comes with a local development server that listens on port 8000 and it serves up local development copies of files, falling back to the CDN when a local copy of a file isn't present.
To make FrankerFaceZ load from your local development server, you must set
the local storage variable ffzDebugMode
to true. Just run the following
in your console on Twitch: localStorage.ffzDebugMode = true;
It should be noted that this project is not a browser extension that you would load in your browser's extensions system. You still need the FrankerFaceZ extension or user-script for your browser.
Editor Settings
Please make sure that your editor is configured to use tabs rather than spaces
for indentation and that lines are ended with \n
. It's recommended that you
configure linting support for your editor as well.
If you're using Visual Studio Code, make sure to install the ESLint extension and add the following to your workspace settings:
{
"eslint.validate": [
"javascript",
"javascriptreact",
"vue"
]
}