nodecg-bundle-walkthrough



nodecg-bundle-walkthrough

0 0


nodecg-bundle-walkthrough


On Github denolfe / nodecg-bundle-walkthrough

Preview

extension.js

Extension.js will pull the album art from the API and drop it into a local .jpg file. NodeCG has a construct called *replicants*. They are essentially javascript objects that, when changed, are sent to the view via websockets. The replicant used to send the song information is called **`songInfo`**.
# Broadcast View This is what will be shown on the broadcast. When the `songInfo` is changed, our javascript file detects it, phases out the old album art, and phases in the new. The controller for most of the logic happens in the **`songInfo.on('change')`** function. Everything else is jQuery transitions.

script.js

# Dashboard Panel This uses the same **`songInfo.on('change')`** function as the broadcast view. It refreshes the admin panel with the song's artist/title and the album art.

panel.js

# To Sum It Up Whenever the broadcaster changes his song... 1. Song change is detected via Last.fm API 2. Album Art retrieved from Spotify API 3. Broadcast view and dashboard panel are updated with the correct info

Final Result (one more time...)

# Links - [Gist files](https://gist.github.com/denolfe/bba80e206c539fa8f497) - [This presentation](https://github.com/denolfe/nodecg-bundle-walkthrough) - [NodeCG](http://nodecg.com/)