YUI Version 2.2.0 Released: Browser History Manager, DataTable, and Button Components, New Versioning, and More

By Nate KoechleyFebruary 20th, 2007

Note: This release is timed to coincide closely with the one-year-anniversary of the YUI Library’s Open Source release…a quick reminder here that we’d love you to come celebrate YUI’s first birthday with us at Yahoo! in two days.


Download YUI
We released version 2.2.0 of the Yahoo User Interface Library (YUI) today. This release is one of the most substantial revisions we’ve done to the library since its inception. Leading the change manifest is a new versioning track and three brand-new YUI components:

New versioning, 0.12.2 —> 2.2.0:

YUI was released internally at Yahoo! about six months before it was released for public use under a BSD license in February 2006. Although the internal and external versions of the library were identical, the way we built and distributed them was different and we managed those differences with separate versioning tracks. Today we’re merging the internal and external project versioning and reaffirming that the YUI you can download here is exactly the same YUI Library used all across Yahoo!. Hence, we’re retiring the old public version series (which had reached 0.12.2) and we’re unifying the versioning of this release at v2.2.0.

Browser History Manager

Read more about the new YUI Browser History Manager Building desktop-style applications within web browsers — which were designed to read hyperlinked pages, not to run apps — has created many challenges. Not the least of these challenges involves handling "back/forward" navigation buttons and bookmarking. First, there’s the tough question about just what the back button or bookmark should do in your app to be consistent with your user’s intuition/expectation. Then there’s the question of how to make your desired implementation work across all the A-Grade Browsers. No one, as far as we know, has resolved the technical issues in a satisfactory way across the A-Grade. Today we’re releasing the YUI Browser History Manager, an experimental component that supports all A-Grade browsers in managing the back/forward button navigation and bookmarking for dynamic web pages. Stay tuned to YUIBlog for a deep-dive on Browser History Manager from its author, Julien Lecomte, later this week.

DataTable Control

YUI engineer Jenny Han Donnelly, who brought you the Logger and AutoComplete Controls, rolls out her third component today with the DataTable Control (beta). Tabular data is one of the most common UI presentation tasks. DataTable allows you to present tabular data and allow your user to engage that presentation by modifying/enhancing the data, sorting and searching through it, and adjusting the presentation itself (by, for example, changing column widths). DataTable’s debut featureset includes:

  • Progressive enhancement: DataTable is built on the foundation of HTML table element markup, providing a solid progressive-enhancement path.
  • Nested column headers
  • Custom sort functions
  • XHR data sources: Integration with Connection Manager offers robust support for pulling in off-page data.
  • Inline editing: Contents of cells can be editable, allowing users to update the information they’re reviewing.

This is just our first release of the DataTable control, and we know that there are many possibilities for pushing this implementation further; we look forward to hearing your feedback in the YUI Forums about this release and what you’d like to see next.

Button Control

Todd Kloots, author of the Menu Control, today brings you the new Button Control (beta). Buttons are essential parts of most graphical interfaces, but the visual constraints of buttons in their various form-control implementations (submit buttons, radio buttons, check boxes, etc.) diminish their effectiveness in some applications. The Button Control provides a platform for implementing visually impactful buttons that range from standard click-to-navigate buttons to radio buttons and checkboxes to advanced split-buttons that can operate as both a button and a menu.

Other Noteworthy Changes

