This app serves views that display information directly from a Chaturbte profile.
These views are intended to be used as an OBS source overlay.
Run the docker image:
docker run \
-ti \
--name=cb-overlay-app \
--publish=8080:8080 \
paulallen87/chaturbate-overlay-app
Then navigate to:
http://localhost:8080/default/<your username>
You must already have node.js installed.
You also need Google Chrome/Chromium (version >= 59) installed.
Then install the yarn package manager.
npm install -g yarn
sh chaturbate-overlay-app/bin/start-dev.sh
sh chaturbate-overlay-app/bin/start-prod.sh
Views are located at:
src/views/<VIEW NAME>/view-<VIEW NAME>.html
They need to be registered with src/my-app.html under this comment:
<!-- ADD VIEWS HERE -->
There are two places in my-app.html that need to be updated.
All views should include the <chaturbate-controller> tag:
<chaturbate-controller
username="[[subrouteData.username]]"
chat="{{chat}}"
...>
</chaturbate-controller>
The data-bindings provided by the controller component can be used to dive other UI components:
<chaturbate-chat items="{{chat}}"></chaturbate-chat>
First create a new git repo for the component.
Then create the new component and create a global link to it:
mkdir new-component && cd new-component
git clone https://github.com/YOUR-USERNAME/new-component.git .
bower init
touch new-component.html
bower link
Link the new component to this app:
cd chaturbate-overlay-app
bower link new-component
Update your view to import the new component:
<link rel="import" href="https://github.com/paulallen87/chaturbate-overlay-app/blob/master/./../../bower_components/new-component/new-component.html">
Update your view to use the new component:
<new-component></new-component>
Test the new component:
sh chaturbate-overlay-app/bin/start-dev.sh
After the component is complete, upload it to Github.
cd new-component
git add .
git commit -m 'initial commit'
git tag v1.0.0
git push origin master --tags
Add the new component to the Bower dependencies:
cd chaturbate-overlay-app
bower add https://github.com/YOUR-USERNAME/new-component.git --save
Finally push a commit of this app with the new component:
git add .
git commit -m 'added new component'
git push origin master
First create a new git repo for the module.
Then create the new module and create a global link to it:
mkdir new-module && cd new-module
git clone https://github.com/YOUR-USERNAME/new-module.git .
yarn init --scope=YOUR-USERNAME
touch index.js
yarn link
Link the new module to this app:
cd chaturbate-overlay-app
yarn link @YOUR-USERNAME/new-module
Update the server to import the new module:
const NewModule = require('@YOUR-USERNAME/new-module')
Test the new module:
sh chaturbate-overlay-app/bin/start-dev.sh
After the module is complete, upload it to Github.
cd new-module
git add .
git commit -m 'initial commit'
git tag v1.0.0
git push origin master --tags
The publish it to NPM:
yarn publish --access=public
Add the new module to the node dependencies:
cd chaturbate-overlay-app
yarn install @YOUR-USERNAME/new-module --save
Finally push a commit of this app with the new component:
git add .
git commit -m 'added new module'
git push origin master
sh chaturbate-overlay-app/bin/docker/build.sh
sh chaturbate-overlay-app/bin/docker/run.sh