This document discusses the potential for using Firefox OS and the JanOS operating system to power Internet of Things devices by accessing device sensors and features through HTML, CSS, and JavaScript. It provides examples of projects like a home security camera, Bluetooth doorbell, and tracking device that are made possible by the open web technologies of Firefox OS and JanOS. The document encourages developers to get their own rootable Firefox OS phones and create their own Internet of Things scripts and projects.

1. Firefox OS
NDC
3 December 2014
…and the Internet of Things

2. @janjongboom
Firefox OS…

3. Evangelist
@janjongboom
Firefox OS…

4. Evangelist
Firefox OS… Contributor
@janjongboom

5. Evangelist
Firefox OS… Contributor
User
@janjongboom

9. 4,300,000,000

10. Network
2013: 3G rollout in Bangladesh

11. BIGGER PROBLEM

12. Handsets
12-14% smartphone penetration

13. Handsets
12-14% smartphone penetration

14. prices are dropping
but not enough...

15. ...and OS makers focus
on the upper end

16. Firefox OS
Smartphone OS by Mozilla

17. “Awesome internet
experience at
low-cost hardware”

18. Launched in 2013
26 countries

19. Unlike Android, iOS
Putting the web first

20. Take the full content of the
Android App Store

21. Take the full content of the
Android App Store
Times 41,666

22. Take the full content of the
Android App Store
Times 41,666
That’s the amount of pages on the
Google’able web (10-20% of full web)

23. Web is superior for
information
And information develops a country

24. Goal of the project
Building a smartphone for
the open web

25. Architecture

26. Architecture

27. A web page
Web
page
Traditional model

28. A web page
Traditional model
Web
page Browser

29. A web page
Traditional model
Web
page Browser OS

30. A web page
Traditional model
Web
page Browser OS Kernel

31. A web page
Traditional model
Web
page Browser OS Kernel Phone

32. A web page
Firefox OS
Web
page Browser OS Kernel Phone

33. A web page
Firefox OS
Web
page Browser Kernel Phone

34. A web page
Firefox OS
Web
page Browser Kernel Phone

35. Android 4.4
Firefox OS 1.3

36. Android 4.4
Firefox OS 1.3
512 MB

37. Android 4.4
Firefox OS 1.3
512 MB
128 MB

38. Just a web browser
Apps? Offline? Payment?

39. No shortcuts
Everything in the phone written in HTML5

41. 1 var call = navigator.mozTelephony.dial('555123')
2
3 call.onconnected = function() {
4 call.hangUp()
5 }

42. Lifes are changing!

43. Before mobile revolution…
Limited input methods

44. Vibration sensor?

45. Accelerometer?

46. Accelerometer?

47. Proximity
Accelerometer
Ambient Light
Magnetometer
Gyroscope
Humidity
Ambient Temperature
Pressure
Battery
Cameras

48. Bend sensor

49. Internet of Things

50. Moves IHR SleepCycle

51. BORING!

56. WiFi Connection
Real purpose: internet connection

57. Hide & Seek!
Hider sets up a WiFi hotspot
Seekers use dBm to triangulate

58. Hide & Seek!
1 var req = navigator.mozWifiManager.getNetworks();
2 req.onsuccess = function() {
3 var seeker = this.result.find(n => n.ssid === 'seeker');
4 if (!seeker) {
5 console.log('Too far out!');
6 }
7 else {
8 console.log(network.relSignalStrength);
9 }
10 };

59. Device Light
Real purpose: adjust brightness

60. Music
Theremin is instrument
Use device light as tone frequency
Wave your hands and magic!

61. Music
Theremin is instrument
Use device light as tone frequency
Wave your hands and magic!

62. Music
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 });

63. Gyroscope
Real purpose: rotate screen

64. Gyroscope
Real purpose: rotate screen

65. Track real life movement
Draw 3D model of phones
Measure gyroscope data
Show real life state on screen

67. 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);

68. 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 });

69. Accelerometer
Real purpose: Turn to mute

70. Juggling visualizer
Measure z-forces on device
Plot it in graph over time
Juggle with multiple devices

71. 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 });

74. Maker movement is
EVERYWHERE
(Kickstarter, spaces, fairs, Wired)

77. € 34,99

80. £ 20.46

82. Bluetooth, WiFi, 3G,
2 Cameras, GPS,
qHD touch screen

83. Bluetooth, WiFi, 3G,
2 Cameras, GPS,
qHD touch screen

