Downloaded 24 times
![JOYSTICK CONTROLLED LASER
JOHNNY FIVE
var five = require(../lib/johnny-five.js),
board = five.Board({
debug: true
});
board.on(ready, function() {
var range, pan, tilt, joystick;
range = [ 0, 170 ];
// Servo to control panning
pan = five.Servo({
pin: 9,
range: range
});
// Servo to control tilt
tilt = five.Servo({
pin: 10,
range: range
});
// Joystick to control pan/tilt
// Read Analog 0, 1
// Limit events to every 100ms
joystick = five.Joystick({
pins: [ A0, A1 ],
freq: 100
});
// Center all servos
(five.Servos()).center();
joystick.on(axismove, function() {
tilt.move( Math.ceil(170 * this.fixed.y) );
pan.move( Math.ceil(170 * this.fixed.x) );
});
http://jsfiddle.net/rwaldron/YHb7A/show/light/
!43](https://image.slidesharecdn.com/javascriptallthethings-131128155139-phpapp02/75/Javascript-all-the-things-43-2048.jpg)
Uploaded byFelix Wahner
Javascript all the things
The document outlines a talk on JavaScript and its applications in the Internet of Things (IoT), featuring various hardware platforms like Arduino, Raspberry Pi, and devices such as Google Glass and Oculus Rift. It emphasizes JavaScript's ease of use for building applications that connect the physical world to the web, supported by libraries like Johnny Five and Noduino. The author also discusses potential business applications and future implications of integrating sensors and interactivity into everyday objects.
Javascript all the things
- 1. JAVASCRIPT ALL THE THINGS #HANNOVERJS11/2013 ! ! ! ! ! ! ! ! ! @FELIXWAHNER / @NEUWAERTS_DE !1
- 2. WHAT IS THISTALK THIS ABOUT? • Javascript (obviously) • Things (literally) !2
- 3. WHAT IS THISTALK THIS ABOUT? • Javascript • Frontend • Server • • Hardware Things • • Hardware Gadgets !3
- 4. WHAT IS THISTALK THIS ABOUT? • Javascript • Frontend • Server • • Hardware Things • • Hardware Gadgets !4
- 5. WHAT IS THISTALK THIS ABOUT? • Javascript • Frontend • Server • • Hardware Things • • Hardware Gadgets !5
- 6. WHAT IS THISTALK THIS ABOUT? • Javascript • Frontend • Server • • Hardware Things • • Hardware Gadgets !6
- 7. WHAT IS THISTALK THIS ABOUT? • Javascript • Frontend • Server • • Hardware Things • • Hardware Gadgets !7
- 8. LET ME INTRODUCEMYSELF !8
- 9. THAT’S ME • Felix Wahner • @felixwahner • 32yrs old • Father, Designer, Frontend Developer, Fulltime Nerd • CTO @neuwaerts_de • blogs @ neuwaerts.de/emerge !9
- 10.
- 11.
- 12.
- 13.
- 14. INTERNET OF THINGS ABRIEF INTRODUCTION • A connection of „Things“ (real world objects) with our beloved InternetsTM • Enriches all day life experience with Facebook like counters awesome metadata and functionality • Will hopefully make our lives a lot easier !14
- 15. RATHER OBVIOUS EXAMPLES Google GlassImage: http://www.aha-soft.com !15
- 16.
- 17. NOT SO OBVIOUS EXAMPLES http://commons.wikimedia.org/wiki/File:Cow_female_black_white.jpg Astreet sign that adjusts its contents and directions based on user input: ! ! http://breakfastny.com/points/ Dutch Company „Sparked“ is using wireless sensors on cattle ! ! ! ! http://www.iotworks.com/#!sensors/c14wo !17 Dominic Wilcox has created a fully functional prototype pair of shoes that will guide the wearer to any destination ! ! ! http://dominicwilcox.com/portfolio/gpsshoe/
- 18. PROTOTYPING, PHYSICAL COMPUTINGPLATFORMS AND THE MAKER MOVEMENT !18
- 19. IN THE BEGINNINGTHERE WAS ARDUINO • Created 2000 by Massimo Banzi • Open Source Hardware and Software • Extendable, Programmable http://arduino.cc/ !19
- 20. ! RASPBERRY PI • Firstversion released in 2011 • credit-card-sized single-board computer http://www.raspberrypi.org/ !20
- 21. ! ESPRUINO • 2013 (tobe released) • JavaScript interpreter for microcontrollers http://www.espruino.com/ !21
- 22. BONUS :) MAKEY MAKEY •An Invention Kit for Everyone • Turn everyday objects into touchpads and combine them with the internet http://www.makeymakey.com/ !22
- 23. BONUS :) MAKEY MAKEY http://www.makeymakey.com/- Foto: http://www.flickr.com/photos/raster/8605560001/ !23
- 24. MORE INTERESTING DEVICES IBROUGHT SOME WITH ME FEEL FREE TO TRY THEM RIGHT HERE. !24
- 25. ! LEAP MOTION • MotionSensing Device • Browse the web, read articles, flip through photos, and play music just by lifting a finger • API App ecosystem https://www.leapmotion.com/ https://developer.leapmotion.com/ !25
- 26. ! SPHERO • It's theworld's first robotic ball that you control with a tilt, touch, or swing from your smartphone or tablet • API and SDK www.gosphero.com https://developer.gosphero.com/ !26
- 27. ! OCULUS RIFT • virtualreality head-mounted display • API and SDK http://www.oculusvr.com/ https://developer.oculusvr.com/ !27
- 28.
- 29.
- 30. NOTICED SOMETHING? ALL THESETHINGS ARE EITHER PROGRAMMABLE OR HAVE AN API !30
- 31. NOTICED SOMETHING? ALL THESETHINGS ARE EITHER PROGRAMMABLE OR HAVE AN API !31
- 32. SO LETS TALKABOUT ALL THE THINGS! !32
- 33. SO LETS TALKABOUT ALL THE THINGS! EXCEPT FOR THE COWS. !33
- 34. SO LETS TALKABOUT JAVASCRIPT ALL THE THINGS! ! ! ! … FINALLY! :) !34
- 35. ! WHY JAVASCRIPT? • Easy tolearn • Asynchronous • Popular, great Community • Awesome because it’s not C. :) • The last one might depend on who you’re talking to !35
- 36. „Any application thatcan be written in JavaScript, will eventually be written in JavaScript“ –Jeff Atwood / The Principle of Least Power http://www.codinghorror.com/blog/2007/07/the-principle-of-least-power.html !36
- 37. ! WHAT CAN BEDONE VIA JS? Build the Frontend (if needed) Build your Server/Services (i.e. with node.js) End to end communication (WebRTC) Hardware Read/Write (node-serialport) !37
- 38. ! WHAT CAN BEDONE VIA JS? Build the Frontend (if needed) Build your Server/Services (i.e. with node.js) End to end communication (WebRTC) Hardware Read/Write (node-serialport) !38
- 39.
- 40. ! NODUINO • A simpleand flexible JavaScript and Node.js Framework for accessing basic Arduino controls from Web Applications using HTML5, Socket.IO and Node.js. http://semu.github.io/noduino/ !40
- 41. ! NODUINO var Noduino =new NoduinoObj({debug: true, host: 'http:// localhost:8090'}, Connector); Noduino.connect(function(err, board) { if (err) { return console.log(err); } board.withButton({pin: 13}, function(err, Button) { if (err) { return console.log(err); } Button.on('push', function() } console.log('Button pushed'); }); Button.push(); }); }); http://semu.github.io/noduino/ !41
- 42. ! JOHNNY FIVE • Johnny-Fiveis an Open Source, JavaScript Arduino programming framework • developed at Bocoup (yup: these guys that contribute to almost all major JS projects). https://github.com/rwaldron/johnny-five http://bocoup.com/ !42
- 43. JOYSTICK CONTROLLED LASER JOHNNYFIVE var five = require(../lib/johnny-five.js), board = five.Board({ debug: true }); board.on(ready, function() { var range, pan, tilt, joystick; range = [ 0, 170 ]; // Servo to control panning pan = five.Servo({ pin: 9, range: range }); // Servo to control tilt tilt = five.Servo({ pin: 10, range: range }); // Joystick to control pan/tilt // Read Analog 0, 1 // Limit events to every 100ms joystick = five.Joystick({ pins: [ A0, A1 ], freq: 100 }); // Center all servos (five.Servos()).center(); joystick.on(axismove, function() { tilt.move( Math.ceil(170 * this.fixed.y) ); pan.move( Math.ceil(170 * this.fixed.x) ); }); http://jsfiddle.net/rwaldron/YHb7A/show/light/ !43
- 44. ! NODE AR-DRONE • Animplementation of the networking protocols used by the Parrot AR Drone 2.0. https://github.com/felixge/node-ar-drone !44
- 45. ! ! NODE AR-DRONE var arDrone= require('ar-drone'); var client = arDrone.createClient(); ! client.takeoff(); ! client .after(5000, function() { this.clockwise(0.5); }) .after(3000, function() { this.stop(); this.land(); }); http://semu.github.io/noduino/ !45
- 46. ! NODE AR-DRONE: NODECOPTER •„There’s a meet up for that!“ • http://nodecopter.com/ • @nodeCopter https://github.com/felixge/node-ar-drone !46
- 47. OK, THIS WASQUITE A LOT OF GEEKY GADGET STUFF. BUT HOW DOES THIS FIT INTO MY BUSINESS MODEL? !47
- 48. BRITISH AIRWAYS BILLBOARD CAMPAIGN •Combines IoT with Classic Campaign • Get’s a lot of „buzz“ • Would be easy to implement with JS: • Flights API • Kinect (node-kinect ) • Some very expensive large screen :) http://mashable.com/2013/11/25/british-airways-billboard/ https://github.com/pgte/node-kinect !48
- 49. CA FASHION LIKE • Shows'Likes' on their respective Clothing Racks • Combines IoT with Classic Campaign • Get’s a lot of „buzz“ • Would be easy to implement with JS: • Facebook Graph-API • Arduino Mini • Some very cheap small led screens :) http://infosthetics.com/archives/2012/05/ca_fashion_like_real-time_facebook_likes_shown_on_clothing_racks.html !49
- 50.
- 51. HYPOTHESIS THE INTERNET ANDSENSORS WILL INFILTRATE EVERYTHING !51
- 52. HYPOTHESIS THERE WILL BENEW, MORE INTUITIVE, MORE PRECISE INPUT AND OUTPUT DEVICES !52
- 53. ! A FUTURE VISION $(livingroom).bind(motion, function() { $(this).find(lights).brightness(75%).dimAfter(120s); }); http://www.voodootikigod.com/nodebots-the-rise-of-js-robotics/ !53
- 54. THANKS FOR LISTENING! NOWGO BUILD SOMETHING AWESOME BE SURE TO SHARE TWEET US ABOUT IT! !54
- 55. QUESTIONS? FEEDBACK? DROP MEA LINE: @FELIXWAHNER ! …AND BE SURE TO VISIT OUR BLOG. THERE WILL BE MORE #IOT POSTS COMING SOON: HTTP://NEUWAERTS.DE/EMERGE !55