silverlight and php

i saw a post over in russell myers' land seemingly acknowledging the confusion that might be out there of hosting silverlight.  he noted my previous post about the topic.  in his note though, russell mentions:

...it seems entirely possible to take a Silverlight application and integrate it on an existing Apache server to create a Silverlight experience within PHP or any other language that can embed the XAML content.

he's right on here, in fact, i'm not sure even samples will do it justice, but i tried anyway :-).  take for example another quick swag sample using flickr.  how can i use flickr services via php, get some images and display them in a silverlight application?  simple.

first, let me stress again 2 things: i'm not a php developer (so be kind on my code) and i'm not saying this is the end-all-be-all of samples...just merely making a point.

in this example my goal is to have a form that accepts user input, which in turn does a tag search on flickr for some images using their REST api's via PHP.  those images are then referenced in a silverlight control that creates a simple little control displaying the image and then for completely gratuitous reasons adds a web 2.0 reflection on the bottom of them :-).

here's what we are doing...first, the php application.  now, in my sample here that i'll provide a link to (btw, i'm using a free host that appears to be having issues, so unless someone can point me to a free, reliable PHP host that is what i'm stuck with) we are using flickr's REST apis.  i'm using a pre-packaged PHP library for flickr called phpFlickr oddly enough.

step one is creating the php interaction (did i already say i wasn't a php developer?).  here's my basic code:

<?phprequire_once("phpFlickr/phpFlickr.php"); $flickr = new phpFlickr("YOUR API KEY HERE"); $i = 0; $tagName = $_POST["flickrTag"];if ($tagName == "") { $tagName = "silverlight"; } $photos = $flickr->photos_search(array("tags"=>$tagName, "tag_mode"=>"any", "per_page"=>"6", "page"=>"1")); ?><script type="text/javascript"> <?foreach($photos["photo"] as $photo) { $purl = $flickr->buildPhotoUrl($photo, "Square"); echo "photoArray.push(\"$purl\");"; } ?></script>

so we are essentially calling out to flickr and getting a search result back.  now when you look at the foreach loop here's where you'll see the silverlight 'integration' part 1.  in another javascript file i have declared a global javascript array called photoArray.  in my loop here, i'm essentially building out the URL to the flickr photo and then jamming that into the array object.

once the content i need to manipulate for silverlight is in my javascript (or .NET code for v1.1) objects, they are on the client.  read: no more server stuff... so really in this sample and others, PHP is simply providing some data, whether directly itself emitting XAML that will be consumed (as in this screencast), or providing data for the client to iterate through and create XAML elements on the fly in my sample here.  in my example, with this new photoArray i'm instantiating a simple little control i had added (this is the ThumbnailImage.xaml file in the download) -- essentially a pre-build glob of XAML representing my end result. 

i iterate through the array and create those elements:

for (var i=0; i < photoArray.length; i++) { var rimg = this.control.content.createFromXaml(xamlFrag, true); this.root.children.add(rimg); new PhpFlickr.Thumbnail(this.control, rimg, photoArray[i], left, top); left += 80; }

the PhpFlickr.Thumbnail object is a javascript prototype class that sets the canvas' inner elements to the image reference.  you can learn about creating these little user controls for silverlight here (v1) and here (v1.1):

PhpFlickr.Thumbnail = function(control, target, imageSource, x, y) { this.target = target; this.thumb_image = target.findName("Thumbnail"); this.thumb_reflex = target.findName("ThumbnailReflect"); this.thumb_image.Source = imageSource; this.thumb_reflex.Source = imageSource; this.target["Canvas.Top"] = y; this.target["Canvas.Left"] = x; }

the end result of this sample looks something like this:

so as you can see, very little php code happening here...and that is kind of the point!  yes, silverlight can be served up via any web server, and yes, silverlight can be used with any technology.  again, my sample may not resonate to "get it" for you, but hopefully you will see the point that the interaction is on the client.  so if you have php web services, great, silverlight can use them.  if you want php to dynamically generate xaml and deliver it to the silverlight control, yes that can be done.

the sample is online here (again, shared/free host so don't hate me if it isn't up/working), and the sample code is below at the end of this post.  i hope this helps clear some things up again, if not, please let me know.

Sample Code: SilverPhp.zip