View
739
Download
1
Category
Tags:
Preview:
Citation preview
abusing phones
DAHO.AM 12 June 2015
to make the internet of things
@janjongboom
abusing phones
DAHO.AM 12 June 2015
to make the internet of things
@janjongboom
@janjongboom
Telenor R&D
Mozilla things
I hate JavaScript!
VBScript <3 <3 <3
Before mobile revolution…Limited input methods
Vibration sensor?
Accelerometer?
Accelerometer?
Proximity Accelerometer Ambient Light Magnetometer Gyroscope Humidity Ambient Temperature Pressure Battery Cameras
Bend sensor
Internet of Things
Moves IHR SleepCycle
BORING!
Device LightReal purpose: adjust brightness
MusicTheremin is instrument
Use device light as tone frequency
Wave your hands and magic!
MusicTheremin is instrument
Use device light as tone frequency
Wave your hands and magic!
1 var context = new AudioContext(); 2 var oscillator = context.createOscillator(); 3 oscillator.connect(context.destination); 4 oscillator.start(0); 5 6 window.addEventListener('devicelight', function(e) { 7 oscillator.frequency.value = e.value * 10; 8 });
Music
GyroscopeReal purpose: rotate screen
GyroscopeReal purpose: rotate screen
Track real life movementDraw 3D model of phones
Measure gyroscope data
Show real life state on screen
Track real life movement 1 var front = new THREE.MeshBasicMaterial({ map: loadTexture('front.jpg') }); 2 var back = new THREE.MeshBasicMaterial({ map: loadTexture('back.jpg') }); 3 var border = new THREE.MeshBasicMaterial({ color: 0xffe04526 }); 4 5 var materials = [ border, border, border, 6 border, front, back ]; 7 8 var geometry = new THREE.BoxGeometry(2, 4, 0.3); 9 var cube = new THREE.Mesh(geometry, 10 new THREE.MeshFaceMaterial(materials)); 11 scene.add(cube);
Track real life movement
1 window.addEventListener('deviceorientation', function(e) { 2 cube.rotation.x = e.beta / 60; 3 cube.rotation.y = e.gamma / 60; 4 cube.rotation.z = e.alpha / 60; 5 });
AccelerometerReal purpose: Turn to mute
Juggling visualizerMeasure z-forces on device
Plot it in graph over time
Juggle with multiple devices
Juggling visualizer
1 window.addEventListener('devicemotion', function(e) { 2 var serie = getGraphSerieForDevice(e.data.deviceId); 3 serie.addPoint([ e.data.timestamp, Math.abs(e.data.z) ]); 4 });
Weight scale
Computer generated
music
http://gibber.mat.ucsb.edu/
1 a = Drums('x*o*x*o-')
Gibber
1 a = Drums('x*o*x*o-')
Gibber
Gibber 1 a = Drums('x*o*x*o-') 2 a.pitch = 0.5
Gibber 1 a = Drums('x*o*x*o-') 2 a.pitch = 0.5
Gibber 1 a = Drums('x*o*x*o-') 2 3 speak = Speak({ pitch: 70, wordgap:5 }) 4 .say.seq( 5 ['Mu', 'nich', 'Mu', 'Mu', 'nich'], 6 [1/2, 1/2, 1/4, 1/4, 1/2] 7 ) 8 9 speak.pitch.seq( [1,.8,1.2].rnd() ) 10 Clock.bpm = 120;
Gibber 1 a = Drums('x*o*x*o-') 2 3 speak = Speak({ pitch: 70, wordgap:5 }) 4 .say.seq( 5 ['Mu', 'nich', 'Mu', 'Mu', 'nich'], 6 [1/2, 1/2, 1/4, 1/4, 1/2] 7 ) 8 9 speak.pitch.seq( [1,.8,1.2].rnd() ) 10 Clock.bpm = 120;
Gibber 1 a = Drums('x*o*x*o-') 2 3 speak = Speak({ pitch: 70, wordgap:5 }) 4 .say.seq( 5 ['Mu', 'nich'], 6 [1/4, 1/4, 1/4, 1/2].rnd() 7 ) 8 9 speak.pitch.seq( [1,.8,1.2].rnd() ) 10 Clock.bpm = 120;
Gibber 1 a = Drums('x*o*x*o-') 2 3 speak = Speak({ pitch: 70, wordgap:5 }) 4 .say.seq( 5 ['Mu', 'nich'], 6 [1/4, 1/4, 1/4, 1/2].rnd() 7 ) 8 9 speak.pitch.seq( [1,.8,1.2].rnd() ) 10 Clock.bpm = 120;
Gibber 1 a = Drums('x*o*x*o-') 2 3 speak = Speak({ pitch: 70, wordgap:5 }) 4 .say.seq( 5 ['Mu', 'nich'], 6 [1/4, 1/4, 1/4, 1/2].rnd() 7 ) 8 9 speak.pitch.seq( [1,.8,1.2].rnd() ) 10 Clock.bpm = 120;
So much phones!
Gibber
Gibber 1 a = Drums('x*o*x*o-') 2 a.pitch = Phone.X
https://github.com/janjongboom/jsconf-us/blob/master/gibber/gibber-phone.js
Gibber 1 a = Drums('x*o*x*o-') 2 a.pitch = Phone.X
https://github.com/janjongboom/jsconf-us/blob/master/gibber/gibber-phone.js
Getting data out of thereal world
Bluetooth beaconsBroadcasting their existence
Bluetooth beaconsLong battery life
Cheap URLs, sensor values, etc.
Coming to a web browser near youhttps://bugzilla.mozilla.org/show_bug.cgi?id=1063444
Coming to a web browser near youhttps://bugzilla.mozilla.org/show_bug.cgi?id=1063444
Scanning beacons 1 var adapter = navigator.mozBluetooth.defaultAdapter 2 adapter.startLeScan([]).then(handle => { 3 handle.ondevicefound = e => { 4 // handle e.scanRecord 5 } 6 7 setTimeout(() => { 8 adapter.stopLeScan(handle) 9 }, 5000) 10 }, err => console.error(err))
Scanning beacons 1 var adapter = navigator.mozBluetooth.defaultAdapter 2 adapter.startLeScan([]).then(handle => { 3 handle.ondevicefound = e => { 4 // handle e.scanRecord 5 } 6 7 setTimeout(() => { 8 adapter.stopLeScan(handle) 9 }, 5000) 10 }, err => console.error(err))
Scanning beacons 1 var adapter = navigator.mozBluetooth.defaultAdapter 2 adapter.startLeScan([]).then(handle => { 3 handle.ondevicefound = e => { 4 // handle e.scanRecord 5 } 6 7 setTimeout(() => { 8 adapter.stopLeScan(handle) 9 }, 5000) 10 }, err => console.error(err))
Scanning beacons 1 var adapter = navigator.mozBluetooth.defaultAdapter 2 adapter.startLeScan([]).then(handle => { 3 handle.ondevicefound = e => { 4 // handle e.scanRecord 5 } 6 7 setTimeout(() => { 8 adapter.stopLeScan(handle) 9 }, 5000) 10 }, err => console.error(err))
Scanning beacons 1 var adapter = navigator.mozBluetooth.defaultAdapter 2 adapter.startLeScan([]).then(handle => { 3 handle.ondevicefound = e => { 4 // handle e.scanRecord 5 } 6 7 setTimeout(() => { 8 adapter.stopLeScan(handle) 9 }, 5000) 10 }, err => console.error(err))
JavaScript baby monitorTag your baby with a phone
Get three beacons Some math
JavaScript baby monitorTag your baby with a phone
Get three beacons Some math
Linux Kernel
Linux Kernel
Gecko
Linux Kernel
Gecko HTML5UI
Linux Kernel
Gecko HTML5UI
Has all phone APIs in JS
Linux Kernel
Gecko
Has all phone APIs in JS
First screwdriver ever!
Booting / flashing
Linux Kernel
Gecko
Has all phone APIs in JS
Linux Kernel
Gecko JanOS
Has all phone APIs in JS
Linux Kernel
Gecko JanOS
Has all phone APIs in JS
JanOSFork of Firefox OS For phones & Rpi
Runs without display
1 var conn = navigator.mozMobileConnections[0]; 2 conn.addEventListener('voicechange', function vc() { 3 if (conn.voice.connected) { 4 conn.removeEventListener('voicechange', vc); 5 6 var req = navigator.mozMobileMessage 7 .send('+31612345678', 'Hello from JanOS!'); 8 req.onsuccess = function() { 9 console.log('Message sent successfully'); 10 }; 11 req.onerror = function() { 12 console.error('Could not send SMS', req.error); 13 }; 14 } 15 });
1 var conn = navigator.mozMobileConnections[0]; 2 conn.addEventListener('voicechange', function vc() { 3 if (conn.voice.connected) { 4 conn.removeEventListener('voicechange', vc); 5 6 var req = navigator.mozMobileMessage 7 .send('+31612345678', 'Hello from JanOS!'); 8 req.onsuccess = function() { 9 console.log('Message sent successfully'); 10 }; 11 req.onerror = function() { 12 console.error('Could not send SMS', req.error); 13 }; 14 } 15 });
1 var conn = navigator.mozMobileConnections[0]; 2 conn.addEventListener('voicechange', function vc() { 3 if (conn.voice.connected) { 4 conn.removeEventListener('voicechange', vc); 5 6 var req = navigator.mozMobileMessage 7 .send('+31612345678', 'Hello from JanOS!'); 8 req.onsuccess = function() { 9 console.log('Message sent successfully'); 10 }; 11 req.onerror = function() { 12 console.error('Could not send SMS', req.error); 13 }; 14 } 15 });
1 var conn = navigator.mozMobileConnections[0]; 2 conn.addEventListener('voicechange', function vc() { 3 if (conn.voice.connected) { 4 conn.removeEventListener('voicechange', vc); 5 6 var req = navigator.mozMobileMessage 7 .send('+31612345678', 'Hello from JanOS!'); 8 req.onsuccess = function() { 9 console.log('Message sent successfully'); 10 }; 11 req.onerror = function() { 12 console.error('Could not send SMS', req.error); 13 }; 14 } 15 });
1 var conn = navigator.mozMobileConnections[0]; 2 conn.addEventListener('voicechange', function vc() { 3 if (conn.voice.connected) { 4 conn.removeEventListener('voicechange', vc); 5 6 var req = navigator.mozMobileMessage 7 .send('+31612345678', 'Hello from JanOS!'); 8 req.onsuccess = function() { 9 console.log('Message sent successfully'); 10 }; 11 req.onerror = function() { 12 console.error('Could not send SMS', req.error); 13 }; 14 } 15 });
-
-
Get hacking!Grab a phone that has latest Chrome / Firefox
Use that sensor data
Think outside the box
Or buy a ZTE Open C for 60 euro's and break it!
Thank you!http://janjongboom.com
janos.io github.com/janjongboom/(jsconf-asia|jsconf-us)
Recommended