Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Physical JavaScript with Johnny-5, Cylon and Te...
Search
mulderp
September 24, 2014
Programming
1
1.1k
Physical JavaScript with Johnny-5, Cylon and Tessel
A small overview on the current state of JavaScript for physical computing
mulderp
September 24, 2014
Tweet
Share
More Decks by mulderp
See All by mulderp
Node.js for Embedded Systems
mulderp
1
2.8k
Nodebotsday
mulderp
1
120
I2C basics with Arduino
mulderp
0
210
Sharing hardware with JavaScript
mulderp
1
190
Arduino October meetup
mulderp
0
110
Blogging and writing about JavaScript
mulderp
2
850
Minimum Viable Interactions
mulderp
3
570
Arduino July Meetup
mulderp
0
93
Handlebones
mulderp
0
200
Other Decks in Programming
See All in Programming
KSPの導入・移行を前向きに検討しよう!
shxun6934
PRO
0
280
Go1.23で入った errorsパッケージの小さなアプデ
kuro_kurorrr
2
390
はじめてみよう量子プログラミング
itokoichi01
0
220
Increased Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
390
ドメイン駆動設計を実践するために必要なもの
bikisuke
4
330
長期運用プロダクトの開発速度を維持し続けるためのリファクタリング実践例
wataruss
8
2.7k
Rubyとクリエイティブコーディングの輪の広がり / The Growing Circle of Ruby and Creative Coding
chobishiba
1
270
Findy - エンジニア向け会社紹介 / Findy Letter for Engineers
findyinc
4
90k
watsonx.ai Dojo #2 生成AIを使ったアプリ開発入門編
oniak3ibm
PRO
0
230
AndroidアプリのUIバリエーションをあの手この手で確認する / Check UI variations of Android apps by various means
tkmnzm
1
180
[DroidKaigi 2024] Android ViewからJetpack Composeへ 〜Jetpack Compose移行のすゝめ〜 / From Android View to Jetpack Compose: A Guide to Migration
syarihu
1
650
Amazon BedrockでサーバレスなAIお料理ボットを作成する!!
tosuri13
0
230
Featured
See All Featured
For a Future-Friendly Web
brad_frost
174
9.3k
Docker and Python
trallard
39
3k
Build The Right Thing And Hit Your Dates
maggiecrowley
30
2.3k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
Agile that works and the tools we love
rasmusluckow
327
20k
Building a Scalable Design System with Sketch
lauravandoore
459
32k
Designing the Hi-DPI Web
ddemaree
278
34k
Design by the Numbers
sachag
277
19k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
26
2k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
28
1.6k
What's new in Ruby 2.0
geeforr
340
31k
Learning to Love Humans: Emotional Interface Design
aarron
270
40k
Transcript
Physical NodeJS! with Johnny-5, Cylon and Tessel Patrick Mulder @mulpat
Munich Node JS User Group September 2014
https://www.flickr.com/photos/spelio/13884611917
ngraph http://anvaka.github.io/talks/jsfest/presentation
maker labs https://www.flickr.com/photos/leesean/3098869562
Source: Sander Arts, Atmel
“inspecting” your car https://vimeo.com/84498522
new browser controls https://www.flickr.com/photos/frenchhope/317111231 https://www.flickr.com/photos/bagogames/14073389239
example: blinking http://makezine.com/2014/05/29/10-ways-to-make-your-robot-more-humanlike/ “The average human blink rate is about
17 blinks per minute.” (ca. 3 blinks/s) “The normal length of a blink is 100-400 milliseconds”
Arduino! 1x1
Arduino UNO MPU Digital Pins Analog Pins USB Power Pins
a “typical” project configuration blocking! code Processing IDE sketch
Embedded Code void setup() {! pinMode(led, OUTPUT);! }! ! void
loop() {! digitalWrite(led, HIGH);! delay(300);! digitalWrite(led, LOW); ! delay(2700); ! }
blink == blocking ? void loop() {! ! blink();! !
check_network();! move_something();! wait_for_input();! write_to_file();! }
–Eric Lippert “The by-design purpose of JavaScript was to make
the monkey dance when you moused over it. ” http://programmers.stackexchange.com/a/221658/4723 JavaScript
How would you write this with JavaScript ?
blink = function() {! led.toggle();! setTimeout(blink, 2700);! }! ! blink();
setTimeout(…)
setInterval(…) setInterval(function () {! led.toggle();! }, 2700);
https://github.com/rwaldron/johnny-five Johnny-5 API
Johnny-5 API this.repl.inject({! board: this! }); https://github.com/rwaldron/johnny-five/tree/master/docs led.fadeIn(); led.blink(100); //
or led.strobe() led.color(keymap[key.name]);
demo johnny-5 http://www.flickr.com/photos/tronixstuff/5268597956/
How can Arduino speak JavaScript ?
Firmata protocol “The aim is to allow people to completely
control the Arduino from software on the host computer.” http://www.firmata.org/wiki/Main_Page
firmata sketch
firmata test
control flow led = new five.Led({! pin: 13! });! !
led.on();! ! this.wait(2700, function() {! led.on();! }); JavaScript https://www.flickr.com/photos/nate/3081263606 Firmata /! serial port Arduino
Network? This means Arduino Yun…
None
Yun architecture
acts-as-webserver http://www.open-electronics.org/interact-and-remotely-control-arduino-yun-with-ajax/#
For developer, OpenWrt is the framework to build an application
without having to build a complete firmware around it + embedded host
Cylon.js http://cylonjs.com/
Cylon.js
led blinking var Cylon = require('cylon');! ! Cylon.robot({! connection: {!
name: 'arduino',! adaptor: 'firmata',! port: '/dev/ttyACM0'! },! ! devices: [! { name: 'led', driver: 'led', pin: 13 },! { name: 'button', driver: 'button', pin: 2 }! ],! ! work: function(my) {! my.button.on('push', function() {! my.led.toggle()! });! }! }).start();
http://www.slideshare.net/TechnicalMachine/tessel-the-end-of-web-development-as-we-know-it Tessel is a microcontroller that runs JavaScript. It's npm-compatible
and ships with Wifi built in. Use it to easily make physical devices that connect to the web. http://www.slideshare.net/TechnicalMachine/fluent-20-min-32416115
How does it work? today tomorrow
Blink first var tessel = require('tessel');! ! var gpioA =
tessel.port['A'];! ! var led1 = gpioA.digital[0];! ! var value = true;! setInterval(function () {! led.write(value);! value = !value;! }, 2000);
physical JavaScript is fun :) still in early stages dedicated
platforms emerge
Thanks! http://blog.farsinotare.com https://oshpark.com/shared_projects/ZsQu0dA9 https://www.kickstarter.com/projects/311408456/rgb-123-led-matrices
None
None
https://iotroadshow.intel.com/de/home/