Download - Build your own RasPiTV with Node.js & Socket.io

Transcript
Page 1: Build your own RasPiTV with Node.js & Socket.io

Build Your own RasPiTV

DerekHaddadDonaldDerek

Page 2: Build your own RasPiTV with Node.js & Socket.io
Page 3: Build your own RasPiTV with Node.js & Socket.io

The idea.

= + +RaspberryPi Chromium NodeJS + Socket.ioRasPiTV

Page 4: Build your own RasPiTV with Node.js & Socket.io

The Implementation.

RasPiTv with its special remote controller

Page 5: Build your own RasPiTV with Node.js & Socket.io

The Stack

• Raspbian• NodeJs– Express– Socket.io– Omxcontrol

• Shell Commands– Chromium in Kiosk mode– Youtube-dl– Omxplayer

Page 6: Build your own RasPiTV with Node.js & Socket.io

WARNING: Diving into Code

Page 7: Build your own RasPiTV with Node.js & Socket.io

Socket.io: Client Side

Client Side Implementation (remote.html)

Page 8: Build your own RasPiTV with Node.js & Socket.io

Socket.io: Server Side

Server Side Implementation (app.js)

Page 9: Build your own RasPiTV with Node.js & Socket.io

Moustache.js – Template Engine

The template

Creating the JSON object and filling in the template

Page 10: Build your own RasPiTV with Node.js & Socket.io

The Remote

Minimal remote – Buttons are replaced with Swipe Gestures

Page 11: Build your own RasPiTV with Node.js & Socket.io

Quo.js – Handling Swipe Gestures

The $$ is to differentiate jQuery from Quo

Page 12: Build your own RasPiTV with Node.js & Socket.io

The TV

Swipe right on the remote to move the border from Watch to Listen

Page 13: Build your own RasPiTV with Node.js & Socket.io

https://github.com/DonaldDerek/RaspberryPiTV

Fork me on github

Check the full tutorial on: blog.donaldderek.com

DerekHaddadDonaldDerek

Page 14: Build your own RasPiTV with Node.js & Socket.io

May the Force be with you

DerekHaddadDonaldDerek