A Sneak Peek at our ASP.NET AJAX RibbonBar development

A few months ago, I blogged about Telerik’s ASP.NET RibbonBar control (or just ribbon for short) in general: why use it; a few words about the ribbon spec; improvements we have made and future plans we have for it.

Now, few days after the 2012 Q3 release, I am blogging about our progress in this area, as well as bringing up some other lesser known features of the ribbon.

What's old new in the Ribbon

I did mention this in my previous post, but perhaps I did not emphasize it enough: apart from complying with the MS specs more, we introduced two major features for the ribbon -- a brand new resizing algorithm (predictable resizing) and the ability to aid it (control groups).

Predictable resizing

One of the most requested features prior 2012 Q2 was the ability to either manually resize the ribbon, or always have the same resizing outcome on the same elements. At the time, the current resizing algorithm was doing a great job, but it lacked those two options, with the latter being more important.

We looked at the spec for clues and hints; we also checked with Telerik's own RibbonView for WPF / Silverlight. It was obvious that we couldn’t do the things in the same manner or match their performance, but there were some ideas worth considering.

We started with the API by adding methods for resizing: gradually moving from manually resizing buttons to groups and eventually to the ribbon. Those methods, by the way, were available about a year ago in the internal builds.

The next part was tricky -- making the resize work by resizing the window, or by dragging the resize handle. We had some success with that, but it did require placing the items in a specific order: large buttons first, medium next and small at the end.

While conventions are a nice thing, enforcing them is not always considered nice. This is why we came up with few extra client methods that effectively reordered the ribbon items on the client -- the so called auto arrange.

Control groups

You might guess that not everyone was fascinated by the idea that a piece of javascript would rearrange the carefully positioned items. Thus we introduced the control groups: a container within the ribbon groups that allows to group items within a group; a stacking panel of sort...

Of course, simply grouping items is pointless, unless you have the ability to set direction of grouping: the control groups allow for horizontal, vertical or automatic orientation.

What's new new in the Ribbon

Enough about old stuff -- let's look at the current ribbon. For this release we have added four new ribbon items: combobox, dropdown, numeric textbox and colorpicker.

New items

While there are counterparts in the Telerik RadControls for ASP.NET suite, we needed something light and simple. And when I say light, I really mean it.

For this first release, the new items have simple look; in a way reminding the one you get from RadFormDecorator. Rest assured, with time we'll add some eye candy.

The rendering is also light -- we are using SPAN elements instead of TABLE. Surely, we could have omited a wrapper, but we left them to ensure dimensions in older browsers.

When it comes to events, the new items have just enough:

• DropDown / ComboBox have SelectedIndexChanging / Changed for the client events and SelectedIndexChanged for the server events;
• In addition the ComboBox has TextChanged, both for client and server events;
• The NumericTextBox has ValueChanging / Changed for client events and ValueChanged for server event;
• The ColorPicker has CollorChanging / Changed for client events and ColorChanged for server event.

There is no async loading in the combo or dropdown; there are no checkboxes in the combo... We really wanted light and straight to the point ribbon items and that's what we made.

Features based on customer feedback

I've said it many times, but I will say it again --* we really do appreciate customer feedback*. True feedback is not always flattering or positive; in fact, sometimes it could be quite harsh... But above all feedback shows where we could improve and we try to look at that.

In the comments of my previous post there were some interesting suggestions and we implemented two of them: the ability to have CommandName and CommandArguments andthe ability to have client events for minimizing / maximizing the ribbon.

If you like the feature, you might thank Julian S.

What will be new in the Ribbon (2013 Q1)

We are definitely not done with the ribbon.

The application menu needs some improvements and we haven't added all the form controls yet. Plus we are missing galleries, labels, separators...

Galleries are on the map for 2013 Q1, but if time is enough, we'll add more.

What could be new in the Ribbon (2013 Q1)

That's mostly up to you. True, we have planning and road map for the Ribbon, but it is possible that we do not see the entire picture, or we miss a scenario. This is where you, our customers, step in.

Your feedback helps us deliver new important features and fix critical bugs.

Such was the case with Julian and his suggestions.

Another notable example is the appearance of the ribbon in IE7. Time, after time, after time, we have received feedback that something does not look good or is broken and we fix things. Even for the 2012 Q3 release we improved IE7 experience, albeit in a not so visible fashion.

This time however, we are not fixing things, but solving the issues that break. As of the time I am writing this, the issues in IE7 have been addressed and the improvements are now undertaking serious QA testing. They will show up in the internal builds at some point and eventually in the 2012 Q3 SP1 and 2013 Q1 release.

Put in other words, we are listening. Do feedback!

...

If you read that far, you might be interested to know that this post was written in MarkDown and then imported in the Telerik’s ASP.NET Editor. Neat :)