code snipplet

Using Google App Engine as Proxy for Silverlight and Flash Cross-Domain Requests

When using Silverlight or Flash to fetch data from other domains one often runs into cross-domain access restrictions. For security reasons in order to access data from different domains, the remote server explicitly has to allow this by defining a crossdomain.xml (or, for Silverlight, clientaccesspolicy.xml is good as well). If this file cannot be found on the remote domain, the request is not executed.

This can be fustrating when querying against RSS feeds or JSON/XML web APIs that don’t define any of these files. The workaround for this issue is to use some sort of proxying service. In this article I’ll be showing how to use Google App Engine to create a simple proxy that will forward these requests for free – within a reasonable daily load.

Google App Engine Overview

The reason I’ve chose to implement the proxy using Google App Engine is because it has a free daily quota and getting started using it is really simple: all you need is a Google account and to download and install the Google App Engine SDK.

Google App Engine supports developing in both Java and Python. In my example I’ll be using Python. In order to use and deploy the code yourself as well, follow these steps:
Read More…

Streaming World Cup Tweets in Silverlight With a Few Lines of Code

The World Cup is on and there have been quite a few good Twitter mashups made for this event, probably the most popular being TweetBeat (and I’ve also developed one, Tweet For Your Team). In this post I’ll show how to build a simple service similar to TweetBeat using a publicly available real-time streaming service, Kwwika.

The application built in this short tutorial will be the following:

Why use a streaming service?

Getting tweets on a certain topic – in our case, the World Cup – can be done in three main ways:

Read More…

Printing in Silverlight: Printing Charts and Auto Scaling

Printing support has been introduced in Silverlight 4. This means that any part of the visual tree can be printed with some simple API calls (see the Printing Basics section on my Advanced Printing in Silverlight post). This post provides an example to print charts and looks at how elements can be auto scaled to fit the page size.

Printing a chart

There are lots of examples on blogs demonstrating printing on simple elements. However I wanted to test how the printing functionality performs when working with charts.

I chose to use the most widespread (and free) charting component, the Silverlight Toolkit. In my example I’ve created four charts and added printing support to all of them like this:

Chart chartToPrint; // The element to be printed
PrintDocument doc = new PrintDocument(); // Create the PrintDocument  object that will do the printing
doc.PrintPage += (s, args) =>
{
  // Set the chart that needs to be printed.
  // As soon as this is set, printing starts
  args.PageVisual = chartToPrint;
}

In the example the whole page can be printed as well by clicking on the Print whole page button. In this case the LayoutRoot element is passed as the PageVisual. Test the example yourself:
Read More…

Detecting Silverlight Version Installed

Detecting the Silverlight version installed on a client machine isn’t entirely straightforward. To do so, one has to use Javascript. Unfortunately even though Microsoft ships a Silverlight.js in the Silverlight SDK, this script only has the ability to tell whether a specific version is supported on the client’s machine; it does not support returning the installed version.

For this reason I have created a simple Javascript function returning the Silverlight version number installed on the client machine or returning -1 if Silverlight is not installed. The source code can be downloaded from here:
SilverlightVersion.js
The script can be used the following way:

var slVersion = GetSilverlightVersion();
if(slVersion != -1)
   document.writeln("Your Silverlight version is: <strong>" +slVersion + "</strong>" );
else
   document.writeln("<strong>Your do not have Silverlight installed on this computer</strong>");

And this is the script in action:

If you’re interested in how the script actually works and what the Silverlight version numbers mean, read the post on my ScottLogic blog: Determining Silverlight Version Installed – source code & explanation

Using fonts in Silverlight: evaluating the options

Silverlight gives the developer the possibility of completely customizing the developed application in all aspects. Defining fonts used for displaying text is no exception. However there are multiple ways on how to go ahead with specifying fonts to use, this article attempts to summarize the options.

In Silverlight, using fonts can be done in three ways:

  • Built-in fonts
    Silverlight can use a limited number of “built-in” fonts to display text such as Arial, Verdana, Times New Roman and a couple of more. The list is limited and it’s also worth noting that Silverlight can only use these fonts if they are installed on the client machine as the runtime does not ship with any fonts.
  • Embedded custom fonts
    Custom font files can be embedded in Silverlight applications and then shipped within the xap files. This option makes sure that the font will be rendered as wanted regardless of wether the font is installed on the client machine or not.
  • Streamed (dynamically downloaded) custom fonts
    The problem with embedding fonts in Silverlight is that it increases the xap size. If a font is only needed in certain cases the font file can be dynamically loaded from a remote location making the initial download time faster.

For details on how to implement the above use cases and some sample applications with source code check out my blog post on the Scott Logic website: Using built-in, embedded and streamed fonts in Silverlight.

My MIX 10K entry – SilverCooler

