Widget and Web Part Communication

SharePoint 2010 Wizardry with Silverlight

http://about.me/scottcurrier

Consumer Focus“What incredible benefits can we give to the customer? Where can we take the customer? Not starting by sitting down with the engineers and figure out what awesome technology we have and how are we going to market that…” – Steve Jobs“The way to achieve the best long term value is to build real value in the world” – Mark Zuckerberg

Innovation is Key to Success

Awesome technology is adopted if it provides a

benefit.

Understand This Principle

• SharePoint - the last slide should tell you just how flexible SharePoint as a platform actually is. Flexibility is key here

• Smart Phones – Windows Phone 7, Android, and iPhones place dotted lines around the form applications can take but allows for highly consistent experiences on the platform. Consistency is key here

• Windows 8 and iOS – Attempt to provide flexibility and consistency over multiple form factors.

• Social Platforms – Facebook, Twitter, WordPress

Some Great Technology

• Exemplifies the 80/20 Rule• SharePoint can be low cost using all

out of the box features and branding• The last 20% represent specialized

purposes usually at a higher cost• Benefits of that last 20% may not

exceed the cost of development if poor choices are made

SharePoint as a Development Platform

• A major decision point in this last 20% is on approach The choices include:

1.Creating applications from multiple third party web parts (and features)

2.Super user development using native capabilities

3.Rolling your own widgets with compiled and middle tier code

4.Purchasing complete sub systems such as pmPoint and Project Server

5.Some combination of everything

SharePoint Development Approaches

Good Technology + Vision = Excellent Applications • Think in terms of an application

domain not just a collection of widgets that meet line item requirements• Stay away from monolithic thinking• Keep the idea of atomic development

a first class principle.• Leverage as much of the platform as

practical• How should platform components

communicate with each other to enhance the value and consistency

Huge trend enabling dynamic linking between applications and components as well as more robust communication between components

Video

Linking Applications and Widgets

Demo… and web part islands

Building a Basic Silverlight Web Part

• Web parts tend to live in self contained islands • Connecting to other web parts OTB is simple but has limited functionality• It takes work to connect in ways that reach the vision presented in the video

Some Observations

Web MessagingWeb SocketsServer Sent EventsWeb WorkersNode.js

HTML5 Affiliated Communication APIs

• New HTML5 standards when integrated with SharePoint open up the platform for some really unique possibilities• Middle Tier Development with

JQuery• Silverlight has rich connectivity

into SharePoint

Cross Component Communication in SharePoint

Web ClientDuplex ServicesScriptObjectHTMLPageSOAP/WCF/RIALocalMessageReceiverLocalMessageSender

Silverlight/XAML

public void HideHTML(string name) { ScriptObject obj = (ScriptObject)HtmlPage.Window.GetProperty("HideHTML"); obj.InvokeSelf(name); }

public void ShowHTML(string name) { ScriptObject obj = (ScriptObject)HtmlPage.Window.GetProperty("ShowHTML"); obj.InvokeSelf(name); }

Communicating to the Host Page

<asp:Content ContentPlaceHolderId="PlaceHolderAdditionalPageHead" runat="server"><script type="text/javascript" src="/_layouts/Xaptic/js/jquery-1.4.4.min.js"></script>

Communicating to the Host Page

<script type="text/javascript"> function AddToHeader(css) { $('head').append(css); } function MoveHTMLTo(name, top, left) { $('#' + name).css('top', top); $('#' + name).css('left', left); }</script>

Communicating to the Host Page

http://msdn.microsoft.com/en-us/library/dd833063(v=vs.95).aspx

// In the receiving application: LocalMessageReceiver messageReceiver = new LocalMessageReceiver("receiver", ReceiverNameScope.Global, LocalMessageReceiver.AnyDomain);

// In the sending application: LocalMessageSender messageSender = new LocalMessageSender( "receiver", LocalMessageSender.Global);

Communication Between Local Silverlight-Based Applications

• Upload and Drag / Drop• Easier to add properties• Leverage the web part concept as

atomic level widgets• Build in communication mechanisms

beyond connected web parts

Making Things a bit Easier

send = new LocalMessageSender(xaptic.GetProperty("SendTo"), System.Windows.Messaging.LocalMessageSender.Global); send.SendCompleted += (object sender, SendCompletedEventArgs e) => {}; allowedSenderDomains.Add("localhost"); allowedSenderDomains.Add("dev"); allowedSenderDomains.Add("dev01.com"); receiver = new LocalMessageReceiver(xaptic.GetProperty("ReceiveFrom"), ReceiverNameScope.Global, allowedSenderDomains); receiver.MessageReceived += (object sender, MessageReceivedEventArgs e) => { L3.Content = e.Message; }; receiver.Listen();

Communication Between Local Silverlight-Based Applications

XAPTICA Silverlight Widget Platform for Prototyping Rich UI’s in SharePoint 2010

Putting it all Together

Thank you!

http://about.me/scottcurrier