imclab / multi-screen-demo

A multi-screen demo using socket.io (WebSockets)

multi-screen-demo

multi-screen-demo is a node.js app that uses socket.io (WebSockets) to pair a mobile and a PC, allowing seamless and responsive two-way interaction between paired devices. The goal of the app is to illustrate the use of WebSockets and hopefully give people some inspiration to create compelling multi-screen scenarios.

Link

You can check out the app in action here.

Overview

The app contains two demos:

• Gestures
  • Use gestures on a mobile and show the detected events on a paired PC
  • The demo uses hammer.js, a JavaScript library for multi-touch gestures, and angular-hammer, an AngularJS directive that adds hammer.js support
• D-pad
  • A simple D-pad controller for a mobile, which moves a target around on a paired PC
  • The demo uses the touch and release events in hammer.js; also uses angular-hammer
  • At the moment, the demo is a bit of a hack, where jQuery's animate() function is used to move the target (using jQuery is not very Angular); this was the fastest (and simplest) path to illustrate the use of a D-pad controller without using intervals, worrying about things like collision detection, and so on; since animate() requires a duration, the animation will just end after 20s (an arbitrary value I picked), even if one of the D-pad buttons is still pressed

Also, this app was tested in Chrome. If you experience any issues using socket.io or hammer.js with another browser, please try using Chrome.