A basic starting point for motion-detection apps using WebRTC & Canvas, refactored out of the Magic Xylophone by @soundstep
JavaScript CSS
Latest commit b9f1a0b Jun 12, 2014 @RonnyO RonnyO Remove nonsense comment
Permalink
Failed to load latest commit information.
images favicon Oct 12, 2012
js cleanup Oct 12, 2012
styles cleanup Oct 12, 2012
videos Import my SoundStep fork - Originally created a chrome extension whic… Oct 11, 2012
README.md Remove nonsense comment Jun 12, 2014
app.html favicon Oct 12, 2012

README.md

JS Motion Detection

This project tries to provide as a basis for other motion-detection apps, by separating the framework from its implementations.

The app uses WebRTC, HTML5 Canvas and some math, and is refactored out of the Magic Xylophone by soundstep. You can learn more about the process fom Romuald himself on Adobe Developer Connection and his blog post.

Usage

Any child element you add inside <div id="hotSpots"></div> will automagically work as a hotSpot, which means it will fire motion events on itself with extra data upon motion detection.

You could control its appearance & position with CSS, and hook to the motion events with jQuery / plain JS.

Sample Usage & DEMO

  • See some examples in sample.js
  • Open up the demo here. Hit Allow, check the console.

License

Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License