Functional skins in action

The idea about functional skins was discussed here

Let's see real life example now. All the actions are done based on Graaasp: http://graaasp.epfl.ch

We have a space that contains four gadgets: Google map search, Quick Latex, Todo list and English resource browser. Graaasp provides us with the following default view for this space:

You can see every gadget one by one, but you can't see few gadgets on the page at the same time (similar to iGoogle view). In Graaasp you can attach a functional skin to a space which could change the representation of this space. Let's do that. Let's add the following gadget as a functional skin: http://graaasp.epfl.ch/gadget/rolespace/rolespace.xml

Now we can click on the button "View space with skin" and we see the following view, where all widgets are displayed on the page as a grid:

We can go further and add another skin to a space that contains youtube videos.
I have few videos in my space and default view for it is as follows:

Now I add the next functional skin to this space: http://graaasp.epfl.ch/gadget/viewer/viewer.xml
And I see the space differently, all youtube videos are open and can be played:

You can easily write your own functional skin and use Graaasp's space as you wish.

Few points on implementation. Graaasp implements Opensocial APIs via Shindig. Plus it uses Space extension to Opensocial. Gadget finds out the space to which it belongs and then retrieves gadgets for this space as in the example below.



Once list of gadgets is received, they are built in a standard Apache Shindig way.
You have to only require a feature


In the second functional skin you retrieve list of assets for a space in a similar way.