One of the problems that one has to tackle when working with different technologies is the fact that in this world each and every different language and runtime hates each other, period.
It is really hard to be able to make everything work nicely without making some sacrifices by hacking or just using ugly code and that, in my case, is a problem (just because I’m a perfecionuit :P ).
I do not like hacks at all, I want things to work as nice as possible following the correct patterns and techniques, but that can’t happen, can it?? Well it can happen if you put the effort. Lets see an example:
In our recent work we have been using a number for java-script libraries to generate the ASP controls, all of this libraries have a tab view of some kind or an other:
- Yahoo User Interface: I really like YUI, although it is very young and not that mature yet.
- Adobe Spry API: Kinda useful, but soo ugly (although that is just the CSS styling which should be easily fixable :P )
- Ext: I really like the work of this guys, but they have done a lot of work I cannot get to work with ASP.
So, as I was saying the three above have the same idea of tabs () but they have implemented them differently. I want to be able to use the three of them within the same code but make sure that when I change from one PAI to another one I do not have to much work to do.
A normal developer who does not go that extra mile will simple inject in the webpage the required code according to the API, and that my friends is a huge mistake. A programmer should ALWAYS mae thing programatically and try to use the smaller amount of literals as possible, and that is what I did.
Currently in our sytem the three different tab views can be use, to do such a thing we follow this design:
The design is a very simple one but those the job. It adds the desired level of abstraction. Now the code to generate a number fo tab bies using C# would be comething like:
protected override void CreateChildControls() {
//we add the differnt tab view we want to test
// first view
TabViewPanel firstViewFirstTab =
new TabViewPanel("FirstViewFirstTab",
new LiteralControl("This is how a tab looks like using the yahoo api.
"));
TabViewPanel firstViewSecondTab =
new TabViewPanel("FirstViewSecondTab",
new LiteralControl("This is how the second tab looks like in the yahoo api.
"));
YahooTabViewControl firstView = new YahooTabViewControl("YahooFirstView", 0);
firstView.Tabs.Add(firstViewFirstTab);
firstView.Tabs.Add(firstViewSecondTab);
// second view
TabViewPanel secondViewFirstTab =
new TabViewPanel("SecondViewFirstTab",
new LiteralControl("This is how a tab looks like using the spry api.
"));
TabViewPanel secondViewSecondTab =
new TabViewPanel("SecondViewSecondTab",
new LiteralControl("This is how the second tab looks like in the spry api.
"));
SpryTabViewControl secondView = new SpryTabViewControl("SpryFirstView");
secondView.Tabs.Add(secondViewFirstTab);
secondView.Tabs.Add(secondViewSecondTab);
//third view
TabViewPanel thirdViewFirstTab =
new TabViewPanel("ThirdViewFirstTab",
new LiteralControl("This is how a tab looks like using the spry api, isn't it cool? You can't do this with yahoo api.
"));
TabViewPanel thirdViewSecondTab =
new TabViewPanel("ThirdViewSecondTab",
new LiteralControl("This is how the second tab looks like in the spry api, isn't it cool? You can't do this with yahoo
api.
"));
SpryTabViewControl thirdView = new SpryTabViewControl("SprySecondView");
thirdView.Tabs.Add(thirdViewFirstTab);
thirdView.Tabs.Add(thirdViewSecondTab);
thirdView.Orientation = TabViewOrientation.LEFT;
Controls.Add(firstView);
Controls.Add(secondView);
Controls.Add(thirdView);
base.CreateChildControls();
}
Notice, that we just needed to change the constructors of the views. Teh best thing is that the differences of the views are hidden, but the can be used since the container does not carea bout them. That way I can set the button of the Ext tab view which is a property that no other view uses. When ever I change the code I wont have any error regarding the view and I’ll be able to change it with a refactor operation within my IDE :)
PS: I’m such a geek :P
