dds web programming with dscript
DESCRIPTION
This presentation introduces dscript, a framework that brings DDS-like publish/subscribe to the Web Browser. Beyond providing an inter-browser Pub/Sub abstraction, dscript provides with a semaless integratio with native DDS applications. Meaning that data can flow effortlessly from native DDS applications to the browser and viceversa.TRANSCRIPT
OpenSplice
DDS
Angelo CORSARO, Ph.D.Chief Technology Officer OMG DDS Sig Co-Chair
DDS Web Programming with dscript
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Motivation
☐ WebSockets have made it possible to efficiently push data to the browser, yet provide a low level abstraction
☐ More and more “Real-Time Web” Applications need to produce as well as consume real-time data streams
☐ Wouldn’t it be nice to have a DDS-like abstraction in JavaScript?☐ i.e. to do pub/sub from JavaScript Applications
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Motivation
☐ WebSockets have made it possible to efficiently push data to the browser, yet provide a low level abstraction
☐ More and more “Real-Time Web” Applications need to produce as well as consume real-time data streams
☐ Wouldn’t be nice to have a DDS-like abstraction in JavaScript to feed Real-Time Web Applications with data coming from a DDS System?
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Motivation
☐ WebSockets have made it possible to efficiently push data to the browser, yet provide a low level abstraction
☐ More and more “Real-Time Web” Applications need to display real-time data streams
☐ In a sense, wouldn’t it be nice to be able to do Pub/Sub with a DDS-like abstraction between Web Applications and DDS Applications w/o any barriers???
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
dscriptJavaScript/CoffeeScript framework
that extends the DDS abstraction to the WebBrowser/Node.js
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Architecturedscript is composed by two elements:☐ Client Side (dscript.js): JavaScript/CoffeeScript framework that provides DDS-
like abstractions☐ Server Side(dscript.play): A Router that transparently bridges data between
matching DDS entities, e.g. Browser-2-Browser, DDS-2-Browser and Browser-2-DDS
TopicA
TopicB
TopicC
TopicDQoS
QoS
QoS
QoSData
Reader
Data Reader
Data Writer
Data Writer
dscript.play
dscript
dscript.js
dscript.js
dscript.jsdscript.play
dscript
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
dscript.js
☐ dscript.js reduces the DDS concepts to Topics, DataReaders, DataWriters and QoS. DomainParticipant and Publishers are managed for you
☐ The API is reactive and considers DataReaders as the source for a stream of data. This data can be handled by the application or bound to a cache (notice the cache is not part of the DataReader)
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Topic
circleTopic = new dds.Topic(0, 'Circle', 'org.omg.dds.demo.ShapeType') squareTopic = new dds.Topic(0, 'Square', 'org.omg.dds.demo.ShapeType') triangleTopic = new dds.Topic(0, 'Triangle', 'org.omg.dds.demo.ShapeType')
var myTopic = new dds.Topic(domainID, topicName, topicType);
myTopic = new dds.Topic(domainID, topicName, topicType)
JavaScript
CoffeeScript
var circleTopic = new dds.Topic(0, 'Circle', 'org.omg.dds.demo.ShapeType'); var squareTopic = new dds.Topic(0, 'Square', 'org.omg.dds.demo.ShapeType'); var triangleTopic = new dds.Topic(0, 'Triangle', 'org.omg.dds.demo.ShapeType');
Example:
Example:
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
DataWriter
dwqos = new dds.DataReaderQos( dds.History.KeepLast(10), dds.Reliability.Reliable, dds.TimeFilter(250))
cdw = new dds.DataWriter(circleTopic,dwqos)
shape = {}shape.color = ’RED’shape.x = 10shape.y = 20shape.shapesize = 30
cdw.write(shape)
dr = new dds.DataWriter(topic, qos)
CoffeeScript
Example:
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
DataReader
drqos = new dds.DataReaderQos( dds.History.KeepLast(10), dds.Reliability.Reliable, dds.TimeFilter(250))
cdr = new dds.DataReader(circleTopic,drqos)
dr = new dds.DataReader(topic, qos)
CoffeeScript
Example:
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Binding a DataReader
☐ A DataReader can be bound to a user provided function that will handle incoming data or to a cache
☐ Notice, that as you are in control of how data-readers are bound to cache you can be very creative
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Binding to User Function
cdr.addListener((s) -> console.log(JSON.stringify(s)))
dr.addListener(f)
CoffeeScript
Example:
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS
Binding to a Cache
// BindingbindShape = dds.bind((s) -> s.color)ccache = new DataCache(historyDepth)bindShape(cache, cdr)
// Working with the Cache
ccache.forEach(displayOnMyHTMLCanvas)
someCircles = ccache.takeWhile((s) -> s.x < s.y)
cache = new DataCache(historyDepth)bind(keyMapper)(dr, cache)
CoffeeScript
Example:
OpenSplice
DDS
Demo!
OpenSplice
DDS
WebAppPublish: CircleSubscribe: Square
JavaFX native DDS AppPublish: SquareSubscribe: Circle
WebAppSubscribe: CircleSubscribe: Square
OpenSplice
DDS Co
pyrig
ht 2013, PrismTech – A
ll Rights Reserved.
Code
☐ https://github.com/nuvo-io/dscript.js
☐ https://github.com/nuvo-io/dscript.play
The demo is under dscript.js/demo/jshapes
Copyrig
ht 2013, PrismTech – A
ll Rights Reserved.
OpenSplice
DDS