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.

Node.js requirements

This web app runs with Node.js v0.12.7. The best way to install it is using nvm. A .nvmrc file is also included in this project's root folder.

Note: support for Node.js 0.12.x has officially ended. There are no plans to update this project to work on a newer version of Node.js at this time.