In addition to the three new components and the new versioning scheme, YUI in 2.2.0 incorporates a number of other significant changes to the library generally and to components specifically. Some noteworthy changes include the following:

  • Reorganization of utility classes: Several utility classes (including Element and KeyListener) were originally introduced as part of the component for which they were written — Element, for example, was part of the TabView distribution. We have begun a reorganization of these utility classes, allowing them to serve a wider range of YUI components and to be more logically accessible within your own implementations. Today, KeyListener becomes part of Event and Element breaks out of TabView to become its own (beta) component…and hence a new dependency for TabView.
  • The YAHOO Global Object:
    • Read more about the enhanced YAHOO Global ObjectYAHOO.lang: The YAHOO Global Object now ships with a lang member; extend and augment are moved under YAHOO.lang, as are a variety of new utility methods for determining object types. Among YAHOO.lang‘s members is a hasOwnProperty method normalizing the behavior of that test for Safari 1.3 and older. We have implemented YAHOO.lang.hasOwnProperty for all of YUI’s hasOwnProperty invocations; although Safari 1.3 is not an A-Grade browser, this should allow YUI-based applications to degrade more generously on older versions of Safari.
    • YAHOO.env: YAHOO.env is another new YAHOO-object member introduced with v2.2.0; it contains version and build information for all YUI components that have been loaded in the current window. Using YAHOO.env‘s methods and data, you can determine which of your required components are already on a page and, if present, which version has been loaded. (Note that versioning information will only be available for implementations of YUI from v2.2.0 onward.) This facilitates, for example, the work of engineers creating YUI-based badges and modules that appear in diverse contexts, some of which already include YUI implementations.
  • New YAHOO_config global: With this release we are introducing a new global variable, YAHOO_config, that allows you to define certain configuration characteristics of YUI prior to loading the YAHOO Global Object. The significant and immediate win here is that you can use YAHOO_config to define a listener that will be invoked any time a YUI component is loaded on the page. For scenarios where you’re adding components dynamically, this will prove valuable in ensuring that dependencies are loaded in the correct sequence.

There’s much more we could say about this release, and there’s more to come on YUIBlog soon — plus a nice bit we’re looking forward to sharing with you at the party on Thursday. For now we encourage you to download the new distribution, explore the updated documentation on the YUI website, and begin exploring it for yourself. Release notes for each component can be accessed from that component’s main documentation page; it’s in those release notes that you’ll find detailed change manifests for each component.

