real-time gis using signalr and jsapi...inherits signalr.hub callable from client-side calling...

14
REAL-TIME GIS USING SIGNALR AND JSAPI A PROOF-OF-CONCEPT AMR ELDIB Esri International Developer Summit 2013 Technical Sessions March 28, 2013 8:30am – Palm Springs Convention Center Esri Canada #DevSummit

Upload: others

Post on 13-Jul-2020

14 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

REAL-TIME GIS USING

SIGNALR AND JSAPIA PROOF-OF-CONCEPT

AMR ELDIBEsri International Developer Summit 2013

Technical SessionsMarch 28, 2013 8:30am – Palm Springs Convention Center

Esri Canada

#DevSummit

Page 2: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

WHO DOESN’T LIKE COMMAND CENTERS

William Shatner as Captain James T. Kirk commanding the bridge of the USS Enterprise Star Trek during the third season (1968–1969)

Page 3: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

THESE GUYS DON’T

Chris O'Dowd as Roy Trenneman, Richard Ayoade as Maurice Moss, and Katherine Parkinson as Jen Barber from the British TV show “The IT Crowd”

Page 4: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

COMMAND CENTERS TODAY

Anton Yelchin as Pavel Chekov, Chris Pine as Captain James T. Kirk, and John Cho as Hikaru Sulu from the 2009 J. J. Abrams’ Reboot of StarTrek

Page 5: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

COMMAND CENTERS TODAY

Just some cubicles with computers.

Page 6: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SIGNALR

Incredibly simple to add real-time.

Start with WebSockets, and gracefully fallback to other technologies

when it’s not available.

Existing SignalR Samples

Jabbr a Chat Server.

ShootR a Multiplayer Shooter Game.

WebSockets > Server-sent Events > Forever Frame > Long Polling

Page 7: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SIGNALR

OPEN SOURCE SUPPORTED

Page 8: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

HOW IT WORKS

Inherits Microsoft.AspNet.SignalR.Hub

var proxy = $.connection.myHubClass

Public methods are callable from client

Override event handlers to handle clients

activities

(connecting, disconnecting, etc.)

Clients.All.myFunction

proxy.client.myFunction = myFunction

proxy.server.myMethod

Page 9: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SHOW ME THE CODE

Inherits SignalR.HubCallable

from

client-side

Calling client function

Page 10: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SHOW ME THE CODE

Reference to ProxyClient-

function

callable

from

Server

Connection ID

Page 11: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SHOW ME THE CODE

Page 12: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SEE IT IN ACTION

Click the screenshot to play video

Page 13: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

SCENARIOS

CLIENT-TO-CLIENT SERVER-TO-CLIENT

Page 14: REAL-TIME GIS USING SIGNALR AND JSAPI...Inherits SignalR.Hub Callable from client-side Calling client function. S HOW M E T HE C ODE Client- Reference to Proxy function callable from

THANK YOU

All trademarks are copyrighted to their owners.

Esri International Developer Summit 2013Technical Sessions

AmrEldib.com

bit.ly/GisSignalR

@AmrEldib

bit.ly/FreeSignalRBook