85. Linux
Kernel

86. Linux
Kernel
Gecko

87. Linux
Kernel
Gecko HTML5
UI

88. Linux
Kernel
Gecko HTML5
UI
Has all phone APIs in JS

89. Linux
Kernel
Gecko
Has all phone APIs in JS

91. First screwdriver ever!

113. Linux
Kernel
Gecko
Has all phone APIs in JS

114. Linux
Kernel
Gecko JanOS
Has all phone APIs in JS

115. Linux
Kernel
Gecko JanOS
Has all phone APIs in JS

116. JanOS
Alternative to Firefox OS
Some batteries included
Need rooted Firefox OS phone
with ADB enabled
!
github.com/janjongboom/janos

117. Booting / flashing
$ make reset-phone && adb logcat

118. 1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta name="viewport" content="width=device-5 initial-scale=1">
6 <meta charset="utf-8">
7
8 <script src="js/bootstrap.js"></script>
9 <script defer src="js/camera.js"></script>
10 <script defer src="js/security_cam.js"></script>
11 <script defer src="js/doorbell.js"></script>
12 <script defer src="js/bluetooth.js"></script>
13 <script defer src="js/tracker.js"></script>
14 </head>
16 <body>
17 <h1>OMG WELCOME TO JANOS 1.0!</h1>
18 </body>
19 </html>

119. about:app-manager

120. Security camera
Every 5 seconds take photo
Save to storage (4GB!) or SD
Sync with cloud

121. Taking picture to storage
1 window.camera.takePicture('front').then(function(blob) {
2 var storage = navigator.getDeviceStorage('pictures');
3 var req = storage.addNamed(blob,
'myawesomepicture.jpg');
4 req.onsuccess = function() {
5 console.log('Saved on internal storage!');
6 };
7 });

122. Taking picture to storage
1 window.camera.takePicture('front').then(function(blob) {
2 var storage = navigator.getDeviceStorage('pictures');
3 var req = storage.addNamed(blob,
'myawesomepicture.jpg');
4 req.onsuccess = function() {
5 console.log('Saved on internal storage!');
6 };
7 });

123. Taking picture to storage
1 window.camera.takePicture('front').then(function(blob) {
2 var storage = navigator.getDeviceStorage('pictures');
3 var req = storage.addNamed(blob,
'myawesomepicture.jpg');
4 req.onsuccess = function() {
5 console.log('Saved on internal storage!');
6 };
7 });

124. Taking picture to storage
1 window.camera.takePicture('front').then(function(blob) {
2 var storage = navigator.getDeviceStorage('pictures');
3 var req = storage.addNamed(blob,
'myawesomepicture.jpg');
4 req.onsuccess = function() {
5 console.log('Saved on internal storage!');
6 };
7 });

125. Doorbell
Proximity sensor
Ring over bluetooth
Live video stream

126. Bluetooth doorbell
1 enableBluetoothAudio('00:0C:8A:75:EF:30').then(function() {
2 window.onuserproximity = function(e) {
3 if (e.near) {
4 var audio = new Audio('/sounds/doorbell.ogg');
5 audio.play();
6 }
7 };
8 });

127. Bluetooth doorbell
1 enableBluetoothAudio('00:0C:8A:75:EF:30').then(function() {
2 window.onuserproximity = function(e) {
3 if (e.near) {
4 var audio = new Audio('/sounds/doorbell.ogg');
5 audio.play();
6 }
7 };
8 });

128. Bluetooth doorbell
1 enableBluetoothAudio('00:0C:8A:75:EF:30').then(function() {
2 window.onuserproximity = function(e) {
3 if (e.near) {
4 var audio = new Audio('/sounds/doorbell.ogg');
5 audio.play();
6 }
7 };
8 });

129. Bluetooth doorbell
1 enableBluetoothAudio('00:0C:8A:75:EF:30').then(function() {
2 window.onuserproximity = function(e) {
3 if (e.near) {
4 var audio = new Audio('/sounds/doorbell.ogg');
5 audio.play();
6 }
7 };
8 });

131. Brian

134. BrianTracker™
2G connection
Connected to push server
Geolocation on request

138. Get hacking

139. Get hacking
Grab a rootable FxOS phone
Crack it open
Write your own scripts
PROFIT!

140. One more thing…

143. Small camera
JanOS powered
Timelapse & on-demand
@janjongboom

144. Thank you!
http://janjongboom.com
github.com/janjongboom