40 Comments

  1. [...] Today, the YUI blog mentions they’ve released a great new version. As you probably know, we’re a huge fan of YUI – we couldn’t have done our fantastic new UI without it. [...]

  2. Re: Browser History Manager, “No one, as far as we know, has resolved the technical issues in a satisfactory way across the A-Grade.”

    Surely you meant “No one, except SmugMug, has resolved the technical issues in a satisfactory way across the A-Grade.” ? :)

    Remember, we solved it, we told you how we solved, and we even fixed the Safari perma-throbber problem, which it looks like YUI still hasn’t solved.

    Come on guys, we pimp YUI to all of our customers and any geeks who’ll listen. You could return the favor.

    Don

  3. Wow!

    Thanks again and again to Yahoo! and the YUI team for making all this possible!

  4. [...] YUI 2.2.0 has been released one year after YUI was released into open source. [...]

  5. Holy crap. Nice work fellas. I’ll have to play with the Data Grid widget sometime. It looks very cool. Props to Jenny.

    The reorg of the utils was a good idea too before the base methods got too large such as extend and augment. I can potentially see a few others sitting under YAHOO.lang.

    I don’t quite see the purpose of YAHOO_config as of yet, but partly because I don’t fully understand what a practical use of it would be. I suppose I’ll check out the examples when I get a chance.

    Again though, great work guys. Congratulations on a great minor release.

  6. Oops, looks like we got our panties in a bunch for no reason.

    The two guys at Yahoo who wrote the Browser History Manager are new to the team, didn’t go to the lunch where we shared our approach with YUI, and had no idea we’d solved it at all.

    Sorry for jumping the gun – we’re just proud of our work. :)

    Don

  7. @Don:

    I apologize for the oversight. The miscommunication was my fault. The folks who wrote Browser History Manager (BHM) are new to the YUI team and weren’t at our lunch together. They arrived at their solution independently.

    As far as the Safari throbber issue is concerned, we didn’t include a fix for two reasons. First of all, it’s a known WebKit issue that’s fixed in the upcoming Safari release. So we’re inclined to wait. Second, the fix we considered actually caused the forthcoming “fixed” version of Safari to crash. So, together, we thought it best to omit it from this early version of BHM, especially because we’ve designated this version “experimental.”

    Anyways, thanks for your follow up comment. As I wrote over on your blog, the beer’s on my this Thursday.

    Thanks,
    Nate

  8. [...] Yahoo! ha rilasciato la versione 2.2.0 della YUI. Le novità più succose, a mio parere, sono il supporto per le tabelle e quello per i pulsanti. [...]

  9. Rene Leonhardt said:
    February 20, 2007 at 11:30 pm

    Wow, the new DataTable control is amazing, thank you very much!

    After reviewing the examples I have some suggestions:

    1) Auto-Resizing to the minimal width on double-click (vertical cell borders except the leftmost one)

    2) Resizing of the last column (there is no resizing icon appearing)

    3) Inline Editing: Allow select boxes for fixed value lists

    4) Inline Editing: Multiline textareas accept a simple return key press like the single line input fields, but introduce a line break on saving (either just add the line break or stop editing, but not both)

    5) Multi-column sorting (valuable for large lists which can contain many rows with the same values). See the complex table example: if you sort by states, the area states for Alabama or California are unsorted.

    Keep up the good work,
    René

  10. [...] Gleich ein Riesenhüpfer in der Versionierung macht Yahoo! mit der neuen YUI-Version: von 0.12.2 geht’s zweks Verschmelzung mit der Yahoo!-internen YUI-Version direkt auf 2.2.0, was auch mehr den wirklichen Release- und Entwicklungsstand widerspiegelt (und sich vom Web2.0 Beta-Image verabschiedet). [...]

  11. Carlton Dickson said:
    February 21, 2007 at 12:45 am

    Thanks a lot for this release, looking forward to using the dataTable and improving the consistancy within my app across browsers by using the button control,

    C

  12. [...] Probably not for existing projects. But for new ones it seems viable. Yesterday’s release of version 2.2 includes such goodies as a browser history manager and a component for building and manipulating data tables (including XHR support!) [...]

  13. Jakub Nesetril said:
    February 21, 2007 at 1:10 am

    Awesome news guys, thanks a lot for the release, I’m sure I’ll experiment with it ASAP.

  14. [...] YUI 是由 Yahoo! Developer Network 所開發的一個 javascript library,主要是著重 UI 的開發。今天看到這個消息,YUI 推出新的版本,由先前的 Version 0.12.2 直接變成 Version 2.2.0。新的版本增加了幾個新的元件,有興趣的人可以到消息來源看看詳細的說明。 [...]

  15. Thanks for this valuable brand new piece of code that helps a lot our (web developers) work. Yahoo seriousness in developing YUI brings a comfortable platform to create rich and interactive web 2.0 aplications.

  16. 【YUI】 Yahoo!UI v2.2.0 リリース…

    これまで0.12 .2 だったYUI の新しいバージョン2.2.0がリリーされました。 大きな変化のひとつは、DataTableの追加ですね。割と使いやすげです。あと、Buttonもデザインをいじればかなり強力に使いでがありそうです(Dojoより扱いやすそう、、)。 YUI Version 2.2.0 Released: Browser History Manager, DataTable, and Button Components, New Versioning, and More http:/…

  17. [...] Ayer salió la versión de Yahoo User Interface Library 2.2.0, uno de los cambios más profundos del conjunto de utilidades YAHOO, muy popular entre los desarrolladores de la Web 2.0. La versión salta la numeración de 0.12.2 a 2.2.0, quizá indicando el caracter radical de los nuevos elementos: [...]

  18. [...] The ninjas over at Yahoo! released version 2.20 of YUI (Yahoo User Interface). They changed the versioning track, hence the jump from v0.12.2 to v2.20. This release has some really nice additions that I think will be extremely useful for buiding some web apps. [...]

  19. Wow. Hats off to Julien Lecomte. (And to the Smugmug team, too, it seems.) I’m looking forward to implementing the BHM. YUI keeps making webdev more and more fun. Thank you.

  20. Thanks for this valuable brand new piece of code that helps a lot our (web developers) work. Yahoo seriousness in developing YUI brings a comfortable platform to create rich and interactive web 2.0 applications.

  21. Very cool. Congrats, guys!

  22. Thanks YUI team. Keep up the great work.

  23. WOW. Drastic evolution! A great one-year-birthday gift to YUI and those developers who are always using and supporting YUI.

  24. YUI 2.whatever…

    Yahoo has released a new version of their YUI framework, and it looks very promising. To be honest, I still haven’t looked into it enough. So my opinion still stays the same, I think it is too big and too much.
    If I need something to pick up the …

  25. YUI v2.2.0 Released…

    The Yahoo! User Interface (YUI) Library v2.2.0 has been released two days ago. This release is one of the most substantial revisions we’ve done to the library since its inception. There is three new component included in this releases, they are brows…..

  26. Great stuff. YUI is definitely the way to go, you guys are heading in the right direction. DataSource will be the foundation for great controls.
    I have coded things very similar to DataTable and MenuButtons for work and it’s great to see this type of controls fully supported in YUI now.
    Thanks & please keep the good stuff coming :)

  27. Awesome work! I already have a use for YAHOO_config on my YUI – based web game IttyBittyRPG (it loads the game and YUI components dynamically) The Element utility will radically change the way folks use YUI!

  28. [...] Yahoo javascript kütüphanesinin yeni versiyonu 2.2.0 çıktı. Web Tarayıcı Arşivi, Buton eklentisi, Veri tabloları en dikkat çekici yenilikler. Link [...]

  29. [...] Hey everyone. This post is mostly aimed at developers. I just wanted to let you know that Yahoo has launched a new version of their Yahoo User Interface with some added cool features. This is exciting to me since I used YUI to help build Joe’s Goals. I have a post up at Download Squad and you can check out the YUI Blog post as well. [...]

  30. JavaScript Made Even Easier…

    It’s been a YUI kind of week here at the big Y featuring warm JavaScript snugglies for the entire developer community. On Tuesday, Yahoo’s YUI team released three incredibly useful new controls, celebrated its one year birthday party, and then……

  31. [...] New YUI version (2.2.0) live on the site. Go wild, you customizers. [...]

  32. [...] YUI 2.2.0 has been released one year after YUI was released into open source. [...]

  33. [...] YUI Version 2.2.0 Released A massive update to the Yahoo! UI Library: experimental Back/Forward button history management, a DataTable Control for adding interactive features to HTML data tables, a Button Control for creating rich, consistent button controls, and lots more. (tags: yahoo! javascript opensource software) [...]

  34. [...] YUI 2.2.0 was released back in February. I was not moved to replace my production code with this release because my eyes fell upon words like DataTable Control (beta) and Button Control (beta)—that’s too many betas for me. [...]

  35. [...] Ruh roh Shaggy! The YUI Button component is misbehaving. It is taking away the submit event fired when the button is clicked and firing the submit() function programmatically. [...]

  36. @Shaggy — You’re right — this is a bug. We’re working on it and plan to have a fix in an upcoming patch early in April. Regards, Eric

  37. [...] However, I recently read the Ext library by Jack Slocum was released, and that it can work against Prototype, YUI and jQuery. I knew it was started as a grid for YUI which lacked that feature but added it in the recently released 2.2.0 version, but when I took a look at Ext’s component collection, I realized it has exactly all the components we needed for our revised UI: [...]

  38. [...] They’ve changed their versioning, which will be much easier to follow. They’ve also included mega amount of extra features to their package. It’s far too much to mention, you’ll have to check it out for yourself. RSS 2.0 [...]

  39. 主要是著重 的開發。今天看到這個消息,推出新的版本