I made this presentation for DFX Korea 2012. I will present this in emerging session. For more information of the event, please go to https://sites.google.com/site/devfestxkorea/program

1. android
arduino
and mixed with
breakout.js
@musart

2. Who am I?
• Embedded System Software Engineer
• Android & Hybrid Application Developer
• PhoneGap Book Author
• twitter : @musart

3. Today Demo
Turn LED on/off
?
Get Button status

4. Way 1. using Android ADK
USB host
• Pros : The simplest way
• Cons : Wired connection

5. Way 2. using Amarino
Bluetooth
• Pros : Wireless connection
• Cons : Bluetooth shield needed

6. Way 3. breakout.js
USB
to
Serial
WiFi
• Pros : Wireless connection, No more shield
• Cons : Server PC needed

7. Arduino
digital
• Open Hardware
usb
serial
• 13 digital pin, 6 analog pin
• It works standalone with
power Power
analog • Sketch Tool

8. breakout.js
Physical Input
WebApp
Physical Output
MobileApp
• Connect physical I/O to Web based on Javascript
• Using WebSocket

9. PhoneGap
& PhoneGap Plugin
• PhoneGap is HTML5 app platform.
• WebView in Android is not support WebSocket.
• PhoneGap also uses WebView.
• WebSocket is able to be implemented as
PhoneGap plugin.

10. Software
Firmata Breakout.js Server Breakout.js Client
-C - Java - Javascript
- use Standard Firmata - webbit, rxtx library - jQuery library
void setup() bridge = new SerialBridge ...
{ (netPort, this, webRoot, var IOBoard = BO.IOBoard;
... isMultiClientEnabled); var IOBoardEvent =
Firmata. bridge.begin(serialPort, BO.IOBoardEvent;
attach(ANALOG_MESSAGE, 57600); var LED = BO.io.LED;
analogWriteCallback); connectBtn. var Button = BO.io.Button;
Firmata. setText("Disconnect"); var ButtonEvent =
attach(DIGITAL_MESSAGE, connectBtn. BO.io.ButtonEvent;
digitalWriteCallback); setActionCommand
... ("disconnect"); var arduino = new
Firmata.begin(57600); if (timer != null) { IOBoard("192.168.1.2",
systemResetCallback(); stopPortListTimer(); 8890);
} } var led;

11. Breakout Javascript API
• Initialize
<script type="text/javascript" src="Breakout.js"></script>
var IOBoard = BO.IOBoard;
var LED = BO.io.LED;
var Button = BO.io.Button;
var arduino = new IOBoard("192.168.1.2", 8890);
var led;
arduino.addEventListener(IOBoardEvent.READY, onReady);
function onReady(event) {
arduino.removeEventListener(IOBoardEvent.READY, onReady);
led = new LED(arduino, arduino.getDigitalPin(11));
var button = new Button(arduino, arduino.getDigitalPin(2));
button.addEventListener(ButtonEvent.PRESS, onPress);
button.addEventListener(ButtonEvent.RELEASE, onRelease);
}

12. Breakout Javascript API
• LED
// led = new LED(arduino, arduino.getDigitalPin(11));
function turnLedOn(evt) {
led.on();
}
function turnLedOff(evt) {
led.off();
}
• Button
// var button = new Button(arduino, arduino.getDigitalPin(2));
// button.addEventListener(ButtonEvent.PRESS, onPress);
// button.addEventListener(ButtonEvent.RELEASE, onRelease);
function onPress(evt) {
var btn = evt.target;
$('#state').html("Button "+ btn.pinNumber +" state: Pressed");
}
function onRelease(evt) {
var btn = evt.target;
$('#state').html("Button "+ btn.pinNumber +" state:Released");
}

13. Demo

14. Many Combinations available
Firmata Breakout.js Server Breakout.js Client
PhoneGap App
Web App, Hybrid App
Arduino Nano
Raspberry Pi
Arduino Mega 2560 Baegle Board

15. Reference Sites
• Breakout.js : http://breakoutjs.com/
• PhoneGap : http://phonegap.com/
• PhoneGap Plugin : https://github.com/anismiles/websocket-
android-phonegap
• Firmata : http://firmata.org/wiki/Main_Page
• Amernio : http://www.amarino-toolkit.net/
• Android ADK : http://developer.android.com/guide/topics/
usb/adk.html
• Funnel : http://funnel.cc/

16. Thanks
@musart