| Comments

When working with Silverlight 2, most will be working with managed code (c#, vb, etc.).  But likely people are working with Silverlight as an additive value to their web application, providing some enhanced user experience to an application.  there may be times where you will still need to call back into the hosting html context.  For then, you'll want to be familiar with two objects HtmlDocument and HtmlPage. 

Both of these objects provide access to the page context hosting your silverlight control.  If you need to seek things in the HTML DOM, you could use the HtmlDocument class.  For example, let's say I need to change the innerHTML property of some <div> element:

using System.Web.Browser;

HtmlDocument doc = HtmlPage.Document;
doc.GetElementById("mydiv").SetProperty("innerHTML", "<b>hello world</b>");

Also, i might want to interact with existing client-side functions, perhaps from client-side frameworks or other library utilities you might have developed on your own.  If I have a function on my page called "foo()" I would invoke it like this:

using System.Web.Browser;

HtmlPage.Window.CreateInstance("foo");

And if I had parameters in a function, like "foo2(theAlert)," I would invoke it like this:

using System.Web.Browser;

HtmlPage.Window.CreateInstance("foo2", new string[] { "tim heuer" });

This may not be the norm with your Silverlight project, but I hope this helps clear some things up!  I am including the "using" statements in my c# samples so you know where in the namespace the class library exists.

| Comments

got mad design and css skillz?  take a stab at redesigning the mix web site for a contest.  i saw through twitter that adam kinney noted only one person entered yet.  and there are three prizes!!! should make winning pretty simple right now ;-).

visitmix.com - restyle

of course i'm ineligible (that's my way of getting off, because i have no mad design skillz), but might i suggest a few themes to try out:

    • halo 3
    • rockband/guitar hero - have you seen this and this yet?
    • reno 911 - man i love this show -- 'sheriff's department!' -- hmm...ballmer as lt. dangle?
    • dora and diego -- go ScottGu go!
    • high school musical
    • election 2008

either way, all you have to do is visit the restyle contest page and download the starter kit.  so what are you waiting for?  deface, er...i mean...restyle the site in a creative way!

| Comments

in part 1 of my baseball example concept, i discussed how i was able to re-use some SVG vector art in XAML.  in that screencast i used an SVG file and a PDF file.  it set the stage for the remaining part of my samples here.  to recap, my goal is to show: using vector files for XAML (done), integrating that XAML and html functionality (here) and then to show a "game play" view of the vector art, extracting just the field information.

in this part 2 of that goal, i set out to recreate a different user experience for the ticket purchase process of the online site for the baseball team.  right now at the dbacks seating/pricing site, they provide a chart and a color match html table.  there is some "zoom" functionality (really it is just image swapping) to get a closer look at the sections.  to me, i wanted to see a simpler implementation -- don't make me think.  when i choose the infield section, clearly show me where that is -- if i can't decipher the colors very well, then i might not understand where the section is.  this is, of course, a very simple sample, but one that can easily demonstrate how easy it is to work with silverlight and html from a DOM perspective.

you see, once the silverlight plugin is loaded, it is a part of the page DOM.  because of this, other elements can dig into it, manipulate XAML, execute storyboards, etc. -- and vice versa...the silverlight plugin can alter html on the same page.  it actually is quite simple, but i've received some questions on it, so i thought i'd whip this quick sample together.  please subscribe to the podcast feed on the left to get the previous screencast and future ones as well.

i hope it helps.  if it doesn't, let me know or let me know how to refine a better sample.  leave a comment in the blogs.

part 3 will be (maybe) the final part of this sample, demonstrating a "game view" using the same imported vector data, real-time data from SQL server, asp.net ajax integration...it's wicked cool and i can't wait to post it!