Presented at FFK11 "beyond tellerrand" on April 6th 2011 in Cologne, Germany

1. P2P on the local network
getting your devices to play together
Peter Elst - Project Cocoon Multimedia - FFK11 April 6th 2011

2. What will we talk about?

3. What will we talk about?
‣ What is P2P and how does it work?

4. What will we talk about?
‣ What is P2P and how does it work?
‣ How can you set up P2P with Flash Player and AIR?

5. What will we talk about?
‣ What is P2P and how does it work?
‣ How can you set up P2P with Flash Player and AIR?
‣ What are the use cases for P2P?

6. What will we talk about?
‣ What is P2P and how does it work?
‣ How can you set up P2P with Flash Player and AIR?
‣ What are the use cases for P2P?
‣ Examples and technical walkthrough

7. What will we talk about?
‣ What is P2P and how does it work?
‣ How can you set up P2P with Flash Player and AIR?
‣ What are the use cases for P2P?
‣ Examples and technical walkthrough
‣ Questions & answers

8. What is P2P?

9. What is P2P?
‣ P2P enables direct communication between clients

10. What is P2P?
‣ P2P enables direct communication between clients
‣ Clients register themselves, from there on all communication
happens directly between connected clients

11. What is P2P?
‣ P2P enables direct communication between clients
‣ Clients register themselves, from there on all communication
happens directly between connected clients
‣ Huge decrease in bandwidth requirements

12. What is P2P?
‣ P2P enables direct communication between clients
‣ Clients register themselves, from there on all communication
happens directly between connected clients
‣ Huge decrease in bandwidth requirements
‣ You can do P2P communication without a server (!)

13. Traditional network setup

14. Traditional network setup

15. Traditional network setup
‣ Centralized communication

16. Traditional network setup
‣ Centralized communication
‣ Single point of failure

17. Traditional network setup
‣ Centralized communication
‣ Single point of failure
‣ Bandwidth needs increases with
each additional client

18. Traditional network setup
‣ Centralized communication
‣ Single point of failure
‣ Bandwidth needs increases with
each additional client
‣ Not extremely scalable

19. P2P network setup

20. P2P network setup

21. P2P network setup
‣ Decentralized communication

22. P2P network setup
‣ Decentralized communication
‣ More robust network setup

23. P2P network setup
‣ Decentralized communication
‣ More robust network setup
‣ Additional clients makes
network faster

24. P2P network setup
‣ Decentralized communication
‣ More robust network setup
‣ Additional clients makes
network faster
‣ Easily scalable solution for
multi-user applications

25. P2P concepts

26. P2P concepts
‣ NetGroup - P2P channel through which you communicate

27. P2P concepts
‣ NetGroup - P2P channel through which you communicate
‣ Peer ID - unique identifier given to each connected client

28. P2P concepts
‣ NetGroup - P2P channel through which you communicate
‣ Peer ID - unique identifier given to each connected client
‣ Posting - sending a message to clients in a netgroup

29. P2P concepts
‣ NetGroup - P2P channel through which you communicate
‣ Peer ID - unique identifier given to each connected client
‣ Posting - sending a message to clients in a netgroup
‣ Routing - sending a message to a client via neighbor peers

30. P2P concepts
‣ NetGroup - P2P channel through which you communicate
‣ Peer ID - unique identifier given to each connected client
‣ Posting - sending a message to clients in a netgroup
‣ Routing - sending a message to a client via neighbor peers
‣ Object replication - transferring of data using chunks

31. How do you set up P2P?

32. How do you set up P2P?
‣ Create a NetConnection instance

33. How do you set up P2P?
‣ Create a NetConnection instance
‣ Connect to an RTMFP server (if wanted)

34. How do you set up P2P?
‣ Create a NetConnection instance
‣ Connect to an RTMFP server (if wanted)
‣ Specify a GroupSpecifier and NetGroup instance

35. How do you set up P2P?
‣ Create a NetConnection instance
‣ Connect to an RTMFP server (if wanted)
‣ Specify a GroupSpecifier and NetGroup instance
‣ Listen for neighbor connect and disconnect events

36. How do you set up P2P?
‣ Create a NetConnection instance
‣ Connect to an RTMFP server (if wanted)
‣ Specify a GroupSpecifier and NetGroup instance
‣ Listen for neighbor connect and disconnect events
‣ Post message to NetGroup or route through nearest neighbor

37. How do you set up P2P?
‣ Create a NetConnection instance
‣ Connect to an RTMFP server (if wanted)
‣ Specify a GroupSpecifier and NetGroup instance
‣ Listen for neighbor connect and disconnect events
‣ Post message to NetGroup or route through nearest neighbor
‣ Handle file chunks for object replication

38. The boilerplate code 1/2

39. The boilerplate code 1/2
nc = new NetConnection();
nc.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus);
nc.connect("rtmfp:");

