4 hours with Silverlight (and Hosting)

After watching some of the great tutorial videos in Silverlight.net I decided to play a little bit with Silverlight 2 and VS2008.

It is incredible all the funcionality that offers Silverlight with a plugin of 4.5 MB (WCF, Drawing, DataBinding, Linq ....) But what is even more incredible is the productivity you get right from the beggining. A .Net programmer doesn't have a deep learning curve and can accomplish many tasks within minutes.

The first Silverlight component I decided to do was a simple rotator (I know there are tons of them and very good ones) but I wanted to do my own and make it configurable so I could set the images by using the InitParameters. All of the things I needed to know where on the video tutorials.

The only glitch was finding a free hosting site to make my silverlight component public. Some hosting sites are not prepared to host Silverlight, why? Since Silverlight is just a .xap file that gets downloaded to the client and the plugins executes it. Theoretically you only need a web server to host a file and an html/php/asp.net (you name it) file to embed the SL control. Well, the problem is the xap extension, some hosting sites ban any "unkown" extension, and some doesn't have configured the MIME type for it. Therefore you end up thinking that the hosting site cannot host SL2 or that SL2 sucks. Read on ...

There is a codeplex article about writing an httphandler to bypass the hosting "type check" https://www.codeproject.com/KB/silverlight/XamlWithoutMime.aspx but of course this will only work in asp.net enabled sites.Read on ...

Well some people think a .xap file is some obscure binary file that only MS can understand, but in many places it is said that a .xap file is just a zip file that contains two files (a xaml manifest and a dll assembly) zip file??? What if I rename the xap file into zip, change the html code to tell that my SL2 control is in a zip file and then I upload it to a "Silverlight not prepared" hosting site. IT WORKS. Here is the proof!

https://www.geocities.com/dhdiez/PhotoRotatorTestPage5.html

 

The html code to host the app is here:

<

body>

<!-- Runtime errors from Silverlight will be displayed here.

This will contain debugging information and should be removed or hidden when debugging is completed -->

<div id='errorLocation' style="font-size: small;color: Gray;"></div>

<div id="silverlightControlHost">

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">

<param name="initparams" value="imagen1=https://www.geocities.com/dhdiez/images/rw1.jpg,

imagen2=https://www.geocities.com/dhdiez/images/rw2.jpg,

imagen3=https://www.geocities.com/dhdiez/images/rw3.jpg,

imagen4=https://www.geocities.com/dhdiez/images/rw4.jpg,

imagen5=https://www.geocities.com/dhdiez/images/rw5.jpg,

imagen6=https://www.geocities.com/dhdiez/images/rw6.jpg,

imagen7=https://www.geocities.com/dhdiez/images/rw7.jpg,

imagen8=https://www.geocities.com/dhdiez/images/rw8.jpg,

imagen9=https://www.geocities.com/dhdiez/images/rw9.jpg,

imagen10=https://www.geocities.com/dhdiez/images/rw10.jpg,

imagen11=https://www.geocities.com/dhdiez/images/rw11.jpg,

imagen12=https://www.geocities.com/dhdiez/images/rw12.jpg,

imagen13=https://www.geocities.com/dhdiez/images/rw13.jpg,

imagen14=https://www.geocities.com/dhdiez/images/rw14.jpg,

imagen15=https://www.geocities.com/dhdiez/images/rw15.jpg,

imagen16=https://www.geocities.com/dhdiez/images/rw16.jpg"

/>

<param name="source" value="ClientBin/PhotoRotator.zip"/>

<param name="onerror" value="onSilverlightError" />

<param name="background" value="white" />

<param name="minRuntimeVersion" value="2.0.31005.0" />

<param name="autoUpgrade" value="true" />

<a href="https://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">

<img src="https://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>

</a>

</object>

<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>

</div>

</

body>