BIOsual: January 2013

Hello there!

So here is the first post of actual work of the year, although most of it was done last year. So, the last time I post here the status of the protein-protein interaction viewer looked like this: http://biosual.cbio.uct.ac.za/interactions/, and my efforts since november have been focused in making it look like this: http://biosual.cbio.uct.ac.za/biosual/tests/pinv/pinv.html Notice the difference?
No, I am not talking about the logo and new name. So try again, check both pages and see the difference! If you didn't notice a change its because I did my job well, in case you notice let me know and I will try to correct that.

Warning: I am going to start being quite technical so if you are not into web development you might get lost. Badly lost!

The thing is what i did was to change the way Ajax-Solr (the library I'm using to get the data) includes its widgets so they can be loaded from a config file, I also make sure all those widgets are now completely agnostic of the other widgets, and I also create some PHP scripting in order to generate a single javascript that contains all the Ajax-Solr files, all the widgets and its dependencies, so pretty much I change hell of a lot in the background with the goal of having a single config file indicating which visual components should be included in the page. It is still in a work on progress stage, but the fact that I'm getting something as close to the application with the original version of AjaxSolr, makes me thing I'm in a good path!

You may be asking why to change so many things if at the end it is going to look almost the same. Well that has to be with the big picture of my project. The viewer has to be dynamic enough to display different setups that users can configure, so what im doing here is been able to create a runnable javascript that include all the required code to show the different graphic components by just passing few parameters.

The key is the configuration file, which is saved in the installation of biosual, then retrieved identifying it by its id. this separation allows me to in future develop a tool to create that configuration file. I'm sure there are lots of requirements i have to go through to get that authoring tool, however the process of this development help me to identify lots of them.

So lets explain some details of this whole thing. I'll start for the PHP script, mainly because it kind of works as the controller of the whole thing and in that way it gives me the chance to have some sort of order in the descriptions. The idea is to have a single point to ask for the resources of a viewer instance. A html page that wants to include an instance of the viewer requires to have an empty [div] component that will be the container of it, and to include as a javascript the path to the PHP script sending as parameters: (i)the id of the instance to create, (ii)the target id, and (iii) the type of data.
There are 3 types of data so far: json returns the MDC configuration file,that indicates which widgets/components are part of this viewer instance; js to get a bundle of all the java scripts files associated with the given id; the third option is css to get a single file with all the css files from the different widgets, dependencies etc.

So the basic HTML file that includes a viewer instance is like follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <title>PINV - Biosual Architecture</title>
  <link href="../../include.php?id=pinv&type=css" media="screen" rel="stylesheet" type="text/css"></link>
  <script src="../../include.php?id=pinv&target=here&type=js" type="text/javascript"></script>
  <link href="http://fonts.googleapis.com/css?family=Jura" rel="stylesheet" type="text/css"></link>
 </head>
 <body>
  <div id="here">
</div>
</body>

Notice that there is just a single javascript tag in this code, the PHP script will create a unified resource that includes the dependencies, the whole Ajax-Solr library, the selected widgets ant its own dependencies. The order to include all this files is key to make the whole thing to work, so here is a high level view of this, and below some explanations of each step.

Add a list of mandatory dependencies, which in the current version is composed by jquery, jquery-ui, ajax-solr and biojs. This dependencies can be located in the same machine where the script is located or somewhere accessible via Web.
The configuration file is loaded through the id parameter passed in the URL.
One of the options in the config file is to assign a template. this is basically a HTML piece of code that works as layout for the components. In this step the PHP script creates a variable in the javascript code containing the selected template, and them a piece of executable js is added to inject the template into the target div.
There are scripts that are associated with a configuration in particular (eg. making 2 widgets to work together) in this case those scripts are listed in the configuration option js and the PHP script adds them in to the response here.
And here is the core of a viewer configuration: the widgets. A widget should be a component that can be executed by itself in the biosual framework, and follow the idea of ajax-solr iwgets, having functions that will be caled at the initialization of the widget and whenever new data is been captured for the Viewer. The way a widget is defined in biosual(at least for now) is as a sub-folder in the folder widgets, it requires a file there called widget.json, the file follows a JSON format and allows to specify the javascript file of the widget, any dependencies a style file on CSS format, and a HTML snippet of code that will be injected whenever the MDC file indicates. An example of the widget configuration below.
```
{
    "name": "Search with Autocomplete",
    "description": "a text based widget to start a search",
    "dependencies":["jquery.autocomplete.js"],
    "dependenciesCSS":["jquery.autocomplete.css"],
    "js": "AutocompleteWidget.js",
    "html": "AutocompleteWidget.html",
    "css": "AutocompleteWidget.css"
}
```
This configuration indicates the widget is in the file "AutocompleteWidget.js", but that it requires the file "jquery.autocomplete.js". it also contains the CSSs, HTML and some metadata for the widget.
A widget can be created but never been used, it is just when is part of a MDC file, that is included, starting for including all its dependencies, then the widget file itself, and in last the HTML to be included in the target explicitly indicated in the MDC file.
A subset of the MDC file is included: widgets, parameters and server
Finally the loader.js is included. This is a piece of software that uses the previous parameters and scripts to create an instance of the Ajax-Solr manager that includes all the widgets and starts the page.
The final resource is included in the web page. The loader.js is executed once the page has been loaded.

There are implementation details that I will post in a future post but for now this one is long enough. By the way, if anybody is interested enough in checking put the code I have a git repository with it: https://github.com/4ndr01d3/biosual/tree/ajaxSolrFromPHP

So let me know any opinions!!
Cheerio!!!

Hey guys...

I know! it's been a while since the last post, and i have no excuses, so this is going to be my new year resolution: I'll post at least once a month but I will try to do it every second week, and to make it easier on me, I will allow myself to write [Off Topic] posts every now and then, and this is the first one of those.

Here I'm going to share my experiences in the last 2 weeks outside of the PhD work, University, and actually outside of any city because what we did for the christmas season was to hike for 6 days in the Tsitsikamma trail, one of the best experiences i have have in this country!

So for those who don't know the Tsitsikamma trail is a 65km hike on the mountains in the border of the Western and Eastern Cape provinces in South Africa, and if you have heard about the highest comercial bungy jumping in the world located in the Bloukrans bridge then you know which mountains were we hiking!

Pre-Hike

So everything started some months ago when a friend randomly commented to her wife that it would be pretty cool to do this hike, less than a week later she have booked over christmas and send the invite to 4 more people including me! Lucky me!!! And here is a Pic of the group few seconds before starting the adventure:

The Team(From left to right): Brett, Gustavo, Tamsin, Julie, Natasha and Sean.

It sounds kind of hardcore eh.. 5 days hike in South African mountains! Well it wasn't that intense and our back packs weren't as big as you might be thinking right now. First thing to mention about it is that the fees that you pay to do this hike include accommodation in 5 huts that are strategically located in the hike with an average distance of about 14km between each 2 huts, so we didn't have to carry tents (bags looking smaller eh!). However that's not the biggest deal of it! For some bucks extra in your fees you can have your "equipment" portered, meaning they will take some bags for you from hut to hut, including stuff that needs to be refrigerated. In conclusion our bags were 1-day bags.
For more details about the package that we took to do this hike check this website (http://www.mtoecotourism.co.za/tsitsikama.htm).

But I'm sure that when this company created the portered option the weren't expecting us. Our portered package included the expected (e.g. sleeping bags, clothes, first aid, etc.) but it also include lots of food, candies, and most amazingly 4 beers per night per person, it was incredible to finish a 14km hike day and having a beer waiting for you every time! although the beers were semi-cold, nothing is perfect eh!

The preparation for the hike included small hikes around table mountain and a one in the Krom River, close to the tunnel in Paarl, nonetheless we were planning to do lots of more training, but you know how it is an at the end we did just a few short ones. We also had hiking meetings, deciding what o take with us and having interesting discussions about how 4 beers was the appropriate number! And a day before have a last packing meeting organising stuff. All this was actually really easy because Tamsin is super organised and most of the meetings were more about aprove what she propose.

The Hike

The first day

So with everything ready we drove for about 6 hours in two cars and leave one of them at the end of the trail and came back to the start point for a introduction about storms, river flooding, scape routes, snakes and a few more appealing facts of the trail!!
I didn't really knew much about the details of the day by day of this hike, kind of wanted to be ignorant of many of the difficulties and be surprised for the awesomeness. The only think I knew was that the first one was short, just to get to the first hut and that in reality everything starts in the second day. But you know you cannot be too ready, so I put on my full hiking gear, boots on, backpack well tied, and a south american soccer t-shirt!
And then I found out I was over dress for this first day, the walk was really short and on beach sand, I think it took me longer to get ready that to do that first segment, and then I understood why the plan was to walk in the evening to a restaurant located 2 km away from the first hut. So yeah we started the hike in a restaurant, the intimidating thing there was seen a tree full of destroyed shoes; as this restaurant is the common final point of the Otter trail, which is a well known trail in SA that starts where our trail finish and ends where we start, although the difference is that the otter path goes closer to the sea and tsitsikamma is on the mountains. So after our first disappointing encounter with Mitchell's (the local beer), we came back to the hut and try to sleep.

Natures Valley Beach

We didn't felt very welcome in the first hut, each hut is prepared for 24 people and been high season it was full, so when we arrived beds were already taken and a big family(12 hikers) were accommodated in the different rooms, so our group split in the available beds and it really felt like we didn't belong into that group, we were too old for the kids and too young for the seniors.

Day number 2

So given our discomfort in this place we started earlier than everybody else at about 5am. and put a fast pace to start the hike, with only one problem the first kilometer is a freaking hard hill, and been that close to the beach the humidity was killer. We were exhausted (i like to think in plural here), and that was just the very beginning, what in hell have I sign for? The only rule of our group was no moaning, so we just took it and move on.

Luckily things starting to get better, the following part was mainly on forest area and it was a cloudy day, kind of perfect weather for hiking so we were able to walk non-stoping for a couple of hours to reach a nice waterfall that became our first swimming spot.

We were there until it started raining, not heavily but raining anyway, by then the full family and the rest of the hiking group have reach this place, actually the youngsters over took us even before the waterfall, they were really fit and prepared for the hike, some of them didn't even have portered items so they were hiking with massive bags and still been faster than me!

The signs indicated that this spot was 9km though, and in theory the first day was 13.4 so we though we were really close to the huts, this until the next sign appeared and said something like you have walked 12 km and need to walk 4.9km more, and somehow that should add to 13.4... mmm something wasn't alright with my maths eh!!

Anyways it wasn't that bad, we were in the hut just after midday, and the first 16.9km of the hike were over, most importantly the first earned beer was in our hands.

That was my favorite hut Blaaukrantz, the view was amazing and we took over the kitchen side and actually took our mattresses there and sleept there. And here is a pic of our view from our sleeping bags. Among other things the relation with the rest of the hikers improved and kind of everybody found their space in the bigger picture.

The Third day

With our batteries fully charged and after having an awesome evening we restarted the hike the next day, but this time we were in not hurry; this place was so cool that we took our time to pack, have breakfast and basically just enjoy the view. But we have to continue and relatively close(3 or 4 kilometers) we got to Bloukrans river which as Sean pointed later is the geographical divisor between the western cape and the eastern cape, two of the nine provinces of SouthAfrica. And this river was the one with more swimming spots in the whole hike, although everybody(including us) stops in the first one because you just dont see the other pools.

That day was also rainy and therefore we didn't stayed longer in that river, we swim there just not for too long. after that came what it was the longest flat segment of the whole hike, about 5km on the top of a long mountain, I would say it was the easiest part at least for me, Julie wasn't feeling allright that day so she couldn't really enjoy that part as the rest of us did. And was there when i put some music in my ears for the first time on the hike, and it was Mr James Blake debut album who give me some company for during that time, if you haven't listen to his music give it a try. I really like that album and i was the perfect companion there.

The rest of that traject wasn't particularly memorable, just walking and walking, an actually a bit disappointing because in the maps close to the next hub appears something called the twin pots, that somebody even described as a natural jacuzzi spot, but it wasn't. the water didnt ran much there and therefore the look of the place wasn't as inviting as the previous swimming spots, as a matter of fact none of us swim there.

And once in the Keurbos hut it was christmas so we put our bags down and proceed to eat ice cream. Yes you heard right we had ice cream!! Natasha was in her own mission with this, it kind of became the big question until there... is Nats Ice cream gonna make it?? and it did!! it wast perfectly frozen but it was still ice cream in the middle of nowhere! what a luxury... then we play Evil Santa(see the thieving santa part in this wiki-link http://en.wikipedia.org/wiki/Secret_Santa). And we had Filet for supper, just delicious!!

Dia Cuarto

And the forth day came, another late start and with it a bit of a hangover, not a bad one but that uncomfortable small headache was there, lucky it stop as we started walking. and it was a nice down hill to a river, not too complicated. The hardest part was to find a spot with some shade because was in the 4th day that the weather change dramatically and from drizzling days and nights it when to full sunny summer. Which at the time we though was awesome, swimming and chilling in that spot, and then a snake appeared, or that was what Sean though it was, when in reality it was a mouse, a swimming mouse, so everything was pretty OK.

The problem came afterwards; the first long up hill of the hike was waiting for us, and under that powerful sun it was really challenging. Im not sure of this, but I think we walked like 100km... OK just around 5km but it really felt like a lot more, specially because it was kind of open, very few trees and the sun was quite 'picante'!

But there is always a rainbow after an storm, or at least thats what "Ice Age 4" tough me yesterday. And in this case the rainbow was in the shape of a small current of a river, it wasn't the biggest river on the hike, we couldn't even swim on it, but for sure it was the most expected one and it didn't disappointed at all, we all sumerge our head in that 30cm deep water and it was marvellous! Even now I feel the refreshing feeling of that moment.
As you can imagine we didn't have too many energies that day to take pics, or at least not in the camera where the pics Im posting were taken. We will share all the pics and I might update something here later.

Checking in the map, that spot is half way the hut, but the second half felt a lot shorter, thanks to be in a forest covered area, so we were in the next hut i not time flat, or at least thats how I remembered now. So we arrived to the Heuningbos hut and the cool think of this one is that there is a river 100mts away, so we took some beers to the river and celebrate the culmination of another successful hiking day.

Day FiiiiiiiiiiiiiiiiVeeeeeee!

Uff that was long! The number of Kilometers is just above 13 and I can pretty much describe the terrein with 4 words(actually just 2): UP-DOWN-UP-DOWN, and thats it. The first part UP was alright, not too sunny and although it was a long up hill, I didn't struggle any more than normal, I actually had more issues with the subsequent down hill, I wasn't happy there, my knees were starting to feel the almost 50km that so far we had walked.

In a super "clever" move, our bags were heavier that day as we decided to have breakfast in the top of the first hill, but somehow that decision changed and the breakfast just happened at the end of the downhill, my poor Julie really suffered with that decision and her energy was really down there, nonetheless she made it and we have our breakfast as an award for finishing the first hill.

The problem was that the first mountain end up being the easy one, the second UP hill was for sure the hardest part of the whole hike, the sun was again over us and the few trees around were pines with not much shade, at some point the hike became in steps of 10mts from shade to shade, one thing that helped was that almost at the top some wind appeared and refreshed a bit.

But again we did it, and the satisfaction at the top was great. At that moment we were so tired that we just look for the closest shade and collapsed there, to realise minutes later that it wasn't the most confy spot, but who cares it was our spot, our moment of glory.

The down hill wasn't particularly easy, the wind was at the other side of the mountain and it was still hot but in comparison with the up hill it was OK and after a couple of Kms the a forest cover appeared and the even a small river was waiting for us to be fresh for the last little piece. Which was a bit of an uphill again but on a pleasant weather and with the conviction than the hard part was over!

The last hut was called Sleepkloof, and there we have a great time, enjoying every single zip of our beers, and the rest of the drinks that we bring, oh did I mentioned that besides the beers we had whisky, brandy, rum and amarula?? Yeah, the pleasures of having your stuff portered from hut to hut!!

Last day.

We knew that the last day was a short one, but it actually was way too short, the big sign of civilisation appeared just when we were warming up, kind of sad.

And here a final pic with all the hikers that finished this adventure with our group, some of the 24 that started with us were just there for 3 days, and others didn't stop at the last hut so they finished a day earlier. In any case here is the pic:

[Edit]

Minor comment on it... the geek on me(and my friends) took part of the whole process, lots of planning was made through whatsapp messages, the food per day was a google doc, whe collaboratively we decide what where we gona have.. Ok collaborative mean here Tamsin though in great ideas per each day and we just complement it, and the last evidence of our geekyness on this adventure is the whole tracked path on GPS, check it out:

View Tsitsikamma Hike 2012 in a larger map

Post-Hike

That was amazing, so to delebrate the whole team stay in the area for 5 more days backpacking, one day in storm rivers mouth (www.tubenaxe.co.za) and 4 in sedgefield(www.afrovibe.co.za) but that is a different story!

BIOsual

Monday 28 January 2013

Biosual Viewer. First prototype.

Tuesday 8 January 2013

[Off Topic] Holidays!!! :-)