40. The boilerplate code 1/2
nc = new NetConnection();
nc.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus);
nc.connect("rtmfp:");
gSpec = new GroupSpecifier("myNetGroupID");
gSpec.postingEnabled = true;
gSpec.routingEnabled = true;
gSpec.ipMulticastMemberUpdatesEnabled = true;
gSpec.objectReplicationEnabled = true;
...
gSpec.addIPMulticastAddress("225.225.0.1:30303");

41. The boilerplate code 1/2
nc = new NetConnection();
nc.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus);
nc.connect("rtmfp:");
gSpec = new GroupSpecifier("myNetGroupID");
gSpec.postingEnabled = true;
gSpec.routingEnabled = true;
gSpec.ipMulticastMemberUpdatesEnabled = true;
gSpec.objectReplicationEnabled = true;
...
gSpec.addIPMulticastAddress("225.225.0.1:30303");
group = new NetGroup(nc, gSpec.groupspecWithAuthorizations());
group.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus);

42. The boilerplate code 2/2

43. The boilerplate code 2/2
private function onNetStatus(evt:NetStatusEvent):void {
switch (evt.info.code) {
case "NetConnection.Connect.Success":
// netconnection successful
break;
case "NetGroup.Neighbor.Connect":
// client joined the netgroup
break;
case "NetGroup.Neighbor.Disconnect":
// client left the netgroup
break;
case "NetGroup.Posting.Notify":
// message was posted to the netgroup
break;
...
}
}

44. Mobile clients - AIR for Android

45. Mobile clients - AIR for Android

46. Mobile clients - AIR for Android
‣ AIR for Android allows us to run desktop AIR files and take
advantage of additional mobile specific features such as the
accelerometer, geolocation,...

47. Mobile clients - AIR for Android
‣ AIR for Android allows us to run desktop AIR files and take
advantage of additional mobile specific features such as the
accelerometer, geolocation,...
‣ Almost all desktop APIs are supported

48. Mobile clients - AIR for Android
‣ AIR for Android allows us to run desktop AIR files and take
advantage of additional mobile specific features such as the
accelerometer, geolocation,...
‣ Almost all desktop APIs are supported
‣ Its a lot of fun to develop for!

49. Mobile clients - compiling to iOS

50. Mobile clients - compiling to iOS

51. Mobile clients - compiling to iOS
‣ AIR can cross-compile to native iOS binaries

52. Mobile clients - compiling to iOS
‣ AIR can cross-compile to native iOS binaries
‣ Apple started allowing third party cross-compiled applications
back into their app store

53. Mobile clients - compiling to iOS
‣ AIR can cross-compile to native iOS binaries
‣ Apple started allowing third party cross-compiled applications
back into their app store
‣ Compiled binaries generally have a larger file size

54. Accelerometer API

55. Accelerometer API
if(Accelerometer.isSupported) {
var acc:Accelerometer = new Accelerometer();
acc.setRequestedUpdateInterval(500);
acc.addEventListener(AccelerometerEvent.UPDATE, update);
}
private function update(evt:AccelerometerEvent):void {
trace("x acceleration: "+evt.accelerationX);
trace("y acceleration: "+evt.accelerationY);
trace("z acceleration: "+evt.accelerationZ);
}

56. Geolocation API

57. Geolocation API
if(Geolocation.isSupported){
var geo:Geolocation = new Geolocation();
geo.setRequestedUpdateInterval(10000);
geo.addEventListener(GeolocationEvent.UPDATE, update);
}
private function update(evt:GeolocationEvent):void {
trace("latitude: "+evt.latitude);
trace("longitude: "+evt.longitude);
trace("speed: "+evt.speed);
}

58. Use cases - Gaming

59. Use cases - Gaming
‣ Sensor data can turn any device into a game controller

60. Use cases - Gaming
‣ Sensor data can turn any device into a game controller
‣ High scores and other game data can be synchronized and
persisted on the mobile device

61. Use cases - Gaming
‣ Sensor data can turn any device into a game controller
‣ High scores and other game data can be synchronized and
persisted on the mobile device
‣ Practically everyone carries a phone so can immediately join in

62. Use cases - E-Learning

63. Use cases - E-Learning
‣ Students are increasingly using devices for their studies

64. Use cases - E-Learning
‣ Students are increasingly using devices for their studies
‣ Connected class rooms with shared whiteboards and
collaborative tasks

65. Use cases - E-Learning
‣ Students are increasingly using devices for their studies
‣ Connected class rooms with shared whiteboards and
collaborative tasks
‣ Teachers can get realtime data and statistics on how their
students perform on particular exercises

66. Use cases - Sensor input

67. Use cases - Sensor input
‣ Mobile devices can provide additional input to your computer

68. Use cases - Sensor input
‣ Mobile devices can provide additional input to your computer
‣ Software can take advantage of multi-touch, accelerometer,
geolocation data and camera access