I’ve entered the MIX 10K competition where the goal is to write an application using no more than 10KBytes of source code in Silverlight. I’ve decided to implement a cocktail selector application – strictly listing alcohol free cocktails only – using the web services I’ve previously built for a popular cocktail site, iCocktail.co.uk.

ICocktail.co.uk was built with Flash using XML services and since Silverlight is indeed as powerful as Flash implementation was quite an ease – my only problem was squishing in the 10K limit (thanks for Colin’s post on some tips on minifying the code). The application I’ve developed is the following:

SilverCooler - Gergely Orosz's entry for MIX 10K

If you like it, please vote for it on its the MIX 10K entry site.

One thing all people noticed when looking at the application at first is the cool “bouncing” effect of the cocktail name. In the flash version this was done by using an EaseOutElastic transition. Not surprisingly Silverlight has similar animation effects as Flash, these are called easing functions. To achieve the bouncing effect I only had to add the following code to the animations changing the width and height of the shape:

DoubleAnimation animation; // The animation changing width or height of the shape popping up
animation.EasingFunction=new ElasticEase(){ Oscillations=3, Springiness=1, EasingMode=EasingMode.EaseOut };

Oh, and if you’re in for some more drinks, check out iCocktail.co.uk as well!

Animated Christmas Card using jQuery

As the holiday season is close I was looking for a way of sending a simple, yet nice animated Christmas card to friends. I wasn’t looking for one of the many popular sites offering e-card sending, instead I wanted something I could somewhat customize, put on my server and send the link to friends and family so they could view it in their browsers.

At first I was thinking of creating a simple application with fading pictures in Silverlight. However I’m intending to send it to some older relatives whom I don’t want to have to mess with installing the Silverlight plugin – they would probably skip from that point. Doing the card in Powerpoint was not an option as not all friends have software to open it. So that left me trying to find a Flash application that does something like that – without any luck. So at that point I almost gave up. And then realized that I’ve forgorren about one of the most simple cross-crowser solution: using javascript to do the job.

So I’ve created a nice greeting card using jQuery that fades in a few images like it was a slideshow and writes out a greeting message in the end. You can take a look at it working here: Christmas Card using jQuery demo, and here’s a screenshot of what it looks like:

jQuery Christmas Card - preview

I’m sharing the complete application for further re-use, you can download the package here: source code for Christmas Card using jQuery. It consists of a html page, a css file, some demo images and a javascript file. If you want to create a similar nice greeting card, you can do it the following way:
Read More…

File Upload in Silverlight – a Simple Solution

Recently I wanted to implement a very simple file upload component in Silverlight that uploads a single file and if possible shows upload progress. Having done some search I’ve found numerous examples but all of them seemed too complex for the simple task of uploading a file so I implemented a really lightweight solution. The source code can be downloaded from here: SimpleFileUpload_v2.zip

Uploading files in Silverlight

Uploading files is quite an easy one in Silverlight: it’s basically just a request made to another server and the file contents are passed in this request. A possible way of implementing this is by using the WebClient class:

private void UploadFile()
{
FileStream _data; // The file stream to be read
string uploadUri;
 
byte[] fileContent = new byte[_data.Length]; // Read the contents of the stream into a byte array
int bytesRead = _data.Read(fileContent, 0, CHUNK_SIZE);
 
WebClient wc = new WebClient();
wc.OpenWriteCompleted += new OpenWriteCompletedEventHandler(wc_OpenWriteCompleted);
Uri u = new Uri(uploadUri);
wc.OpenWriteAsync(u, null, new object[] { fileContent, bytesRead }); // Upload the file to the server
}
 
void wc_OpenWriteCompleted(object sender, OpenWriteCompletedEventArgs e) // The upload completed
{
if (e.Error == null)
{
  // Upload completed without error
}

Upload Progress Indicator

The above solution does the job of uploading the file well. However it does not indicate file upload progress at all: when uploading large files or when having slow internet connection this behaviour would be desirable.

Silverlight has no built-in way to monitor the number of bytes sent which means that the only way to indicate upload progress is sending the file to the server in multiple, smaller chunks. Of course this behaviour needs support from the server side as well.

The idea is that multiple calls are made to the server, every call submitting the next chunk of the file. On the server these chunks are appended to the file.

Read More…

How to resample images – a simple algorithm

When working with images I sooner or later usually run into the problem of creating thumbnails. Resampling images is not really difficult in the major programming languages however I have not found built-in support for caclulating thumbnail dimensions neither in .NET nor in PHP. And it seems that this made me re-invent the wheel over and over again creating codes with various lengths just for this simple task.

In Sense/Net 6.0, the open source ECMS I am working on I came across the exact same problem: I wanted to resize images, this time on the fly. This time however I decided to do it a bit less complicated as in previous cases and create a clean and simple solution. After a good deal of googling, tutorial reading and planning I came up with a fairly simple and good code snipplet.

Read More…

 Scroll to top