Shine Draw

I was pretty busy for the last week and that’s why I didn’t update here for several days.

In this application, there is an red ball bouncing between the Flash and Silverlight. The Flash is responsible to calculate the position of the ball. It will also pass the ball’s position the Silverlight application via JavaScript.

In the next sample, I will try to make the Silverlight as the master controller and demonstrate how to control Flash via JavaScript.

Vote for this sample

Comparison

Flash implementation: 20 minutes
Silverlight implementation: 20 minutes  (Implemented First)
What’s the difference?

• ExternalInterface[AS3] vs RegisterScriptableObject[C#]

Source codes

•   JavaScript Sample 2 [Flash 9, AS3] (9.8 KiB, 693 hits)
•   JavaScript Sample 2 [Silverlight, C#] (10.3 KiB, 747 hits)

ExternalInterface[AS3] vs RegisterScriptableObject[C#]

Firstly, we have to write a JavaScript to connect to the Silverlight and update it’s internal value. The JavaScript can be easily accessed by the Class ExternalInterface.

// JavaScript
function updateProperty( x, y ) {
	// JavaScriptSample2 is the Object Tag ID
	var silverlightObject = document.getElementById("JavaScriptSample2");
	if(silverlightObject.content != null)
		silverlightObject.content.JavaScriptSample2.UpdateProperty(x, y);
} 

// call the JavaScript inside AS3
ExternalInterface.call("updateProperty", ball.x, ball.y);

While in Silverlight, you have to register the class and method to the browser before they can be accessed outside the application. The registration is very simple.

// C#
// register the object to the client browser
HtmlPage.RegisterScriptableObject("JavaScriptSample2", this);

// make the method visible to the client browser
[ScriptableMember]
public void UpdateProperty(double x, double y)
{

}

When talking about Silverlight and Flash, one should not miss out the browser integration part.

The sample below demonstrate three basic browser integration techniques: open popup, modify CSS and amend HTML content.

This is the first sample only. I will try to come up the 2th, 3th, 4th.. 10th samples later on.

Vote for this sample

Comparison

Flash implementation: 30 minutes (Implemented First)
Silverlight implementation: 40 minutes
What’s the difference?

• Browser Integration: navigateToURL [AS3] vs HtmlPage [C#]

Source codes

•   JavaScript Sample 1 [Flash 9, AS3] (15 KiB, 790 hits)
•   JavaScript Sample 1 [Silverlight 2, C#] (10.5 KiB, 862 hits)

Browser Integration: navigateToURL [AS3] vs HtmlPage [C#]

I think you can do whatever you want in Flash. It’s because you can write JavasScript directly in AS3.

// AS3
// open popup
var js:String = "window.open('URL','_blank','height=300,width=300');";
var url : URLRequest = new URLRequest("javascript:" + js+ " void(0);");
navigateToURL(url, "_self");

// modify CSS
var js:String = "document.body.style.backgroundColor='#FF0000';"; 

// amend HTML content
var js:String = "document.getElementsByTagName('h1')[0].innerText = ‘Value’;”;

Silverlight provided a set of API to manage the HTML DOM. However, I am not sure if you can call your own JavaScript directly as in Flash.

// C#
// open Popup
HtmlPage.PopupWindow(new Uri("URL", UriKind.Absolute)
	, "_blank",
	new HtmlPopupWindowOptions() { Width = 300, Height = 300});

// modify CSS
HtmlDocument document = HtmlPage.Document;
document.Body.SetStyleAttribute("background", "#0080FF");

// amend HTML content
HtmlDocument document = HtmlPage.Document;
ScriptObjectCollection collections =  document.GetElementsByTagName("h1");
HtmlElement htmlElement = (HtmlElement) collections[0];
htmlElement.SetProperty(”innerHtml”, “This is Silverlight Title”);