69. Use cases - Sensor input
‣ Mobile devices can provide additional input to your computer
‣ Software can take advantage of multi-touch, accelerometer,
geolocation data and camera access
‣ Mobile device becomes a second screen and helps with your
productivity

70. Introducing Cocoon P2P

71. Introducing Cocoon P2P

72. Introducing Cocoon P2P
‣ Simple open source library focussed on
local IP multicast with Flash Player 10.1
or later and AIR across devices

73. Introducing Cocoon P2P
‣ Simple open source library focussed on
local IP multicast with Flash Player 10.1
or later and AIR across devices
‣ Very easy to use, avoid boilerplate code

74. Introducing Cocoon P2P
‣ Simple open source library focussed on
local IP multicast with Flash Player 10.1
or later and AIR across devices
‣ Very easy to use, avoid boilerplate code
‣ Early support for file transfer, video
streaming and accelerometer
cocoon-p2p.googlecode.com

75. Example - device discovery

76. Example - device discovery
<p2p:LocalNetworkDiscovery id="channel" clientName="FFK11 - beyond tellerrand" /
>
<s:List width="80%" height="200"
horizontalCenter="0" verticalCenter="0"
dataProvider="{channel.clients}" labelField="clientName" />

77. Example - messaging

78. Example - messaging
<p2p:LocalNetworkDiscovery id="channel"
clientAdded="onClientAdded(event)"
clientRemoved="onClientRemoved(event)"
dataReceived="onDataReceived(event)"
loopback="true" />
channel.sendMessageToAll("Hello everyone!");
channel.sendMessageToClient("Hello you!", peerID);

79. Example - photo sharing

80. Example - photo sharing
<p2p:LocalNetworkDiscovery id="channel"
dataReceived="onDataReceived(event)"
fileComplete="onFileComplete(event)" />
var myFile:File = File.desktopDirectory.resolvePath("image.jpg");
channel.sendFileToAll(myFile);
channel.sendFileToClient(myFile, peerID);

81. Example - multiplayer game

82. Example - multiplayer game
• <p2p:LocalNetworkDiscovery id="channel"
accelerometerInterval="1000" />
<p2p:LocalNetworkDiscovery id="channel"
accelerometerUpdate="onAccelerometer(event)" />
private function onAccelerometer(evt:AccelerometerEvent):void {
trace("x acceleration: "+evt.accelerationX);
trace("y acceleration: "+evt.accelerationY);
trace("z acceleration: "+evt.accelerationZ);
}

83. Example - video streaming

84. Example - video streaming
• <p2p:LocalNetworkDiscovery id="channel"
videoStream="{cam}" />
var cam:Camera = Camera.getCamera();
var video:Video = new Video(320,240);
video.attachCamera({channel.videoStream});

85. Security dialog

86. Security dialog

87. Security dialog
‣ Everything covered here does not require Adobe AIR

88. Security dialog
‣ Everything covered here does not require Adobe AIR
‣ Using P2P in Flash Player will prompt a security dialog

89. Security dialog
‣ Everything covered here does not require Adobe AIR
‣ Using P2P in Flash Player will prompt a security dialog
‣ User can control whether or not
to allow peer assisted networking

90. Security dialog
‣ Everything covered here does not require Adobe AIR
‣ Using P2P in Flash Player will prompt a security dialog
‣ User can control whether or not
to allow peer assisted networking
‣ For AIR applications this is allowed
by default without user interaction

91. Summary

92. Summary
‣ P2P is available from Flash Player 10.1 onwards and in Adobe
AIR across devices (including iOS, BlackBerry PlayBook,
Google TV,...)

93. Summary
‣ P2P is available from Flash Player 10.1 onwards and in Adobe
AIR across devices (including iOS, BlackBerry PlayBook,
Google TV,...)
‣ You can use this feature for connecting local devices without
the need for a Flash Media Server

94. Summary
‣ P2P is available from Flash Player 10.1 onwards and in Adobe
AIR across devices (including iOS, BlackBerry PlayBook,
Google TV,...)
‣ You can use this feature for connecting local devices without
the need for a Flash Media Server
‣ Devices need to be on the same wifi network and IP multicast
must not be blocked on the router

95. Resources

96. Resources
‣ Tom Krcha - flashrealtime.com

97. Resources
‣ Tom Krcha - flashrealtime.com
‣ HydraP2P - github.com/devboy/HydraP2P

98. Resources
‣ Tom Krcha - flashrealtime.com
‣ HydraP2P - github.com/devboy/HydraP2P
‣ Cirrus (formerly Stratus) - labs.adobe.com/technologies/cirrus

99. Questions?

100. Questions?
Peter Elst
e-mail info@peterelst.com
twitter @peterelst
blog www.peterelst.com
company www.project-cocoon.com

101. Thank you!
Peter Elst
e-mail info@peterelst.com
twitter @peterelst
blog www.peterelst.com
company www.project-cocoon.com